☰

Arras.io Chat

Use Right Shift button to enable/disable chat

目前為 2023-01-12 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name        Arras.io Chat
  3. // @match	    *://arras.io/*
  4. // @match       *://arras.netlify.app/*
  5. // @match       *://arrax.io/*
  6. // @match       *://arras.cx/*
  7. // @author      Inellok
  8. // @description Use Right Shift button to enable/disable chat
  9. // @namespace   Inellok Labs.
  10. // @version     1.9
  11. // @run-at      document-start
  12. // @license     MIT
  13. // ==/UserScript==
  14.  
  15.  
  16. function getServerFromLoc()
  17. {
  18.     let rlockhash = "";
  19.     let started = false;
  20.     for (let i = 0; i < location.hash.length; i++) {
  21.         if (location.hash[i] === '#') {
  22.             started = true;
  23.             continue
  24.         }
  25.         if (started) {
  26.             rlockhash += location.hash[i];
  27.         }
  28.     }
  29.     return rlockhash;
  30. }
  31.  
  32.  
  33. function getName()
  34. {
  35.     let rname = "unnamed";
  36. 	let item = window.localStorage.getItem("arras.io");
  37.  
  38. 	if (item != null) {
  39. 		rname = JSON.parse(window.localStorage.getItem("arras.io")).name;
  40. 	}
  41.     return rname;
  42. }
  43.  
  44.  
  45. function sendEverything() {
  46.     let xhr = new XMLHttpRequest();
  47.     xhr.open("POST", "https://arrasio-chat.glitch.me/");
  48.  
  49.     //We need this to send http requests from arras.io page to the server with other URL
  50.     xhr.setRequestHeader("Accept", "plain/text");
  51.     xhr.setRequestHeader("Content-Type", "plain/text");
  52.     //------
  53.  
  54.     //when we got server's response
  55.     xhr.onreadystatechange = function() {
  56.         let srv = getServerFromLoc();
  57.         if (xhr.readyState === 4) {
  58.             chat_container.innerText = "";
  59.             let msgs = JSON.parse(xhr.responseText);
  60.             for (let i = 0; i < msgs.length; ++i) {
  61.                 if (srv === msgs[i].srv) {
  62.                     let nick = document.createElement("font");
  63.                     nick.color = "yellow";
  64.                     nick.innerText = msgs[i].nick + ": ";
  65.                     chat_container.appendChild(nick);
  66.  
  67.                     let msg = document.createElement("font");
  68.                     msg.color = "red";
  69.                     msg.innerText = msgs[i].message;
  70.                     chat_container.appendChild(msg);
  71.  
  72.                     chat_container.appendChild(document.createElement("br"));
  73.                 }
  74.             }
  75.         }
  76.     };
  77.  
  78.     xhr.send(JSON.stringify({
  79.         srv: getServerFromLoc(),
  80.         nick: getName(),
  81.         message: msg_container.value
  82.     }));
  83. }
  84.  
  85. //We need this to draw chat over arras drawing canvas
  86. let canvas = document.getElementById("canvas");
  87. canvas.style.zIndex = 1;
  88. canvas.style.position = "absolute";
  89.  
  90.  
  91. let lockhash = "";
  92.  
  93.  
  94. let info_container = document.createElement("div");
  95. info_container.innerText = "Arras.io Chat (by Inellok)";
  96. info_container.style.marginLeft = "40%";
  97. info_container.style.color = "white";
  98. info_container.style.opacity = "1";
  99.  
  100.  
  101. let chat_container = document.createElement("div");
  102. chat_container.style.marginLeft = "2%";
  103. chat_container.style.color = "red";
  104. chat_container.style.opacity = "1";
  105. chat_container.style.height = "88%";
  106. chat_container.fontSize = "100%";
  107.  
  108. let msg_container = document.createElement("input");
  109.  
  110. msg_container.placeholder = "message";
  111. msg_container.style.marginLeft = "2%";
  112. msg_container.style.color = "black";
  113. msg_container.style.opacity = "1";
  114. msg_container.style.height = "5%";
  115. msg_container.style.width = "65%";
  116. msg_container.style.fontSize = "110%";
  117.  
  118.  
  119. let send_container = document.createElement("button");
  120.  
  121. send_container.innerText = "SEND / UPDATE";
  122. send_container.style.marginLeft = "2%";
  123. send_container.style.color = "black";
  124. send_container.style.opacity = "1";
  125. send_container.style.height = "5%";
  126. send_container.style.width = "21%";
  127. send_container.style.fontSize = "60%";
  128.  
  129. send_container.onclick = function() {
  130.     sendEverything();
  131.  
  132.     return false;
  133. 	}
  134.  
  135. let mainContainer = document.createElement("div");
  136. mainContainer.style = `
  137.     width:50%;
  138.     height:85%;
  139.     background:#000000;
  140.     opacity: 90%;
  141.     margin: auto;
  142.     font-size: 150%;
  143.     visibility:hidden;
  144.     z-index:2;
  145.     position:absolute;
  146.     margin-left: 20%`;
  147.  
  148. msg_container.addEventListener("keydown", (e) => {
  149.     //We need this to not move our character while writing message
  150.     e.stopPropagation();
  151.     if (e.code === "Enter" && document.activeElement === msg_container) {
  152.         sendEverything();
  153.         msg_container.value = "";
  154.     }
  155.  
  156.     if (e.code === "ShiftRight") {
  157.         if (mainContainer.style.visibility === "hidden") {
  158.             mainContainer.style.visibility = "visible";
  159.         } else {
  160.             mainContainer.style.visibility = "hidden";
  161.         }
  162. 		}
  163. });
  164.  
  165. window.addEventListener("keydown", (e) => {
  166.     //show/hide our chat when press right shift
  167.     if (e.code === "ShiftRight") {
  168.         if (mainContainer.style.visibility === "hidden") {
  169.             mainContainer.style.visibility = "visible";
  170.         } else {
  171.             mainContainer.style.visibility = "hidden";
  172.         }
  173.     }
  174.  
  175.  
  176. });
  177.  
  178. mainContainer.appendChild(info_container);
  179. mainContainer.appendChild(chat_container);
  180. mainContainer.appendChild(msg_container);
  181. mainContainer.appendChild(send_container);
  182. document.body.appendChild(mainContainer);