diff --git a/user/plugins/youtube/.gitignore b/user/plugins/youtube/.gitignore new file mode 100644 index 0000000..496ee2c --- /dev/null +++ b/user/plugins/youtube/.gitignore @@ -0,0 +1 @@ +.DS_Store \ No newline at end of file diff --git a/user/plugins/youtube/CHANGELOG.md b/user/plugins/youtube/CHANGELOG.md new file mode 100644 index 0000000..4b427ca --- /dev/null +++ b/user/plugins/youtube/CHANGELOG.md @@ -0,0 +1,66 @@ +# v3.1.0 +## 05/20/2020 + +1. [](#new) + * Added "Lazy Load" Option [#30](https://github.com/getgrav/grav-plugin-youtube/pull/30) + * Added option for video size [#29](https://github.com/getgrav/grav-plugin-youtube/pull/29) + +# v3.0.1 +## 08/20/2018 + +1. [](#improved) + * Refactor to remove GravTrait + +# v3.0.0 +## 08/02/2018 + +1. [](#new) + * Added shortcode support + +# v2.0.4 +## 09/28/2017 + +1. [](#improved) + * Always use HTTPS for YouTube [#21](https://github.com/getgrav/grav-plugin-youtube/pull/21) + +# v2.0.3 +## 12/23/2016 + +1. [](#bugfix) + * Fixed a JavaScript issue [#16](https://github.com/getgrav/grav-plugin-youtube/pull/16) + +# v2.0.2 +## 05/23/2016 + +1. [](#improved) + * Supports `youtu.be` based short links +1. [](#bugfix) + * Fixed for invalid URL with YouTube editor buttons + * Fixed editor button to work with Admin v1.1 + +# v2.0.1 +## 11/24/2015 + +1. [](#bugfix) + * Fixed issue with case sensitivity when including new `YoutubeTwigExtension` + +# v2.0.0 +## 11/23/2015 + +1. [](#new) + * Added player parameters configuration values (@hctom) + * Added various YouTube options (@hctom) + * Reworked output to use overridable Twig template (@hctom) + * Added hebe.json (@hctom) + +# v1.1.0 +## 10/07/2015 + +1. [](#new) + * Added admin editor button + +# v1.0.0 +## 05/09/2015 + +1. [](#new) + * ChangeLog started... diff --git a/user/plugins/youtube/LICENSE b/user/plugins/youtube/LICENSE new file mode 100644 index 0000000..0e788c6 --- /dev/null +++ b/user/plugins/youtube/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2015 Grav + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/user/plugins/youtube/README.md b/user/plugins/youtube/README.md new file mode 100644 index 0000000..31dfac7 --- /dev/null +++ b/user/plugins/youtube/README.md @@ -0,0 +1,91 @@ +# Grav YouTube Plugin + +`YouTube` is a simple [Grav][grav] Plugin that converts markdown links into responsive embeds. + +# Installation + +Installing the YouTube plugin can be done in one of two ways. Our GPM (Grav Package Manager) installation method enables you to quickly and easily install the plugin with a simple terminal command, while the manual method enables you to do so via a zip file. + +## GPM Installation (Preferred) + +The simplest way to install this plugin is via the [Grav Package Manager (GPM)](http://learn.getgrav.org/advanced/grav-gpm) through your system's Terminal (also called the command line). From the root of your Grav install type: + + bin/gpm install youtube + +This will install the YouTube plugin into your `/user/plugins` directory within Grav. Its files can be found under `/your/site/grav/user/plugins/youtube`. + +## Manual Installation + +To install this plugin, just download the zip version of this repository and unzip it under `/your/site/grav/user/plugins`. Then, rename the folder to `youtube`. You can find these files either on [GitHub](https://github.com/getgrav/grav-plugin-youtube) or via [GetGrav.org](http://getgrav.org/downloads/plugins#extras). + +You should now have all the plugin files under + + /your/site/grav/user/plugins/youtube + +# Config Defaults + +``` +enabled: true +built_in_css: true +player_parameters: + autoplay: 0 + cc_load_policy: 0 + color: red + controls: 1 + disablekb: 0 + enablejsapi: 0 + fs: 1 + hl: '' + iv_load_policy: 1 + loop: 0 + modestbranding: 0 + origin: '' + playsinline: 0 + rel: 1 + showinfo: 1 + vq: default +privacy_enhanced_mode: false +``` + +If you need to change any value, then the best process is to copy the [youtube.yaml](youtube.yaml) file into your `users/config/plugins/` folder (create it if it doesn't exist), and then modify there. This will override the default settings. + +You can also set any of these settings on a per-page basis by adding them under a `youtube:` setting in your page header. For example: + + --- + title: YouTube Video + youtube: + player_parameters: + autoplay: 1 + --- + + [plugin:youtube](https://www.youtube.com/watch?v=BK8guP9ov2U) + +This will display a video and auto-play it. + +For more details on the `player_parameters`, please check out the [YouTube official documentation](https://developers.google.com/youtube/player_parameters) + +# Usage + +To use this plugin you simply need to include a youtube URL in markdown link such as: + +``` +[plugin:youtube](https://www.youtube.com/watch?v=BK8guP9ov2U) +``` + +Will be converted into the following embeded HTML: + +``` +
+``` + +CSS is also loaded to provide the appropriate responsive layout. + +# Shortcode Syntax + +As of version `3.0` you can now use an alternative _shortcode_ syntax that supports passing in the player parameter values inline + +``` +[youtube color=white autoplay=1]https://www.youtube.com/watch?v=BK8guP9ov2U[/youtube] +``` + +[grav]: http://github.com/getgrav/grav diff --git a/user/plugins/youtube/admin/editor-button/js/button.js b/user/plugins/youtube/admin/editor-button/js/button.js new file mode 100644 index 0000000..e42faaf --- /dev/null +++ b/user/plugins/youtube/admin/editor-button/js/button.js @@ -0,0 +1,36 @@ +(function($){ + $(function(){ + $('body').on('grav-editor-ready', function() { + var Instance = Grav.default.Forms.Fields.EditorField.Instance; + Instance.addButton({ + youtube: { + identifier: 'youtube-video', + title: 'YouTube Video', + label: '', + modes: ['gfm', 'markdown'], + action: function(_ref) { + var codemirror = _ref.codemirror, button = _ref.button, textarea = _ref.textarea; + button.on('click.editor.youtube',function() { + var videoURL = prompt("Enter the YouTube Video URL. E.g. https://www.youtube.com/watch?v=vQ4qK36UenI"); + + if (videoURL) { + var text = '[plugin:youtube](' + videoURL + ')'; + + //Add text to the editor + var pos = codemirror.getDoc().getCursor(true); + var posend = codemirror.getDoc().getCursor(false); + + for (var i=pos.line; i<(posend.line+1);i++) { + codemirror.replaceRange(text+codemirror.getLine(i), { line: i, ch: 0 }, { line: i, ch: codemirror.getLine(i).length }); + } + + codemirror.setCursor({ line: posend.line, ch: codemirror.getLine(posend.line).length }); + codemirror.focus(); + } + }); + } + } + }); + }); + }); +})(jQuery); diff --git a/user/plugins/youtube/blueprints.yaml b/user/plugins/youtube/blueprints.yaml new file mode 100644 index 0000000..5009377 --- /dev/null +++ b/user/plugins/youtube/blueprints.yaml @@ -0,0 +1,281 @@ +name: YouTube +version: 3.1.0 +description: "**YouTube** is a simple plugin that converts markdown links or shortcodes into responsive embeds." +icon: youtube +author: + name: Team Grav + email: devs@getgrav.org + url: http://getgrav.org +homepage: https://github.com/getgrav/grav-plugin-youtube +keywords: youtube, markdown +bugs: https://github.com/getgrav/grav-plugin-youtube/issues +license: MIT + +form: + validation: strict + fields: + enabled: + type: toggle + label: Plugin status + highlight: 1 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + built_in_css: + type: toggle + label: Use built in CSS + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + built_in_js: + type: toggle + label: Use built in JS + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + add_editor_button: + type: toggle + label: Add editor button + help: The editor button allows you to easily enter YouTube videos in the page content + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + privacy_enhanced_mode: + type: toggle + label: Privacy-enhanced mode + help: If enabled, YouTube won’t store information about visitors on your web page unless they play the video. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + lazy_load: + type: toggle + label: Lazy load iframes + help: If enabled, only the preview thumbnail will be loaded. When clicked, the iframe will be loaded. Improves page load speed. + hightlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: bool + + player_parameters: + type: section + title: Player parameters + underline: true + fields: + + player_parameters.vq: + type: select + size: medium + label: Preferred video quality + help: Specifies the preferred video quality to display. This may be overridden by YouTube to improve playback quality based on the user's screen resolution, bandwidth etc. + default: 'default' + options: + default: Default + small: Small + medium: Medium + large: Large + highres: High resolution + hd1080: High definition (1080) + hd720: High definition (720) + validate: + type: string + + player_parameters.autoplay: + type: toggle + label: Autoplay + help: Specifies whether the initial video will automatically start to play when the player loads. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.loop: + type: toggle + label: Loop + help: If enabled, the player will play the initial video again and again. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.showinfo: + type: toggle + label: Show information + help: If enabled, the player will display information like the video title and uploader before the video starts playing. + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.rel: + type: toggle + label: Related videos + help: If enabled, the player will show related videos when playback of the initial video ends. + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.modestbranding: + type: toggle + label: Modest branding + help: If enabled, the YouTube logo won't be displayed in the control bar. Note that a small YouTube text label will still display in the upper-right corner of a paused video when the user's mouse pointer hovers over the player. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.color: + type: select + size: medium + label: Color + help: Specifies the color that will be used in the player's video progress bar to highlight the amount of the video that the viewer has already seen. Setting this to white will disable the modest branding option. + default: red + options: + red: Red + white: White + validate: + type: string + + player_parameters.cc_load_policy: + type: toggle + label: Show closed captions by default + help: If enabled, this causes closed captions to be shown by default, even if the user has turned captions off. The default behavior is based on user preference. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.iv_load_policy: + type: select + size: medium + label: Video annotations + help: Specifies whether video annotatins should be displayed. + default: 1 + options: + 1: Displayed by default + 3: Hidden by default + validate: + type: int + + player_parameters.controls: + type: toggle + label: Controls + help: Indicates whether the video player controls are displayed. + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.disablekb: + type: toggle + label: Keyboard controls + help: If enabled, the player responds to supported keyboard controls. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.fs: + type: toggle + label: Fullscreen button + help: If enabled, the player displays the fullscreen button. + highlight: 1 + default: 1 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.hl: + type: text + label: Language + placeholder: 'e.g. en or en-us' + help: Specifies the player's interface language. This has to be an ISO 639-1 two-letter language code or a fully specified locale. The interface language is used for tooltips in the player and also affects the default caption track. Note that YouTube might select a different caption track language for a particular user based on the user's individual language preferences and the availability of caption tracks. + default: '' + validate: + type: string + + player_parameters.enablejsapi: + type: toggle + label: JavaScript API + help: If enabled, the player may be controlled via IFrame or JavaScript Player API calls. + highlight: 0 + default: 0 + options: + 1: Enabled + 0: Disabled + validate: + type: int + + player_parameters.origin: + type: text + label: Origin + placeholder: 'e.g. example.com' + help: If using the IFrame API, specify your domain name. This provides an extra security measure for the IFrame API and is only supported for IFrame embeds. + default: '' + validate: + type: string + + player_parameters.playsinline: + type: toggle + label: iOS playback behavior + help: Specifies whether videos play inline or fullscreen in an HTML5 player on iOS. + highlight: 0 + default: 0 + options: + 0: Fullscreen + 1: Inline + validate: + type: int diff --git a/user/plugins/youtube/classes/Twig/YoutubeTwigExtension.php b/user/plugins/youtube/classes/Twig/YoutubeTwigExtension.php new file mode 100644 index 0000000..c858dce --- /dev/null +++ b/user/plugins/youtube/classes/Twig/YoutubeTwigExtension.php @@ -0,0 +1,78 @@ + $value) { + $parameter_blueprint = $grav['config']->blueprints()->get('plugins.youtube.player_parameters.' . $key); + + // configured value matches YouTube default -> skip parameter + if (isset($parameter_blueprint['default']) && $parameter_blueprint['default'] == $value) { + continue; + } + + //YouTube loop fix for HTML5 player + if ($key == 'loop' && $value == 1) { + $filtered_player_parameters['playlist'] = $video_id; + } + + $filtered_player_parameters[$key] = $value; + } + + // append query string (if any) + if (!empty($filtered_player_parameters) && ($query_string = http_build_query($filtered_player_parameters))) { + $url .= '?' . $query_string; + } + + return $url; + } + + public function thumbnailUrl($video_id) + { + $url = 'https://i.ytimg.com/vi/' . $video_id . '/hqdefault.jpg'; + + return $url; + } +} diff --git a/user/plugins/youtube/css/youtube.css b/user/plugins/youtube/css/youtube.css new file mode 100644 index 0000000..d188840 --- /dev/null +++ b/user/plugins/youtube/css/youtube.css @@ -0,0 +1,60 @@ +.grav-youtube { + height: 0; + padding-top: 25px; + padding-bottom: 56.34%; + margin-bottom: 10px; + position: relative; + overflow: hidden; + max-width: 1920px; + max-height: 1080px; +} + +.grav-youtube iframe { + top: 0; + left: 0; + width: 100%; + height: 100%; + position: absolute; +} + +.grav-youtube--lazyloaded { + background-repeat: no-repeat; + background-position: center; + background-size: cover; + cursor: pointer; +} + +.grav-youtube--lazyloaded button { + position: absolute; + left: 50%; + top: 50%; + width: 68px; + height: 48px; + margin-left: -34px; + margin-top: -24px; + border: none; + background-color: transparent; + padding: 0; + outline: 0; + cursor: pointer; +} + +.grav-youtube--lazyloaded iframe:not([src]) { + display: none; +} + +.grav-youtube--lazyloaded iframe[src] + button { + display: none; +} + +.grav-youtube--lazyloaded path:first-of-type { + -webkit-transition: fill .1s cubic-bezier(0.0,0.0,0.2,1), fill-opacity .1s cubic-bezier(0.0,0.0,0.2,1); + -o-transition: fill .1s cubic-bezier(0.0,0.0,0.2,1), fill-opacity .1s cubic-bezier(0.0,0.0,0.2,1); + transition: fill .1s cubic-bezier(0.0,0.0,0.2,1), fill-opacity .1s cubic-bezier(0.0,0.0,0.2,1) +} + +.grav-youtube--lazyloaded:hover path:first-of-type, +.grav-youtube--lazyloaded button:focus path:first-of-type { + fill: #f00; + fill-opacity: 1; +} diff --git a/user/plugins/youtube/hebe.json b/user/plugins/youtube/hebe.json new file mode 100644 index 0000000..1c4d446 --- /dev/null +++ b/user/plugins/youtube/hebe.json @@ -0,0 +1,15 @@ +{ + "project":"grav-plugin-youtube", + "platforms":{ + "grav":{ + "nodes":{ + "theme":[ + { + "source":"/", + "destination":"/user/plugins/youtube" + } + ] + } + } + } +} diff --git a/user/plugins/youtube/js/youtube.js b/user/plugins/youtube/js/youtube.js new file mode 100644 index 0000000..36e33f1 --- /dev/null +++ b/user/plugins/youtube/js/youtube.js @@ -0,0 +1,13 @@ +(function() { + window.addEventListener('DOMContentLoaded', function() { + var gravYoutubeEmbeds = document.querySelectorAll('.grav-youtube--lazyloaded'); + + for (var i = 0; i < gravYoutubeEmbeds.length; i++) { + gravYoutubeEmbeds[i].addEventListener('click', function() { + var iframe = this.querySelector('iframe'); + var src = iframe.getAttribute('data-src'); + iframe.src = src; + }); + } + }); +})(); diff --git a/user/plugins/youtube/nextgen-editor/shortcodes/youtube/youtube.js b/user/plugins/youtube/nextgen-editor/shortcodes/youtube/youtube.js new file mode 100644 index 0000000..e26c3bd --- /dev/null +++ b/user/plugins/youtube/nextgen-editor/shortcodes/youtube/youtube.js @@ -0,0 +1,250 @@ +window.nextgenEditor.addShortcode('youtube', { + type: 'block', + plugin: 'shortcode-core', + title: 'YouTube', + button: { + label: 'YouTube', + icon: '', + }, + attributes: { + url: { + type: String, + innerHTML: true, + title: 'URL', + widget: 'input-text', + default: '', + }, + width: { + type: String, + title: 'Width', + widget: 'input-text', + default: '', + }, + height: { + type: String, + title: 'Width', + widget: 'input-text', + default: '', + }, + autoplay: { + type: Number, + title: 'Autoplay', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + cc_load_policy: { + type: Number, + title: 'Show Captions', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + cc_lang_pref: { + type: String, + title: 'Captions Language', + widget: 'input-text', + default: '', + }, + color: { + type: String, + title: 'Color', + widget: 'input-text', + default: 'red', + }, + controls: { + type: Number, + title: 'Show Controls', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 1, + }, + disablekb: { + type: Number, + title: 'Disable Keyboard', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + enablejsapi: { + type: Number, + title: 'Enable API Control', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + end: { + type: Number, + title: 'End Time (in sec)', + widget: 'input-number', + default: 0, + }, + fs: { + type: Number, + title: 'Show Full Screen', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 1, + }, + hl: { + type: String, + title: 'Interface Language', + widget: 'input-text', + default: '', + }, + iv_load_policy: { + type: Number, + title: 'Show Annotations', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 1, + }, + list: { + type: String, + title: 'List Name', + widget: 'input-text', + default: '', + }, + listType: { + type: String, + title: 'List Type', + widget: { + type: 'select', + values: [ + { value: '', label: '' }, + { value: 'playlist', label: 'Playlist' }, + { value: 'user_uploads', label: 'User Uploads' }, + ], + }, + default: '', + }, + loop: { + type: Number, + title: 'Loop', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + modestbranding: { + type: Number, + title: 'Hide YouTube Logo', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + origin: { + type: String, + title: 'Origin', + widget: 'input-text', + default: '', + }, + playlist: { + type: String, + title: 'Playlist', + widget: 'input-text', + default: '', + }, + playsinline: { + type: Number, + title: 'Play Inline', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 0, + }, + rel: { + type: Number, + title: 'Show Related', + widget: { + type: 'checkbox', + valueType: Number, + label: 'Yes', + }, + default: 1, + }, + start: { + type: Number, + title: 'Start Time (in sec)', + widget: 'input-number', + default: 0, + }, + widget_referrer: { + type: String, + title: 'Widget Referrer', + widget: 'input-text', + default: '', + }, + }, + titlebar({ attributes }) { + let id = ''; + + try { + id = new URL(attributes.url).searchParams.get('v'); + } + catch (err) { + } + + return `id: ${id}`; + }, + content({ attributes }) { + let id = ''; + + try { + id = new URL(attributes.url).searchParams.get('v'); + } + catch (err) { + } + + return id + ? `
` + : '
Empty URL
'; + }, + preserve: { + block: [ + 'iframe', + ], + }, +}); + +window.nextgenEditor.addHook('hookMarkdowntoHTML', { + weight: -50, + async handler(options, input) { + let output = input; + + output = output.replace(/\[plugin:youtube\]\((?[^)]*)\)/g, (...matches) => { + const { url } = matches.pop(); + return `[youtube]${url}[/youtube]`; + }); + + return output; + }, +}); diff --git a/user/plugins/youtube/shortcodes/YoutubeShortcode.php b/user/plugins/youtube/shortcodes/YoutubeShortcode.php new file mode 100644 index 0000000..7199a10 --- /dev/null +++ b/user/plugins/youtube/shortcodes/YoutubeShortcode.php @@ -0,0 +1,56 @@ +shortcode->getHandlers()->add('youtube', function(ShortcodeInterface $sc) { + + // Get shortcode content and parameters + $url = $sc->getContent(); + $params = $sc->getParameters(); + $privacy_mode = $sc->getParameter('privacy_enhanced_mode'); + + if ($url) { + preg_match($this::YOUTUBE_REGEX, $url, $matches); + $search = $matches[0]; + + // double check to make sure we found a valid YouTube video ID + if (!isset($matches[1])) { + return $search; + } + + /** @var Twig $twig */ + $twig = $this->grav['twig']; + + $options = array( + 'player_parameters' => $params, + 'privacy_enhanced_mode' => $privacy_mode, + 'video_id' => $matches[1], + ); + + // check if size was given + if (isset($params['width']) && isset($params['height'])) { + $options['video_size'] = true; + $options['video_height'] = $params['width']; + $options['video_width'] = $params['height']; + unset($params['width']); + unset($params['height']); + } + + // build the replacement embed HTML string + $replace = $twig->processTemplate('partials/youtube.html.twig', $options); + + // do the replacement + return str_replace($search, $replace, $search); + } + + + }); + } +} \ No newline at end of file diff --git a/user/plugins/youtube/templates/partials/youtube.html.twig b/user/plugins/youtube/templates/partials/youtube.html.twig new file mode 100644 index 0000000..c698b9b --- /dev/null +++ b/user/plugins/youtube/templates/partials/youtube.html.twig @@ -0,0 +1,15 @@ +{% if lazy_load == true %} +
+ + +
+{% else %} +
+ +
+{% endif %} \ No newline at end of file diff --git a/user/plugins/youtube/youtube.php b/user/plugins/youtube/youtube.php new file mode 100644 index 0000000..7414cb4 --- /dev/null +++ b/user/plugins/youtube/youtube.php @@ -0,0 +1,167 @@ + ['method_name', priority]. + */ + public static function getSubscribedEvents() + { + return [ + 'onPluginsInitialized' => ['onPluginsInitialized', 0], + 'registerNextGenEditorPlugin' => ['registerNextGenEditorPluginShortcodes', 0], + ]; + } + + /** + * Initialize configuration. + */ + public function onPluginsInitialized() + { + if ($this->isAdmin()) { + $this->enable([ + 'onTwigSiteVariables' => ['onTwigSiteVariables', 0], + ]); + return; + } + + $this->enable([ + 'onPageContentRaw' => ['onPageContentRaw', 0], + 'onTwigExtensions' => ['onTwigExtensions', 0], + 'onTwigSiteVariables' => ['onTwigSiteVariables', 0], + 'onTwigTemplatePaths' => ['onTwigTemplatePaths', 0], + 'onShortcodeHandlers' => ['onShortcodeHandlers', 0], + ]); + } + + /** + * Add content after page content was read into the system. + * + * @param Event $event An event object, when `onPageContentRaw` is fired. + */ + public function onPageContentRaw(Event $event) + { + /** @var Page $page */ + $page = $event['page']; + /** @var Twig $twig */ + $twig = $this->grav['twig']; + /** @var Data $config */ + $config = $this->mergeConfig($page, TRUE); + + if ($config->get('enabled')) { + // Get raw content and substitute all formulas by a unique token + $raw = $page->getRawContent(); + + // build an anonymous function to pass to `parseLinks()` + $function = function ($matches) use ($twig, $config) { + $search = $matches[0]; + + // double check to make sure we found a valid YouTube video ID + if (!isset($matches[1])) { + return $search; + } + + $options = array( + 'player_parameters' => $config->get('player_parameters'), + 'privacy_enhanced_mode' => $config->get('privacy_enhanced_mode'), + 'lazy_load' => $config->get('lazy_load'), + 'video_id' => $matches[1] + ); + + if($options['lazy_load'] == true) { + $options['player_parameters']['autoplay'] = true; + } + + // check if size was given + if (isset($matches[2]) && isset($matches[3])) { + $options['video_size'] = true; + $options['video_height'] = $matches[2]; + $options['video_width'] = $matches[3]; + } + + // build the replacement embed HTML string + $replace = $twig->processTemplate('partials/youtube.html.twig', $options); + + // do the replacement + return str_replace($search, $replace, $search); + }; + + // set the parsed content back into as raw content + $page->setRawContent($this->parseLinks($raw, $function, $this::YOUTUBE_REGEX)); + } + } + + /** + * Add Twig Extensions. + */ + public function onTwigExtensions() + { + require_once __DIR__ . '/classes/Twig/YoutubeTwigExtension.php'; + $this->grav['twig']->twig->addExtension(new YoutubeTwigExtension()); + } + + /** + * Set needed variables to display breadcrumbs. + */ + public function onTwigSiteVariables() + { + if (!$this->isAdmin() && $this->config->get('plugins.youtube.built_in_css')) { + $this->grav['assets']->add('plugin://youtube/css/youtube.css'); + } + + if (!$this->isAdmin() && $this->config->get('plugins.youtube.built_in_js')) { + $this->grav['assets']->add('plugin://youtube/js/youtube.js'); + } + + if ($this->isAdmin() && $this->config->get('plugins.youtube.add_editor_button')) { + $this->grav['assets']->add('plugin://youtube/admin/editor-button/js/button.js'); + } + } + + /** + * Add current directory to twig lookup paths. + */ + public function onTwigTemplatePaths() + { + $this->grav['twig']->twig_paths[] = __DIR__ . '/templates'; + } + + /** + * Initialize shortcodes + */ + public function onShortcodeHandlers() + { + $this->grav['shortcode']->registerAllShortcodes(__DIR__.'/shortcodes'); + } + + public function registerNextGenEditorPluginShortcodes($event) { + $plugins = $event['plugins']; + + // youtube + $plugins['js'][] = 'plugin://youtube/nextgen-editor/shortcodes/youtube/youtube.js'; + + $event['plugins'] = $plugins; + return $event; + } +} diff --git a/user/plugins/youtube/youtube.yaml b/user/plugins/youtube/youtube.yaml new file mode 100644 index 0000000..6dfb343 --- /dev/null +++ b/user/plugins/youtube/youtube.yaml @@ -0,0 +1,23 @@ +enabled: true +built_in_css: true +built_in_js: false +add_editor_button: true +player_parameters: + autoplay: 0 + cc_load_policy: 0 + color: red + controls: 1 + disablekb: 0 + enablejsapi: 0 + fs: 1 + hl: '' + iv_load_policy: 1 + loop: 0 + modestbranding: 0 + origin: '' + playsinline: 0 + rel: 1 + showinfo: 1 + vq: default +privacy_enhanced_mode: false +lazy_load: false