Monster Twitch

Streches stream to max width and hides left navigation bar with an 'M' toggle on the bottom right

Verze ze dne 04. 04. 2014. Zobrazit nejnovější verzi.

K instalaci tototo skriptu si budete muset nainstalovat rozšíření jako Tampermonkey, Greasemonkey nebo Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Violentmonkey.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat manažer uživatelských skriptů.

(Už mám manažer uživatelských skriptů, nechte mě ho nainstalovat!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(Už mám manažer uživatelských stylů, nechte mě ho nainstalovat!)

// ==UserScript==
// @name       Monster Twitch
// @namespace  http://enut.co/dev
// @author	   Tracerman
// @version    2.66
// @description  Streches stream to max width and hides left navigation bar with an 'M' toggle on the bottom right
// @include        http://*.twitch.tv/*
// @include        http://twitch.tv/*
// @exclude        http://www.twitch.tv/directory*
// @exclude        http://www.twitch.tv/*/dashboard
// @exclude        http://www.twitch.tv/inbox*
// @exclude        http://www.twitch.tv/subscriptions*
// @exclude        http://store.twitch.tv
// @exclude        http://api.twitch.tv/*
// @exclude        https://api.twitch.tv/*
// @require     http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js
// @grant       GM_addStyle
// @copyright  2013+, tracerman
// ==/UserScript==

var showCheck3 = 0;
var zNode3       = document.createElement ('div');
var pHeight = $(".dynamic-player").css("height");
var bHeight = $('#left_col').css("width");
var cHeight = $('#right_col').css("width");
var cDisp 	= $('#right_col').css("display");
var conWidth = $('#content').css("width");
var tHeight = $('#main_col').css("margin-left");
var zHeight = $('#main_col').css("margin-right");
var mrCheck = $('#main_col').css("margin-right");
var zWidth = $('#main_col').css("width");
var ZWidthCheck = zWidth;
var chatHeight = $('#chat').css("width");
var chatLHeight = $('#chat_line').css("width");
var chatLLHeight = $('#chat_line_list').css("width");
var chatLLPadding = $('#chat_line_list').css("padding");


zNode3.innerHTML = '<button id="myButton3" type="button">'
                + 'M</button>';

zNode3.setAttribute ('id', 'myContainer3');
document.body.appendChild (zNode3);

//--- Activate the newly added button.
document.getElementById ("myButton3").addEventListener (
    "click", ButtonClickAction, false
);

function ButtonClickAction (zEvent) {
if(showCheck3 == 1) { 
    $("#channel").removeAttr('style');
    $("#chat_line_list").each(function () {
      this.style.setProperty("padding", chatLLPadding, "important");
});
    $("#chat_line_list").each(function () {
      this.style.setProperty("padding", chatLLPadding);
});
    $("#left_col").show();
    $(".editable").show();
    $("#channel_panels_contain").show();
    $(".stats-and-actions").show();
    $(".resizer").show();
    $("#right_close").show(); 
    $("#right_col").each(function () {
       this.style.setProperty("width", "", "important");
});
    $("#right_col").each(function () {
       this.style.setProperty("width", cHeight);
});
    $("#main_col").removeAttr('style');
    
    $("#main_col").each(function () {
       this.style.setProperty("margin-left", "", "important");
});
    $("#main_col").css("margin-left","");
    
    /* $("#main_col").each(function () {
       this.style.setProperty("margin-left", tHeight);
}); */
    $("#main_col").each(function () {
       /* this.style.setProperty("margin-right", "", "important"); */
       this.style.setProperty("width", "", "important");
});
    
    if (cDisp == "block") {
        
    $("#main_col").each(function () {
      /* this.style.setProperty("margin-right", zHeight); */
        this.style.setProperty("margin-right", "");
       /* this.style.setProperty("width", zWidth); */
});
    }
    
    else {
        $("#main_col").each(function () {
       /* this.style.setProperty("margin-right", "0px"); */
       this.style.setProperty("width", "");
});
        
    }
    
   /* $("#main_col").each(function () {
       this.style.setProperty("margin-left", tHeight);
        /* this.style.setProperty("width", zWidth); */
/* }); */
    
   if(zWidth >= 1) {
    
       $("#main_col").each(function () {
        this.style.setProperty("width", "");
          this.style.setProperty("margin-right", "");
}); 
       
    }
    else {       
        
        /* $("#main_col").css("width", zWidth); */
        $("#main_col").css("width", "");
        
       /* $("#main_col").css("margin-right", "", "important"); */
        
    }
    
    /* if (cDisp == "block") {
       $("#main_col").each(function () {
           this.style.setProperty("margin-right", "340px");
}); 
       
    }
    else {       
        $("#main_col").css("margin-right", "0", "important");
    } */
    
    $(".dynamic-player").each(function () {
       this.style.setProperty("height", "", "important");
});
    $(".dynamic-player").each(function () {
       this.style.setProperty("height", pHeight, "important");
});
    $("#player").each(function () {
      this.style.setProperty("position", "relative");
});
    $("#content").each(function () {
        this.style.setProperty("width", "", "important");
});
    $("#content").each(function () {
        this.style.setProperty("width", conWidth);
});
    $("#chat").each(function () {
       this.style.setProperty("width", "", "important");
});
    $("#chat").each(function () {
       this.style.setProperty("width", chatHeight);
});
    $("#chat_line").each(function () {
       this.style.setProperty("width", "", "important");
});
    $("#chat_line").each(function () {
       this.style.setProperty("width", chatLHeight);
});
    $("#chat_line_list").each(function () {
       this.style.setProperty("width", "", "important");
});
   /* $("#chat_line_list").each(function () {
       this.style.setProperty("width", chatLLHeight);
}); */
    $("#myButton3").fadeTo("fast", 1).delay(300).css({"color":"white"});
    /* $(".primary_button").animate({"width":"149px"}, "fast"); */
    
    //--- Old Chat Button
    $("#chat_speak").animate({"width":"149px"}, "fast");
    //--- New Chat Button
    $(".send-chat-button").css("width", "").css("left", "");
    $("button.primary_button").css("background", "");
    // Show the video bar
    $("#twitch_chat").animate({"top":"51px"}, "fast");
    $("#chat").each(function () {
    this.style.setProperty("top", "51px", "important");
});
    $("#archives").animate({"top":"51px"}, "fast");
    //--- Chat Bottom
    $(".chat-messages").css("bottom", "");
    //--- Old Buttons Border
    $(".dropdown_glyph").css("border", "", "important").css("box-shadow", "", "important");
    //--- New Buttons Border
    $("button.settings").css("margin-right", "").css("border", "", "important").css("box-shadow", "", "important");
    $("button.viewers").css("margin-right", "").css("border", "", "important").css("box-shadow", "", "important");
    $("button.emotemenu").css("margin-right", "").css("border", "", "important").css("box-shadow", "", "important");
    
    //--- New Chat Interface Features
    $(".chat-interface").css("background", "").css("height", "").css("border", "", "important").css("box-shadow", "", "!important");
    $(".textarea-contain").css("border", "");
    
    $(".segmented_tabs").css({"visibility":"visible"});
    showCheck3 = 2;
}
else if(showCheck3 == 0) {
    pHeight = $(".dynamic-player").css("height");
    bHeight = $('#left_col').css("width");
    cHeight = $('#right_col').css("width");
    conWidth = $('#content').css("width");
    tHeight = $('#main_col').css("margin-left");
    zHeight = $('#main_col').css("margin-right");
    chatHeight = $('#chat').css("width");
    chatLHeight = $('#chat_line').css("width");
    chatLLHeight = $('#chat_line_list').css("width");
    chatLLPadding = $('#chat_line_list').css("padding");
    cDisp 	= $('#right_col').css("display");
    zWidth = $('#main_col').css("width");
    
    $("#channel").each(function () {
      this.style.setProperty("padding", "0 0 0 0", "important");
});
    $("#chat_line_list").each(function () {
      this.style.setProperty("padding", "0 0 0", "important");
});
    $(".editable").hide();
    $("#left_col").hide();
    $(".resizer").hide();
    $("#channel_panels_contain").hide();
    $(".stats-and-actions").hide();
    $(".dynamic-player, .dynamic-player object, .dynamic-player video").each(function () {
      this.style.setProperty("height", "100%", "important");
      this.style.setProperty("width", "100%", "important");
});
    $(".dynamic-player").each(function () {
      this.style.setProperty("height", "100%", "important");
      this.style.setProperty("width", "100%", "important");
});
    $("#player").each(function () {
      this.style.setProperty("position", "absolute");
});
    if (cDisp == "block") {
    $("#content").each(function () {
      this.style.setProperty("width", "275px", "important");
});
    $("#right_col").each(function () {
      this.style.setProperty("width", "275px", "important");
});
    $("#chat").animate({"width":"275px"}, "fast");
    $("#chat_line_list").css({"width":""});
    $("#chat_line").animate({"width":"272px"}, "fast");

    $("#main_col").each(function () {
     this.style.setProperty("margin-right", "275px", "important");
      this.style.setProperty("width", "");
});
    
    $(".segmented_tabs").css({"visibility":"hidden"});
    $("#twitch_chat").css({"top":"0px"});
    $("#chat").each(function () {
      this.style.setProperty("top", "0px", "important");
});
    $("#archives").animate({"top":"0px"}, "fast");
    //--- Old Chat Button    
    $("#chat_speak").animate({"width":"84px"}, "fast");
    //--- New Chat Button
    $(".send-chat-button").css("width", "120px").css("left", "auto");
    $("button.primary_button").css("background", "black");
    
    //--- Chat Bottom
    $(".chat-messages").css("bottom", "110px");
        
    //--- New Chat Interface Features
    $(".chat-interface").css("background", "white").css("height", "110px").css("border", "1px solid #6441a5", "important").css("box-shadow", "1px 1px 1px rgb(100, 65, 165), 0px 1px 0px rgba(0, 0, 0, 0.15) inset", "!important");
    $(".textarea-contain").css("border", "2px solid rgb(100, 65, 165)");
    }
    else {
        $("#content").each(function () {
      this.style.setProperty("width", "0px", "important");
});
    $("#right_col").each(function () {
      this.style.setProperty("width", "0px", "important");
});
        $("#main_col").each(function () {
      this.style.setProperty("margin-right", "0px", "important");
           this.style.setProperty("width", "100%", "important");
});
        
    }
    
    if (zWidth > 0) {
       $("#main_col").each(function () {
        this.style.setProperty("width", "100%", "important");
}); 
       
    }
    else {       
        this.style.setProperty("width", "", "important");
    }
    
    $("#main_col").each(function () {
      this.style.setProperty("margin-left", "0px", "important");      
});
    $("#right_close").hide();     
    /* zHeight = $('#main_col').css("margin-right"); */
    //--- Old Buttons Border
    $(".dropdown_glyph").css("border", "1px solid #6441a5", "important").css("box-shadow", "1px 1px 1px rgb(100, 65, 165), 0px 1px 0px rgba(0, 0, 0, 0.15) inset", "!important");
    //--- New Buttons Border
    $("button.settings").css("margin-right", "1px").css("border", "1px solid #6441a5", "important").css("box-shadow", "1px 1px 1px rgb(100, 65, 165), 0px 1px 0px rgba(0, 0, 0, 0.15) inset", "!important");
    $("button.viewers").css("margin-right", "1px").css("border", "1px solid #6441a5", "important").css("box-shadow", "1px 1px 1px rgb(100, 65, 165), 0px 1px 0px rgba(0, 0, 0, 0.15) inset", "!important");
    $("button.emotemenu").css("margin-right", "1px").css("border", "1px solid #6441a5", "important").css("box-shadow", "1px 1px 1px rgb(100, 65, 165), 0px 1px 0px rgba(0, 0, 0, 0.15) inset", "!important");
    
    $("#myButton3").fadeTo("fast", 0.5).delay(300).css({"color":"yellow"});
    showCheck3 = 1;
}
else if(showCheck3 == 2) {
    
    if (cDisp == "block") {
        
    $("#main_col").each(function () {
      this.style.setProperty("margin-right", zHeight);
       /* this.style.setProperty("width", zWidth); */
});
    }
    
    else {
        $("#main_col").each(function () {
       this.style.setProperty("margin-right", "0px");
       this.style.setProperty("width", "");
});
        
    }
    
    $("#main_col").each(function () {
       this.style.setProperty("margin-left", tHeight);
        /* this.style.setProperty("width", zWidth); */
});
    
    $("#main_col").css("width", "");
    if (cDisp == "block") {
       $("#main_col").each(function () {
           this.style.setProperty("margin-right", "340px");
}); 
       
    }
    else {       
        $("#main_col").css("margin-right", "0", "important");
    }
 
    $("#myButton3").fadeTo("fast", 1).delay(300).css({"color":"blue"});
    
    
    showCheck3 = 0;
}
else if(showCheck3 == 3) {
    
}
}

//--- Style our newly added elements using CSS.
GM_addStyle ( multilineStr ( function () {/*!
    #myContainer3 {
        position:               absolute;
        bottom:                    0;
        left:					0;
        font-size:              10px;
        border:                 0px outset black;
        margin:                 0px;
        opacity:                10.0;
        z-index:                250;
        padding:                0px 1px;
    }
    #myButton3 {
        cursor:                 pointer;
       	background: 			transparent;
    	border: 				none !important;
        color:					purple;
        font-weight:			bold;
    }
    #myContainer3 p {
        color:                  purple;
        background:             transparent;
    }
*/} ) );

function multilineStr (dummyFunc) {
    var str = dummyFunc.toString ();
    str     = str.replace (/^[^\/]+\/\*!?/, '') // Strip function () { /*!
            .replace (/\s*\*\/\s*\}\s*$/, '')   // Strip */ }
            .replace (/\/\/.+$/gm, '') // Double-slash comments wreck CSS. Strip them.
            ;
    return str;
}