twitchplaysdark controller
目前為
// ==UserScript==
// @name twitchplaysdark
// @namespace https://greasyfork.org/en/scripts/13027-twitchplaysdark
// @version 0.1
// @description twitchplaysdark controller
// @author You
// @match http://www.twitch.tv/twitchplaysdark
// @grant GM_getValue
// @grant GM_setValue
// @grant GM_addStyle
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
// @require http://code.jquery.com/ui/1.9.2/jquery-ui.js
// ==/UserScript==
GM_addStyle ( "\
.tpdb {\
cursor:pointer;\
position:absolute;\
background: #999999;\
background-image: -webkit-linear-gradient(top, #999999, #404040);\
background-image: -moz-linear-gradient(top, #999999, #404040);\
background-image: -ms-linear-gradient(top, #999999, #404040);\
background-image: -o-linear-gradient(top, #999999, #404040);\
background-image: linear-gradient(to bottom, #999999, #404040);\
-webkit-border-radius: 10;\
-moz-border-radius: 10;\
border-radius: 10px;\
font-family: Arial;\
color: #ffffff;\
font-size: 20px;\
padding: 0px 2px 2px 2px;\
text-decoration: none;\
text-align:center;\
height:30px;\
width:30px;\
}\
.tpdb_v {\
-webkit-transform: rotate(-90deg);\
-moz-transform: rotate(-90deg);\
-ms-transform: rotate(-90deg);\
-o-transform: rotate(-90deg);\
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);\
}\
\
.tpdb:hover {\
background: #bfbfbf;\
background-image: -webkit-linear-gradient(top, #bfbfbf, #969696);\
background-image: -moz-linear-gradient(top, #bfbfbf, #969696);\
background-image: -ms-linear-gradient(top, #bfbfbf, #969696);\
background-image: -o-linear-gradient(top, #bfbfbf, #969696);\
background-image: linear-gradient(to bottom, #bfbfbf, #969696);\
text-decoration: none;\
}\
#TPD {\
position:absolute;\
z-index:1000;\
background:black;\
border:1px solid #333;\
border-radius:10px;\
height:300px;\
width:300px;\
color:white;\
}\
.tpd_option{\
cursor:pointer;\
}\
.tpd_tooltip{\
margin:8px;\
padding:8px;\
border:1px solid blue;\
background-color:yellow;\
position: absolute;\
z-index: 2;\
}\
" );
unsafeWindow.TPDNS = {
sendCommand: function(cmd) {
var val = $( cmd ).attr('id').replace('c_','');
if(!$( "#tpd_target" ).prop('readonly'))
if($( "#tpd_target" ).attr('checked'))
val = 't' + val;
else
val = 'n' + val;
console.log("cmd:" + val);
$( '#chat_text_input' ).val(val);
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0, false, false, false, false, 0, null);
var a = document.getElementsByClassName("send-chat-button")[0];
a.dispatchEvent(evt);
return 0;
},
ts: function (cb) {
if (cb.readOnly) cb.checked=cb.readOnly=false;
else if (!cb.checked) cb.readOnly=cb.indeterminate=true;
}
}
jQuery(function($){
$( document ).tooltip({
track: true,
position: {my: "left top", at: "left bottom"}
});
$('body').append('<div id="TPD"></div>');
$( "#TPD" ).css("top",GM_getValue("top",0));
$( "#TPD" ).css("left",GM_getValue("left",0));
$( "#TPD" ).draggable();
$( "#TPD" ).draggable('disable');
$( '#TPD' ).mouseup(function() {
var divOffset = $("#TPD").offset();
GM_setValue("left", divOffset.left);
GM_setValue("top", divOffset.top);
console.log(divOffset.top + " , " + divOffset.left);
});
$( '#TPD' ).append('<div class=tpd_option style="position:absolute;top:10px;right:10px;"><label for=tpd_drag class=tpd_option>✣</label><input alt="Move this window" id=tpd_drag class=tpd_option type="checkbox" value="0"></div>');
$( '#tpd_drag' ).click(function() {
if($( "#tpd_drag" ).attr('checked'))
$( "#TPD" ).draggable('enable');
else
$( "#TPD" ).draggable('disable');
});
$( '#TPD' ).append('<div class=tpd_option style="position:absolute;top:30px;right:10px;"><label for=tpd_target class=tpd_option>⊚</label><input alt="Target (n,t or none)" id=tpd_target class=tpd_option type="checkbox" value="0" onclick="window.TPDNS.ts(this)" readonly></div>');
$( '#tpd_target' ).prop("indeterminate", true);
//directions
$( '#TPD' ).append('<div id=c_f class=tpdb style="top:10px;left:50px;" onclick="window.TPDNS.sendCommand(this);">↑</div>');
$( '#TPD' ).append('<div id=c_b class=tpdb style="top:90px;left:50px;" onclick="window.TPDNS.sendCommand(this);">↓</div>');
$( '#TPD' ).append('<div id=c_l class=tpdb style="top:50px;left:10px;" onclick="window.TPDNS.sendCommand(this);">←</div>');
$( '#TPD' ).append('<div id=c_r class=tpdb style="top:50px;left:90px;" onclick="window.TPDNS.sendCommand(this);">→</div>');
$( '#TPD' ).append('<div id=c_fr class=tpdb style="top:10px;left:90px;" onclick="window.TPDNS.sendCommand(this);">↗</div>');
$( '#TPD' ).append('<div id=c_fl class=tpdb style="top:10px;left:10px;" onclick="window.TPDNS.sendCommand(this);">↖</div>');
$( '#TPD' ).append('<div id=c_br class=tpdb style="top:90px;left:90px;" onclick="window.TPDNS.sendCommand(this);">↘</div>');
$( '#TPD' ).append('<div id=c_bl class=tpdb style="top:90px;left:10px;" onclick="window.TPDNS.sendCommand(this);">↙</div>');
//flong
$( '#TPD' ).append('<div id=c_flong class=tpdb style="top:50px;left:50px;" onclick="window.TPDNS.sendCommand(this);">↟</div>');
//attacks
$( '#TPD' ).append('<div id=c_l1 class=tpdb style="top:10px;left:140px;" onclick="window.TPDNS.sendCommand(this);">ᗢ</div>');
$( '#TPD' ).append('<div id=c_l2 class=tpdb style="top:50px;left:140px;" onclick="window.TPDNS.sendCommand(this);">☇</div>');
$( '#TPD' ).append('<div id=c_r1 class=tpdb style="top:10px;left:180px;" onclick="window.TPDNS.sendCommand(this);">⚔</div>');
$( '#TPD' ).append('<div id=c_r2 class=tpdb style="top:10px;left:220px;" onclick="window.TPDNS.sendCommand(this);">⚒</div>');
$( '#TPD' ).append('<div id=c_ja class=tpdb style="top:50px;left:220px;" onclick="window.TPDNS.sendCommand(this);">☭</div>');
//rolls
$( '#TPD' ).append('<div id=c_rf class=tpdb style="top:140px;left:50px;" onclick="window.TPDNS.sendCommand(this);"><div class=tpdb_v>↬</div></div>');
$( '#TPD' ).append('<div id=c_rb class=tpdb style="top:220px;left:50px;" onclick="window.TPDNS.sendCommand(this);"><div class=tpdb_v>↫</div></div>');
$( '#TPD' ).append('<div id=c_rl class=tpdb style="top:180px;left:10px;" onclick="window.TPDNS.sendCommand(this);">↫</div>');
$( '#TPD' ).append('<div id=c_rr class=tpdb style="top:180px;left:90px;" onclick="window.TPDNS.sendCommand(this);">↬</div>');
$( "#TPD" ).children("div").each(function() {
if($(this).attr("id"))
$( this ).attr( "title", $(this).attr("id").replace('c_','')) ;
});
});