API tools faq
paste
Advertisement
Guest User

Skribbl.io script

a guest
Jun 2nd, 2019
3,036
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 11.04 KB | None | 0 0
raw download clone embed print report
  1. // ==UserScript==
  2. // @name         caasinehc's Skribbl tool
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.0
  5. // @description  Useful tools for skribbl.io
  6. // @author       Isaac Chen
  7. // @match        https://skribbl.io/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12. // Set the color (red, white, green, black, blue, etc)
  13. var setColor = (function() {
  14.     function getColorElem(row, column) {
  15.         return document.querySelector(
  16.               "#containerBoard "
  17.             + "> div.containerToolbar "
  18.             + "> div.containerColorbox "
  19.             + "> div:nth-child(" + row + ") "
  20.             + "> div:nth-child(" + column + ")"
  21.         );
  22.     }
  23.     let colors = {
  24.         "white":   getColorElem(1, 1),
  25.         "silver":  getColorElem(1, 2),
  26.         "red":     getColorElem(1, 3),
  27.         "orange":  getColorElem(1, 4),
  28.         "yellow":  getColorElem(1, 5),
  29.         "lime":    getColorElem(1, 6),
  30.         "sky":     getColorElem(1, 7),
  31.         "blue":    getColorElem(1, 8),
  32.         "purple":  getColorElem(1, 9),
  33.         "pink":    getColorElem(1, 10),
  34.         "tan":     getColorElem(1, 11),
  35.         "black":   getColorElem(2, 1),
  36.         "gray":    getColorElem(2, 2),
  37.         "maroon":  getColorElem(2, 3),
  38.         "scarlet": getColorElem(2, 4),
  39.         "gold":    getColorElem(2, 5),
  40.         "green":   getColorElem(2, 6),
  41.         "teal":    getColorElem(2, 7),
  42.         "navy":    getColorElem(2, 8),
  43.         "plum":    getColorElem(2, 9),
  44.         "mauve":   getColorElem(2, 10),
  45.         "brown":   getColorElem(2, 11)
  46.     }
  47.     return function(color) {
  48.         colors[color].click();
  49.     }
  50. })();
  51.  
  52. // Set the tool (pen, eraser, fill)
  53. var setTool = (function() {
  54.     function getTool(n) {
  55.         return document.querySelector(
  56.               "#containerBoard "
  57.             + "> div.containerToolbar "
  58.             + "> div.containerTools "
  59.             + "> div:nth-child(" + n + ")"
  60.         );
  61.     }
  62.     let tools = {
  63.         "pen":    getTool(1),
  64.         "eraser": getTool(2),
  65.         "fill":   getTool(3)
  66.     }
  67.     return function(tool) {
  68.         tools[tool].click();
  69.     }
  70. })();
  71.  
  72. // Set the pen size (1, 2, 3, 4)
  73. var setSize = (function() {
  74.     function getSize(n) {
  75.         return document.querySelector(
  76.               "#containerBoard "
  77.             + "> div.containerToolbar "
  78.             + "> div.containerBrushSizes "
  79.             + "> div:nth-child(" + n + ") "
  80.             + "> div "
  81.             + "> div"
  82.         );
  83.     }
  84.     let sizes = {
  85.         1: getSize(1),
  86.         2: getSize(2),
  87.         3: getSize(3),
  88.         4: getSize(4)
  89.     }
  90.     return function(size) {
  91.         sizes[size].click();
  92.     }
  93. })();
  94.  
  95. // Clear the canvas
  96. var clearCanvas = (function() {
  97.     let clearCanvasButton = document.querySelector("#buttonClearCanvas");
  98.  
  99.     return function() {
  100.         clearCanvasButton.click();
  101.     }
  102. })();
  103.  
  104. // Votekick
  105. var voteKick = (function() {
  106.     let voteKickButton = document.querySelector("#votekickCurrentplayer");
  107.  
  108.     return function() {
  109.         voteKickButton.click();
  110.     }
  111. })();
  112.  
  113. // Thumbs up or down
  114. var rate = (function() {
  115.     let ratings = {
  116.         "good": document.querySelector("#rateDrawing > div:nth-child(1) > div"),
  117.         "bad":  document.querySelector("#rateDrawing > div:nth-child(2) > div")
  118.     }
  119.  
  120.     return function(rating) {
  121.         ratings[rating].click();
  122.     }
  123. })();
  124.  
  125. // Choose which word to draw
  126. var chooseWord = function(word) {
  127.     document.querySelector(
  128.           "#overlay "
  129.         + "> div "
  130.         + "> div.wordContainer "
  131.         + "> div:nth-child("
  132.         + word
  133.         + ")"
  134.     ).click();
  135. };
  136.  
  137. function isDrawing() {
  138.     return document.querySelector("#containerBoard > div.containerToolbar").style.display != "none";
  139. }
  140.  
  141.  
  142.  
  143.  
  144.  
  145.  
  146.  
  147.  
  148.  
  149.  
  150. // turn the chatbox green if the guess matches the hint
  151. (function() {
  152.     function templateToRegex(template) {
  153.         return new RegExp("^" + template.split("_").join("[A-Za-z]") + "$");
  154.     }
  155.  
  156.     let inputBox    = document.querySelector("#inputChat"  );
  157.     let hintDisplay = document.querySelector("#currentWord");
  158.     setInterval(function() {
  159.         let text = inputBox.value.toLowerCase();
  160.         let regex = templateToRegex(hintDisplay.innerText);
  161.         if(regex.test(text) && text.length) {
  162.             inputBox.style.backgroundColor = "lime";
  163.         }
  164.         else {
  165.             inputBox.style.backgroundColor = "white";
  166.         }
  167.     }, 1000 / 60)
  168. })();
  169.  
  170. // Color wheel
  171. (function() {
  172.     let canvas = document.createElement("canvas");
  173.     document.body.appendChild(canvas);
  174.     canvas.width                 = window.innerWidth;
  175.     canvas.height                = window.innerHeight;
  176.     canvas.style.position        = "absolute";
  177.     canvas.style.backgroundColor = "transparent";
  178.     canvas.style.zIndex          = 10;
  179.     canvas.style.top             = 0;
  180.     canvas.style.left            = 0;
  181.     canvas.style.pointerEvents   = "none";
  182.  
  183.     let ctx = canvas.getContext("2d");
  184.  
  185.     let colorTable = [0, 1, 12, 11, 21, 13, 10, 14, 2, 3, 15, 4, 5, 16, 18, 17, 7, 6, 19, 8, 20, 9];
  186.     let colorCount = colorTable.length;
  187.     let sliceAngle = 360 / colorCount;
  188.     let width      = canvas.width;
  189.     let height     = canvas.height;
  190.  
  191.     let mousePos    = {x: 0, y: 0};
  192.     let palettePos  = {x: 0, y: 0};
  193.     let showPalette = false;
  194.     let selectedColor = 0;
  195.  
  196.     function colorDecoder(color) {
  197.         return ["white", "gray", "silver", "gray", "red", "maroon", "orange", "scarlet", "yellow", "gold", "lime", "green", "sky", "teal", "blue", "navy", "purple", "eggplant", "pink", "mauve", "tan", "brown"][color];
  198.     }
  199.  
  200.     function renderPalette() {
  201.         let selectedAngle = (450 - Math.atan2(palettePos.x - mousePos.x, palettePos.y - mousePos.y) * 180 / Math.PI) % 360;
  202.         selectedColor = Math.floor(selectedAngle / sliceAngle);
  203.  
  204.         ctx.clearRect(0, 0, width, height);
  205.  
  206.         ctx.shadowBlur = 50;
  207.         ctx.shadowColor = "black";
  208.         ctx.beginPath();
  209.         ctx.fillStyle = document.getElementsByClassName("colorItem")[colorTable[selectedColor]].style.backgroundColor;
  210.         ctx.arc(mousePos.x, mousePos.y, 180, 0, Math.PI * 2);
  211.         ctx.lineTo(mousePos.x, mousePos.y);
  212.         ctx.closePath;
  213.         ctx.fill();
  214.         for(let i = 0; i < colorCount; i++) {
  215.             ctx.shadowBlur = 5;
  216.             ctx.shadowColor = "black";
  217.             ctx.beginPath();
  218.             ctx.moveTo(mousePos.x, mousePos.y);
  219.             ctx.fillStyle = document.getElementsByClassName("colorItem")[colorTable[i]].style.backgroundColor;
  220.             ctx.arc(mousePos.x, mousePos.y, 160, Math.PI / 180 * i * sliceAngle, Math.PI / 180 * i * sliceAngle + (Math.PI / 180 * sliceAngle));
  221.             ctx.lineTo(mousePos.x, mousePos.y);
  222.             ctx.closePath();
  223.             ctx.fill();
  224.             ctx.stroke();
  225.         }
  226.         ctx.shadowBlur = 40;
  227.         ctx.shadowColor = "white";
  228.         ctx.beginPath();
  229.         ctx.moveTo(mousePos.x, mousePos.y);
  230.         ctx.fillStyle = document.getElementsByClassName("colorItem")[colorTable[selectedColor]].style.backgroundColor; // might have to be wrapped in a try-catch?
  231.         ctx.arc(mousePos.x, mousePos.y, 200, Math.PI / 180 * selectedColor * sliceAngle, Math.PI / 180 * selectedColor * sliceAngle + (Math.PI / 180 * sliceAngle));
  232.         ctx.lineTo(mousePos.x, mousePos.y);
  233.         ctx.closePath();
  234.         ctx.fill();
  235.         ctx.stroke();
  236.     }
  237.  
  238.     document.addEventListener("mousedown", function(e) {
  239.         if(e.button == 2) {
  240.             showPalette = true;
  241.             canvas.width = window.innerWidth;
  242.             width = canvas.width;
  243.             canvas.height = window.innerHeight;
  244.             height = canvas.height;
  245.             renderPalette();
  246.         }
  247.     }, false);
  248.  
  249.     document.addEventListener("mouseup", function(e) {
  250.         if(showPalette) {
  251.             showPalette = false;
  252.             ctx.clearRect(0, 0, width, height);
  253.             document.getElementsByClassName("colorItem")[colorTable[selectedColor]].click();
  254.         }
  255.     }, false);
  256.  
  257.     document.addEventListener("mousemove", function(e) {
  258.         let rect = e.target.getBoundingClientRect();
  259.         if(!showPalette) {
  260.             mousePos.x = e.pageX;
  261.             mousePos.y = e.pageY;
  262.         }
  263.         else {
  264.             palettePos.x = e.pageX;
  265.             palettePos.y = e.pageY;
  266.             renderPalette();
  267.         }
  268.     }, false)
  269.  
  270.     document.addEventListener("contextmenu", function(e) {
  271.         e.preventDefault();
  272.         return false;
  273.     }, false);
  274. })();
  275.  
  276. // wordlist stuff
  277. (function() {
  278.     function saveWordList() {
  279.         removeDuplicateWords();
  280.         localStorage.setItem("wordList", JSON.stringify(wordList));
  281.     }
  282.  
  283.     let wordList = JSON.parse(localStorage.getItem("wordList") || "[]");
  284.     let saveWords = true;
  285.  
  286.     function removeDuplicateWords() {
  287.         let words = {};
  288.         let newWordList = wordList.filter(function(item) {
  289.             return words.hasOwnProperty(item) ? false : (words[item] = true);
  290.         });
  291.         wordList = newWordList;
  292.     }
  293.  
  294.     window.addEventListener("unload", saveWordList, false);
  295.  
  296.     function theWordWasCallback() {
  297.         let text = theWordWasTarget.innerText;
  298.         if(saveWords && text.startsWith("The word was: ")) {
  299.             wordList.push(text.replace("The word was: ", ""));
  300.             removeDuplicateWords();
  301.         }
  302.     }
  303.     let theWordWasTarget = document.querySelector("#overlay > div > div.text");
  304.     let theWordWasObserver = new MutationObserver(theWordWasCallback);
  305.     theWordWasObserver.observe(theWordWasTarget, {attributes: true, childList: true, characterData: true, subtree: true});
  306.  
  307.     function chooseAWordCallback() {
  308.         if(saveWords) {
  309.             wordList.push(chooseAWordTarget.children[0].innerText);
  310.             wordList.push(chooseAWordTarget.children[1].innerText);
  311.             wordList.push(chooseAWordTarget.children[2].innerText);
  312.             removeDuplicateWords();
  313.         }
  314.     }
  315.     let chooseAWordTarget = document.querySelector("#overlay > div > div.wordContainer");
  316.     let chooseAWordObserver = new MutationObserver(chooseAWordCallback);
  317.     chooseAWordObserver.observe(chooseAWordTarget, {attributes: true, childList: true, characterData: true, subtree: true});
  318.  
  319.     function templateToRegex(template) {
  320.         return new RegExp("^" + template.split("_").join("[A-Za-z]") + "$");
  321.     }
  322.  
  323.     document.addEventListener("keydown", function(e) {
  324.         if(e.key == "h" && e.altKey && !isDrawing()) {
  325.             console.log("bringing up list of possible words");
  326.             let regex = templateToRegex(document.querySelector("#currentWord").innerText);
  327.             let matches = [];
  328.             for(let word of wordList) {
  329.                 if(regex.test(word)) matches.push(word.toLowerCase());
  330.             }
  331.             let matchesText = matches.length > 0 ? "Possible words: \n" + matches.sort().join(", ") : "No matches found in your database!";
  332.             console.log(matchesText);
  333.             alert(matchesText);
  334.         }
  335.         else if(e.key == "s" && e.altKey) {
  336.             alert("Stopped saving words to database!");
  337.             saveWords = false;
  338.         }
  339.         else if(e.key == "r" && e.altKey) {
  340.             alert("Resumed saving words to database!");
  341.             saveWords = true;
  342.         }
  343.     }, false);
  344. })();
  345.  
  346. // Vote/rate hotkeys
  347. (function() {
  348.     document.addEventListener("keydown", function(e) {
  349.         if(e.key == "g" && e.altKey && !isDrawing()) {
  350.             rate("good");
  351.         }
  352.         else if(e.key == "b" && e.altKey && !isDrawing()) {
  353.             rate("bad");
  354.         }
  355.         else if(e.key == "v" && e.altKey && !isDrawing()) {
  356.             voteKick();
  357.         }
  358.     }, false);
  359. })();
  360.  
  361. function wordScrape() {
  362.     function startGame() {
  363.         document.querySelector("#modalIdle > div > div > div.modal-header > button").click();
  364.         if(document.querySelector("#screenLogin").style.display != "none") {
  365.             document.querySelector("#modalKicked > div > div > div.modal-footer > button").click();
  366.             document.querySelector("#modalDisconnect > div > div > div.modal-footer > button").click();
  367.             document.querySelector("#inputName").value = "Word Scraper";
  368.             document.querySelector("#formLogin > button").click();
  369.         }
  370.     }
  371.     setInterval(startGame, 1000);
  372. }
  373.  
  374. /*
  375. TODO:
  376. clear
  377.  
  378. BUG:
  379.  
  380. DONE:
  381. input box word checker
  382. color wheel
  383. wordlist
  384. hotkey for votekick, rategood, and ratebad
  385.  
  386. */
  387.  
  388. })();
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!