☰

Youtube Player Speed Slider

Add Speed Slider to Youtube Player Settings

当前为 2016-11-22 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Youtube Player Speed Slider
  3. // @namespace    youtube_player_speed_slider
  4. // @version      0.1.0
  5. // @description  Add Speed Slider to Youtube Player Settings
  6. // @author       Łukasz
  7. // @match        https://*.youtube.com/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     'use strict';
  13.  
  14.     var YT_F = {};
  15.  
  16.     YT_F.option = {
  17.         menu:null,
  18.         speedMenu: null,
  19.         label:null,
  20.         menuClass : "ytp-menuitem",
  21.     };
  22.  
  23.     YT_F.new = function(tag, option){
  24.         var element = document.createElement(tag);
  25.         for(var param in option){
  26.             element[param] = option[param];
  27.         }
  28.         return element;
  29.     };
  30.  
  31.     YT_F.get = function(tselector, all){
  32.         all = all || false;
  33.         var type = tselector.substring(0,1);
  34.         var selector = tselector.substring(1);
  35.         if(type == "#"){
  36.             return document.getElementById(selector);
  37.         }
  38.         else if(type == "."){
  39.             var elements = document.getElementsByClassName(selector);
  40.             if(all){
  41.                 return elements;
  42.             }
  43.             else{
  44.                 return elements.length ? elements[0] : null;
  45.             }
  46.         }
  47.     };
  48.  
  49.     YT_F.build = function() {
  50.         YT_F.option.menu = YT_F.get('.ytp-panel-menu');
  51.         YT_F.option.menu.appendChild(YT_F.buildSpeedMenu());
  52.     };
  53.  
  54.     YT_F.buildSpeedMenu = function(){
  55.         YT_F.option.speedMenu = YT_F.new('div', {'className':'ytp-menuitem'});
  56.  
  57. 	    YT_F.option.speedMenu.label = YT_F.new('div', {'className':'ytp-menuitem-label', 'innerHTML':'<b>Szybkość: 1</b>'});
  58. 	    var right = YT_F.new('div', {'className':'ytp-menuitem-content'});
  59. 	    var range = YT_F.new('input', {'className':'', 'type':'range', 'min':0.5, 'max':4, 'step':0.1, 'value':1});
  60.         document.addEventListener('change', YT_F.onchange);
  61.  
  62.         right.appendChild(range);
  63.         YT_F.option.speedMenu.appendChild(YT_F.option.speedMenu.label);
  64.         YT_F.option.speedMenu.appendChild(right);
  65.         return YT_F.option.speedMenu;
  66.     };
  67.  
  68.     YT_F.updateLabel = function(value){
  69.         YT_F.option.speedMenu.label.innerHTML = "Szybkość: " + value;
  70.     };
  71.  
  72.     YT_F.onchange = function(event){
  73.         YT_F.updateLabel(event.target.value);
  74.         YT_F.updatePlayerSpeed(event.target.value);
  75.     };
  76.  
  77.     YT_F.updatePlayerSpeed= function(value){
  78.         YT_F.get('.html5-main-video').playbackRate = value;
  79.     };
  80.  
  81.     YT_F.annotationsSwitchOffAndRemoveDefaultSpeedMenu = function(){
  82.         var settings_button = YT_F.get(".ytp-settings-button");
  83.         settings_button.click(); settings_button.click();
  84.  
  85.         var all_labels = document.getElementsByClassName("ytp-menuitem-label");
  86.         for (var i = 0; i < all_labels.length; i++) {
  87.             if ((all_labels[i].innerHTML == "Annotations" || all_labels[i].innerHTML == "Adnotacje") &&
  88.                 (all_labels[i].parentNode.getAttribute("aria-checked") == "true")) {
  89.                 all_labels[i].parentNode.click();
  90.             }
  91.             if (all_labels[i].innerHTML == "Speed" || all_labels[i].innerHTML == "Szybkość"){
  92.                 all_labels[i].parentNode.style.display = 'none';
  93.             }
  94.         }
  95.     };
  96.  
  97.     YT_F.build();
  98.     YT_F.annotationsSwitchOffAndRemoveDefaultSpeedMenu();
  99.  
  100. })();