☰

Bubble.am+

Script that adds useful features to the game.

当前为 2021-07-16 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Bubble.am+
  3. // @namespace    https://enderror.pl
  4. // @version      21.07.06
  5. // @description  Script that adds useful features to the game.
  6. // @author       enderror
  7. // @match        *://bubble.am/*
  8. // @run-at       document-start
  9. // @grant        none
  10. // ==/UserScript==
  11.  
  12. class Plus {
  13.     constructor() {
  14.         this.name = 'plus';
  15.         this.version = '21.07.06';
  16.         this.author = 'enderror';
  17.  
  18.         this.defaultSettings = { 
  19.             controls: [
  20.                 { type: '1x', keycode: '32', disabled: false },
  21.                 { type: 'eject', keycode: '87', disabled: false },
  22.                 { type: 'setCamera', keycode: '81', disabled: false },
  23.                 { type: 'holdEject', keycode: '69', disabled: false },
  24.                 { type: '1x', keycode: '49', disabled: false },
  25.                 { type: '2x', keycode: '50', disabled: false },
  26.                 { type: '4x', keycode: '51', disabled: false },
  27.                 { type: '8x', keycode: '52', disabled: false },
  28.                 { type: '16x', keycode: '53', disabled: false },
  29.                 { type: 'holdSplit', keycode: '16', disabled: false },
  30.                 { type: 'movementUp', keycode: '81', disabled: false },
  31.                 { type: 'movementLeft', keycode: '65', disabled: false },
  32.                 { type: 'movementDown', keycode: '83', disabled: false },
  33.                 { type: 'movementRight', keycode: '68', disabled: false },
  34.             ]
  35.         };
  36.  
  37.         this.settings = {
  38.             checkbox: {
  39.                 transparentVirus: true,
  40.                 noGrid: false,
  41.                 customColor: false,
  42.                 customSkin: false,
  43.                 bypassSkin: false,
  44.                 darkMenu: false,
  45.                 virusSplitCounter: true,
  46.                 cellsCounter: true,
  47.                 hideName: false,
  48.                 showMotherMass: false
  49.             },
  50.  
  51.             values: {
  52.                 cellsColor: '#e31e24',
  53.                 skinUrl: null,
  54.             },
  55.  
  56.             controls: this.defaultSettings.controls,
  57.             chat: [],
  58.             accounts: []
  59.         }
  60.  
  61.         this.helpers = {
  62.             skin: {
  63.                 skinInd: 1,
  64.                 gid: 0,
  65.             },
  66.  
  67.             controls: {
  68.                 splitSwitch: false,
  69.                 holdSplitSwitch: false,
  70.                 splitInterval: undefined,
  71.                 ejectSwitch: false,
  72.                 ejectInterval: undefined,
  73.                 isActiveMovement: false,
  74.                 activeMovement: []
  75.             }
  76.         }
  77.  
  78.         this.run();
  79.     }
  80.  
  81.     run() {
  82.         console.log(`${this.name} ${this.version} created by ${this.author}`);
  83.  
  84.         if(location.pathname.includes('.txt') 
  85.         || location.pathname.includes('.png')
  86.         || location.pathname.includes('.jpg')
  87.         || location.pathname.includes('.jpeg')) {
  88.              return;
  89.         }
  90.  
  91.         if((location.host === 'bubble.am' && location.pathname === '/') || location.pathname.length > 15) {
  92.             window.stop();
  93.             location.href = `${location.origin}/${this.name}${location.hash}`;
  94.             return;
  95.         }
  96.  
  97.         document.documentElement.innerHTML = '';
  98.  
  99.         const request = new XMLHttpRequest();
  100.         const url = 'http://bubble.am';
  101.  
  102.         request.open('get', url, true);
  103.         request.send();
  104.         request.onload = (e) => {
  105.             const newCore = this.modify(e.target.responseText);
  106.  
  107.             document.open();
  108.             document.write(newCore);
  109.             document.close();
  110.  
  111.             let documentCheck = setInterval(() => {
  112.                 if(document.readyState == 'complete') {
  113.                     clearInterval(documentCheck);
  114.                     
  115.                     new UI();
  116.                     this.addEventListeners();
  117.  
  118.                     window.modLoaded = true;
  119.                 }
  120.             }, 100);
  121.         }
  122.     }
  123.  
  124.     modify(core) {
  125.         core = core.replace(/(.*)(Ubuntu\:700)(.*)(\n.*){4}/gm, `
  126.             <link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Ubuntu:700'>
  127.             <link rel="stylesheet" type="text/css" href="http://m.bubble.am/css/bootstrap.min.css?v=3">
  128.             <link rel="stylesheet" type="text/css" href="http://bubble.am/css/style.css?v=0.2.50" />
  129.             <link rel="stylesheet" type="text/css" href="http://bubble.am/css/font.awesome.css?v5" />
  130.  
  131.             <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.3/css/bootstrap-colorpicker.css"/>
  132.             <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>
  133.             <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/themes/nano.min.css"/>
  134.  
  135.             <script src="//m.bubble.am/js/jquery.js"></script>
  136.         `);
  137.  
  138.         core = core.replace(/(.*)(bootstrap\.min\.js)(.*)(\n.*){3}/gm, `
  139.             <script src="/js/bootstrap.min.js"></script>
  140.             <script src="//m.bubble.am/js/jquery.lazy.js"></script>
  141.             <script src="/js/jquery.ui.js"></script>
  142.             <script src="/js/bub.js?v=0.2.50"></script>
  143.  
  144.             <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.3/js/bootstrap-colorpicker.min.js" async></script>
  145.             <script src="https://cdnjs.cloudflare.com/ajax/libs/smooth-scrollbar/8.6.2/smooth-scrollbar.min.js" async></script>
  146.             <script src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.min.js" async></script>
  147.             <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11" async></script>
  148.         `);
  149.  
  150.         core = core.replace(/(d\.onkeydown\s=\sf)([^]*?b\s=\s\!1)([^]*?\}\;)/gm, `
  151.             d.split = function() {
  152.                 ba();
  153.                 K(17);
  154.             }
  155.  
  156.             d.eject = function() {
  157.                 ba();
  158.                 K(21);
  159.             }
  160.  
  161.             d.setCamera = function() {
  162.                 K(18);
  163.             }
  164.  
  165.             d.onkeydown = function(n) {
  166.                 switch (n.keyCode) {
  167.                     case 27: // quit
  168.                         oa(true);
  169.                         break;
  170.  
  171.                     case 13:
  172.                         if (isTyping) {
  173.                             isTyping = false;
  174.                             document.getElementById("chat_textbox").blur();
  175.                             chattxt = document.getElementById("chat_textbox").value;
  176.                             if (chattxt.length > 0) sendChat(chattxt);
  177.                             //document.getElementById("chat_textbox").value = "";
  178.  
  179.                         } else {
  180.                             if (!hasOverlay) {
  181.                                 document.getElementById("chat_textbox").focus();
  182.                                 isTyping = true;
  183.                             }
  184.                         }
  185.                     break;
  186.  
  187.                     case 17:
  188.                             if (!hasOverlay && !isTyping) {
  189.                                 document.getElementById("chat_textbox").value = "/g ";
  190.                                 document.getElementById("chat_textbox").focus();
  191.                                 isTyping = true;
  192.                             }
  193.                     break;
  194.                 }
  195.             };
  196.         `);
  197.  
  198.         core = core.replace(/(\,\sI\:\s)(.*)/, `
  199.             $&
  200.             , counterCache: null
  201.             , motherCache: null
  202.         `);
  203.  
  204.         core = core.replace(/(f.+)(v\[d\]\.)(.*)/, `
  205.             $&
  206.  
  207.             if(window.plus.settings.checkbox.cellsCounter && h.length !== 0) {
  208.                 f.restore();
  209.  
  210.                 let maxCells = '';
  211.  
  212.                 if(currentMode() == ':5') {
  213.                     maxCells = '35';
  214.                 } else {
  215.                     maxCells = '16';
  216.                 }
  217.  
  218.                 const playerCells = h.length;
  219.                 const playerCellsText = new Ca(24, '#fff');
  220.                 playerCellsText.u(playerCells + '/' + maxCells);
  221.                 c = playerCellsText.F();
  222.                 a = c.width;
  223.                 
  224.                 f.globalAlpha = .2;
  225.                 f.fillStyle = "#000000";
  226.                 f.fillRect(10, 55, a + 10, 34);
  227.                 f.globalAlpha = 1;
  228.                 f.drawImage(c, 15, 60);
  229.             }
  230.         `);
  231.  
  232.         core = core.replace(/(bb\s\?)(.*)/, `
  233.             if(bb) {
  234.                 a.fillStyle = "#FFFFFF";
  235.                 a.strokeStyle = "#AAAAAA";
  236.                 if(this.f && window.plus.settings.checkbox.transparentVirus === true) a.globalAlpha = 0.2;
  237.             } else {
  238.                 a.fillStyle = this.color;
  239.                 a.strokeStyle = this.color;
  240.                 if(this.f && window.plus.settings.checkbox.transparentVirus === true) a.globalAlpha = 0.2;
  241.             }
  242.         `);
  243.  
  244.         core = core.replace(/(.*)(var\sa\s=\sl\s\/\sg)(.+)(\n.*\n.*)/gm, `
  245.             if(window.plus.settings.checkbox.noGrid === false) {
  246.                 $&
  247.             }
  248.         `);
  249.  
  250.         core = core.replace(/(.*)(m\.color)(.*)/, `
  251.             $&
  252.  
  253.             const amAlive = h.length > 0;
  254.  
  255.             const helpers = window.plus.helpers;
  256.             const settings = window.plus.settings;
  257.             
  258.             if(amAlive && m.name === h[0].name && !m.f && settings.values.cellsColor !== undefined && settings.values.cellsColor !== null && settings.checkbox.customColor === true) {
  259.                 m.color = settings.values.cellsColor;
  260.             }
  261.  
  262.             if(amAlive && (h[0].gid !== 1 && h[0].gid !== 2)) {
  263.                 helpers.skin.gid = h[0].gid;
  264.             }
  265.  
  266.             if(settings.checkbox.customSkin === true && settings.values.skinUrl !== null && amAlive) {
  267.                 for(let i = 0; i < h.length; i++) {
  268.                     const cell = h[i];
  269.  
  270.                     if(cell.gid !== helpers.skin.skinInd) {
  271.                         cell.gid = helpers.skin.skinInd;
  272.  
  273.                         if(cell.name === '') cell.name = 'enderror';
  274.                     }
  275.                 }
  276.             }
  277.             
  278.             if(settings.checkbox.customSkin === false && amAlive && h[0].gid !== helpers.skin.gid) {
  279.                 for(let i = 0; i < h.length; i++) {
  280.                     const cell = h[i];
  281.  
  282.                     cell.gid = helpers.skin.gid;
  283.                 }
  284.             }
  285.  
  286.         `);
  287.  
  288.         core = core.replace(/(.*)(\(c\s\&\&\sFb.*)(\n.*){35}/gm, `
  289.             const bypassSkin = (window.plus.settings.checkbox.customSkin && window.plus.settings.checkbox.bypassSkin)
  290.             const customSkinGid = (this.gid == 1 || this.gid == 2);
  291.             if (c && (Fb || bypassSkin) && !this.j && ':1' != V && ':3' != V && ':8' != V) {
  292.                 var loadBub = -1;
  293.  
  294.                 if(Fb && this.gid && this.gid > 0) {
  295.                     loadBub = this.gid;
  296.                 } else if(!Fb && this.gid && customSkinGid) {
  297.                     loadBub = this.gid;
  298.                 } else if(Fb) {
  299.                     if(-1 != Jb.indexOf(c)) {
  300.                         loadBub = c;
  301.                     }
  302.                 }
  303.             
  304.                 if (loadBub != -1) {
  305.                     if((Fb || bypassSkin && customSkinGid ) && (!$.hasOwnProperty(c) || $[c].skin != loadBub)) {
  306.                         $[c] = new Image;
  307.  
  308.                         if(Fb && loadBub > 100000000) {
  309.                             $[c].src = "//bubble.am/skins/custom/" + loadBub + '.png?0.2.50';
  310.                         } else if(loadBub >= 10 && loadBub <= 20 && Fb) {
  311.                             $[c].src = "//bubble.am/img/battle_" + loadBub + '.png?0.2.50';
  312.                         } else if(customSkinGid && (Fb || bypassSkin)) {
  313.                             $[c].src = window.plus.settings.values.skinUrl;
  314.                         } else if(Fb) {
  315.                             $[c].src = "//m.bubble.am/skins/" + loadBub + '.png?0.2.50';
  316.                         }
  317.  
  318.                         $[c].skin = loadBub;
  319.                     }
  320.                     if((Fb || bypassSkin) && (0 != $[c].width && $[c].complete)) {
  321.                         d = $[c];
  322.                     } else {
  323.                         d = null;
  324.                     }
  325.                 } else {
  326.                     d = null;
  327.                 }
  328.             } else {
  329.                 d = null;
  330.             }
  331.         `);
  332.  
  333.         core = core.replace(/(\,\sd\s\=\sthis\.I\,)(.*)/, `
  334.             $&
  335.  
  336.             const settings = window.plus.settings;
  337.             const isNotSplittable = window.currentMode() == ':2'
  338.                                     || window.currentMode() == ':5'
  339.                                     || window.currentMode() == ':13';
  340.             const isBattle = window.currentMode() == ':11' || window.currentMode() == ':12';
  341.             const isTeams = window.currentMode() == ':3';
  342.  
  343.             let nc;
  344.             if(settings.checkbox.virusSplitCounter && !isNotSplittable && this.f && this.color !== '#cd5564') {
  345.                 if(this.counterCache === null) {
  346.                     this.counterCache = new Ca(this.i(), '#FFFFFF', !0, "#000000");
  347.                 }
  348.  
  349.                 nc = this.counterCache;
  350.  
  351.                 if(isTeams) {
  352.                     switch(true) {
  353.                         case this.size >= 123 && this.size <= 126:
  354.                             nc.u('7');
  355.                             break;
  356.                         
  357.                         case this.size >= 126 && this.size <= 129:
  358.                             nc.u('6');
  359.                             break;
  360.  
  361.                         case this.size >= 129 && this.size <= 134:
  362.                             nc.u('5');
  363.                             break;
  364.  
  365.                         case this.size >= 134 && this.size <= 137:
  366.                             nc.u('4');
  367.                             break;
  368.  
  369.                         case this.size >= 137 && this.size <= 141:
  370.                             nc.u('3');
  371.                             break;
  372.  
  373.                         case this.size >= 142 && this.size <= 145:
  374.                             nc.u('2');
  375.                             break;
  376.  
  377.                         case this.size >= 145 && this.size <= 151:
  378.                             nc.u('1');
  379.                             break;
  380.                         }
  381.                 } else if(isBattle) {
  382.                     switch(true) {
  383.                         case this.size >= 84 && this.size <= 89:
  384.                             nc.u('7');
  385.                             break;
  386.                         
  387.                         case this.size >= 89 && this.size <= 94:
  388.                             nc.u('6');
  389.                             break;
  390.  
  391.                         case this.size >= 94 && this.size <= 99:
  392.                             nc.u('5');
  393.                             break;
  394.  
  395.                         case this.size >= 99 && this.size <= 104:
  396.                             nc.u('4');
  397.                             break;
  398.  
  399.                         case this.size >= 104 && this.size <= 109:
  400.                             nc.u('3');
  401.                             break;
  402.  
  403.                         case this.size >= 109 && this.size <= 115:
  404.                             nc.u('2');
  405.                             break;
  406.  
  407.                         case this.size >= 115 && this.size <= 120:
  408.                             nc.u('1');
  409.                             break;
  410.                         }
  411.                 } else {
  412.                     switch(true) {
  413.                         case this.size >= 114 && this.size <= 119:
  414.                             nc.u('7');
  415.                             break;
  416.                         
  417.                         case this.size >= 119 && this.size <= 123:
  418.                             nc.u('6');
  419.                             break;
  420.  
  421.                         case this.size >= 123 && this.size <= 127:
  422.                             nc.u('5');
  423.                             break;
  424.  
  425.                         case this.size >= 127 && this.size <= 132:
  426.                             nc.u('4');
  427.                             break;
  428.  
  429.                         case this.size >= 132 && this.size <= 136:
  430.                             nc.u('3');
  431.                             break;
  432.  
  433.                         case this.size >= 136 && this.size <= 141:
  434.                             nc.u('2');
  435.                             break;
  436.  
  437.                         case this.size >= 141 && this.size <= 145:
  438.                             nc.u('1');
  439.                             break;
  440.                         }
  441.                 }
  442.  
  443.                 nc.G(this.i());
  444.                 nc.U(4);
  445.  
  446.                 const rn = nc.F();
  447.                 a.drawImage(rn, ~~this.x - ~~(rn.width / 2), ~~this.y - ~~(rn.height / 2));
  448.             }
  449.         `);
  450.  
  451.         core = core.replace(/(.*)(\~\~\(l\s\/\s2\)\,\sf\,\sl\)\;)/, `
  452.             const settings = window.plus.settings;
  453.  
  454.             if(settings.checkbox.hideName && h.length > 0 && this.name === h[0].name) {
  455.                 
  456.             } else {
  457.                 $&
  458.             }
  459.         `);
  460.  
  461.         core = core.replace(/(.*)(chatNick\s\+)(.*)/, `
  462.             const settings = window.plus.settings;
  463.  
  464.             const rawNick = chatNick.replace(/(<([^>]+)>)/ig, '').replace(/(\\[.*?\\])/, '').trim().toLowerCase();
  465.             if(!settings.chat.includes(rawNick)) {
  466.                 $&
  467.             }
  468.         `);
  469.  
  470.         core = core.replace(/(.*)(isUnlimitedZoom)(.*)(\n.*){7}/gm, ``);
  471.  
  472.  
  473.         core = core.replace(/(.*)(\&\&\sGb)(.*)(\n.*){3}/gm, `
  474.             if(0 < this.id && Gb && (d || (0 == h.length || Qd) && (!this.f || this.j) && 80 < this.size)) {
  475.                 if(null == this.I) {
  476.                     this.I = new Ca(this.i() / 2, "#FFFFFF", true, "#000000");
  477.                 }
  478.                 d = this.I;
  479.                 d.G(this.i() / 2);
  480.                 d.u(~~(this.size * this.size / 100));
  481.                 c = Math.ceil(10 * g) / 10;
  482.                 d.U(c);
  483.                 e = d.F();
  484.                 f = ~~(e.width / c);
  485.                 l = ~~(e.height / c);
  486.                 a.drawImage(e, ~~this.x - ~~(f / 2), b - ~~(l / 2), f, l);
  487.             }
  488.  
  489.             if(0 < this.id && window.plus.settings.checkbox.showMotherMass && this.color === '#cd5564') {
  490.                 if(this.motherCache == null) {
  491.                     this.motherCache = new Ca(this.i() / 2, "#FFFFFF", true, "#000000");
  492.                 }
  493.  
  494.                 d = this.motherCache;
  495.                 d.G(this.i());
  496.                 d.u(~~(this.size * this.size / 100));
  497.                 c = Math.ceil(10 * g) / 10;
  498.                 d.U(c);
  499.                 e = d.F();
  500.                 f = ~~(e.width / c);
  501.                 l = ~~(e.height / c);
  502.                 a.drawImage(e, ~~this.x - ~~(f / 2), b - ~~(l / 2), f, l);
  503.             }
  504.         `);
  505.  
  506.         core = core.replace(/(J\.onmousedown)(.*)(\n.*){20}/gm, `
  507.             const helpers = window.plus.helpers;
  508.             J.onmousedown = function(a) {
  509.                 if (db) {
  510.                     var b = a.clientX - (5 + l / 5 / 2)
  511.                         , c = a.clientY - (5 + l / 5 / 2);
  512.                     if (Math.sqrt(b * b + c * c) <= l / 5 / 2) {
  513.                         ba();
  514.                         K(17);
  515.                         return
  516.                     }
  517.                 }
  518.                 if(!helpers.controls.isActiveMovement) {
  519.                     ma = a.clientX;
  520.                     na = a.clientY;
  521.                     Ha();
  522.                     ba()
  523.                 }
  524.             };
  525.             J.onmousemove = function(a) {
  526.                 if(!helpers.controls.isActiveMovement) {
  527.                     ma = a.clientX;
  528.                     na = a.clientY;
  529.  
  530.                     lastacti = Date.now();
  531.                 }
  532.             };
  533.  
  534.             d.goTo = function(x, y) {
  535.                 ma = x;
  536.                 na = y;
  537.             }
  538.         `);
  539.  
  540.         core = core.replace(/(.*)(\(\'\#gamemode\'\)\.on)([^]*?\}\)\;)/, `
  541.             $('#gamemode').on('change', function() {
  542.                 console.log(this.value);
  543.                 setGameMode(this.value);
  544.                 if (this.value == ':5' || this.value == ':11') {
  545.                     $('#radio_mode').find('input[type=radio]').prop("checked", false);
  546.                     switch(this.value) {
  547.                         //case ":3": $('#radio_mode .radio-ffa, #radio_mode .radio-battle').hide(); $('#radio_mode .radio-teams').show(); break;
  548.                         case ":11": $('#radio_mode .radio-ffa, #radio_mode .radio-teams').hide(); $('#radio_mode .radio-battle').show(); break;
  549.                         default: $('#radio_mode .radio-ffa').show(); $('#radio_mode .radio-battle, #radio_mode .radio-teams').hide(); break;
  550.                     }
  551.                     $('#radio_mode').css('display','block');
  552.                     
  553.                 } else {
  554.                     $('#radio_mode').css('display','none');
  555.                 }
  556.                 
  557.                 if (this.value == ':11' || this.value == ':10') {
  558.                     
  559.                         if ($("#playBtn").hasClass('btn-primary')) $("#playBtn").toggleClass('btn-primary btn-danger').html('<span class="spinner"><i class="fa fa-spinner fa-spin"></i></span> ' + lang_play);
  560.  
  561.                         if(logged) {
  562.                             $('.showFriends').hide();
  563.                             $('#playBtn').css('width','86%');
  564.                         }
  565.                     
  566.                 } else {
  567.                     if(logged) {
  568.                         $('#playBtn').css('width','73%');
  569.                         $('.showFriends').show();
  570.                     }
  571.                     if ($("#playBtn").hasClass('btn-danger')) $("#playBtn").toggleClass('btn-danger btn-primary').html(lang_play);
  572.                 }
  573.             });
  574.         `);
  575.  
  576.         return core;
  577.     }
  578.  
  579.     keydown = (e) => {
  580.         this.controlTypeDown(e);
  581.     }
  582.  
  583.     keyup = (e) => {
  584.         this.controlTypeUp(e);
  585.     }
  586.  
  587.     mousedown = (e) => {
  588.         this.controlTypeDown(e);
  589.     }
  590.  
  591.     mouseup = (e) => {
  592.         this.controlTypeUp(e);
  593.     }
  594.  
  595.     controlTypeDown(e) {
  596.         const settings = window.plus.settings;
  597.         const helpers = window.plus.helpers;
  598.  
  599.         const key = e.which;
  600.         const controls = settings.controls;
  601.         const chat = document.querySelector('#chat_textbox');
  602.  
  603.         if(controls.length === 0) return;
  604.         if(chat === document.activeElement) return;
  605.  
  606.         for(let i = 0; i < controls.length; i++) {
  607.             const control = controls[i];
  608.  
  609.             if(control.keycode == key && !control.disabled) {
  610.                 switch(control.type) {
  611.                     case '1x':
  612.                         if(!helpers.controls.splitSwitch) {
  613.                             helpers.controls.splitSwitch = true;
  614.                             window.split();
  615.                         }
  616.                         break;
  617.  
  618.                     case 'eject':
  619.                         if(!helpers.controls.ejectSwitch) {;
  620.                             helpers.controls.ejectSwitch = true;
  621.                             window.eject();
  622.                         }
  623.                         break;
  624.  
  625.                     case 'setCamera':
  626.                         window.setCamera();
  627.                         break;
  628.         
  629.                     case '2x':
  630.                         if(!helpers.controls.splitSwitch) {
  631.                             helpers.controls.splitSwitch = true;
  632.                             this.split(2);
  633.                         }
  634.                         break;
  635.         
  636.                     case '4x':
  637.                         if(!helpers.controls.splitSwitch) {
  638.                             helpers.controls.splitSwitch = true;
  639.                             this.split(4);
  640.                         }
  641.                         break;
  642.         
  643.                     case '8x':
  644.                         if(!helpers.controls.splitSwitch) {
  645.                             helpers.controls.splitSwitch = true;
  646.                             this.split(8);
  647.                         }
  648.                         break;
  649.         
  650.                     case '16x':
  651.                         if(!helpers.controls.splitSwitch) {
  652.                             helpers.controls.splitSwitch = true;
  653.                             this.split(16);
  654.                         }
  655.                         break;
  656.         
  657.                     case 'holdSplit':
  658.                         if(!helpers.controls.holdSplitSwitch) {
  659.                             helpers.controls.holdSplitSwitch = true;
  660.  
  661.                             helpers.controls.splitInterval = setInterval(() => {
  662.                                 window.split();
  663.                             }, 4);
  664.                         }
  665.                         break;
  666.         
  667.                     case 'holdEject':
  668.                         if(helpers.controls.ejectSwitch) break;
  669.          
  670.                         helpers.controls.ejectSwitch = true;
  671.                         helpers.controls.ejectInterval = setInterval(() => {
  672.                             window.eject();
  673.                         }, 4);
  674.                         break;
  675.         
  676.                     case 'mouseLeft':
  677.                         this.split(1);
  678.                         break;
  679.         
  680.                     case 'mouseRight':
  681.                         this.split(1);
  682.                         break;
  683.         
  684.                     case 'mouseMiddle':
  685.                         this.split(1);
  686.                         break;
  687.         
  688.                     case 'movementUp':
  689.                         this.goTo(3, -0);
  690.  
  691.                         if(!helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = true;
  692.                         helpers.controls.activeMovement['up'] = true;
  693.                         break;
  694.         
  695.                     case 'movementRight':
  696.                         this.goTo(0, 5);
  697.  
  698.                         if(!helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = true;
  699.                         helpers.controls.activeMovement['right'] = true;
  700.                         break;
  701.         
  702.                     case 'movementDown':
  703.                         this.goTo(2, 0.6);
  704.  
  705.                         if(!helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = true;
  706.                         helpers.controls.activeMovement['down'] = true;
  707.                         break;
  708.         
  709.                     case 'movementLeft':
  710.                         this.goTo(-0, 8);
  711.  
  712.                         if(!helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = true;
  713.                         helpers.controls.activeMovement['left'] = true;
  714.                         break;
  715.  
  716.                     case 'hashLogin':
  717.                         this.hashLogin();
  718.                         break;
  719.  
  720.                     case 'hashShow':
  721.                         this.hashShow();
  722.                         break;
  723.                 }
  724.  
  725.                 if(control.type.includes('movement')) {
  726.                     const keys = helpers.controls.activeMovement;
  727.  
  728.                     switch(true) {
  729.                         case keys['left'] && keys['up']:
  730.                             this.goTo(-0, -0);
  731.                             break;
  732.                 
  733.                         case keys['left'] && keys["down"]:
  734.                             this.goTo(-0, 0);
  735.                             break;
  736.                 
  737.                         case keys['up'] && keys['right']:
  738.                             this.goTo(0, -0);
  739.                             break;
  740.                 
  741.                         case keys['down'] && keys['right']:
  742.                             this.goTo(0, 0);
  743.                             break;
  744.                     }
  745.                 }
  746.             }
  747.         }
  748.     }
  749.  
  750.     controlTypeUp(e) {
  751.         const settings = window.plus.settings;
  752.         const helpers = window.plus.helpers;
  753.  
  754.         const key = e.which;
  755.         const controls = settings.controls;
  756.         const chat = document.querySelector('#chat_textbox');
  757.  
  758.         if(controls.length === 0) return;
  759.         if(chat === document.activeElement && helpers.controls.splitSwitch === false && helpers.controls.ejectSwitch === false) return;
  760.  
  761.         for(let i = 0; i < controls.length; i++) {
  762.             const control = controls[i];
  763.  
  764.             if(key == control.keycode && !control.disabled) {
  765.                 switch(control.type) {
  766.                     case '1x':
  767.                         helpers.controls.splitSwitch = false;
  768.                         break;
  769.         
  770.                     case '2x':
  771.                         helpers.controls.splitSwitch = false;
  772.                         break;
  773.         
  774.                     case '4x':
  775.                         helpers.controls.splitSwitch = false;
  776.                         break;
  777.         
  778.                     case '8x':
  779.                         helpers.controls.splitSwitch = false;
  780.                         break;
  781.         
  782.                     case '16x':
  783.                         helpers.controls.splitSwitch = false;
  784.                         break;
  785.  
  786.                     case 'holdSplit':
  787.                         clearInterval(helpers.controls.splitInterval);
  788.                         helpers.controls.holdSplitSwitch = false;
  789.                         break;
  790.  
  791.                     case 'eject':
  792.                         helpers.controls.ejectSwitch = false;
  793.                         break;
  794.         
  795.                     case 'holdEject':
  796.                         clearInterval(window.plus.helpers.controls.ejectInterval);
  797.                         helpers.controls.ejectSwitch = false;
  798.                         break;
  799.  
  800.                     case 'movementUp':
  801.                         if(helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = false;
  802.                         delete helpers.controls.activeMovement['up'];
  803.                         break;
  804.         
  805.                     case 'movementRight':
  806.                         if(helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = false;
  807.                         delete helpers.controls.activeMovement['right'];
  808.                         break;
  809.         
  810.                     case 'movementDown':
  811.                         if(helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = false;
  812.                         delete helpers.controls.activeMovement['down'];
  813.                         break;
  814.         
  815.                     case 'movementLeft':
  816.                         if(helpers.controls.isActiveMovement) helpers.controls.isActiveMovement = false;
  817.                         delete helpers.controls.activeMovement['left'];
  818.                         break;
  819.                 }
  820.             }
  821.         }
  822.     }
  823.  
  824.     split(times) {
  825.         for(let i = 0; i < times; i++) {
  826.             setTimeout(function() {
  827.                 window.split();
  828.             }, 50 * i);
  829.         }
  830.     }
  831.  
  832.     goTo(x, y) {
  833.         x = window.innerWidth / x; y = window.innerHeight / y;
  834.         window.goTo(x, y);
  835.     }
  836.     
  837.     getCookie(name) {
  838.         let v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
  839.         return v ? v[2] : null;
  840.     }
  841.  
  842.     setCookie(name, value, days) {
  843.         const d = new Date;
  844.         d.setTime(d.getTime() + 24*60*60*1000*days);
  845.         document.cookie = name + '=' + value + ';path=/;expires=' + d.toGMTString();
  846.     }
  847.      
  848.     deleteCookie(name) {
  849.         this.setCookie(name, '', -1);
  850.     }
  851.  
  852.     setHash(hash) {
  853.         this.deleteCookie('user_hash');
  854.         this.deleteCookie('PHPSESSID');
  855.         this.setCookie('user_hash', hash, 30);
  856.  
  857.         window.location.reload();
  858.     }
  859.  
  860.     async hashLogin() {
  861.         const { value: hash } = await Swal.fire({
  862.             title: 'Enter your hash',
  863.             input: 'text',
  864.             inputValue: '',
  865.             showCancelButton: true,
  866.             inputValidator: (value) => {
  867.               if(!value) {
  868.                 return 'You need to write something!'
  869.               }
  870.  
  871.               if(value.length !== 40) {
  872.                   return 'The hash length must be 40 characters.'
  873.               }
  874.             }
  875.           })
  876.           
  877.           if(hash) {
  878.             this.setHash(hash);
  879.           }
  880.     }
  881.  
  882.     hashShow() {
  883.         const hash = this.getCookie('user_hash');
  884.  
  885.         if(hash === null) {
  886.             return Swal.fire({
  887.                 icon: 'error',
  888.                 text: 'You must be logged in to your account to view its hash.'
  889.               });
  890.         }
  891.  
  892.         Swal.fire({
  893.             icon: 'info',
  894.             html: `The hash assigned to this account is: <strong>${hash}</strong>.<br><br>Remember to never give it to anyone!`
  895.           });
  896.     }
  897.  
  898.     addEventListeners() {
  899.         document.addEventListener('keydown', this.keydown);
  900.         document.addEventListener('keyup', this.keyup);
  901.         document.addEventListener('mousedown', this.mousedown);
  902.         document.addEventListener('mouseup', this.mouseup); 
  903.  
  904.         document.getElementById('canvas').addEventListener('contextmenu', function(e) {
  905.             e.preventDefault();
  906.         });
  907.     }
  908. }
  909.  
  910. class UI {
  911.     constructor() {
  912.         this.loadCSS();
  913.         this.loadGUI();
  914.         this.loadSettings();
  915.     }
  916.  
  917.     loadCSS() {
  918.         const css = `
  919.             #plusSettingsBtn {
  920.                 float: right;
  921.                 width: 12%;
  922.             }
  923.  
  924.             #plusSettings .modal-body {
  925.                 height: 300px;
  926.                 user-select: none;
  927.             }
  928.  
  929.             #plusSettings .modal-footer {
  930.                 user-select: none;
  931.             }
  932.  
  933.             #plusContent {
  934.                 height: 100%;
  935.             }
  936.  
  937.             #general-content {
  938.                 display: flex;
  939.                 flex-flow: column wrap;
  940.                 height: 160px;
  941.             }
  942.  
  943.             #plusContent .tab-pane {
  944.                 height: 100%;
  945.             }
  946.  
  947.             #plusTabs {
  948.                 text-align: center;
  949.                 border-bottom: none !important;
  950.                 margin-top: 1em;
  951.             }
  952.  
  953.             #plusTabs > li {
  954.                 float: none !important;
  955.                 display: inline-block;
  956.             }
  957.  
  958.             #plusTabs>li.active>a, #plusTabs>li.active>a:hover, #plusTabs>li.active>a:focus {
  959.                 border: none !important;
  960.                 background: #efefef;
  961.                 color: #27272A;
  962.             }
  963.  
  964.             #plusTabs>li>a {
  965.                 border: none !important;
  966.                 border-radius: 4px;
  967.                 color: #5f5f67;
  968.             }
  969.  
  970.             #pLabel {
  971.                 text-align: center;
  972.             }
  973.  
  974.             .plus-checkbox {
  975.                 padding-bottom: 0.5em;
  976.                 width: 50%;
  977.             }
  978.  
  979.             .plus-checkbox label {
  980.                 max-width: 100%;
  981.                 position: relative;
  982.                 display: inline-block;
  983.                 padding-left: 20px;
  984.                 margin-bottom: 0;
  985.                 font-weight: 400;
  986.                 vertical-align: middle;
  987.                 cursor: pointer;
  988.             }
  989.  
  990.             .plus-checkbox input[type=radio], .plus-checkbox input[type=checkbox] {
  991.                 position: absolute;
  992.                 margin-left: -20px;
  993.             }
  994.  
  995.             #skinPanel {
  996.                 float: left;
  997.                 margin-left: 5px;
  998.             }
  999.  
  1000.             .skinBtn {
  1001.                 margin: 0;
  1002.                 padding: 2px 8px;
  1003.             }
  1004.  
  1005.             .plusControls {
  1006.                 display: block;
  1007.                 height: 210px;
  1008.             }
  1009.  
  1010.             .plusBtn {
  1011.                 display: flex;
  1012.                 justify-content: space-between;
  1013.                 margin-top: 8px;
  1014.             }
  1015.  
  1016.             .plusBtn button {
  1017.                 width: 100px;
  1018.             }
  1019.  
  1020.             .plusHeader {
  1021.                 display: flex;
  1022.                 justify-content: center;
  1023.                 width: 100%;
  1024.             }
  1025.  
  1026.             .plusContent {
  1027.                 display: flex;
  1028.                 flex-flow: column nowrap;
  1029.                 height: 210px;
  1030.                 padding: 0;
  1031.                 margin: 0;
  1032.             }
  1033.  
  1034.             .plusContent li {
  1035.                 display: flex;
  1036.                 margin: 0 auto;
  1037.                 padding: 0.75rem;
  1038.                 width: 300px;
  1039.                 height: 34px;
  1040.                 align-items: center;
  1041.                 justify-content: space-between;
  1042.                 border-radius: 0.375rem;
  1043.                 background: #FAFAFA;
  1044.                 margin-top: 0.525rem;
  1045.             }
  1046.  
  1047.             .controlsContent {
  1048.                 display: flex;
  1049.                 flex-flow: column nowrap;
  1050.                 height: 210px;
  1051.                 padding: 0;
  1052.                 margin: 0;
  1053.             }
  1054.  
  1055.             .controlsContent li {
  1056.                 display: flex;
  1057.                 justify-content: space-around;
  1058.                 align-items: center;
  1059.                 margin-top: 5px;
  1060.             }
  1061.  
  1062.             .emptyPanel {
  1063.                 text-align: center;
  1064.                 padding: 0.5em;
  1065.                 margin: 0.5em;
  1066.             }
  1067.  
  1068.             .delete {
  1069.                 cursor: pointer;
  1070.             }
  1071.  
  1072.             html, 
  1073.             body {
  1074.                 height: 100%;
  1075.             }
  1076.  
  1077.             .main-panel {
  1078.                 margin: 0 2px;
  1079.                 box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%);
  1080.             }
  1081.  
  1082.             .friends-online {
  1083.                 border-radius: 10px;
  1084.                 box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%);
  1085.                 border: none;
  1086.             }
  1087.  
  1088.             #playBtn {
  1089.                 width: 74.8% !important;
  1090.             }
  1091.             
  1092.             #playBtn.has-spinner {
  1093.                 width: 62.9% !important;
  1094.             }
  1095.  
  1096.             #playBtn.btn-danger {
  1097.                 width: 75.5% !important;
  1098.             }
  1099.  
  1100.             #spectateBtn {
  1101.                 height: 34px;
  1102.             }
  1103.  
  1104.             table.chat-table {
  1105.                 margin-bottom: 34px !important;
  1106.             }
  1107.  
  1108.             .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
  1109.                 outline: none;
  1110.             }
  1111.  
  1112.             .btn-primary {
  1113.                 background-color: #3B82F6;
  1114.                 border: none;
  1115.             }
  1116.          
  1117.             .btn-primary:hover {
  1118.                 background-color: #2563EB;
  1119.             }
  1120.  
  1121.             .btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
  1122.                 background-color: #2563EB;
  1123.             }
  1124.          
  1125.             .btn-success {
  1126.                 background-color: #22C55E;
  1127.                 border: none;
  1128.             }
  1129.          
  1130.             .btn-success:hover {
  1131.                 background-color: #16A34A;
  1132.             }
  1133.  
  1134.             .btn-success:hover, .btn-success:focus, .btn-success.focus, .btn-success:active, .btn-success.active, .open>.dropdown-toggle.btn-success {
  1135.                 background-color: #16A34A;
  1136.             }
  1137.          
  1138.             .btn-settings {
  1139.                 float: none !important;
  1140.                 display: inline-block !important;
  1141.                 width: auto !important;
  1142.                 height: auto !important;
  1143.                 border: none;
  1144.                 background-color: #06B6D4;
  1145.             }
  1146.          
  1147.             .btn-settings:hover {
  1148.                 background-color: #0891B2;
  1149.                 border: none;
  1150.             }
  1151.  
  1152.             .btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .open>.dropdown-toggle.btn-info {
  1153.                 background-color: #0891B2;
  1154.             }
  1155.          
  1156.             .btn-warning {
  1157.                 background-color: #EAB308;
  1158.                 border: none;
  1159.             }
  1160.          
  1161.             .btn-warning:hover {
  1162.                 background-color: #CA8A04;
  1163.             }
  1164.  
  1165.             .btn-warning:hover, .btn-warning:focus, .btn-warning.focus, .btn-warning:active, .btn-warning.active, .open>.dropdown-toggle.btn-warning {
  1166.                 background-color: #CA8A04;
  1167.             }
  1168.          
  1169.             .btn-danger {
  1170.                 background-color: #F43F5E;
  1171.                 border: none;
  1172.             }
  1173.          
  1174.             .btn-danger:hover {
  1175.                 background-color: #E11D48;
  1176.             }
  1177.  
  1178.             .btn-danger:hover, .btn-danger:focus, .btn-danger.focus, .btn-danger:active, .btn-danger.active, .open>.dropdown-toggle.btn-danger {
  1179.                 background-color: #E11D48;
  1180.             }
  1181.  
  1182.             .form-control  {
  1183.                 border: 1px solid #ced4da;
  1184.                 box-shadow: none;
  1185.             }
  1186.  
  1187.             #radio_mode .gm-s {
  1188.                 border: 2px solid #D1D5DB;
  1189.             }
  1190.  
  1191.             #chat_textbox {
  1192.                 border-radius: 0.3em;
  1193.             }
  1194.  
  1195.             .exp-bar {
  1196.                 border: 2px solid #3B82F6;
  1197.             }
  1198.  
  1199.             .exp-bar .progress-bar {
  1200.                 background-color: #60A5FA;
  1201.             }
  1202.  
  1203.             .modal-content {
  1204.                 border: none;
  1205.             }
  1206.  
  1207.             .swal2-popup {
  1208.                 font-size: 1.5rem !important;
  1209.             }
  1210.  
  1211.             .swal2-styled.swal2-confirm {
  1212.                 background-color: #3B82F6 !important;
  1213.             }
  1214.  
  1215.             .swal2-styled.swal2-confirm:focus {
  1216.                 box-shadow: 0 0 0 3px rgb(59 130 246 / 50%) !important;
  1217.             }
  1218.  
  1219.             .pickr {
  1220.                 float: left;
  1221.                 margin-left: 5px;
  1222.             }
  1223.  
  1224.             .pickr .pcr-button {
  1225.                 height: 1.8em;
  1226.                 width: 1.8em;
  1227.             }
  1228.  
  1229.             .pickr .pcr-button:after, .pickr .pcr-button:before {
  1230.                 border: 1px solid #80808060;
  1231.             }
  1232.  
  1233.             .hashLogin {
  1234.                 margin: 0 5px;
  1235.             }
  1236.  
  1237.             li {
  1238.                 list-style-type: none;
  1239.             }
  1240.  
  1241.             @media (min-width: 768px) {
  1242.                 .modal-content {
  1243.                     -webkit-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
  1244.                     box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
  1245.                 }
  1246.             }
  1247.  
  1248.             body.dark-mode .plusColor {
  1249.                 background: #27272A;
  1250.             }
  1251.  
  1252.             body.dark-mode .plusColor .pcr-result {
  1253.                 background: #36363a;
  1254.                 color: #c6c6c8;
  1255.             }
  1256.  
  1257.             body.dark-mode .main-panel {
  1258.                 background: #18181B;
  1259.                 color: #c6c6c8;
  1260.             }
  1261.  
  1262.             body.dark-mode .form-control[disabled], body.dark-mode .form-control[readonly], body.dark-mode fieldset[disabled] .form-control {
  1263.                 background: #27272A;
  1264.             }
  1265.  
  1266.             body.dark-mode .form-control {
  1267.                 background: #27272A;
  1268.                 border: none;
  1269.                 color: #c6c6c8;
  1270.             }
  1271.  
  1272.             body.dark-mode #radio_mode .gm-s {
  1273.                 border: 2px solid #5f5f60;
  1274.                 background: #27272A;
  1275.             }
  1276.  
  1277.             body.dark-mode .bb-panel {
  1278.                 background: #18181B;
  1279.             }
  1280.  
  1281.             body.dark-mode .progress {
  1282.                 background: #27272A;
  1283.             }
  1284.  
  1285.             body.dark-mode .dropdown-menu>li>a {
  1286.                 color: #c6c6c8;
  1287.             }
  1288.  
  1289.             body.dark-mode .dropdown-menu {
  1290.                 background: #27272A;
  1291.             }
  1292.  
  1293.             body.dark-mode hr {
  1294.                 border-top: 1px solid #5f5f60;
  1295.             }
  1296.  
  1297.             body.dark-mode .table-striped>tbody>tr:nth-child(odd) {
  1298.                 background: #1f1f21 !important;
  1299.             }
  1300.  
  1301.             body.dark-mode .table-striped>tbody>tr:nth-child(even) {
  1302.                 background-color: #18181B !important;
  1303.             }
  1304.          
  1305.             body.dark-mode .table>thead>tr>th {
  1306.                 border-bottom: 2px solid #5f5f60;
  1307.             }
  1308.  
  1309.             body.dark-mode .table>thead>tr>th, body.dark-mode .table>tbody>tr>th, body.dark-mode .table>tfoot>tr>th, body.dark-mode .table>thead>tr>td, body.dark-mode .table>tbody>tr>td, body.dark-mode .table>tfoot>tr>td {
  1310.                 border-top: none;
  1311.             }
  1312.  
  1313.             body.dark-mode .modal-content {
  1314.                 background: #18181B;
  1315.                 color: #c6c6c8;
  1316.             }
  1317.  
  1318.             body.dark-mode .modal-header {
  1319.                 border-bottom: 1px solid #5f5f60;
  1320.             }
  1321.  
  1322.             body.dark-mode .bub-table-list {
  1323.                 border: 1px solid #353636;
  1324.             }
  1325.  
  1326.             body.dark-mode .modal-footer {
  1327.                 border-top: 1px solid #5f5f60;
  1328.             }
  1329.  
  1330.             body.dark-mode .dropdown-menu>li>a:hover, body.dark-mode .dropdown-menu>li>a:focus {
  1331.                 background: #202023;
  1332.             }
  1333.  
  1334.             body.dark-mode .user-notif div.info {
  1335.                 background: #1f1f21;
  1336.             }
  1337.  
  1338.             body.dark-mode .user-notif div {
  1339.                 border-bottom: none;
  1340.             }
  1341.  
  1342.             body.dark-mode .user-notif div.warning {
  1343.                 background: none;
  1344.                 border-left: 1px solid #F59E0B;            
  1345.             }
  1346.  
  1347.             body.dark-mode .guild-members2 {
  1348.                 border-bottom: 1px solid #5f5f60;
  1349.                 border-top: 1px solid #5f5f60;
  1350.             }
  1351.  
  1352.             body.dark-mode .table>thead>tr>td.warning, body.dark-mode .table>tbody>tr>td.warning, body.dark-mode .table>tfoot>tr>td.warning, body.dark-mode .table>thead>tr>th.warning, body.dark-mode .table>tbody>tr>th.warning, body.dark-mode .table>tfoot>tr>th.warning, body.dark-mode .table>thead>tr.warning>td, body.dark-mode .table>tbody>tr.warning>td, body.dark-mode .table>tfoot>tr.warning>td, body.dark-mode .table>thead>tr.warning>th, body.dark-mode .table>tbody>tr.warning>th, body.dark-mode .table>tfoot>tr.warning>th {
  1353.                 color: #FDE047;
  1354.                 background: none;
  1355.             }
  1356.  
  1357.             body.dark-mode .nav-tabs {
  1358.                 border-bottom: none;
  1359.             }
  1360.  
  1361.             body.dark-mode .nav-tabs>li.active>a, body.dark-mode .nav-tabs>li.active>a:hover, body.dark-mode .nav-tabs>li.active>a:focus {
  1362.                 color: #c6c6c8;
  1363.                 background: #2a2a2d;
  1364.                 border: 1px solid transparent;
  1365.             }
  1366.  
  1367.             body.dark-mode .nav-tabs>li>a {
  1368.                 border-radius: 4px;
  1369.             }
  1370.  
  1371.             body.dark-mode .nav-tabs>li>a:hover {
  1372.                 border-color: transparent;
  1373.             }
  1374.  
  1375.             body.dark-mode .nav>li>a:hover, body.dark-mode .nav>li>a:focus {
  1376.                 background: #212123;
  1377.             }
  1378.  
  1379.             body.dark-mode .guild-members {
  1380.                 border-bottom: 1px solid #5f5f60;
  1381.             }
  1382.  
  1383.             body.dark-mode #tournament-modal .panel-heading {
  1384.                 color: #c6c6c8 !important;
  1385.                 border: none;
  1386.             }
  1387.  
  1388.             body.dark-mode .panel-default>.panel-heading {
  1389.                 background: #18181B;
  1390.             }
  1391.  
  1392.             body.dark-mode .panel {
  1393.                 background: #1f1f21;
  1394.             }
  1395.  
  1396.             body.dark-mode .panel-default {
  1397.                 border-color: transparent;
  1398.             }
  1399.  
  1400.             body.dark-mode #connecting > div {
  1401.                 background: #18181B !important;
  1402.                 color: #c6c6c8;
  1403.             }
  1404.  
  1405.             body.dark-mode #statsChartText, body.dark-mode #statsText {
  1406.                 color: #c6c6c8;
  1407.             }
  1408.          
  1409.             body.dark-mode #statsSubtext {
  1410.                 color: #a5a5a5;
  1411.             }
  1412.  
  1413.             body.dark-mode input.chat {
  1414.                 background: #18181B;
  1415.                 border: none;
  1416.             }
  1417.  
  1418.             body.dark-mode input:focus-visible {
  1419.                 outline: none;
  1420.                 color: #c6c6c8;
  1421.             }
  1422.  
  1423.             body.dark-mode .swal2-popup {
  1424.                 background: #18181B;
  1425.             }
  1426.  
  1427.             body.dark-mode .swal2-title {
  1428.                 color: #c6c6c8;
  1429.             }
  1430.  
  1431.             body.dark-mode .swal2-html-container {
  1432.                 color: #B4B4B5;
  1433.             }
  1434.  
  1435.             body.dark-mode .swal2-input-label {
  1436.                 color: #B4B4B5;
  1437.             }
  1438.  
  1439.             body.dark-mode .swal2-validation-message {
  1440.                 background: #27272A;
  1441.                 color: #c6c6c8;
  1442.             }
  1443.  
  1444.             body.dark-mode .scrollbar-track {
  1445.                 background: transparent;
  1446.             }
  1447.  
  1448.             body.dark-mode .scrollbar-track .show {
  1449.                 opacity: 0;
  1450.             }
  1451.  
  1452.             body.dark-mode .chatUsers li {
  1453.                 background: #27272A;
  1454.             }
  1455.  
  1456.             body.dark-mode .accounts li {
  1457.                 background: #27272A;
  1458.             }
  1459.  
  1460.             body.dark-mode #plusTabs>li.active>a, body.dark-mode #plusTabs>li.active>a:hover, body.dark-mode #plusTabs>li.active>a:focus {
  1461.                 border: none !important;
  1462.                 background: #27272A;
  1463.                 color: #c6c6c8;
  1464.             }
  1465.  
  1466.             body.dark-mode #plusTabs>li>a {
  1467.                 border: none !important;
  1468.                 border-radius: 4px;
  1469.                 color: #a2a2ad;
  1470.             }
  1471.  
  1472.             body.dark-mode .text-muted {
  1473.                 color: #a2a2a2;
  1474.             }
  1475.  
  1476.             body.dark-mode .close {
  1477.                 color: #c6c6c8;
  1478.                 text-shadow: none;
  1479.             }
  1480.  
  1481.             body.dark-mode .scrollbar-thumb {
  1482.                 background: #6B7280;
  1483.             }
  1484.  
  1485.             body.dark-mode ::-webkit-scrollbar {
  1486.                 width: 5px;
  1487.                 height: 5px;
  1488.             }
  1489.          
  1490.             body.dark-mode ::-webkit-scrollbar-button {
  1491.                 width: 0px;
  1492.                 height: 0px;
  1493.             }
  1494.          
  1495.             body.dark-mode ::-webkit-scrollbar-thumb {
  1496.                 background: #71717A;
  1497.                 border: 0px none #ffffff;
  1498.                 border-radius: 50px;
  1499.             }
  1500.          
  1501.             body.dark-mode ::-webkit-scrollbar-thumb:hover {
  1502.                 background: #52525B;
  1503.             }
  1504.          
  1505.             body.dark-mode ::-webkit-scrollbar-thumb:active {
  1506.                 background: #52525B;
  1507.             }
  1508.          
  1509.             body.dark-mode ::-webkit-scrollbar-track {
  1510.                 background: transparent;
  1511.                 border: 0px none #ffffff;
  1512.                 border-radius: 50px;
  1513.             }
  1514.             
  1515.             body.dark-mode ::-webkit-scrollbar-track:hover {
  1516.                 background: transparent;
  1517.             }
  1518.          
  1519.             body.dark-mode ::-webkit-scrollbar-track:active {
  1520.                 background: transparent;
  1521.             }
  1522.          
  1523.             body.dark-mode ::-webkit-scrollbar-corner {
  1524.                 background: transparent;
  1525.             }
  1526.  
  1527.         `;
  1528.  
  1529.         const style = document.createElement('style');
  1530.         style.textContent = css;
  1531.         document.head.append(style);
  1532.     }
  1533.  
  1534.     loadGUI() {
  1535.         $('#formStd h2').html('Bubble.am+').css({'display': 'inline-block', 'margin-right': '0.3em'});
  1536.         $('#formStd h2').after(`<p style="display: inline-block; vertical-align: middle;">${window.plus.version}</p>`)
  1537.         $('.btn-settings').after(`
  1538.             <button id="plusSettingsBtn" onclick="return false;" class="btn btn-danger" data-toggle="modal" data-target=".bs-example-modal-lg">
  1539.                 <i class="fa fa-plus"></i>
  1540.             </button>
  1541.         `);
  1542.         $('#chat_textbox').attr('maxlength', '99');
  1543.  
  1544.         $('#overlays').before(`
  1545.         <div id="plusSettings" class="modal fade" tabindex="-1" role="dialog">
  1546.             <div class="modal-dialog" role="document">
  1547.                 <div class="modal-content">
  1548.                     <div class="modal-header">
  1549.                         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
  1550.                         <h4 class="modal-title" id="pLabel">Bubble.am+ ${window.plus.version}</h4>
  1551.                         <ul id="plusTabs" class="nav nav-tabs" role="tablist">
  1552.                             <li role="presentation" class="active"><a href="#general" aria-controls="general" role="tab" data-toggle="tab">General</a></li>
  1553.                             <li role="presentation"><a href="#controls" aria-controls="controls" role="tab" data-toggle="tab">Controls</a></li>
  1554.                             <li role="presentation"><a href="#chat" aria-controls="chat" role="tab" data-toggle="tab">Chat</a></li>
  1555.                             <li role="presentation"><a href="#accounts" aria-controls="accounts" role="tab" data-toggle="tab">Accounts</a></li>
  1556.                         </ul>
  1557.                     </div>
  1558.                     <div class="modal-body">
  1559.                         <div id="plusContent" class="tab-content">
  1560.                             <div role="tabpanel" class="tab-pane active" id="general"></div>
  1561.                             <div role="tabpanel" class="tab-pane" id="controls"></div>
  1562.                             <div role="tabpanel" class="tab-pane" id="chat"></div>
  1563.                             <div role="tabpanel" class="tab-pane" id="accounts"></div>
  1564.                         </div>
  1565.                     </div>
  1566.                     <div class="modal-footer" style="text-align: center;">
  1567.                         <a href="http://enderror.pl" target="_blank">
  1568.                             <img id="enderror-logo" src="https://i.imgur.com/W7FkCgA.png" style="width: 3em;">
  1569.                         </a>
  1570.                     </div>
  1571.                 </div>
  1572.             </div>
  1573.         </div>
  1574.         `);
  1575.  
  1576.         const plusSettingsBtn = document.querySelector('#plusSettingsBtn');
  1577.         plusSettingsBtn.addEventListener('click', function() {
  1578.             $('#plusSettings').modal('toggle');
  1579.         });
  1580.  
  1581.         this.modsGUI();
  1582.         this.controlsGUI();
  1583.         this.chatGUI();
  1584.         this.accountsGUI();
  1585.  
  1586.         $('#plusSettings').on('shown.bs.modal', () => {
  1587.             $(document).off('focusin.modal');
  1588.         });
  1589.  
  1590.         $('#plusSettings').on('hidden.bs.modal', () => {
  1591.             const settings = Store.getSettings();
  1592.  
  1593.             this.displayControls(settings.controls);
  1594.             this.displayUsers(settings.chat);
  1595.             this.displayAccounts(settings.accounts);
  1596.         });
  1597.  
  1598.         const pickr = new Pickr({
  1599.             el: '#colorMod',
  1600.             theme: 'nano',
  1601.             container: 'body',
  1602.             default: Store.getSettings().values.cellsColor,
  1603.             position: 'right-start',
  1604.             appClass: 'plusColor',
  1605.  
  1606.             swatches: null,
  1607.             components: {
  1608.                 preview: true,
  1609.                 opacity: true,
  1610.                 hue: true,
  1611.         
  1612.                 interaction: {
  1613.                     hex: false,
  1614.                     rgba: false,
  1615.                     hsla: false,
  1616.                     hsva: false,
  1617.                     cmyk: false,
  1618.                     input: true,
  1619.                     clear: false,
  1620.                     save: true
  1621.                 }
  1622.             }
  1623.         });
  1624.      
  1625.         pickr.on('save', (color, instance) => {
  1626.             window.plus.settings.values.cellsColor = color.toRGBA().toString(3);
  1627.             Store.setSettings();
  1628.         });
  1629.  
  1630.         window.Scrollbars = Scrollbar.initAll();
  1631.     }
  1632.  
  1633.     modsGUI() {
  1634.         $('#general').append(`
  1635.             <div id="general-content">
  1636.                 <div class="plus-checkbox">
  1637.                     <label>
  1638.                         <input id="plus_transparentVirus" type="checkbox" onchange="setTransparentVirus($(this).is(':checked'));"> Transparent virus
  1639.                     </label>
  1640.                 </div>
  1641.                 <div class="plus-checkbox">
  1642.                     <label>
  1643.                         <input id="plus_noGrid" type="checkbox" onchange="setNoGrid($(this).is(':checked'));"> No grid
  1644.                     </label>
  1645.                 </div>
  1646.                 <div class="plus-checkbox" style="display: flex; align-items: center;">
  1647.                     <label style="float: left;">
  1648.                         <input id="plus_customColor" type="checkbox" onchange="setCustomColor($(this).is(':checked'));"> Custom cells color
  1649.                     </label>
  1650.                     <div id="colorMod" style="float: left;"></div>
  1651.                 </div>
  1652.                 <div class="plus-checkbox" style="display: flex; align-items: center;">
  1653.                     <label style="float: left;">
  1654.                         <input id="plus_customSkin" type="checkbox" onchange="setCustomSkin($(this).is(':checked'));"> Custom skin
  1655.                     </label>
  1656.                     <div id="skinPanel">
  1657.                         <button id="setSkinBtn" class="btn btn-success skinBtn"><i class="fa fa-plus"></i></button>
  1658.                         <button id="showSkinBtn" class="btn btn-primary skinBtn"><i class="fa fa-eye"></i></button>
  1659.                     </div>
  1660.                 </div>
  1661.                 <div class="plus-checkbox">
  1662.                     <label>
  1663.                         <input id="plus_bypassSkin" type="checkbox" onchange="setBypassSkin($(this).is(':checked'));"> Bypass "No skins"
  1664.                     </label>
  1665.                 </div>
  1666.                 <div class="plus-checkbox">
  1667.                     <label>
  1668.                         <input id="plus_darkMenu" type="checkbox" onchange="setDarkMenu($(this).is(':checked'));"> Dark theme menu
  1669.                     </label>
  1670.                 </div>
  1671.                 <div class="plus-checkbox">
  1672.                     <label>
  1673.                         <input id="plus_virusSplitCounter" type="checkbox" onchange="setVirusSplitCounter($(this).is(':checked'));"> Virus split counter
  1674.                     </label>
  1675.                 </div>
  1676.                 <div class="plus-checkbox">
  1677.                     <label>
  1678.                         <input id="plus_cellsCounter" type="checkbox" onchange="setCellsCounter($(this).is(':checked'));"> Cells counter
  1679.                     </label>
  1680.                 </div>
  1681.                 <div class="plus-checkbox">
  1682.                     <label>
  1683.                         <input id="plus_hideName" type="checkbox" onchange="setHideName($(this).is(':checked'));"> Hide your name
  1684.                     </label>
  1685.                 </div>
  1686.                 <div class="plus-checkbox">
  1687.                     <label>
  1688.                         <input id="plus_showMotherMass" type="checkbox" onchange="setShowMotherMass($(this).is(':checked'));"> Show mother mass
  1689.                     </label>
  1690.                 </div>
  1691.         </div>
  1692.         `);
  1693.  
  1694.         document.querySelector('#setSkinBtn').addEventListener('click', async () => {
  1695.             const { value: skinValue } = await Swal.fire({
  1696.                 title: 'Enter skin url (png, jpg or jpeg)',
  1697.                 input: 'text',
  1698.                 showCancelButton: true,
  1699.                 inputValidator: (value) => {
  1700.                   if(!value) {
  1701.                     return 'You need to write something.'
  1702.                   }
  1703.  
  1704.                   if(!this.isUriImage(value)) {
  1705.                       return 'Your skin url is wrong.'
  1706.                   }
  1707.                 }
  1708.               });
  1709.               
  1710.               if(skinValue) {
  1711.                 Swal.fire({
  1712.                     title: 'Skin has been successfully set.',
  1713.                     imageUrl: skinValue,
  1714.                     imageAlt: 'Skin',
  1715.                 });
  1716.  
  1717.                 const settings = window.plus.settings;
  1718.                 const helpers = window.plus.helpers;
  1719.                   
  1720.                 settings.values.skinUrl = skinValue;
  1721.                 helpers.skin.skinInd == 1 ? helpers.skin.skinInd++ : helpers.skin.skinInd--;
  1722.                 
  1723.                 Store.setSettings();
  1724.               }
  1725.         });
  1726.  
  1727.         document.querySelector('#showSkinBtn').addEventListener('click', async function() {
  1728.             const settings = window.plus.settings;
  1729.  
  1730.             if(typeof(settings.values.skinUrl) === 'string') {
  1731.                 Swal.fire({
  1732.                     title: 'Current skin',
  1733.                     imageUrl: settings.values.skinUrl,
  1734.                     imageAlt: 'Skin',
  1735.                 });
  1736.             } else {
  1737.                 Swal.fire({
  1738.                     title: 'Current skin',
  1739.                     text: 'No skin has been set yet.',
  1740.                 });
  1741.             }
  1742.         });
  1743.     }
  1744.  
  1745.     controlsGUI() {
  1746.         $('#controls').append(`
  1747.             <div class="plusHeader" style="text-align: center; justify-content: space-around;">
  1748.                 <strong style="width: 240px;">Type</strong>
  1749.                 <strong style="width: 200px; padding-left: 10px;">Key</strong>
  1750.                 <strong style="width: 60px;">Disabled</strong>
  1751.                 <strong style="width: 40px;"></strong>
  1752.             </div>
  1753.             <div class="plusContent-wrapper" data-scrollbar>
  1754.                 <ul class="controlsContent controls"></ul>
  1755.             </div>
  1756.             <div class="plusBtn">
  1757.                 <button class="btn btn-warning controlsDefault">Load default</button>
  1758.                 <button class="btn btn-danger controlsDelete">Delete all</button>
  1759.                 <button class="btn btn-success controlsNew">Add new</button>
  1760.                 <button class="btn btn-primary controlsSave">Save</button>
  1761.             </div>
  1762.         `);
  1763.  
  1764.         $('.controls').on('click', (e) => {
  1765.             if(!e.target.className.includes('delete')) return;
  1766.  
  1767.             const controlsLength = $('.controls li').length;
  1768.             const hasEmpty = $('.controls').find('.emptyPanel').length === 1;
  1769.  
  1770.             if(controlsLength === 1) {
  1771.                 this.displayEmpty('.controls', 'controls');
  1772.             }
  1773.  
  1774.             if(controlsLength !== 1 && hasEmpty) {
  1775.                 $('.controls .emptyPanel').remove();
  1776.             }
  1777.  
  1778.             e.target.parentElement.remove();
  1779.         });
  1780.  
  1781.         $('.controlsDefault').on('click', () => {
  1782.             const defaultSettings = window.plus.defaultSettings;
  1783.  
  1784.             $('.plusControls tbody').html('');
  1785.  
  1786.             this.displayControls(defaultSettings.controls);
  1787.         });
  1788.  
  1789.         $('.controlsDelete').on('click', () => {
  1790.             this.displayEmpty('.controls', 'controls');
  1791.         });
  1792.  
  1793.         $('.controlsNew').on('click', () => {
  1794.             this.addControl();
  1795.         });
  1796.  
  1797.         $('.controlsSave').on('click', () => {
  1798.             const newControls = [];
  1799.             const actualControls = document.querySelectorAll('.controls li');
  1800.             const settings = window.plus.settings;
  1801.  
  1802.             for(let i = 0; i < actualControls.length; i++) {
  1803.                 const li = actualControls[i];
  1804.                 const select = li.querySelectorAll('select');
  1805.                 const checkbox = li.querySelector('input');
  1806.  
  1807.                 const controlType = select[0].value;
  1808.                 const controlKey = select[1].value;
  1809.                 const controlDisabled = checkbox.checked;
  1810.  
  1811.                 newControls.push({
  1812.                     type: controlType,
  1813.                     keycode: controlKey,
  1814.                     disabled: controlDisabled
  1815.                 });
  1816.             }
  1817.  
  1818.             settings.controls = newControls;
  1819.             Store.setSettings();
  1820.  
  1821.             Swal.fire({
  1822.                 icon: 'success',
  1823.                 title: 'Success!',
  1824.                 text: 'Your new controls configuration has been successfully saved.'
  1825.           });
  1826.         });
  1827.     }
  1828.  
  1829.     addControl() {
  1830.         const controlsTemplate = `
  1831.             <li>
  1832.                 <select class="form-control" style="border-radius:4px; width: 15em;">
  1833.                     <option value="1x" selected="selected">Split</option>
  1834.                     <option value="eject">Eject</option>
  1835.                     <option value="setCamera">Lock/unlock camera [spectate]</option>
  1836.                     <option value="2x">2x split</option>
  1837.                     <option value="4x">4x split</option>
  1838.                     <option value="8x">8x split</option>
  1839.                     <option value="16x">16x split</option>
  1840.                     <option value="holdSplit">Hold split</option>
  1841.                     <option value="holdEject">Hold eject</option>
  1842.                     <option value="movementUp">Movement up</option>
  1843.                     <option value="movementRight">Movement right</option>
  1844.                     <option value="movementDown">Movement down</option>
  1845.                     <option value="movementLeft">Movement left</option>
  1846.                     <option value="hashLogin">Login by hash</option>
  1847.                     <option value="hashShow">Show hash</option>
  1848.                 </select>
  1849.                 <select class="form-control" style="border-radius:4px; width: 12em;">
  1850.                     <option value="1">Left Click</option>
  1851.                     <option value="2">Scroll Click</option>
  1852.                     <option value="3">Right Click</option>
  1853.                     <option value="9">Tab</option>
  1854.                     <option value="12">Clear</option>
  1855.                     <option value="13">Enter</option>
  1856.                     <option value="16">Shift</option>
  1857.                     <option value="17">Ctrl</option>
  1858.                     <option value="18">Alt</option>
  1859.                     <option value="27">Esc</option>
  1860.                     <option value="32" selected="selected">Space</option>
  1861.                     <option value="33">Page Up</option>
  1862.                     <option value="34">Page Down</option>
  1863.                     <option value="35">End</option>
  1864.                     <option value="36">Home</option>
  1865.                     <option value="37">Left Arrow</option>
  1866.                     <option value="38">Up Arrow</option>
  1867.                     <option value="39">Right Arrow</option>
  1868.                     <option value="40">Down Arrow</option>
  1869.                     <option value="45">Insert</option>
  1870.                     <option value="46">Delete</option>
  1871.                     <option value="48">0</option>
  1872.                     <option value="49">1</option>
  1873.                     <option value="50">2</option>
  1874.                     <option value="51">3</option>
  1875.                     <option value="52">4</option>
  1876.                     <option value="53">5</option>
  1877.                     <option value="54">6</option>
  1878.                     <option value="55">7</option>
  1879.                     <option value="56">8</option>
  1880.                     <option value="57">9</option>
  1881.                     <option value="65">A</option>
  1882.                     <option value="66">B</option>
  1883.                     <option value="67">C</option>
  1884.                     <option value="68">D</option>
  1885.                     <option value="69">E</option>
  1886.                     <option value="70">F</option>
  1887.                     <option value="71">G</option>
  1888.                     <option value="72">H</option>
  1889.                     <option value="73">I</option>
  1890.                     <option value="74">J</option>
  1891.                     <option value="75">K</option>
  1892.                     <option value="76">L</option>
  1893.                     <option value="77">M</option>
  1894.                     <option value="78">N</option>
  1895.                     <option value="79">O</option>
  1896.                     <option value="80">P</option>
  1897.                     <option value="81">Q</option>
  1898.                     <option value="82">R</option>
  1899.                     <option value="83">S</option>
  1900.                     <option value="84">T</option>
  1901.                     <option value="85">U</option>
  1902.                     <option value="86">V</option>
  1903.                     <option value="87">W</option>
  1904.                     <option value="88">X</option>
  1905.                     <option value="89">Y</option>
  1906.                     <option value="90">Z</option>
  1907.                     <option value="96">Numpad 0</option>
  1908.                     <option value="97">Numpad 1</option>
  1909.                     <option value="98">Numpad 2</option>
  1910.                     <option value="99">Numpad 3</option>
  1911.                     <option value="100">Numpad 4</option>
  1912.                     <option value="101">Numpad 5</option>
  1913.                     <option value="102">Numpad 6</option>
  1914.                     <option value="103">Numpad 7</option>
  1915.                     <option value="104">Numpad 8</option>
  1916.                     <option value="105">Numpad 9</option>
  1917.                     <option value="106">Numpad *</option>
  1918.                     <option value="107">Numpad +</option>
  1919.                     <option value="109">Numpad -</option>
  1920.                     <option value="110">Numpad .</option>
  1921.                     <option value="111">Numpad /</option>
  1922.                     <option value="112">F1</option>
  1923.                     <option value="113">F2</option>
  1924.                     <option value="114">F3</option>
  1925.                     <option value="115">F4</option>
  1926.                     <option value="116">F5</option>
  1927.                     <option value="117">F6</option>
  1928.                     <option value="118">F7</option>
  1929.                     <option value="119">F8</option>
  1930.                     <option value="120">F9</option>
  1931.                     <option value="121">F10</option>
  1932.                     <option value="122">F11</option>
  1933.                     <option value="123">F12</option>
  1934.                     <option value="124">F13</option>
  1935.                     <option value="125">F14</option>
  1936.                     <option value="126">F15</option>
  1937.                     <option value="127">F16</option>
  1938.                     <option value="128">F17</option>
  1939.                     <option value="129">F18</option>
  1940.                     <option value="130">F19</option>
  1941.                     <option value="131">F20</option>
  1942.                     <option value="132">F21</option>
  1943.                     <option value="133">F22</option>
  1944.                     <option value="134">F23</option>
  1945.                     <option value="135">F24</option>
  1946.                     <option value="186">;</option>
  1947.                     <option value="187">=</option>
  1948.                     <option value="188">,</option>
  1949.                     <option value="189">-</option>
  1950.                     <option value="190">.</option>
  1951.                     <option value="191">/</option>
  1952.                     <option value="192">&#96;</option>
  1953.                     <option value="219">[</option>
  1954.                     <option value="220">&#92;</option>
  1955.                     <option value="221">]</option>
  1956.                     <option value="222">'</option>
  1957.                 </select>
  1958.                 <input type="checkbox" style="margin: 0;">
  1959.                 <i class="fa fa-remove delete"></i>
  1960.             </li>
  1961.         `;
  1962.  
  1963.         const hasEmpty = $('.controls').find('.emptyPanel').length === 1;
  1964.         if(hasEmpty) {
  1965.             $('.controls .emptyPanel').remove();
  1966.         }
  1967.  
  1968.         $('.controls').append(controlsTemplate);
  1969.         this.fixScrollbar(window.Scrollbars[0]);
  1970.     }
  1971.  
  1972.     displayControls(settings) {
  1973.         if(settings.length === 0) {
  1974.             return this.displayEmpty('.controls', 'controls');
  1975.         };
  1976.  
  1977.         $('.controls').html('');
  1978.  
  1979.         for(let i = 0; i < settings.length; i++) {
  1980.             const setting = settings[i];
  1981.             
  1982.             this.addControl();
  1983.  
  1984.             const li = document.querySelectorAll('.controls li')[i];
  1985.             const select = li.querySelectorAll('select');
  1986.             const checkbox = li.querySelector('input');
  1987.  
  1988.             select[0].value = setting.type;
  1989.             select[1].value = setting.keycode;
  1990.             checkbox.checked = setting.disabled;
  1991.         }
  1992.     }
  1993.  
  1994.     chatGUI() {
  1995.         $('#chat').append(`
  1996.             <div class="plusHeader">
  1997.                 <strong>Blocked users</strong>
  1998.             </div>
  1999.             <div class="plusContent-wrapper" data-scrollbar>
  2000.                 <ul class="plusContent chatUsers"></ul>
  2001.             </div>
  2002.             <div class="plusBtn">
  2003.                 <button class="btn btn-danger chatDelete">Delete all</button>
  2004.                 <button class="btn btn-success chatNew">Add new</button>
  2005.                 <button class="btn btn-primary chatSave">Save</button>
  2006.             </div>
  2007.         `);
  2008.  
  2009.         $('.chatUsers').on('click', (e) => {
  2010.             if(!e.target.className.includes('delete')) return;
  2011.  
  2012.             const chatLength = $('.chatUsers li').length;
  2013.             const hasEmpty = $('.chatUsers').find('.emptyPanel').length === 1;
  2014.  
  2015.             if(chatLength === 1) {
  2016.                 this.displayEmpty('.chatUsers', 'users');
  2017.             }
  2018.  
  2019.             if(chatLength !== 1 && hasEmpty) {
  2020.                 $('.chatUsers .emptyPanel').remove();
  2021.             }
  2022.  
  2023.             e.target.parentElement.remove();
  2024.         });
  2025.  
  2026.         $('.chatDelete').on('click', () => {
  2027.             this.displayEmpty('.chatUsers', 'users');
  2028.         });
  2029.  
  2030.         $('.chatNew').on('click', async () => {
  2031.             let { value: playerNick } = await Swal.fire({
  2032.                 title: 'Player nickname',
  2033.                 text: 'You don\'t need to specify a clan tag.',
  2034.                 input: 'text',
  2035.                 inputValue: '',
  2036.                 showCancelButton: true,
  2037.                 inputValidator: (value) => {
  2038.                   if(!value) {
  2039.                     return 'You need to write something!'
  2040.                   }
  2041.     
  2042.                   if(value.length > 15) {
  2043.                       return 'Player nickname cannot be longer than 15 characters.'
  2044.                   }
  2045.     
  2046.                   const currentUsers = this.getCurrentUsers();
  2047.                   if(currentUsers.includes(value.toLowerCase())) {
  2048.                     return 'This user is already on the list.';
  2049.                   }
  2050.                 }
  2051.               });
  2052.               
  2053.             if(playerNick) {
  2054.                 this.addUser(playerNick);
  2055.             }
  2056.         });
  2057.  
  2058.         $('.chatSave').on('click', () => {
  2059.             const newChat = [];
  2060.             const actualChat = document.querySelectorAll('.chatUsers li');
  2061.             const settings = window.plus.settings;
  2062.  
  2063.             for(let i = 0; i < actualChat.length; i++) {
  2064.                 const li = actualChat[i];
  2065.                 const playerNick = li.querySelectorAll('span')[0].innerHTML;
  2066.  
  2067.                 newChat.push(playerNick.toLowerCase());
  2068.             }
  2069.  
  2070.             settings.chat = newChat;
  2071.             Store.setSettings();
  2072.  
  2073.             Swal.fire({
  2074.                 icon: 'success',
  2075.                 title: 'Success!',
  2076.                 text: 'Your new chat configuration has been successfully saved.'
  2077.           });
  2078.         });
  2079.     }
  2080.  
  2081.     addUser(name) {
  2082.         const hasEmpty = $('.chatUsers').find('.emptyPanel').length === 1;
  2083.         if(hasEmpty) {
  2084.             $('.chatUsers .emptyPanel').remove();
  2085.         }
  2086.  
  2087.         $('.chatUsers').append(`
  2088.             <li>
  2089.                 <span>${name.toLowerCase()}</span>
  2090.                 <i class="fa fa-remove delete"></i>
  2091.             </li>
  2092.         `);
  2093.  
  2094.         this.fixScrollbar(window.Scrollbars[1]);
  2095.     }
  2096.  
  2097.     getCurrentUsers() {
  2098.         const currentUsers = document.querySelectorAll('.chatUsers li');
  2099.         const nicks = [];
  2100.  
  2101.         for(let i = 0; i < currentUsers.length; i++) {
  2102.             const user = currentUsers[i];
  2103.             const nick = user.querySelectorAll('span')[0].innerHTML.toLowerCase();
  2104.  
  2105.             nicks.push(nick);
  2106.         }
  2107.  
  2108.         return nicks;
  2109.     }
  2110.  
  2111.     displayUsers(users) {
  2112.         if(users.length === 0) {
  2113.             return this.displayEmpty('.chatUsers', 'users');
  2114.         }
  2115.  
  2116.         $('.chatUsers').html('');
  2117.  
  2118.         for(let i = 0; i < users.length; i++) {
  2119.             const playerNick = users[i];
  2120.  
  2121.             this.addUser(playerNick);
  2122.         }
  2123.     }
  2124.  
  2125.     accountsGUI() {
  2126.         $('#accounts').append(`
  2127.             <div class="plusHeader">
  2128.                 <strong>Your accounts</strong>
  2129.             </div>
  2130.             <div class="plusContent-wrapper" data-scrollbar>
  2131.                 <ul class="plusContent accounts"></ul>
  2132.             </div>
  2133.             <div class="plusBtn">
  2134.                 <button class="btn btn-danger accountsDelete">Delete all</button>
  2135.                 <button class="btn btn-success accountsNew">Add new</button>
  2136.                 <button class="btn btn-primary accountsSave">Save</button>
  2137.             </div>
  2138.         `);
  2139.  
  2140.         $('.accounts').on('click', (e) => {
  2141.             if(!e.target.className.includes('delete')) return;
  2142.  
  2143.             const accountsLength = $('.accounts li').length;
  2144.             const hasEmpty = $('.accounts').find('.emptyPanel').length === 1;
  2145.  
  2146.             if(accountsLength === 1) {
  2147.                 this.displayEmpty('.accounts', 'accounts');
  2148.             }
  2149.  
  2150.             if(accountsLength !== 1 && hasEmpty) {
  2151.                 $('.accounts .emptyPanel').remove();
  2152.             }
  2153.  
  2154.             e.target.parentElement.remove();
  2155.         });
  2156.  
  2157.         $('.accountsDelete').on('click', () => {
  2158.             this.displayEmpty('.accounts', 'accounts');
  2159.         });
  2160.  
  2161.         $('.accountsNew').on('click', async () => {
  2162.             const {value: account} = await Swal.fire({
  2163.                 title: 'Add account',
  2164.                 html: `
  2165.                   <input id="name" class="swal2-input" placeholder="Name" maxlength="15">
  2166.                   <input id="hash" class="swal2-input" placeholder="Hash" maxlength="40">
  2167.                 `,
  2168.                 focusConfirm: false,
  2169.                 preConfirm: () => {
  2170.                     const name = document.getElementById('name').value.trim();
  2171.                     const hash = document.getElementById('hash').value.trim();
  2172.     
  2173.                     const currentAccounts = this.getCurrentAccounts();
  2174.                     const currentNames = currentAccounts.names;
  2175.                     const currentHashes = currentAccounts.hashes;
  2176.     
  2177.                     if(name.length === 0 || hash.length === 0) {
  2178.                         return Swal.showValidationMessage('You must complete all fields.');
  2179.                     }
  2180.     
  2181.                     if(hash.length !== 40) {
  2182.                         return Swal.showValidationMessage('The hash length must be 40 characters.');
  2183.                     }
  2184.     
  2185.                     if(currentNames.includes(name.toLowerCase()) || currentHashes.includes(hash)) {
  2186.                         return Swal.showValidationMessage('The name or hash is already on the list.');
  2187.                     }
  2188.     
  2189.                     return {
  2190.                         name,
  2191.                         hash
  2192.                     }
  2193.                 }
  2194.               });
  2195.     
  2196.             if(account) {
  2197.                 this.addAccount(account.name, account.hash);
  2198.             }
  2199.         });
  2200.  
  2201.         $('.accountsSave').on('click', () => {
  2202.             const newAccounts = [];
  2203.             const actualAccounts = document.querySelectorAll('.accounts li');
  2204.             const settings = window.plus.settings;
  2205.  
  2206.             for(let i = 0; i < actualAccounts.length; i++) {
  2207.                 const li = actualAccounts[i];
  2208.                 const accountName = li.querySelectorAll('span')[0].innerHTML;
  2209.                 const accountHash = li.dataset.hash;
  2210.  
  2211.                 newAccounts.push({
  2212.                     name: accountName,
  2213.                     hash: accountHash
  2214.                 });
  2215.             }
  2216.  
  2217.             settings.accounts = newAccounts;
  2218.             Store.setSettings();
  2219.  
  2220.             Swal.fire({
  2221.                 icon: 'success',
  2222.                 title: 'Success!',
  2223.                 text: 'Your new accounts configuration has been successfully saved.'
  2224.           });
  2225.         });
  2226.     }
  2227.  
  2228.     addAccount(name, hash) {
  2229.         const hasEmpty = $('.accounts').find('.emptyPanel').length === 1;
  2230.         if(hasEmpty) {
  2231.             $('.accounts .emptyPanel').remove();
  2232.         }
  2233.  
  2234.         $('.accounts').append(`
  2235.             <li data-hash="${hash}">
  2236.                 <span>${name}</span>
  2237.                 <div>
  2238.                     <span class="hashLogin" style="cursor: pointer;" onclick="window.plus.setHash($(this).parent().parent().data('hash'));">
  2239.                         <i class="fa fa-arrow-right"></i>
  2240.                     </span>
  2241.                     <span class="delete" style="cursor: pointer;" onclick="$(this).parent().parent().remove();">
  2242.                         <i class="fa fa-remove"></i>
  2243.                     </span>
  2244.                 </div>
  2245.             </li>
  2246.         `);
  2247.  
  2248.         this.fixScrollbar(window.Scrollbars[2]);
  2249.     }
  2250.  
  2251.     displayAccounts(accounts) {
  2252.         if(accounts.length === 0) {
  2253.             return this.displayEmpty('.accounts', 'accounts');
  2254.         }
  2255.  
  2256.         $('.accounts').html('');
  2257.  
  2258.         for(const account in accounts) {
  2259.             const { name, hash } = accounts[account];
  2260.             
  2261.             this.addAccount(name, hash);
  2262.         }
  2263.     }
  2264.  
  2265.     getCurrentAccounts() {
  2266.         const currentAccounts = document.querySelectorAll('.accounts li');
  2267.  
  2268.         const accounts = [];
  2269.         const names = [];
  2270.         const hashes = [];
  2271.  
  2272.         for(let i = 0; i < currentAccounts.length; i++) {
  2273.             const account = currentAccounts[i];
  2274.             const name = account.querySelectorAll('span')[0].innerHTML.toLowerCase();
  2275.             const hash = account.dataset.hash;
  2276.  
  2277.             accounts.push({
  2278.                 name,
  2279.                 hash
  2280.             });
  2281.  
  2282.             names.push(name);
  2283.             hashes.push(hash);
  2284.         }
  2285.  
  2286.         return {
  2287.             accounts,
  2288.             names,
  2289.             hashes
  2290.         }
  2291.     }
  2292.  
  2293.     loadSettings() {
  2294.         const settings = Store.getSettings();
  2295.  
  2296.         window.plus.settings = settings;
  2297.  
  2298.         for(const checkbox in settings.checkbox) {
  2299.             const name = checkbox;
  2300.             const value = settings.checkbox[checkbox];
  2301.  
  2302.             $(`#plus_${name}`).prop('checked', value).change();
  2303.         }
  2304.  
  2305.         this.displayControls(settings.controls);
  2306.         this.displayUsers(settings.chat);
  2307.         this.displayAccounts(settings.accounts);
  2308.     }
  2309.  
  2310.     displayEmpty(element, text) {
  2311.         $(element).html(`<div class="emptyPanel">There are currently no ${text} in this panel.</div>`);
  2312.     }
  2313.  
  2314.     fixScrollbar(scrollbar) {
  2315.         scrollbar.update();
  2316.  
  2317.         const limitY = scrollbar.limit.y;
  2318.         scrollbar.setPosition(0, limitY);
  2319.     }
  2320.  
  2321.     isUriImage = function(uri) {
  2322.         uri = uri.split('?')[0];
  2323.         const parts = uri.split('.');
  2324.         const extension = parts[parts.length - 1];
  2325.         const imageTypes = ['png', 'jpg', 'jpeg'];
  2326.         if(imageTypes.indexOf(extension) !== -1) {
  2327.             return true;   
  2328.         }
  2329.     }
  2330. }
  2331.  
  2332. class Store {
  2333.     static getSettings() {
  2334.         let settings;
  2335.         if(localStorage.getItem('plus_settings') === null) {
  2336.             this.setSettings();
  2337.         }
  2338.  
  2339.         settings = JSON.parse(localStorage.getItem('plus_settings'));
  2340.  
  2341.         return settings;
  2342.     }
  2343.  
  2344.     static setSettings() {
  2345.         localStorage.setItem('plus_settings', JSON.stringify(window.plus.settings));
  2346.     }
  2347. }
  2348.  
  2349. window.modLoaded = false;
  2350.  
  2351. window.setCustomColor = function(a) {
  2352.     window.plus.settings.checkbox.customColor = a;
  2353.     Store.setSettings();
  2354. }
  2355.  
  2356. window.setTransparentVirus = function(a) {
  2357.     window.plus.settings.checkbox.transparentVirus = a;
  2358.     Store.setSettings();
  2359. }
  2360.  
  2361. window.setCustomSkin = function(a) {
  2362.     window.plus.settings.checkbox.customSkin = a;
  2363.     Store.setSettings();
  2364. }
  2365.  
  2366. window.setBypassSkin = function(a) {
  2367.     window.plus.settings.checkbox.bypassSkin = a;
  2368.     Store.setSettings();
  2369. }
  2370.  
  2371. window.setNoGrid = function(a) {
  2372.     window.plus.settings.checkbox.noGrid = a;
  2373.     Store.setSettings();
  2374. }
  2375.  
  2376. window.setDarkMenu = function(a) {
  2377.     window.plus.settings.checkbox.darkMenu = a;
  2378.     if(a === true) {
  2379.         $('body').addClass('dark-mode');
  2380.         $('#enderror-logo').attr('src', 'https://i.imgur.com/ewMCLSe.png'); 
  2381.     } else {
  2382.         $('body').removeClass('dark-mode')
  2383.         $('#enderror-logo').attr('src', 'https://i.imgur.com/W7FkCgA.png'); 
  2384.     }
  2385.  
  2386.     Store.setSettings();
  2387. }
  2388.  
  2389. window.setVirusSplitCounter = function(a) {
  2390.     window.plus.settings.checkbox.virusSplitCounter = a;
  2391.     Store.setSettings();
  2392. }
  2393.  
  2394. window.setCellsCounter = function(a) {
  2395.     window.plus.settings.checkbox.cellsCounter = a;
  2396.     Store.setSettings();
  2397. }
  2398.  
  2399. window.setHideName = function(a) {
  2400.     window.plus.settings.checkbox.hideName = a;
  2401.     Store.setSettings();
  2402. }
  2403.  
  2404. window.setShowMotherMass = function(a) {
  2405.     window.plus.settings.checkbox.showMotherMass = a;
  2406.     Store.setSettings();
  2407. }
  2408.  
  2409. window.plus = new Plus();