Vertical Stream Magic

Adjust Twitch streams for a vertical orientated monitor.

当前为 2017-01-23 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name          Vertical Stream Magic
// @namespace     http://greasyfork.org/users/2240-doodles
// @author        Doodles
// @version       2
// @description   Adjust Twitch streams for a vertical orientated monitor.
// @include       *://www.twitch.tv/*
// @require       https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js
// @grant         none
// @updateVersion 2
// ==/UserScript==

this.$ = this.jQuery = jQuery.noConflict(true);
$(document).ready(function () {
	'use strict';
	verticalStreamMagic();
	var observer = new MutationObserver(verticalStreamMagic);
	observer.observe(document.body, {childList: true});
	$(window).resize(resizeIframes);
	function resizeIframes() {
		if($("iframe#vsmStream").length !== 0){
			var _width = window.innerWidth;
			var _height = window.innerHeight;
			var streamFrameHeight = Math.floor((_width / 16) * 9);
			$( "iframe#vsmStream" ).attr("width", _width).attr("height", streamFrameHeight);
			$( "iframe#vsmChat" ).attr("width", _width).attr("height", _height - streamFrameHeight);
		}
	}	
	function verticalStreamMagic() {
		if($("iframe#vsmStream").length === 0){
			if($("div.js-chat-interface").length !== 0 && document.URL.split("twitch.tv/")[1].split("/").length == 1 && window.top == window.self){
				var channelName = document.URL.split("twitch.tv/")[1].split("/")[0].split("&")[0].split("#")[0];
				$('script').each(function () { $(this).remove(); });
				$('body').html('' +
					'<iframe src="https://player.twitch.tv/?channel='+channelName+'" id="vsmStream" height="450" width="800" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>' + 
					'<iframe src="https://www.twitch.tv/'+channelName+'/chat?popout=" id="vsmChat" height="450" width="800" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>' +
				'');
				$('head').html('<title>'+channelName+'</title>');
				$('<style></style>').prop('type', 'text/css').html('' +
					'html { height:100%; }body{padding:0 0 0 0;margin:0 0 0 0;background-color:#333;}iframe#vsmStream, iframe#vsmChat{padding:0 0 0 0;margin:0 0 0 0;display:block;}' +
				'').appendTo('head');
				resizeIframes();
			}
		}
	}
});