fix injection in firefox

This commit is contained in:
Maximilian Keßler 2022-09-17 01:22:20 +02:00
parent fc18c6d448
commit 54b59eb438

View file

@ -1,17 +1,19 @@
// ==UserScript== // ==UserScript==
// @name onlinetichu.com card counter // @name onlinetichu.com card counter
// @version 1.0.0 // @version 1.0.2
// @description automatically count cards at onlinetichu.com // @description automatically count cards at onlinetichu.com
// @author kesslermaximilian // @author kesslermaximilian
// @match *://*.onlinetichu.com/Site/Game/Table/* // @match *://*.onlinetichu.com/Site/Game/Table/*
// ==/UserScript== // ==/UserScript==
// disable auto fold functionality completely // disable auto fold functionality completely
if (ot.AutoFold) { function injectCounter() {
if (ot.AutoFold) {
ot.$autoFold.click() ot.$autoFold.click()
ot.$autoFold.hide() ot.$autoFold.hide()
} }
var myStyles = `
var myStyles = `
#playedHigh { #playedHigh {
position: absolute; position: absolute;
top: 620px; top: 620px;
@ -43,85 +45,85 @@ var myStyles = `
.playedCardsLayout .card:hover { .playedCardsLayout .card:hover {
z-index: 1400; z-index: 1400;
} }
` `
var styleSheet = document.createElement("style") var styleSheet = document.createElement("style")
styleSheet.innerText = myStyles; styleSheet.innerText = myStyles;
console.log(styleSheet); console.log(styleSheet);
document.head.appendChild(styleSheet); document.head.appendChild(styleSheet);
// add an extra field where we will put down the played cards // add an extra field where we will put down the played cards
var cardsField = document.createElement('div'); var cardsField = document.createElement('div');
cardsField.id = 'cardsField'; cardsField.id = 'cardsField';
cardsField.style.marginLeft = '25px'; cardsField.style.marginLeft = '25px';
var playedHigh = document.createElement('div'); var playedHigh = document.createElement('div');
playedHigh.id = 'playedHigh'; playedHigh.id = 'playedHigh';
playedHigh.style.marginLeft = '25px'; playedHigh.style.marginLeft = '25px';
playedHigh.className = 'row'; playedHigh.className = 'row';
playedHigh.hidden = true; playedHigh.hidden = true;
var playedLow = document.createElement('div'); var playedLow = document.createElement('div');
playedLow.id = 'playedLow'; playedLow.id = 'playedLow';
playedLow.style.marginLeft = '25px'; playedLow.style.marginLeft = '25px';
playedLow.className = 'row'; playedLow.className = 'row';
playedLow.hidden = true; playedLow.hidden = true;
tableIG = document.getElementById('gameField').parentNode; tableIG = document.getElementById('gameField').parentNode;
tableIG.appendChild(playedHigh); tableIG.appendChild(playedHigh);
tableIG.appendChild(playedLow); tableIG.appendChild(playedLow);
var createCardPlace = function(value, shift, node) { var createCardPlace = function(value, shift, node) {
var playedCards = document.createElement('ul'); var playedCards = document.createElement('ul');
playedCards.id = 'playedCards' + value; playedCards.id = 'playedCards' + value;
// playedCards.className = 'layoutPlayedCards list-unstyled col-lg-2'; // playedCards.className = 'layoutPlayedCards list-unstyled col-lg-2';
// playedCards.className = 'playedCardsLayout list-unstyled'; // playedCards.className = 'playedCardsLayout list-unstyled';
playedCards.className = 'playedCardsLayout list-unstyled'; playedCards.className = 'playedCardsLayout list-unstyled';
playedCards.style.width = '160px'; playedCards.style.width = '160px';
playedCards.style.marginLeft = '25px'; playedCards.style.marginLeft = '25px';
playedCards.style.left = shift*129 + 'px'; playedCards.style.left = shift*129 + 'px';
node.appendChild(playedCards); node.appendChild(playedCards);
} }
createCardPlace(1, 0, document.getElementById('playedHigh')); createCardPlace(1, 0, document.getElementById('playedHigh'));
for(let i = 14; i > 8; i--) { for(let i = 14; i > 8; i--) {
createCardPlace(i, 14 - i + 1, document.getElementById('playedHigh')); createCardPlace(i, 14 - i + 1, document.getElementById('playedHigh'));
} }
for(let i = 8; i > 1; i--) { for(let i = 8; i > 1; i--) {
createCardPlace(i, 8 - i, document.getElementById('playedLow')); createCardPlace(i, 8 - i, document.getElementById('playedLow'));
} }
var smartFoldButton = document.createElement('button'); var smartFoldButton = document.createElement('button');
smartFoldButton.className = "btn btn-danger btn-xs"; smartFoldButton.className = "btn btn-danger btn-xs";
smartFoldButton.id = "smartFold"; smartFoldButton.id = "smartFold";
smartFoldButton.type = "button"; smartFoldButton.type = "button";
smartFoldButton.innerHTML = 'Smart fold: <span id="smartFoldValue" data-on="Yes" data-off="No">Yes</span>'; smartFoldButton.innerHTML = 'Smart fold: <span id="smartFoldValue" data-on="Yes" data-off="No">Yes</span>';
var showPlayedButton = document.createElement('button'); var showPlayedButton = document.createElement('button');
showPlayedButton.className = "btn btn-primary btn-xs"; showPlayedButton.className = "btn btn-primary btn-xs";
showPlayedButton.id = "showPlayed"; showPlayedButton.id = "showPlayed";
showPlayedButton.type = "button"; showPlayedButton.type = "button";
showPlayedButton.innerHTML = 'Show counted cards: <span id="showPlayedValue" data-on="Yes" data-off="No">No</span>'; showPlayedButton.innerHTML = 'Show counted cards: <span id="showPlayedValue" data-on="Yes" data-off="No">No</span>';
var showRemainingButton = document.createElement('button'); var showRemainingButton = document.createElement('button');
showRemainingButton.className = "btn btn-info btn-xs"; showRemainingButton.className = "btn btn-info btn-xs";
showRemainingButton.id = "showRemaining"; showRemainingButton.id = "showRemaining";
showRemainingButton.type = "button"; showRemainingButton.type = "button";
showRemainingButton.innerHTML = 'Show: <span id="showRemainingValue" data-on="Remaining" data-off="Played">Remaining</span>'; showRemainingButton.innerHTML = 'Show: <span id="showRemainingValue" data-on="Remaining" data-off="Played">Remaining</span>';
buttons = document.getElementById('statusButtons'); buttons = document.getElementById('statusButtons');
buttons.insertBefore(showRemainingButton, document.getElementById('autoFold')); buttons.insertBefore(showRemainingButton, document.getElementById('autoFold'));
buttons.insertBefore(showPlayedButton, document.getElementById('autoFold')); buttons.insertBefore(showPlayedButton, document.getElementById('autoFold'));
buttons.insertBefore(smartFoldButton, document.getElementById('autoFold')); buttons.insertBefore(smartFoldButton, document.getElementById('autoFold'));
// playedCards. // playedCards.
// ot.$gameField.insertAfter(playedCards, ot.$gameField.lastChild); // ot.$gameField.insertAfter(playedCards, ot.$gameField.lastChild);
// set up counting of played cards // set up counting of played cards
var OnlineTichuCounter = { var OnlineTichuCounter = {
$playedCards: {}, $playedCards: {},
$smartFold: $('#smartFold'), $smartFold: $('#smartFold'),
$smartFoldValue: $('#smartFoldValue'), $smartFoldValue: $('#smartFoldValue'),
@ -244,24 +246,26 @@ var OnlineTichuCounter = {
} }
} }
} }
} }
if (!window.otc) { if (!window.otc) {
window.otc = OnlineTichuCounter; window.otc = OnlineTichuCounter;
} }
// add functionality to smartFold button otc.$showRemaining.hide();
otc.$smartFold.click(function () {
// add functionality to smartFold button
otc.$smartFold.click(function () {
otc.smartFold = !otc.smartFold; otc.smartFold = !otc.smartFold;
if (otc.smartFold) { if (otc.smartFold) {
otc.$smartFoldValue.text(otc.$smartFoldValue.data('on')); otc.$smartFoldValue.text(otc.$smartFoldValue.data('on'));
} else { } else {
otc.$smartFoldValue.text(otc.$smartFoldValue.data('off')); otc.$smartFoldValue.text(otc.$smartFoldValue.data('off'));
} }
}); });
// add functionality to show button // add functionality to show button
otc.$showPlayed.click(function () { otc.$showPlayed.click(function () {
otc.showPlayed = !otc.showPlayed; otc.showPlayed = !otc.showPlayed;
if (otc.showPlayed) { if (otc.showPlayed) {
otc.$showPlayedValue.text(otc.$showPlayedValue.data('on')); otc.$showPlayedValue.text(otc.$showPlayedValue.data('on'));
@ -274,9 +278,9 @@ otc.$showPlayed.click(function () {
otc.$playedLow.hide(); otc.$playedLow.hide();
otc.$showRemaining.hide(); otc.$showRemaining.hide();
} }
}); });
otc.$showRemaining.click(function () { otc.$showRemaining.click(function () {
otc.showRemaining = !otc.showRemaining; otc.showRemaining = !otc.showRemaining;
if (otc.showRemaining) { if (otc.showRemaining) {
otc.$showRemainingValue.text(otc.$showRemainingValue.data('on')); otc.$showRemainingValue.text(otc.$showRemainingValue.data('on'));
@ -284,16 +288,16 @@ otc.$showRemaining.click(function () {
otc.$showRemainingValue.text(otc.$showRemainingValue.data('off')); otc.$showRemainingValue.text(otc.$showRemainingValue.data('off'));
} }
otc.action.drawPlayedCards(); otc.action.drawPlayedCards();
}); });
for(let i = 1; i < 15; i++) { for(let i = 1; i < 15; i++) {
otc.$playedCards[i] = $('#playedCards' + i); otc.$playedCards[i] = $('#playedCards' + i);
} }
otc.action.resetPlayedCards(); otc.action.resetPlayedCards();
otc.util.populateAllCards(); otc.util.populateAllCards();
MyTableState = (function() { MyTableState = (function() {
var cachedFunction = ot.reaction.TableState; var cachedFunction = ot.reaction.TableState;
return function() { return function() {
@ -301,8 +305,8 @@ MyTableState = (function() {
message = arguments[0]; message = arguments[0];
// console.log('detected table state change event'); // console.log('detected table state change event');
// console.log(message.Table.Status); // console.log(message.Table.Status);
// reset played cards at start of round // reset played cards at start of round
if(message.Table.Status == 'WaitForNextCards') { if(message.Table.Status == 'WaitForNextCards') {
@ -334,10 +338,10 @@ MyTableState = (function() {
return result; return result;
} }
})(); })();
MyChat = (function() { MyChat = (function() {
var cachedFunction = ot.reaction.Chat; var cachedFunction = ot.reaction.Chat;
return function() { return function() {
@ -361,9 +365,9 @@ MyChat = (function() {
return result; return result;
} }
})(); })();
MyExchangeCards = (function() { MyExchangeCards = (function() {
var cachedFunction = ot.action.ExchangeCards; var cachedFunction = ot.action.ExchangeCards;
return function() { return function() {
@ -383,17 +387,35 @@ MyExchangeCards = (function() {
var result = cachedFunction.apply(this, arguments); var result = cachedFunction.apply(this, arguments);
return result; return result;
} }
})(); })();
MyReviewExchange = (function() { MyReviewExchange = (function() {
var cachedFunction = ot.reaction.ReviewExchange; var cachedFunction = ot.reaction.ReviewExchange;
return function() { return function() {
var result = cachedFunction.apply(this, arguments); var result = cachedFunction.apply(this, arguments);
return result; return result;
} }
})(); })();
ot.reaction.TableState = MyTableState; ot.reaction.TableState = MyTableState;
ot.reaction.Chat = MyChat; ot.reaction.Chat = MyChat;
ot.action.ExchangeCards = MyExchangeCards; ot.action.ExchangeCards = MyExchangeCards;
};
// Special care is to be taken to safely inject our javascript into the websiet
// without the website being able to talk back to greasemonkey
// (which would be a security problem)
// see
// https://stackoverflow.com/questions/5006460/userscripts-greasemonkey-calling-a-websites-javascript-functions
// and the excellent answer by Wayne for details on this
function exec(fn) {
var script = document.createElement('script');
script.setAttribute("type", "application/javascript");
script.textContent = '(' + fn + ')();';
document.body.appendChild(script); // run the script
document.body.removeChild(script); // clean up
}
exec(injectCounter);