Youtube Subtitles Edit

A script for changing the ugly ass youtube subtitles on CC. May make it so you can select your own subtitle look later on.
当前为 2016-02-27 提交的版本，查看最新版本。
安装此脚本？
提问、发表评价或者举报此脚本。
换行
// ==UserScript==
// @name         Youtube Subtitles Edit
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  A script for changing the ugly ass youtube subtitles on CC. May make it so you can select your own subtitle look later on.
// @author       Dildoer the Cocknight
// @match        *youtube.com/watch*
// @match        *youtube.com/embed*
// @match        https://www.youtube.com/watch*
// @match        https://www.youtube.com/embed*
// @require     https://code.jquery.com/jquery-1.11.0.min.js
// @require     https://code.jquery.com/ui/1.11.4/jquery-ui.js
// @grant        none
// ==/UserScript==
/* jshint -W097 */


//note - my website (therealnig.ga) got hijacked so the manual selector is no longer working! If you want to edit your subs you'll have to do it manually within the script below!

    //vars for my CSS stuff later, will set it so I can change these with a modal selector eventually
    var backgroundcolor = 'transparent'
    var textcolor = 'yellow'
    var fontsize = 150 //goes by Percent- 100% is the default!
    var fontfamily = 'roboto'
    var textshadow = 'rgba(34, 34, 34, 0.498039) 0px 0px 4px, rgba(34, 34, 34, 0.498039) 0px 0px 4px, rgba(34, 34, 34, 0.498039) 0px 0px 4px, rgba(34, 34, 34, 0.498039) 0px 0px 4px'
 
    // Tells you that the script is working and it picked up the video.
console.log("Video detected - Youtube Subtitles Editor Enabled!")
   
 
    //Gives JQUERYUI.css and a few aditional fonts, gonna add a selector in there later to choose from Google fonts
    $('head').append('<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans|Orbitron|Oleo+Script|Special+Elite|Permanent+Marker|Calligraffitti|Frijole|Bangers|Droid+Sans|,">');
    $('head').append('<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">');
    
 
    //initial css style for the subtitles; gotta change that shit later on
    $('head').append('<style> .captions-text { color:' + textcolor + '!important;  text-shadow:' + textshadow + '!important; font-family:' + fontfamily + '!important; background-color:' + backgroundcolor + '!important; font-size:' + fontsize + '%!important; } </style>');
    //creates the menu option in jquery to open the modal for our subtitle customizer
    $('body').append('<div id="dialog" title="Subtitle Edit Menu" <div id="editcontent"> Background: <br> <input class="jscolor {onFineChange:\'update(this, \'background\')\'}" value="FF0000"> <br> Text color: <br> <input class="jscolor {onFineChange:\'update(this, \'text\')\'}" value="B8FF87"> </div></div>');
    $('#ytp-main-menu-id').append('<div class="ytp-menuitem" aria-haspopup="true" role="menuitem" tabindex="0"><div class="ytp-menuitem-label"><div><span>Subtitle Editor</span></div></div><button class="ytp-menuitem-content" id="opener">Edit</button></div>');
 
//color script
    function update(jscolor, item) {
    // 'jscolor' instance can be used as a string
    if (item == 'background') {
      $(".captions-text")[0].style.setProperty('background-color', '#' + jscolor , 'important');
    } else if (item == 'text') {
      $(".captions-text")[0].style.setProperty('color', '#' + jscolor , 'important');
    }
}
   
        //ui scripts...
       
  $(function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 500
      },
      hide: {
        effect: "explode",
        duration: 500
      }
    });
 
    $( "#opener" ).click(function() {
      $( "#dialog" ).dialog( "open" );
    });
  });
欢迎访问Greasy Fork镜像
