Next Button and seek button plugin

https://github.com/DanielnetoDotCom/YouPHPTube/issues/359

plugin/NextButton/NextButton.php

@@ -0,0 +1,31 @@
+<?php
+
+global $global;
+require_once $global['systemRootPath'] . 'plugin/Plugin.abstract.php';
+
+class NextButton extends PluginAbstract {
+
+    public function getDescription() {
+        return "Add next button to the control bar";
+    }
+
+    public function getName() {
+        return "NextButton";
+    }
+
+    public function getUUID() {
+        return "5310b394-b54f-48ab-9049-995df4d95239";
+    }    
+
+    public function getFooterCode() {
+        global $global, $autoPlayVideo;
+        if (!empty($autoPlayVideo['url'])) {            
+            $js = '<script>autoPlayVideoURL="'.$autoPlayVideo['url'].'"</script>';
+            $js .= '<script src="' . $global['webSiteRootURL'] . 'plugin/NextButton/script.js" type="text/javascript"></script>';
+
+            return $js;
+        }
+    }
+
+
+}

plugin/NextButton/script.js

@@ -0,0 +1,20 @@
+// Extend default
+if(typeof player == 'undefined'){player = videojs('mainVideo');}
+var Button = videojs.getComponent('Button');
+var nextButton = videojs.extend(Button, {
+    //constructor: function(player, options) {
+    constructor: function () {
+        Button.apply(this, arguments);
+        //this.addClass('vjs-chapters-button');
+        this.addClass('fa-step-forward');
+        this.addClass('fa');
+        this.controlText("Next");
+    },
+    handleClick: function () {
+        document.location = autoPlayVideoURL;
+    }
+});
+
+// Register the new component
+videojs.registerComponent('nextButton', nextButton);
+player.getChild('controlBar').addChild('nextButton', {}, getPlayerButtonIndex('PlayToggle')+1);

plugin/SeekButton/SeekButton.php

@@ -0,0 +1,52 @@
+<?php
+
+global $global;
+require_once $global['systemRootPath'] . 'plugin/Plugin.abstract.php';
+
+class SeekButton extends PluginAbstract {
+
+    public function getDescription() {
+        return "Add seek buttons to the control bar";
+    }
+
+    public function getName() {
+        return "SeekButton";
+    }
+
+    public function getUUID() {
+        return "f5c30980-9530-4650-8eab-9ab461ea6fdb";
+    }    
+
+    public function getEmptyDataObject() {
+        global $global;
+        $obj = new stdClass();
+        $obj->forward = 30;
+        $obj->back = 10;
+        return $obj;
+    }
+    
+    public function getHeadCode() {
+        global $global;
+        if (empty($_GET['videoName'])) {
+            return "";
+        }
+        $css = '<link href="' . $global['webSiteRootURL'] . 'plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.css" rel="stylesheet" type="text/css"/>';
+        $css .= '<style></style>';
+        return $css;
+    }
+    
+    public function getFooterCode() {
+        global $global;
+        if (!empty($_GET['videoName'])) {
+            $obj = $this->getDataObject();
+            $js = '<script src="' . $global['webSiteRootURL'] . 'plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.min.js" type="text/javascript"></script>';
+
+            $js .= '<script>if(typeof player == \'undefined\'){player = videojs(\'mainVideo\');}'
+                    . 'player.seekButtons({forward: '.$obj->forward.',back: '.$obj->back.' });'
+                    . '</script>';
+            return $js;
+        }
+    }
+
+
+}

plugin/SeekButton/videojs-seek-buttons/lang/de.js

@@ -0,0 +1,4 @@
+videojs.addLanguage('de', {
+  "Seek forward {{seconds}} seconds": "Vorwärts {{seconds}} Sekunden",
+  "Seek back {{seconds}} seconds": "Zurück {{seconds}} Sekunden"
+});

plugin/SeekButton/videojs-seek-buttons/lang/en.js

@@ -0,0 +1,4 @@
+videojs.addLanguage('en', {
+  "Seek forward {{seconds}} seconds": "Seek forward {{seconds}} seconds",
+  "Seek back {{seconds}} seconds": "Seek back {{seconds}} seconds"
+});

plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.cjs.js

@@ -0,0 +1,181 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var videojs = _interopDefault(require('video.js'));
+
+var version = "1.1.0";
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+
+
+
+
+
+
+
+
+
+
+var inherits = function (subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
+  }
+
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      enumerable: false,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
+};
+
+
+
+
+
+
+
+
+
+
+
+var possibleConstructorReturn = function (self, call) {
+  if (!self) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+
+  return call && (typeof call === "object" || typeof call === "function") ? call : self;
+};
+
+var Button = videojs.getComponent('Button');
+var Component = videojs.getComponent('Component');
+
+// Default options for the plugin.
+var defaults$$1 = {};
+
+// Cross-compatibility for Video.js 5 and 6.
+var registerPlugin = videojs.registerPlugin || videojs.plugin;
+// const dom = videojs.dom || videojs;
+
+/**
+ * Function to invoke when the player is ready.
+ *
+ * This is a great place for your plugin to initialize itself. When this
+ * function is called, the player will have its DOM and child components
+ * in place.
+ *
+ * @function onPlayerReady
+ * @param    {Player} player
+ *           A Video.js player object.
+ *
+ * @param    {Object} [options={}]
+ *           A plain object containing options for the plugin.
+ */
+var onPlayerReady = function onPlayerReady(player, options) {
+
+  player.addClass('vjs-seek-buttons');
+
+  if (options.forward && options.forward > 0) {
+    player.controlBar.seekForward = player.controlBar.addChild('seekButton', {
+      direction: 'forward',
+      seconds: options.forward
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekForward.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+
+  if (options.back && options.back > 0) {
+    player.controlBar.seekBack = player.controlBar.addChild('seekButton', {
+      direction: 'back',
+      seconds: options.back
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekBack.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+};
+
+/**
+ * A video.js plugin.
+ *
+ * In the plugin function, the value of `this` is a video.js `Player`
+ * instance. You cannot rely on the player being in a "ready" state here,
+ * depending on how the plugin is invoked. This may or may not be important
+ * to you; if not, remove the wait for "ready"!
+ *
+ * @function seekButtons
+ * @param    {Object} [options={}]
+ *           An object of options left to the plugin author to define.
+ */
+var seekButtons = function seekButtons(options) {
+  var _this = this;
+
+  this.ready(function () {
+    onPlayerReady(_this, videojs.mergeOptions(defaults$$1, options));
+  });
+};
+
+/**
+ * Button to seek forward/back
+ *
+ * @param {Player|Object} player
+ * @param {Object=} options
+ * @extends Button
+ * @class SeekToggle
+ */
+
+var SeekButton = function (_Button) {
+  inherits(SeekButton, _Button);
+
+  function SeekButton(player, options) {
+    classCallCheck(this, SeekButton);
+
+    var _this2 = possibleConstructorReturn(this, _Button.call(this, player, options));
+
+    if (_this2.options_.direction === 'forward') {
+      _this2.controlText(_this2.localize('Seek forward {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    } else if (_this2.options_.direction === 'back') {
+      _this2.controlText(_this2.localize('Seek back {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    }
+    return _this2;
+  }
+
+  SeekButton.prototype.buildCSSClass = function buildCSSClass() {
+    /* Each button will have the classes:
+       `vjs-seek-button`
+       `skip-forward` or `skip-back`
+       `skip-n` where `n` is the number of seconds
+       So you could have a generic icon for "skip back" and a more
+       specific one for "skip back 30 seconds"
+    */
+    return 'vjs-seek-button skip-' + this.options_.direction + ' ' + ('skip-' + this.options_.seconds + ' ' + _Button.prototype.buildCSSClass.call(this));
+  };
+
+  SeekButton.prototype.handleClick = function handleClick() {
+    var now = this.player_.currentTime();
+
+    if (this.options_.direction === 'forward') {
+      this.player_.currentTime(now + this.options_.seconds);
+    } else if (this.options_.direction === 'back') {
+      this.player_.currentTime(now - this.options_.seconds);
+    }
+  };
+
+  return SeekButton;
+}(Button);
+
+Component.registerComponent('SeekButton', SeekButton);
+
+// Register the plugin with video.js.
+registerPlugin('seekButtons', seekButtons);
+
+// Include the version number.
+seekButtons.VERSION = version;
+
+module.exports = seekButtons;

plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.css

@@ -0,0 +1,7 @@
+/**
+ * videojs-seek-buttons
+ * @version 1.1.0
+ * @copyright 2017 Ben Clifford
+ * @license Apache-2.0
+ */
+@import url(https://fonts.googleapis.com/css?family=Material+Icons);.video-js .vjs-seek-button{font-family:'Material Icons';cursor:pointer}.video-js .vjs-seek-button.skip-back::before{content:'\e042'}.video-js .vjs-seek-button.skip-back.skip-10::before{content:'\e059'}.video-js .vjs-seek-button.skip-back.skip-5::before{content:'\e05b'}.video-js .vjs-seek-button.skip-back.skip-30::before{content:'\e05a'}.video-js .vjs-seek-button.skip-forward::before{content:'\e5d5'}.video-js .vjs-seek-button.skip-forward.skip-10::before{content:'\e056'}.video-js .vjs-seek-button.skip-forward.skip-5::before{content:'\e058'}.video-js .vjs-seek-button.skip-forward.skip-30::before{content:'\e057'}.video-js.vjs-v6 .vjs-seek-button.skip-back::before,.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-10::before,.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-5::before,.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-30::before,.video-js.vjs-v6 .vjs-seek-button.skip-forward::before,.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-10::before,.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-5::before,.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-30::before{content:none}.video-js.vjs-v6 .vjs-seek-button.skip-back .vjs-icon-placeholder::before{content:'\e042'}.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-10 .vjs-icon-placeholder::before{content:'\e059'}.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-5 .vjs-icon-placeholder::before{content:'\e05b'}.video-js.vjs-v6 .vjs-seek-button.skip-back.skip-30 .vjs-icon-placeholder::before{content:'\e05a'}.video-js.vjs-v6 .vjs-seek-button.skip-forward .vjs-icon-placeholder::before{content:'\e5d5'}.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-10 .vjs-icon-placeholder::before{content:'\e056'}.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-5 .vjs-icon-placeholder::before{content:'\e058'}.video-js.vjs-v6 .vjs-seek-button.skip-forward.skip-30 .vjs-icon-placeholder::before{content:'\e057'}

plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.es.js

@@ -0,0 +1,177 @@
+import videojs from 'video.js';
+
+var version = "1.1.0";
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+
+
+
+
+
+
+
+
+
+
+var inherits = function (subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
+  }
+
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      enumerable: false,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
+};
+
+
+
+
+
+
+
+
+
+
+
+var possibleConstructorReturn = function (self, call) {
+  if (!self) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+
+  return call && (typeof call === "object" || typeof call === "function") ? call : self;
+};
+
+var Button = videojs.getComponent('Button');
+var Component = videojs.getComponent('Component');
+
+// Default options for the plugin.
+var defaults$$1 = {};
+
+// Cross-compatibility for Video.js 5 and 6.
+var registerPlugin = videojs.registerPlugin || videojs.plugin;
+// const dom = videojs.dom || videojs;
+
+/**
+ * Function to invoke when the player is ready.
+ *
+ * This is a great place for your plugin to initialize itself. When this
+ * function is called, the player will have its DOM and child components
+ * in place.
+ *
+ * @function onPlayerReady
+ * @param    {Player} player
+ *           A Video.js player object.
+ *
+ * @param    {Object} [options={}]
+ *           A plain object containing options for the plugin.
+ */
+var onPlayerReady = function onPlayerReady(player, options) {
+
+  player.addClass('vjs-seek-buttons');
+
+  if (options.forward && options.forward > 0) {
+    player.controlBar.seekForward = player.controlBar.addChild('seekButton', {
+      direction: 'forward',
+      seconds: options.forward
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekForward.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+
+  if (options.back && options.back > 0) {
+    player.controlBar.seekBack = player.controlBar.addChild('seekButton', {
+      direction: 'back',
+      seconds: options.back
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekBack.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+};
+
+/**
+ * A video.js plugin.
+ *
+ * In the plugin function, the value of `this` is a video.js `Player`
+ * instance. You cannot rely on the player being in a "ready" state here,
+ * depending on how the plugin is invoked. This may or may not be important
+ * to you; if not, remove the wait for "ready"!
+ *
+ * @function seekButtons
+ * @param    {Object} [options={}]
+ *           An object of options left to the plugin author to define.
+ */
+var seekButtons = function seekButtons(options) {
+  var _this = this;
+
+  this.ready(function () {
+    onPlayerReady(_this, videojs.mergeOptions(defaults$$1, options));
+  });
+};
+
+/**
+ * Button to seek forward/back
+ *
+ * @param {Player|Object} player
+ * @param {Object=} options
+ * @extends Button
+ * @class SeekToggle
+ */
+
+var SeekButton = function (_Button) {
+  inherits(SeekButton, _Button);
+
+  function SeekButton(player, options) {
+    classCallCheck(this, SeekButton);
+
+    var _this2 = possibleConstructorReturn(this, _Button.call(this, player, options));
+
+    if (_this2.options_.direction === 'forward') {
+      _this2.controlText(_this2.localize('Seek forward {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    } else if (_this2.options_.direction === 'back') {
+      _this2.controlText(_this2.localize('Seek back {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    }
+    return _this2;
+  }
+
+  SeekButton.prototype.buildCSSClass = function buildCSSClass() {
+    /* Each button will have the classes:
+       `vjs-seek-button`
+       `skip-forward` or `skip-back`
+       `skip-n` where `n` is the number of seconds
+       So you could have a generic icon for "skip back" and a more
+       specific one for "skip back 30 seconds"
+    */
+    return 'vjs-seek-button skip-' + this.options_.direction + ' ' + ('skip-' + this.options_.seconds + ' ' + _Button.prototype.buildCSSClass.call(this));
+  };
+
+  SeekButton.prototype.handleClick = function handleClick() {
+    var now = this.player_.currentTime();
+
+    if (this.options_.direction === 'forward') {
+      this.player_.currentTime(now + this.options_.seconds);
+    } else if (this.options_.direction === 'back') {
+      this.player_.currentTime(now - this.options_.seconds);
+    }
+  };
+
+  return SeekButton;
+}(Button);
+
+Component.registerComponent('SeekButton', SeekButton);
+
+// Register the plugin with video.js.
+registerPlugin('seekButtons', seekButtons);
+
+// Include the version number.
+seekButtons.VERSION = version;
+
+export default seekButtons;

plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.js

@@ -0,0 +1,147 @@
+/**
+ * videojs-seek-buttons
+ * @version 1.1.0
+ * @copyright 2017 Ben Clifford
+ * @license Apache-2.0
+ */
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('video.js')) :
+	typeof define === 'function' && define.amd ? define(['video.js'], factory) :
+	(global.videojsSeekButtons = factory(global.videojs));
+}(this, (function (videojs) { 'use strict';
+
+videojs = 'default' in videojs ? videojs['default'] : videojs;
+
+var version = "1.1.0";
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Button = videojs.getComponent('Button');
+var Component = videojs.getComponent('Component');
+
+// Default options for the plugin.
+var defaults = {};
+
+// Cross-compatibility for Video.js 5 and 6.
+var registerPlugin = videojs.registerPlugin || videojs.plugin;
+// const dom = videojs.dom || videojs;
+
+/**
+ * Function to invoke when the player is ready.
+ *
+ * This is a great place for your plugin to initialize itself. When this
+ * function is called, the player will have its DOM and child components
+ * in place.
+ *
+ * @function onPlayerReady
+ * @param    {Player} player
+ *           A Video.js player object.
+ *
+ * @param    {Object} [options={}]
+ *           A plain object containing options for the plugin.
+ */
+var onPlayerReady = function onPlayerReady(player, options) {
+
+  player.addClass('vjs-seek-buttons');
+
+  if (options.forward && options.forward > 0) {
+    player.controlBar.seekForward = player.controlBar.addChild('seekButton', {
+      direction: 'forward',
+      seconds: options.forward
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekForward.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+
+  if (options.back && options.back > 0) {
+    player.controlBar.seekBack = player.controlBar.addChild('seekButton', {
+      direction: 'back',
+      seconds: options.back
+    });
+    player.controlBar.el().insertBefore(player.controlBar.seekBack.el(), player.controlBar.el().firstChild.nextSibling);
+  }
+};
+
+/**
+ * A video.js plugin.
+ *
+ * In the plugin function, the value of `this` is a video.js `Player`
+ * instance. You cannot rely on the player being in a "ready" state here,
+ * depending on how the plugin is invoked. This may or may not be important
+ * to you; if not, remove the wait for "ready"!
+ *
+ * @function seekButtons
+ * @param    {Object} [options={}]
+ *           An object of options left to the plugin author to define.
+ */
+var seekButtons = function seekButtons(options) {
+  var _this = this;
+
+  this.ready(function () {
+    onPlayerReady(_this, videojs.mergeOptions(defaults, options));
+  });
+};
+
+/**
+ * Button to seek forward/back
+ *
+ * @param {Player|Object} player
+ * @param {Object=} options
+ * @extends Button
+ * @class SeekToggle
+ */
+
+var SeekButton = function (_Button) {
+  _inherits(SeekButton, _Button);
+
+  function SeekButton(player, options) {
+    _classCallCheck(this, SeekButton);
+
+    var _this2 = _possibleConstructorReturn(this, _Button.call(this, player, options));
+
+    if (_this2.options_.direction === 'forward') {
+      _this2.controlText(_this2.localize('Seek forward {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    } else if (_this2.options_.direction === 'back') {
+      _this2.controlText(_this2.localize('Seek back {{seconds}} seconds').replace('{{seconds}}', _this2.options_.seconds));
+    }
+    return _this2;
+  }
+
+  SeekButton.prototype.buildCSSClass = function buildCSSClass() {
+    /* Each button will have the classes:
+       `vjs-seek-button`
+       `skip-forward` or `skip-back`
+       `skip-n` where `n` is the number of seconds
+       So you could have a generic icon for "skip back" and a more
+       specific one for "skip back 30 seconds"
+    */
+    return 'vjs-seek-button skip-' + this.options_.direction + ' ' + ('skip-' + this.options_.seconds + ' ' + _Button.prototype.buildCSSClass.call(this));
+  };
+
+  SeekButton.prototype.handleClick = function handleClick() {
+    var now = this.player_.currentTime();
+
+    if (this.options_.direction === 'forward') {
+      this.player_.currentTime(now + this.options_.seconds);
+    } else if (this.options_.direction === 'back') {
+      this.player_.currentTime(now - this.options_.seconds);
+    }
+  };
+
+  return SeekButton;
+}(Button);
+
+Component.registerComponent('SeekButton', SeekButton);
+
+// Register the plugin with video.js.
+registerPlugin('seekButtons', seekButtons);
+
+// Include the version number.
+seekButtons.VERSION = version;
+
+return seekButtons;
+
+})));

plugin/SeekButton/videojs-seek-buttons/videojs-seek-buttons.min.js

@@ -0,0 +1,7 @@
+/**
+ * videojs-seek-buttons
+ * @version 1.1.0
+ * @copyright 2017 Ben Clifford
+ * @license Apache-2.0
+ */
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("video.js")):"function"==typeof define&&define.amd?define(["video.js"],o):e.videojsSeekButtons=o(e.videojs)}(this,function(e){"use strict";function o(e,o){if(!(e instanceof o))throw new TypeError("Cannot call a class as a function")}function t(e,o){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!o||"object"!=typeof o&&"function"!=typeof o?e:o}function n(e,o){if("function"!=typeof o&&null!==o)throw new TypeError("Super expression must either be null or a function, not "+typeof o);e.prototype=Object.create(o&&o.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),o&&(Object.setPrototypeOf?Object.setPrototypeOf(e,o):e.__proto__=o)}var r=(e="default"in e?e.default:e).getComponent("Button"),i=e.getComponent("Component"),s={},c=e.registerPlugin||e.plugin,a=function(e,o){e.addClass("vjs-seek-buttons"),o.forward&&o.forward>0&&(e.controlBar.seekForward=e.controlBar.addChild("seekButton",{direction:"forward",seconds:o.forward}),e.controlBar.el().insertBefore(e.controlBar.seekForward.el(),e.controlBar.el().firstChild.nextSibling)),o.back&&o.back>0&&(e.controlBar.seekBack=e.controlBar.addChild("seekButton",{direction:"back",seconds:o.back}),e.controlBar.el().insertBefore(e.controlBar.seekBack.el(),e.controlBar.el().firstChild.nextSibling))},l=function(o){var t=this;this.ready(function(){a(t,e.mergeOptions(s,o))})},d=function(e){function r(n,i){o(this,r);var s=t(this,e.call(this,n,i));return"forward"===s.options_.direction?s.controlText(s.localize("Seek forward {{seconds}} seconds").replace("{{seconds}}",s.options_.seconds)):"back"===s.options_.direction&&s.controlText(s.localize("Seek back {{seconds}} seconds").replace("{{seconds}}",s.options_.seconds)),s}return n(r,e),r.prototype.buildCSSClass=function(){return"vjs-seek-button skip-"+this.options_.direction+" skip-"+this.options_.seconds+" "+e.prototype.buildCSSClass.call(this)},r.prototype.handleClick=function(){var e=this.player_.currentTime();"forward"===this.options_.direction?this.player_.currentTime(e+this.options_.seconds):"back"===this.options_.direction&&this.player_.currentTime(e-this.options_.seconds)},r}(r);return i.registerComponent("SeekButton",d),c("seekButtons",l),l.VERSION="1.1.0",l});

view/include/video.php

@@ -160,14 +160,14 @@ if (!empty($ad)) {
 
         // Extend default
         var Button = videojs.getComponent('Button');
-        var teater = videojs.extend(Button, {
+        var Theater = videojs.extend(Button, {
             //constructor: function(player, options) {
             constructor: function () {
                 Button.apply(this, arguments);
                 //this.addClass('vjs-chapters-button');
                 this.addClass('fa-compress');
                 this.addClass('fa');
-                this.controlText("<?php echo __("Teater"); ?>");
+                this.controlText("<?php echo __("Theater"); ?>");
                 if (Cookies.get('compress') === "true") {
                     toogleEC(this);
                 }
@@ -178,8 +178,8 @@ if (!empty($ad)) {
         });
 
         // Register the new component
-        videojs.registerComponent('teater', teater);
-        player.getChild('controlBar').addChild('teater', {}, 8);
+        videojs.registerComponent('Theater', Theater);
+        player.getChild('controlBar').addChild('Theater', {}, 16);
         player.zoomrotate(<?php echo $transformation; ?>);
         player.on('play', function () {
             addView(<?php echo $playNowVideo['id']; ?>);
@@ -191,7 +191,7 @@ if ($config->getAutoplay()) {
 } else {
     ?>
                 if (Cookies.get('autoplay') && Cookies.get('autoplay') !== 'false') {
-                    setTimeout(function () { if(typeof player === 'undefined'){ player = videojs('mainVideo');} player.play();}, 150);                    
+                    setTimeout(function () { if(typeof player === 'undefined'){ player = videojs('mainVideo');} player.play();}, getPlayerButtonIndex('FullscreenToggle')-1);                    
                 }
 <?php }
 ?>

view/js/script.js

@@ -257,3 +257,13 @@ function addView(videos_id){
         }
     });
 }
+
+function getPlayerButtonIndex(name){
+    var children = player.getChild('controlBar').children();
+    for(i=0;i<children.length;i++){
+        if(children[0].name_ === name){
+            return i;
+        }
+    }
+    return children.length;
+}