MooMoo.io Stack Visualizers

MooMoo.io Visuals without bundle.

  1. // ==UserScript==
  2. // @name MooMoo.io Stack Visualizers
  3. // @namespace https://moomoo.io/
  4. // @version 2024-08-29
  5. // @description MooMoo.io Visuals without bundle.
  6. // @author BianosakaSozinho
  7. // @match *://*.moomoo.io/*
  8. // @require https://code.jquery.com/jquery-3.6.0.min.js
  9. // @require https://code.jquery.com/ui/1.12.1/jquery-ui.min.js
  10. // @icon https://moomoo.io/img/favicon.png?v=1
  11. // @grant none
  12. // ==/UserScript==
  13.  
  14. (function() {
  15. 'use strict';
  16.  
  17. var menu = document.createElement(`div`);
  18. menu.id = `menu`;
  19. menu.innerHTML = `
  20. <label id='wow'>MooMoo io Visualizer</label>
  21. <p> Health Color: <input type="color" value="#8ecc51" id="healthColor"> </p>
  22. <p> Enemy Health: <input type="color" value="#cc5151" id="enemyHealthColor"> </p>
  23. <p> Damage Text Color: <input type="color" value="#ffffff" id="damageColor"> </p>
  24. <p> Health Text Color: <input type="color" value="#8ecc51" id="healthTColor"> </p>
  25. <p> Chat Text Color: <input type="color" value="#ffffff" id="chatTColor"> </p>
  26. <p> My Chat Text Color: <input type="color" value="#ffffff" id="myChatColor"> </p>
  27. <p> Nickname Color: <input type="color" value="#ffffff" id="nickColor"> </p>
  28. <p> My Player Nick Color: <input type="color" value="#ffffff" id="myPNColor"> </p>
  29. <p> Text Outline: <input type="checkbox" id="outlineText"> </p>
  30. <p> Remove Grids: <input type="checkbox" id="grids"> </p>
  31. `;
  32. let style = document.createElement(`style`);
  33. style.textContent = `
  34. @import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
  35.  
  36. #menu {
  37. display: flex;
  38. position: fixed;
  39. flex-direction: column;
  40. left: 50%;
  41. top: 50%;
  42. transform: translate(-50%, -50%);
  43. width: 400px;
  44. height: 600px;
  45. color: white;
  46. background-color: #4C4C4C;
  47. font-family: "Be Vietnam Pro", sans-serif;
  48. border-radius: 6px;
  49. z-index: 50;
  50. overflow-y: auto;
  51. }
  52.  
  53. #menu > p {
  54. margin-left: 4px;
  55. }
  56.  
  57. p > input {
  58. cursor: pointer;
  59. }
  60.  
  61. #wow {
  62. text-align: center;
  63. font-size: 24px;
  64. }
  65.  
  66. #menu::-webkit-scrollbar {
  67. width: 8px;
  68. }
  69.  
  70. #menu::-webkit-scrollbar-track {
  71. background: #4C4C4C;
  72. border-radius: 4px;
  73. }
  74.  
  75. #menu::-webkit-scrollbar-thumb {
  76. background-color: #3C3C3C;
  77. border-radius: 4px;
  78. }
  79.  
  80. #menu::-webkit-scrollbar-thumb:hover {
  81. background-color: #2C2C2C;
  82. }
  83. `;
  84.  
  85. document.head.appendChild(style);
  86. document.body.prepend(menu);
  87. let myChat;
  88. document.addEventListener(`keydown`, e => {
  89. if(e.keyCode == 27) $(`#menu`).toggle()
  90. if(e.keyCode == 13 && document.getElementById('chatHolder').style.display == `block`) myChat = document.getElementById('chatBox').value;
  91. })
  92.  
  93. const originalFillText = CanvasRenderingContext2D.prototype.fillText;
  94. const originalStrokeText = CanvasRenderingContext2D.prototype.strokeText;
  95. const originalMoveTo = CanvasRenderingContext2D.prototype.moveTo;
  96. const originalRoundRect = CanvasRenderingContext2D.prototype.roundRect;
  97. const originaldrawImage = CanvasRenderingContext2D.prototype.drawImage;
  98.  
  99. CanvasRenderingContext2D.prototype.fillText = function(text, x, y, maxWidth) {
  100. if (text !== 'x' && document.getElementById('outlineText').checked) {
  101. originalStrokeText.call(this, text, x, y, maxWidth);
  102. }
  103. if(this.fillStyle == '#ffffff' && typeof text === 'number') this.fillStyle = document.getElementById('damageColor').value
  104. if(this.fillStyle == '#8ecc51') this.fillStyle = document.getElementById('healthTColor').value;
  105. if (this.fillStyle === '#ffffff' && this.font === `30px "Hammersmith One"`) {
  106. if (text === localStorage.getItem('moo_name')) {
  107. this.fillStyle = document.getElementById('myPNColor').value;
  108. } else {
  109. this.fillStyle = document.getElementById('nickColor').value;
  110. }
  111. }
  112. if(text == myChat) {
  113. this.fillStyle = document.getElementById('myChatColor').value;
  114. }
  115. if(this.fillStyle == '#ffffff' && this.font === `32px "Hammersmith One"` && text != myChat) this.fillStyle = document.getElementById('chatTColor').value;
  116. originalFillText.call(this, text, x, y, maxWidth);
  117. }
  118.  
  119. CanvasRenderingContext2D.prototype.moveTo = function(x, y) {
  120. if(this.globalAlpha === 0.06 && document.getElementById('grids').checked) this.globalAlpha = 0;
  121. originalMoveTo.call(this, x, y);
  122. }
  123.  
  124. CanvasRenderingContext2D.prototype.roundRect = function(x, y, w, h, r) {
  125. if(this.fillStyle === '#8ecc51') this.fillStyle = document.getElementById('healthColor').value;
  126. if(this.fillStyle === '#cc5151') this.fillStyle = document.getElementById('enemyHealthColor').value;
  127. originalRoundRect.call(this, x, y, w, h, r)
  128. }
  129.  
  130. })();