diff --git a/app/classes/web/routes/api/servers/server/files.py b/app/classes/web/routes/api/servers/server/files.py
index 3fb99796..9ed720ac 100644
--- a/app/classes/web/routes/api/servers/server/files.py
+++ b/app/classes/web/routes/api/servers/server/files.py
@@ -86,8 +86,8 @@ class ApiServersServerFilesIndexHandler(BaseApiHandler):
             not in self.controller.server_perms.get_user_id_permissions_list(
                 auth_data[4]["user_id"], server_id
             )
-            or not EnumPermissionsServer.BACKUP
-            in self.controller.server_perms.get_user_id_permissions_list(
+            or EnumPermissionsServer.BACKUP
+            not in self.controller.server_perms.get_user_id_permissions_list(
                 auth_data[4]["user_id"], server_id
             )
         ):
diff --git a/app/classes/web/routes/api/users/user/index.py b/app/classes/web/routes/api/users/user/index.py
index 898a9fda..73f17f9f 100644
--- a/app/classes/web/routes/api/users/user/index.py
+++ b/app/classes/web/routes/api/users/user/index.py
@@ -242,12 +242,11 @@ class ApiUsersUserIndexHandler(BaseApiHandler):
                     user_id, removed_roles
                 )
 
-        if "manager" in data:
-            if (
-                data["manager"] == self.controller.users.get_id_by_name("SYSTEM")
-                or data["manager"] == 0
-            ):
-                data["manager"] = None
+        if "manager" in data and (
+            data["manager"] == self.controller.users.get_id_by_name("SYSTEM")
+            or data["manager"] == 0
+        ):
+            data["manager"] = None
 
         if "permissions" in data:
             permissions: t.List[UsersController.ApiPermissionDict] = data.pop(
diff --git a/app/frontend/static/assets/js/shared/root-dir.js b/app/frontend/static/assets/js/shared/root-dir.js
index 9f3f14ac..2a6f58fd 100644
--- a/app/frontend/static/assets/js/shared/root-dir.js
+++ b/app/frontend/static/assets/js/shared/root-dir.js
@@ -1,11 +1,11 @@
 
 function show_file_tree() {
-        $("#dir_select").modal();
+    $("#dir_select").modal();
 }
 function getDirView(event = false) {
     if (event) {
         try {
-            path = event.target.parentElement.getAttribute('data-path');
+            let path = event.target.parentElement.getAttribute('data-path');
             if (event.target.parentElement.classList.contains('clicked')) {
 
                 if ($(`#${path}span`).hasClass('files-tree-title')) {
@@ -19,20 +19,18 @@ function getDirView(event = false) {
         } catch {
             console.log("Well that failed");
         }
+    } else if ($("#root_files_button").hasClass("clicked")) {
+        path = $("#zip_server_path").val();
+        getTreeView(path, true);
     } else {
-        if ($("#root_files_button").hasClass("clicked")) {
-            path = $("#zip_server_path").val();
-            getTreeView(path, true);
-        } else {
-            path = $("#file-uploaded").val();
-            getTreeView(path, true, true);
-        }
+        path = $("#file-uploaded").val();
+        getTreeView(path, true, true);
     }
-
 }
 
+
 async function getTreeView(path, unzip = false, upload = false) {
-    var token = getCookie("_xsrf");
+    const token = getCookie("_xsrf");
     console.log("IN TREE VIEW")
     console.log({ "page": "import", "folder": path, "upload": upload, "unzip": unzip });
     let res = await fetch(`/api/v2/import/file/unzip/`, {
diff --git a/app/frontend/templates/base.html b/app/frontend/templates/base.html
index fc56d45b..eca34e75 100755
--- a/app/frontend/templates/base.html
+++ b/app/frontend/templates/base.html
@@ -18,7 +18,7 @@
     href="https://cdn.datatables.net/v/bs4/dt-1.10.22/fh-3.1.7/r-2.2.6/sc-2.0.3/sp-1.2.2/datatables.min.css" />
   <link rel="stylesheet" href="/static/assets/vendors/css/vendor.bundle.base.css">
   <link rel="stylesheet" href="/static/assets/css/crafty.css">
-  
+
   <link rel="manifest" href="/static/assets/crafty.webmanifest">
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
@@ -414,7 +414,7 @@
 
     async function eulaAgree(server_id, command) {
       //< !--this getCookie function is in base.html-- >
-      var token = getCookie("_xsrf");
+      const token = getCookie("_xsrf");
 
       let res = await fetch(`/api/v2/servers/${server_id}/action/eula/`, {
         method: 'POST',
@@ -544,7 +544,7 @@
     });
     $(document).ready(() => {
       if ('serviceWorker' in navigator) {
-        navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', {scope: '/'})
+        navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', { scope: '/' })
           .then(function (registration) {
             console.log('Service Worker Registered');
           });
diff --git a/app/frontend/templates/panel/config_json.html b/app/frontend/templates/panel/config_json.html
index a8d5e040..aabac37d 100644
--- a/app/frontend/templates/panel/config_json.html
+++ b/app/frontend/templates/panel/config_json.html
@@ -6,7 +6,8 @@
 {% block title %}Crafty Controller - {{ translate('panelConfig', 'pageTitle', data['lang']) }}{% end %}
 
 {% block content %}
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.10/css/bootstrap-select.min.css">
+<link rel="stylesheet"
+  href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.10/css/bootstrap-select.min.css">
 
 
 <div class="content-wrapper">
@@ -72,8 +73,11 @@
                 </select>
                 {% elif item[0] == 'disabled_language_files' %}
                 <div class="input-group">
-                  <button type="button" class="btn btn-outline-default custom-picker" onclick="$('option', $('#lang_select')).each(function(element) {$(this).removeAttr('selected').prop('selected', false); $('.selectpicker').selectpicker('refresh')});">{{ translate('panelConfig', 'enableLang', data['lang']) }}</button>
-                  <select id="lang_select" class="form-control selectpicker show-tick custom-picker" data-icon-base="fas" data-tick-icon="fa-check" multiple data-style="custom-picker">
+                  <button type="button" class="btn btn-outline-default custom-picker"
+                    onclick="$('option', $('#lang_select')).each(function(element) {$(this).removeAttr('selected').prop('selected', false); $('.selectpicker').selectpicker('refresh')});">{{
+                    translate('panelConfig', 'enableLang', data['lang']) }}</button>
+                  <select id="lang_select" class="form-control selectpicker show-tick custom-picker"
+                    data-icon-base="fas" data-tick-icon="fa-check" multiple data-style="custom-picker">
                     {% for lang in data['all_languages'] %}
                     {% if lang in item[1] %}
                     <option selected>{{lang}}</option>
@@ -82,12 +86,17 @@
                     {% end %}
                     {% end %}
                   </select>
-                  <textarea id="disabled_lang" name="{{item[0]}}" class="form-control list hidden" rows="{{ len(data['all_languages']) }}" value="{{','.join(item[1])}}" hidden>{{','.join(item[1])}}</textarea>
+                  <textarea id="disabled_lang" name="{{item[0]}}" class="form-control list hidden"
+                    rows="{{ len(data['all_languages']) }}" value="{{','.join(item[1])}}"
+                    hidden>{{','.join(item[1])}}</textarea>
                 </div>
                 {% elif item[0] == 'monitored_mounts'%}
                 <div class="input-group">
-                  <button type="button" class="btn btn-outline-default custom-picker" onclick="$('option', $('#mount_select')).each(function(element) {$(this).removeAttr('selected').prop('selected', false); $('.selectpicker').selectpicker('refresh')});">{{ translate('panelConfig', 'noMounts', data['lang']) }}</button>
-                  <select id="mount_select" class="form-control selectpicker show-tick" data-icon-base="fas" data-tick-icon="fa-check" multiple data-style="custom-picker">
+                  <button type="button" class="btn btn-outline-default custom-picker"
+                    onclick="$('option', $('#mount_select')).each(function(element) {$(this).removeAttr('selected').prop('selected', false); $('.selectpicker').selectpicker('refresh')});">{{
+                    translate('panelConfig', 'noMounts', data['lang']) }}</button>
+                  <select id="mount_select" class="form-control selectpicker show-tick" data-icon-base="fas"
+                    data-tick-icon="fa-check" multiple data-style="custom-picker">
                     {% for mount in data['all_partitions'] %}
                     {% if mount in item[1] %}
                     <option selected>{{mount}}</option>
@@ -96,10 +105,13 @@
                     {% end %}
                     {% end %}
                   </select>
-                  <textarea id="monitored_mounts" name="{{item[0]}}" class="form-control list hidden" rows="{{ len(data['all_partitions']) }}" value="{{','.join(item[1])}}" hidden>{{','.join(item[1])}}</textarea>
+                  <textarea id="monitored_mounts" name="{{item[0]}}" class="form-control list hidden"
+                    rows="{{ len(data['all_partitions']) }}" value="{{','.join(item[1])}}"
+                    hidden>{{','.join(item[1])}}</textarea>
                 </div>
                 {% elif isinstance(item[1], list) %}
-                <textarea id="{{item[0]}}" value="{{','.join(item[1])}}" type="text" name="{{item[0]}}" class="form-control list">{{','.join(item[1])}}</textarea>
+                <textarea id="{{item[0]}}" value="{{','.join(item[1])}}" type="text" name="{{item[0]}}"
+                  class="form-control list">{{','.join(item[1])}}</textarea>
                 {% elif isinstance(item[1], bool) %}
                 <div style="margin-left: 30px;">
                   {% if item[1] == True %}
@@ -115,9 +127,11 @@
                   {% end %}
                 </div>
                 {% elif isinstance(item[1], int) %}
-                <input type="number" class="form-control" name="{{item[0]}}" id="{{item[0]}}" value="{{ item[1]  }}" step="1" min="0" required>
+                <input type="number" class="form-control" name="{{item[0]}}" id="{{item[0]}}" value="{{ item[1]  }}"
+                  step="1" min="0" required>
                 {% else %}
-                <input type="text" class="form-control" name="{{item[0]}}" id="{{item[0]}}" value="{{ item[1]  }}" step="2" min="0" required>
+                <input type="text" class="form-control" name="{{item[0]}}" id="{{item[0]}}" value="{{ item[1]  }}"
+                  step="2" min="0" required>
                 {% end %}
               </div>
               {% end %}
@@ -155,9 +169,9 @@
 
 {% block js %}
 <script>
-    function replacer(key, value) {
+  function replacer(key, value) {
     if (key == "disabled_language_files") {
-      if (value == 0){
+      if (value == 0) {
         return []
       } else {
         return value
@@ -172,7 +186,7 @@
   $("#config-form").on("submit", async function (e) {
     e.preventDefault();
     $("#submit-status").html('<i class="fa fa-spinner fa-spin"></i>');
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let configForm = document.getElementById("config-form");
 
     let formData = new FormData(configForm);
@@ -185,10 +199,10 @@
     formDataObject.disabled_language_files = $('#lang_select').val();
     formDataObject.monitored_mounts = $('#mount_select').val();
     formDataObject.keywords = $('#keywords').val().split(",");
-    $('#config-form input[type="radio"]:checked').each(function() {
-      if ($(this).val() == 'True'){
+    $('#config-form input[type="radio"]:checked').each(function () {
+      if ($(this).val() == 'True') {
         formDataObject[this.name] = true;
-      }else{
+      } else {
         formDataObject[this.name] = false;
       }
     });
@@ -215,7 +229,7 @@
         message: responseData.error_data
       });
     }
-});
+  });
 
   function uuidv4() {
     return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
@@ -286,7 +300,7 @@
   });
 
   $('.clear-comm').click(function () {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     $.ajax({
       type: "POST",
       headers: { 'X-XSRFToken': token },
@@ -297,7 +311,7 @@
   })
 
   $('.delete-photo').click(function () {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let photo = $('#photo').find(":selected").val();
     $.ajax({
       type: "POST",
@@ -310,7 +324,7 @@
   })
 
   $('.select-photo').click(function () {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let photo = $('#photo').find(":selected").val();
     $.ajax({
       type: "POST",
diff --git a/app/frontend/templates/panel/custom_login.html b/app/frontend/templates/panel/custom_login.html
index 87e6d081..0f2f6c10 100644
--- a/app/frontend/templates/panel/custom_login.html
+++ b/app/frontend/templates/panel/custom_login.html
@@ -62,11 +62,14 @@
                         <div class="form-group">
                           <div id="upload_input" class="input-group">
                             <div class="custom-file">
-                              <input type="file" class="custom-file-input" id="file" name="file" multiple="false" required>
-                              <label id="fileLabel" class="custom-file-label" for="file">{{ translate('customLogin', 'labelLoginImage', data['lang']) }}</label>
+                              <input type="file" class="custom-file-input" id="file" name="file" multiple="false"
+                                required>
+                              <label id="fileLabel" class="custom-file-label" for="file">{{ translate('customLogin',
+                                'labelLoginImage', data['lang']) }}</label>
                             </div>
                             <div class="input-group-append">
-                              <button type="button" class="btn btn-info upload-button" id="upload-button" onclick="sendFile()" disabled>UPLOAD</button>
+                              <button type="button" class="btn btn-info upload-button" id="upload-button"
+                                onclick="sendFile()" disabled>UPLOAD</button>
                             </div>
                           </div>
                         </div>
@@ -81,7 +84,8 @@
                           <div class="form-group row">
                             <label for="photo" class="col-sm-6 col-form-label">Selected Background Image</label>
                             <div class="col-sm-6">
-                              <select class="form-select form-control form-control-lg select-css form-control-plaintext" id="photo" name="photo" form="photo_form" onchange="updateBackgroundPreview()">
+                              <select class="form-select form-control form-control-lg select-css form-control-plaintext"
+                                id="photo" name="photo" form="photo_form" onchange="updateBackgroundPreview()">
                                 {% for image in data["backgrounds"] %}
                                 <option value="{{image}}">{{image}}</option>
                                 {% end %}
@@ -90,7 +94,9 @@
                           </div>
                           <div id="photo_loading" class="form-group" hidden>
                             <div class="progress">
-                              <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i class="fa-solid fa-spinner"></i></div>
+                              <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar"
+                                aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i
+                                  class="fa-solid fa-spinner"></i></div>
                             </div>
                           </div>
                           <div class="form-group row">
@@ -98,11 +104,13 @@
                               data['lang']) }}</label>
                             <label class="col-sm-1" id="opacityValue">{{ data['login_opacity'] }}%</label>
                             <div class="range col-sm-8">
-                              <input type="range" class="form-control-range" id="modal_opacity" name="modal_opacity" onchange="previewOpacity()" min="0" max="100" value="{{ data['login_opacity'] }}">
+                              <input type="range" class="form-control-range" id="modal_opacity" name="modal_opacity"
+                                onchange="previewOpacity()" min="0" max="100" value="{{ data['login_opacity'] }}">
                             </div>
                           </div>
                           <div id="login_preview" style="position: relative;">
-                            <img id="bg-preview" src="../../static/assets/images/auth/{{ data['background'] }}" class="img-fluid" alt="Responsive image">
+                            <img id="bg-preview" src="../../static/assets/images/auth/{{ data['background'] }}"
+                              class="img-fluid" alt="Responsive image">
                             <div id="login-form-preview">
                               <div id="login-form-background" class="auto-form-wrapper login-modal">
                                 <div class="text-center auto-form-logo">
@@ -166,17 +174,20 @@
                                 </style>
 
                                 <div id="login_form_data">
-                                  <input type="hidden" name="_xsrf" value="2|1d603267|809fb6bd82f677d440e484dde7c3a310|1671726040" disabled>
+                                  <input type="hidden" name="_xsrf"
+                                    value="2|1d603267|809fb6bd82f677d440e484dde7c3a310|1671726040" disabled>
                                   <div class="form-group">
                                     <label class="label">Username</label>
                                     <div class="input-group">
-                                      <input type="text" class="form-control login-text-input login-input" placeholder="Username" name="username" id="username" required="true" disabled>
+                                      <input type="text" class="form-control login-text-input login-input"
+                                        placeholder="Username" name="username" id="username" required="true" disabled>
                                     </div>
                                   </div>
                                   <div class="form-group">
                                     <label class="label">Password</label>
                                     <div class="input-group">
-                                      <input type="password" class="form-control login-text-input login-input" placeholder="Password" name="password" id="password" required="true" disabled>
+                                      <input type="password" class="form-control login-text-input login-input"
+                                        placeholder="Password" name="password" id="password" required="true" disabled>
                                     </div>
                                   </div>
                                   <div class="form-group">
@@ -195,7 +206,8 @@
                                     <a href="#" class="text-small forgot-password" disabled>Forgot Password</a>
                                   </div>
                                   <div class="text-block text-center my-3">
-                                    <span class="text-small font-weight-semibold"><a href="https://craftycontrol.com/">Crafty Control
+                                    <span class="text-small font-weight-semibold"><a
+                                        href="https://craftycontrol.com/">Crafty Control
                                         4.0.20</a> </span>
                                   </div>
                                 </div>
@@ -299,48 +311,48 @@
 
   $('.delete-photo').click(async function () {
     let photo = $('#photo').find(":selected").val();
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/crafty/config/customize`, {
-        method: 'DELETE',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"photo": photo}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        window.location.reload();
-      } else {
+      method: 'DELETE',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "photo": photo }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      window.location.reload();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   })
 
   $('.select-photo').click(async function () {
     let photo = $('#photo').find(":selected").val();
     let opacity = $('#modal_opacity').val();
-    console.log(JSON.stringify({"photo": photo, "opacity": opacity}))
-    var token = getCookie("_xsrf")
+    console.log(JSON.stringify({ "photo": photo, "opacity": opacity }))
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/crafty/config/customize`, {
-        method: 'PATCH',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"photo": photo, "opacity": opacity}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        window.location.reload();
-      } else {
+      method: 'PATCH',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "photo": photo, "opacity": opacity }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      window.location.reload();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   })
 
   $(document).ready(function () {
@@ -375,7 +387,7 @@
     file = $("#file")[0].files[0]
     document.getElementById("upload_input").innerHTML = '<div class="progress" style="width: 100%"><div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i class="fa-solid fa-spinner"></i></div></div>';
     let xmlHttpRequest = new XMLHttpRequest();
-    let token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let fileName = file.name
     let target = '/upload'
     let mimeType = file.type
diff --git a/app/frontend/templates/panel/panel_config.html b/app/frontend/templates/panel/panel_config.html
index 22cf7998..eded1165 100644
--- a/app/frontend/templates/panel/panel_config.html
+++ b/app/frontend/templates/panel/panel_config.html
@@ -327,30 +327,29 @@
   }
 
   $("#server-path").submit(async function (e) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     e.preventDefault();
 
     $("#submit-status").html('<i class="fa fa-spinner fa-spin"></i>');
 
     let path = $("#global_server_path").val();
-    var token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/crafty/config/servers_dir`, {
-        method: 'PATCH',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"new_dir": path}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        return
-      } else {
+      method: 'PATCH',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "new_dir": path }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      return
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   });
 
   $(document).ready(function () {
diff --git a/app/frontend/templates/panel/panel_edit_role.html b/app/frontend/templates/panel/panel_edit_role.html
index f614b7a3..3abb12a3 100644
--- a/app/frontend/templates/panel/panel_edit_role.html
+++ b/app/frontend/templates/panel/panel_edit_role.html
@@ -355,7 +355,7 @@
   }
 
   async function del_role(){
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/roles/${roleId}`, {
         method: "DELETE",
         headers: {
@@ -376,7 +376,7 @@
 
     $("#role_form").on("submit", async function (e) {
       e.preventDefault();
-      var token = getCookie("_xsrf")
+      const token = getCookie("_xsrf")
       let roleForm = document.getElementById("role_form");
 
       let server_ids = $('.access').map(function() {
diff --git a/app/frontend/templates/panel/panel_edit_user.html b/app/frontend/templates/panel/panel_edit_user.html
index 959987a9..39979b6d 100644
--- a/app/frontend/templates/panel/panel_edit_user.html
+++ b/app/frontend/templates/panel/panel_edit_user.html
@@ -395,7 +395,7 @@ data['lang']) }}{% end %}
       if (!password){
         return;
       }
-      var token = getCookie("_xsrf")
+      const token = getCookie("_xsrf")
       let userForm = document.getElementById("user_form");
 
       let disabled_flag = false;
@@ -494,7 +494,7 @@ data['lang']) }}{% end %}
       callback: async function (result) {
         console.log(result);
         if (result === true) {
-            var token = getCookie("_xsrf")
+            const token = getCookie("_xsrf")
             let res = await fetch(`/api/v2/users/${userId}`, {
               method: "DELETE",
               headers: {
diff --git a/app/frontend/templates/panel/panel_edit_user_apikeys.html b/app/frontend/templates/panel/panel_edit_user_apikeys.html
index 34e0d23b..c08b5518 100644
--- a/app/frontend/templates/panel/panel_edit_user_apikeys.html
+++ b/app/frontend/templates/panel/panel_edit_user_apikeys.html
@@ -199,7 +199,7 @@
     $(document).ready(function () {
         $("#user_api_form").on("submit", async function (e) {
             e.preventDefault();
-            var token = getCookie("_xsrf")
+            const token = getCookie("_xsrf")
             let apiForm = document.getElementById("user_api_form");
 
             let formData = new FormData(apiForm);
@@ -269,7 +269,7 @@
         $('.delete-api-key').click(async function () {
             let keyId = $(this).data("key-id");
             let keyName = $(this).data("key-name");
-            let token = getCookie("_xsrf");
+            const token = getCookie("_xsrf");
             let res = await fetch(`/api/v2/users/${userId}/key/${keyId}`, {
                 method: 'DELETE',
                 headers: {
@@ -290,7 +290,7 @@
         $('.get-a-token').click(async function () {
             let keyId = $(this).data("key-id");
             let keyName = $(this).data("key-name");
-            let token = getCookie("_xsrf");
+            const token = getCookie("_xsrf");
             let res = await fetch(`/api/v2/users/${userId}/key/${keyId}`, {
                 method: 'GET',
                 headers: {
diff --git a/app/frontend/templates/panel/server_admin_controls.html b/app/frontend/templates/panel/server_admin_controls.html
index b7b8d5a2..c021f310 100644
--- a/app/frontend/templates/panel/server_admin_controls.html
+++ b/app/frontend/templates/panel/server_admin_controls.html
@@ -87,7 +87,7 @@
 
   async function send_command_to_server(command) {
     console.log(command)
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     console.log('sending command: ' + command)
 
     let res = await fetch(`/api/v2/servers/${serverId}/stdin`, {
diff --git a/app/frontend/templates/panel/server_config.html b/app/frontend/templates/panel/server_config.html
index dec4fec6..08c426e8 100644
--- a/app/frontend/templates/panel/server_config.html
+++ b/app/frontend/templates/panel/server_config.html
@@ -304,7 +304,7 @@
   });
 
   function deleteServerE(callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     $.ajax({
       type: "DELETE",
       headers: { 'X-XSRFToken': token },
@@ -318,7 +318,7 @@
     });
   }
   function deleteServerFilesE(path, callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     $.ajax({
       type: "DELETE",
       headers: { 'X-XSRFToken': token },
@@ -334,7 +334,7 @@
 
   function send_command(serverId, command) {
     //<!--  this getCookie function is in base.html-->
-    var token = getCookie("_xsrf");
+    const token = getCookie("_xsrf");
     if (command == "update_executable") {
       document.getElementById("update-spinner").style.visibility = "visible";
     }
@@ -460,7 +460,7 @@
           return;
         }
         else {
-          var token = getCookie("_xsrf")
+          const token = getCookie("_xsrf")
           setTimeout(function () { window.location = '/panel/dashboard'; }, 5000);
           bootbox.dialog({
             backdrop: true,
@@ -549,7 +549,7 @@
     });
     $("#config_form").on("submit", async function (e) {
       e.preventDefault();
-      var token = getCookie("_xsrf")
+      const token = getCookie("_xsrf")
       let configForm = document.getElementById("config_form");
 
       let formData = new FormData(configForm);
diff --git a/app/frontend/templates/panel/server_files.html b/app/frontend/templates/panel/server_files.html
index 46ca0a86..77cc2353 100644
--- a/app/frontend/templates/panel/server_files.html
+++ b/app/frontend/templates/panel/server_files.html
@@ -401,33 +401,33 @@
   let path = '', serverFileContent = '';
 
   async function clickOnFile(event) {
-    var token = getCookie("_xsrf");
+    const token = getCookie("_xsrf");
     path = event.target.getAttribute('data-path');
     let res = await fetch(`/api/v2/servers/${serverId}/files`, {
-        method: 'POST',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"page": "files", "path": path}),
-      });
-      let responseData = await res.json();
-      console.log(responseData)
-      if (responseData.status === "ok") {
-        console.log('Got File Contents From Server');
-          $('#editorParent').toggle(true) // show
-          $('#fileError').toggle(false)   // hide
-          setFileName(event.target.innerText);
-          editor.session.setValue(responseData.data);
-          serverFileContent = responseData.data;
-          setSaveStatus(true);
-        }
-      else {
+      method: 'POST',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "page": "files", "path": path }),
+    });
+    let responseData = await res.json();
+    console.log(responseData)
+    if (responseData.status === "ok") {
+      console.log('Got File Contents From Server');
+      $('#editorParent').toggle(true) // show
+      $('#fileError').toggle(false)   // hide
+      setFileName(event.target.innerText);
+      editor.session.setValue(responseData.data);
+      serverFileContent = responseData.data;
+      setSaveStatus(true);
+    }
+    else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
   function setFileName(name) {
@@ -584,143 +584,143 @@
   async function save() {
     let text = editor.session.getValue();
 
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/servers/${serverId}/files`, {
-        method: 'PATCH',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"path": path, "contents": text}),
+      method: 'PATCH',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "path": path, "contents": text }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      serverFileContent = text;
+      setSaveStatus(true)
+
+    } else {
+
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
       });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        serverFileContent = text;
-        setSaveStatus(true)
-
-      } else {
-
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+    }
   }
 
   async function createFile(parent, name, callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/servers/${serverId}/files/create/`, {
-        method: 'PUT',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"parent": parent, "name": name, "directory": false}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        getTreeView($('#root_dir').data('path'));
-        setTreeViewContext();
-      } else {
+      method: 'PUT',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "parent": parent, "name": name, "directory": false }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      getTreeView($('#root_dir').data('path'));
+      setTreeViewContext();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
 
   async function createDir(parent, name, callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/servers/${serverId}/files/create/`, {
-        method: 'PUT',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"parent": parent, "name": name, "directory": true}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        getTreeView($('#root_dir').data('path'));
-        setTreeViewContext();
-      } else {
+      method: 'PUT',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "parent": parent, "name": name, "directory": true }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      getTreeView($('#root_dir').data('path'));
+      setTreeViewContext();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
   async function renameItem(path, name, callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/servers/${serverId}/files/create/`, {
-        method: 'PATCH',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"path": path, "new_name": name}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        getTreeView($('#root_dir').data('path'));
-        setTreeViewContext();
-      } else {
+      method: 'PATCH',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "path": path, "new_name": name }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      getTreeView($('#root_dir').data('path'));
+      setTreeViewContext();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
   async function deleteItem(path, el, callback) {
-    var token = getCookie("_xsrf");
+    const token = getCookie("_xsrf");
     let res = await fetch(`/api/v2/servers/${serverId}/files`, {
-        method: 'DELETE',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"filename": path}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        el = document.getElementById(path + "li");
-        $(el).remove();
-        document.getElementById('files-tree-nav').style.display = 'none';
-      } else {
+      method: 'DELETE',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "filename": path }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      el = document.getElementById(path + "li");
+      $(el).remove();
+      document.getElementById('files-tree-nav').style.display = 'none';
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
   async function unZip(path, callback) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let res = await fetch(`/api/v2/servers/${serverId}/files/zip/`, {
-        method: 'POST',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"folder": path}),
-      });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        getTreeView($('#root_dir').data('path'));
-        setTreeViewContext();
-      } else {
+      method: 'POST',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "folder": path }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      getTreeView($('#root_dir').data('path'));
+      setTreeViewContext();
+    } else {
 
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
   async function sendFile(file, path, serverId, left, i, onProgress) {
     let xmlHttpRequest = new XMLHttpRequest();
-    let token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let fileName = file.name
     let target = '/upload?server_id=' + serverId
     let mimeType = file.type
@@ -903,54 +903,54 @@
     });
   }
 
-  function getDirView(event){
+  function getDirView(event) {
     let path = event.target.parentElement.getAttribute("data-path");
     if (document.getElementById(path).classList.contains('clicked')) {
       return;
-    }else{
+    } else {
       getTreeView(path);
     }
 
   }
-  async function getTreeView(path){
-    var token = getCookie("_xsrf");
+  async function getTreeView(path) {
+    const token = getCookie("_xsrf");
     let res = await fetch(`/api/v2/servers/${serverId}/files`, {
-        method: 'POST',
-        headers: {
-          'X-XSRFToken': token
-        },
-        body: JSON.stringify({"page": "files", "path": path}),
+      method: 'POST',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: JSON.stringify({ "page": "files", "path": path }),
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      console.log(responseData);
+      process_tree_response(responseData);
+
+    } else {
+
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
       });
-      let responseData = await res.json();
-      if (responseData.status === "ok") {
-        console.log(responseData);
-        process_tree_response(responseData);
-
-      } else {
-
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
-      }
+    }
   }
 
   function process_tree_response(response) {
     let path = response.data.root_path.path;
     let text = ``;
-    if (!response.data.root_path.top){
+    if (!response.data.root_path.top) {
       text = `<ul class="tree-nested d-block" id="${path}ul">`;
     }
-      Object.entries(response.data).forEach(([key, value]) => {
-        if (key === "root_path" || key === "db_stats"){
-          //continue is not valid in for each. Return acts as a continue.
-          return;
-        }
+    Object.entries(response.data).forEach(([key, value]) => {
+      if (key === "root_path" || key === "db_stats") {
+        //continue is not valid in for each. Return acts as a continue.
+        return;
+      }
       let checked = ""
       let dpath = value.path;
       let filename = key;
-      if (value.dir){
-        if (value.excluded){
+      if (value.dir) {
+        if (value.excluded) {
           checked = "checked"
         }
         text += `<li class="tree-item" id="${dpath}li" data-path="${dpath}">
@@ -962,7 +962,7 @@
                             ${filename}
                             </span>
                             </input></div></li>`
-      }else{
+      } else {
         text += `<li
                         class="d-block tree-ctx-item tree-file"
                         data-path="${dpath}"
@@ -971,33 +971,33 @@
                         <i class="far fa-file"></i></span></input>${filename}</li>`
       }
     });
-    if (! response.data.root_path.top){
+    if (!response.data.root_path.top) {
       text += `</ul>`;
     }
-    if(response.data.root_path.top){
+    if (response.data.root_path.top) {
       try {
-          document.getElementById('main-tree-div').innerHTML += text;
-          document.getElementById('main-tree').parentElement.classList.add("clicked");
-        } catch {
-          document.getElementById('files-tree').innerHTML = text;
-        }
-    }else{
+        document.getElementById('main-tree-div').innerHTML += text;
+        document.getElementById('main-tree').parentElement.classList.add("clicked");
+      } catch {
+        document.getElementById('files-tree').innerHTML = text;
+      }
+    } else {
       try {
-            document.getElementById(path + "span").classList.add('tree-caret-down');
-            document.getElementById(path).innerHTML += text;
-            document.getElementById(path).classList.add("clicked");
-          } catch {
-            console.log("Bad")
-          }
+        document.getElementById(path + "span").classList.add('tree-caret-down');
+        document.getElementById(path).innerHTML += text;
+        document.getElementById(path).classList.add("clicked");
+      } catch {
+        console.log("Bad")
+      }
 
-          var toggler = document.getElementById(path + "span");
+      var toggler = document.getElementById(path + "span");
 
-          if (toggler.classList.contains('files-tree-title')) {
-            document.getElementById(path + "span").addEventListener("click", function caretListener() {
-              document.getElementById(path + "ul").classList.toggle("d-block");
-              document.getElementById(path + "span").classList.toggle("tree-caret-down");
-            });
-          }
+      if (toggler.classList.contains('files-tree-title')) {
+        document.getElementById(path + "span").addEventListener("click", function caretListener() {
+          document.getElementById(path + "ul").classList.toggle("d-block");
+          document.getElementById(path + "span").classList.toggle("tree-caret-down");
+        });
+      }
     }
     setTimeout(function () { setTreeViewContext() }, 1000);
   }
diff --git a/app/frontend/templates/panel/server_logs.html b/app/frontend/templates/panel/server_logs.html
index 9388c2d8..df654ce1 100644
--- a/app/frontend/templates/panel/server_logs.html
+++ b/app/frontend/templates/panel/server_logs.html
@@ -189,10 +189,10 @@
   // Populate logs and filter if present
   const serverId = new URLSearchParams(document.location.search).get('id')
   async function get_server_log() {
-    var token = getCookie("_xsrf")
-    let colors=true;
+    const token = getCookie("_xsrf")
+    let colors = true;
     if (!$("#stop_scroll").is(':checked')) {
-    let res = await fetch(`/api/v2/servers/${serverId}/logs?colors=${colors}`, {
+      let res = await fetch(`/api/v2/servers/${serverId}/logs?colors=${colors}`, {
         method: 'GET',
         headers: {
           'X-XSRFToken': token
@@ -201,7 +201,7 @@
       let responseData = await res.json();
       html = ``
       if (responseData.status === "ok") {
-        for(i=0; i < responseData.data.length; i++) {
+        for (i = 0; i < responseData.data.length; i++) {
           html += `<span class='box'>${responseData.data[i]}<br /></span>`
         }
         console.log('Got Log From Server')
@@ -216,7 +216,7 @@
           message: responseData.error
         });
       }
-  }
+    }
   }
   $(document).ready(function () {
     console.log("ready!");
@@ -224,4 +224,4 @@
     populateWords();
   });
 </script>
-{% end %}
+{% end %}
\ No newline at end of file
diff --git a/app/frontend/templates/panel/server_schedule_edit.html b/app/frontend/templates/panel/server_schedule_edit.html
index ebded95e..b1260770 100644
--- a/app/frontend/templates/panel/server_schedule_edit.html
+++ b/app/frontend/templates/panel/server_schedule_edit.html
@@ -260,7 +260,7 @@
       console.log("ready!");
       $("#new_schedule_form").on("submit", async function (e) {
       e.preventDefault();
-      var token = getCookie("_xsrf")
+      const token = getCookie("_xsrf")
       let schForm = document.getElementById("new_schedule_form");
 
       let formData = new FormData(schForm);
@@ -305,7 +305,7 @@
 
     $("#schedule_form").on("submit", async function (e) {
       e.preventDefault();
-      var token = getCookie("_xsrf")
+      const token = getCookie("_xsrf")
       let schForm = document.getElementById("schedule_form");
 
       let formData = new FormData(schForm);
diff --git a/app/frontend/templates/panel/server_schedules.html b/app/frontend/templates/panel/server_schedules.html
index 78e43bb2..586c6ae4 100644
--- a/app/frontend/templates/panel/server_schedules.html
+++ b/app/frontend/templates/panel/server_schedules.html
@@ -47,14 +47,20 @@
                   <h4 class="card-title"><i class="fas fa-calendar"></i> {{ translate('serverSchedules',
                     'scheduledTasks', data['lang']) }} </h4>
                   {% if data['user_data']['hints'] %}
-                  <span class="too_small" title="{{ translate('serverSchedules', 'cannotSee', data['lang']) }}" , data-content="{{ translate('serverSchedules', 'cannotSeeOnMobile', data['lang']) }}" , data-placement="bottom"></span>
+                  <span class="too_small" title="{{ translate('serverSchedules', 'cannotSee', data['lang']) }}" ,
+                    data-content="{{ translate('serverSchedules', 'cannotSeeOnMobile', data['lang']) }}" ,
+                    data-placement="bottom"></span>
                   {% end %}
                   <div>
-                    <button onclick="location.href=`/panel/add_schedule?id={{ data['server_stats']['server_id']['server_id'] }}`" class="btn btn-info">{{ translate('serverSchedules', 'create', data['lang']) }}<i class="fas fa-pencil-alt"></i></button>
+                    <button
+                      onclick="location.href=`/panel/add_schedule?id={{ data['server_stats']['server_id']['server_id'] }}`"
+                      class="btn btn-info">{{ translate('serverSchedules', 'create', data['lang']) }}<i
+                        class="fas fa-pencil-alt"></i></button>
                   </div>
                 </div>
                 <div class="card-body">
-                  <table class="table table-hover d-none d-lg-block responsive-table" id="schedule_table" width="100%" style="table-layout:fixed;">
+                  <table class="table table-hover d-none d-lg-block responsive-table" id="schedule_table" width="100%"
+                    style="table-layout:fixed;">
                     <thead>
                       <tr class="rounded">
                         <th style="width: 2%; min-width: 10px;">{{ translate('serverSchedules', 'name', data['lang']) }}
@@ -101,10 +107,14 @@
                           <p>{{schedule.next_run}}</p>
                         </td>
                         <td id="{{schedule.enabled}}" class="action">
-                          <input style="width: 10px !important;" type="checkbox" class="schedule-enabled-toggle" data-schedule-id="{{schedule.schedule_id}}" data-schedule-enabled="{{ 'true' if schedule.enabled else 'false' }}">
+                          <input style="width: 10px !important;" type="checkbox" class="schedule-enabled-toggle"
+                            data-schedule-id="{{schedule.schedule_id}}"
+                            data-schedule-enabled="{{ 'true' if schedule.enabled else 'false' }}">
                         </td>
                         <td id="{{schedule.action}}" class="action">
-                          <button onclick="window.location.href='/panel/edit_schedule?id={{ data['server_stats']['server_id']['server_id'] }}&sch_id={{schedule.schedule_id}}'" class="btn btn-info">
+                          <button
+                            onclick="window.location.href='/panel/edit_schedule?id={{ data['server_stats']['server_id']['server_id'] }}&sch_id={{schedule.schedule_id}}'"
+                            class="btn btn-info">
                             <i class="fas fa-pencil-alt"></i>
                           </button>
                           <br>
@@ -118,7 +128,8 @@
                     </tbody>
                   </table>
                   <hr />
-                  <table class="table table-hover d-block d-lg-none" id="mini_schedule_table" width="100%" style="table-layout:fixed;">
+                  <table class="table table-hover d-block d-lg-none" id="mini_schedule_table" width="100%"
+                    style="table-layout:fixed;">
                     <thead>
                       <tr class="rounded">
                         <th style="width: 25%; min-width: 50px;">{{ translate('serverSchedules', 'action', data['lang'])
@@ -151,7 +162,8 @@
                         </td>
                       </tr>
                       <!-- Modal -->
-                      <div class="modal fade" id="task_details_{{schedule.schedule_id}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
+                      <div class="modal fade" id="task_details_{{schedule.schedule_id}}" tabindex="-1" role="dialog"
+                        aria-labelledby="exampleModalLabel" aria-hidden="true">
                         <div class="modal-dialog" role="document">
                           <div class="modal-content">
                             <div class="modal-header">
@@ -198,14 +210,19 @@
                                   <p>zzzzzzz</p>
                                   {% end %}
                                 </li>
-                                <li id="{{schedule.enabled}}" class="action" style="border-top: .1em solid gray; border-bottom: .1em solid gray">
+                                <li id="{{schedule.enabled}}" class="action"
+                                  style="border-top: .1em solid gray; border-bottom: .1em solid gray">
                                   <h4>{{ translate('serverSchedules', 'enabled', data['lang']) }}</h4>
-                                  <input type="checkbox" class="schedule-enabled-toggle" data-schedule-id="{{schedule.schedule_id}}" data-schedule-enabled="{{ 'true' if schedule.enabled else 'false' }}">
+                                  <input type="checkbox" class="schedule-enabled-toggle"
+                                    data-schedule-id="{{schedule.schedule_id}}"
+                                    data-schedule-enabled="{{ 'true' if schedule.enabled else 'false' }}">
                                 </li>
                               </ul>
                             </div>
                             <div class="modal-footer">
-                              <button onclick="window.location.href='/panel/edit_schedule?id={{ data['server_stats']['server_id']['server_id'] }}&sch_id={{schedule.schedule_id}}'" class="btn btn-info">
+                              <button
+                                onclick="window.location.href='/panel/edit_schedule?id={{ data['server_stats']['server_id']['server_id'] }}&sch_id={{schedule.schedule_id}}'"
+                                class="btn btn-info">
                                 <i class="fas fa-pencil-alt"></i> {{ translate('serverSchedules', 'edit', data['lang'])
                                 }}
                               </button>
@@ -393,7 +410,7 @@
   });
 
   async function del_task(sch_id, id) {
-    var token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
 
     let res = await fetch(`/api/v2/servers/${id}/tasks/${sch_id}`, {
       method: 'DELETE',
diff --git a/app/frontend/templates/panel/server_term.html b/app/frontend/templates/panel/server_term.html
index 41d974d2..37f923c1 100644
--- a/app/frontend/templates/panel/server_term.html
+++ b/app/frontend/templates/panel/server_term.html
@@ -46,15 +46,15 @@
 
             <div class="input-group">
               <div id="virt_console" class=""
-                   style="width: 100%; font-size: .8em; padding: 5px 10px; border: 1px solid var(--outline); background-color:var(--card-banner-bg);height:500px; overflow: scroll;">
+                style="width: 100%; font-size: .8em; padding: 5px 10px; border: 1px solid var(--outline); background-color:var(--card-banner-bg);height:500px; overflow: scroll;">
               </div>
             </div>
             <br />
 
             <div style="gap: 0.5rem;" class="input-group flex-wrap">
               <input style="min-width: 10rem;" type="text" class="form-control" id="server_command"
-                     name="server_command" placeholder="{{ translate('serverTerm', 'commandInput', data['lang']) }}"
-                     autofocus="">
+                name="server_command" placeholder="{{ translate('serverTerm', 'commandInput', data['lang']) }}"
+                autofocus="">
               <span class="input-group-btn ml-5">
                 <button id="submit" class="btn btn-sm btn-info" type="button">{{ translate('serverTerm', 'sendCommand',
                   data['lang']) }}</button>
@@ -63,73 +63,74 @@
             {% if data['permissions']['Commands'] in data['user_permissions'] %}
             {% if data['importing'] and data['server_stats']['running']%}
             <div id="update_control_buttons"
-                 class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
-                 style="visibility: visible">
+              class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
+              style="visibility: visible">
               <button onclick="" id="start-btn" style="max-width: 7rem;"
-                      class="btn btn-warning m-1 flex-grow-1 disabled"><i
-                   class="fa fa-spinner fa-spin"></i>&nbsp;{{translate('serverTerm', 'installing', data['lang']) }}</button>
+                class="btn btn-warning m-1 flex-grow-1 disabled"><i
+                  class="fa fa-spinner fa-spin"></i>&nbsp;{{translate('serverTerm', 'installing', data['lang'])
+                }}</button>
               <button onclick="" id="restart-btn" style="max-width: 7rem;"
-                      class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
+                class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
                 data['lang']) %}</button>
               <button onclick="" id="stop-btn" style="max-width: 7rem;"
-                      class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
+                class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
                 }}</button>
             </div>
             {% elif data['server_stats']['updating']%}
             <div id="update_control_buttons"
-                 class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
-                 style="visibility: visible">
+              class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
+              style="visibility: visible">
               <button onclick="" id="start-btn" style="max-width: 7rem;"
-                      class="btn btn-warning m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i>&nbsp;{{
+                class="btn btn-warning m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i>&nbsp;{{
                 translate('serverTerm', 'updating', data['lang']) }}</button>
               <button onclick="" id="restart-btn" style="max-width: 7rem;"
-                      class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
+                class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
                 data['lang']) %}</button>
               <button onclick="" id="stop-btn" style="max-width: 7rem;"
-                      class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
+                class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
                 }}</button>
             </div>
             {% elif data['waiting_start'] %}
             <div id="control_buttons"
-                 class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
-                 style="visibility: visible">
+              class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
+              style="visibility: visible">
               <button onclick="" id="start-btn" style="max-width: 7rem; white-space: nowrap;"
-                      class="btn btn-secondary m-1 flex-grow-1 disabled" data-toggle="tooltip"
-                      title="{{ translate('serverTerm', 'delay-explained', data['lang'])}}">{{ translate('serverTerm',
+                class="btn btn-secondary m-1 flex-grow-1 disabled" data-toggle="tooltip"
+                title="{{ translate('serverTerm', 'delay-explained', data['lang'])}}">{{ translate('serverTerm',
                 'starting', data['lang']) }}</button>
               <button onclick="" id="restart-btn" style="max-width: 7rem;"
-                      class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
+                class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
                 data['lang']) %}</button>
               <button onclick="" id="stop-btn" style="max-width: 7rem;"
-                      class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
+                class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
                 }}</button>
             </div>
             {% elif data['importing'] %}
             <div id="control_buttons"
-                 class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
-                 style="visibility: visible">
+              class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
+              style="visibility: visible">
               <button onclick="" id="start-btn" style="max-width: 12rem; white-space: nowrap;"
-                      class="btn btn-secondary m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i> {{
+                class="btn btn-secondary m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i> {{
                 translate('serverTerm', 'importing',
                 data['lang']) }}</button>
               <button onclick="" id="restart-btn" style="max-width: 7rem;"
-                      class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
+                class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
                 data['lang']) %}</button>
               <button onclick="" id="stop-btn" style="max-width: 7rem;"
-                      class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
+                class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
                 }}</button>
             </div>
             {% else %}
             <div id="control_buttons"
-                 class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
-                 style="visibility: visible">
+              class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
+              style="visibility: visible">
               <button onclick="send_command(serverId, 'start_server');" id="start-btn" style="max-width: 7rem;"
-                      class="btn btn-primary m-1 flex-grow-1">{{ translate('serverTerm', 'start', data['lang']) }}</button>
+                class="btn btn-primary m-1 flex-grow-1">{{ translate('serverTerm', 'start', data['lang']) }}</button>
               <button onclick="send_command(serverId, 'restart_server');" id="restart-btn" style="max-width: 7rem;"
-                      class="btn btn-outline-primary m-1 flex-grow-1">{% raw translate('serverTerm', 'restart', data['lang'])
+                class="btn btn-outline-primary m-1 flex-grow-1">{% raw translate('serverTerm', 'restart', data['lang'])
                 %}</button>
               <button onclick="send_command(serverId, 'stop_server');" id="stop-btn" style="max-width: 7rem;"
-                      class="btn btn-danger m-1 flex-grow-1">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
+                class="btn btn-danger m-1 flex-grow-1">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
             </div>
             {% end %}
             {% end %}
@@ -150,7 +151,7 @@
     /* IE and Edge */
     scrollbar-width: none;
     /* Firefox */
-    font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
+    font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
     white-space: pre-wrap;
   }
 </style>
@@ -175,7 +176,7 @@
       stopBtn.setAttribute('disabled', 'disabled');
     }
     //<!--  this getCookie function is in base.html-->
-    var token = getCookie("_xsrf");
+    const token = getCookie("_xsrf");
 
     $.ajax({
       type: "POST",
@@ -230,30 +231,30 @@
   //{% end %}
 
   async function get_server_log() {
-    var token = getCookie("_xsrf")
-    let colors=true;
+    const token = getCookie("_xsrf")
+    let colors = true;
     let res = await fetch(`/api/v2/servers/${serverId}/logs?colors=${colors}`, {
-        method: 'GET',
-        headers: {
-          'X-XSRFToken': token
-        },
-      });
-      let responseData = await res.json();
-      html = ``
-      if (responseData.status === "ok") {
-        for(i=0; i < responseData.data.length; i++) {
-          html += `<span class='box'>${responseData.data[i]}<br /></span>`
-        }
-        console.log('Got Log From Server')
-        $('#virt_console').html(html);
-        scrollConsole();
-      } else {
-
-        bootbox.alert({
-          title: responseData.status,
-          message: responseData.error
-        });
+      method: 'GET',
+      headers: {
+        'X-XSRFToken': token
+      },
+    });
+    let responseData = await res.json();
+    html = ``
+    if (responseData.status === "ok") {
+      for (i = 0; i < responseData.data.length; i++) {
+        html += `<span class='box'>${responseData.data[i]}<br /></span>`
       }
+      console.log('Got Log From Server')
+      $('#virt_console').html(html);
+      scrollConsole();
+    } else {
+
+      bootbox.alert({
+        title: responseData.status,
+        message: responseData.error
+      });
+    }
   }
 
 
diff --git a/app/frontend/templates/server/bedrock_wizard.html b/app/frontend/templates/server/bedrock_wizard.html
index 6c9a3289..8eefcf68 100644
--- a/app/frontend/templates/server/bedrock_wizard.html
+++ b/app/frontend/templates/server/bedrock_wizard.html
@@ -96,8 +96,8 @@
               <div class="api-alert" style="position: absolute; top: -5px; z-index: 100; opacity: .99;">
                 <p style="color: white !important;"><i class="fas fa-exclamation-triangle"
                     style="color: red;"></i>&nbsp;{{ translate('error', 'bedrockError', data['lang']) }}<a
-                    style="color: red;" ; href="https://status.craftycontrol.com/status/craftycontrol"
-                    target="_blank" rel="noopener noreferrer">&nbsp;{{ translate('error', 'craftyStatus', data['lang']) }}</a>
+                    style="color: red;" ; href="https://status.craftycontrol.com/status/craftycontrol" target="_blank"
+                    rel="noopener noreferrer">&nbsp;{{ translate('error', 'craftyStatus', data['lang']) }}</a>
                   &nbsp;{{ translate('error', 'serverJars2', data['lang']) }}</p>
               </div>
               {% end %}
@@ -397,7 +397,8 @@
                     <div class="modal-body">
                       <div class="tree-ctx-item" id="main-tree-div-upload" data-path=""
                         style="overflow: scroll; max-height:75%;">
-                        <input type="radio" class="root-input" id="main-tree-input-upload" name="root_path" value="" checked>
+                        <input type="radio" class="root-input" id="main-tree-input-upload" name="root_path" value=""
+                          checked>
                         <span id="main-tree" class="files-tree-title tree-caret-down root-dir" data-path="">
                           <i class="far fa-folder"></i>
                           <i class="far fa-folder-open"></i>
@@ -529,7 +530,7 @@
     file = $("#file")[0].files[0]
     document.getElementById("upload_input").innerHTML = '<div class="progress" style="width: 100%;"><div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i class="fa-solid fa-spinner"></i></div></div>'
     let xmlHttpRequest = new XMLHttpRequest();
-    let token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     let fileName = encodeURIComponent(file.name)
     let target = '/upload'
     let mimeType = file.type
@@ -555,7 +556,7 @@
     xmlHttpRequest.addEventListener('load', (event) => {
       if (event.target.responseText == 'success') {
         console.log('Upload for file', file.name, 'was successful!')
-        document.getElementById("upload_input").innerHTML =  `<div class="card-header header-sm d-flex justify-content-between align-items-center" style="width: 100%;"><input value=${fileName} type="text" id="file-uploaded" disabled></input> 🔒</div>`;
+        document.getElementById("upload_input").innerHTML = `<div class="card-header header-sm d-flex justify-content-between align-items-center" style="width: 100%;"><input value=${fileName} type="text" id="file-uploaded" disabled></input> 🔒</div>`;
         document.getElementById("lower_half").style.visibility = "visible";
       }
       else {
@@ -585,7 +586,7 @@
       } else {
         document.getElementById('root_upload_button').classList.add('clicked')
       }
-      var token = getCookie("_xsrf");
+      const token = getCookie("_xsrf");
       var dialog = bootbox.dialog({
         message: '<p class="text-center mb-0"><i class="fa fa-spin fa-cog"></i> Please wait while we gather your files...</p>',
         closeButton: false
@@ -696,7 +697,7 @@
     return role_ids
   }
   async function send_server(data) {
-    let token = getCookie("_xsrf")
+    const token = getCookie("_xsrf")
     console.log(token)
     let res = await fetch(`/api/v2/servers/`, {
       method: 'POST',
diff --git a/app/frontend/templates/server/wizard.html b/app/frontend/templates/server/wizard.html
index 83205160..080fcb49 100644
--- a/app/frontend/templates/server/wizard.html
+++ b/app/frontend/templates/server/wizard.html
@@ -21,8 +21,9 @@
       <div class="card" id="creation_wizard">
         <div class="card-body">
           {% if data["server_api"] and data["online"] %}
-          <a href="https://serverjars.com/" target="_blank" alt="serverjars icon"><img src="../../static/assets/images/serverjars/ICON.svg"
-             style="float: right; width: 40px; position: relative;"></a>
+          <a href="https://serverjars.com/" target="_blank" alt="serverjars icon"><img
+              src="../../static/assets/images/serverjars/ICON.svg"
+              style="float: right; width: 40px; position: relative;"></a>
           {% end %}
 
           <h4>{{ translate('serverWizard', 'newServer', data['lang']) }}</h4>
@@ -71,7 +72,8 @@
                       <label for="server_jar">{{ translate('serverWizard', 'serverType', data['lang'])
                         }}</label>
                       <div class="input-group">
-                        <select required class="form-control form-control-lg select-css" id="server_jar" name="server_jar" onchange="serverJarChange(this)">
+                        <select required class="form-control form-control-lg select-css" id="server_jar"
+                          name="server_jar" onchange="serverJarChange(this)">
                           <option value="None">{{ translate('serverWizard', 'selectType', data['lang']) }}</option>
                           {% for s in data['server_types'] %}
                           <option value="{{ s }}">{{ s.capitalize() }}</option>
@@ -79,7 +81,8 @@
                         </select>
                         {% if data['super_user'] %}
                         <div class="input-group-append">
-                          <button class="btn custom-picker" type="button" onclick="refreshCache()"><i id="refresh-cache" class="refresh-class fas fa-sync"></i></button>
+                          <button class="btn custom-picker" type="button" onclick="refreshCache()"><i id="refresh-cache"
+                              class="refresh-class fas fa-sync"></i></button>
                         </div>
                         {% end %}
                       </div>
@@ -89,7 +92,8 @@
                   <div class="col-sm-12">
                     <div class="form-group">
                       <label for="server_type">{{ translate('serverWizard', 'serverSelect', data['lang']) }}</label>
-                      <select required class="form-control form-control-lg select-css" id="server_type" name="type" onchange="serverTypeChange(this)">
+                      <select required class="form-control form-control-lg select-css" id="server_type" name="type"
+                        onchange="serverTypeChange(this)">
                         <option value="">{{ translate('serverWizard', 'selectServer', data['lang']) }}</option>
                       </select>
                     </div>
@@ -107,13 +111,15 @@
                   <div class="col-sm-12">
                     <div class="form-group">
                       <label for="server_name">{{ translate('serverWizard', 'serverName', data['lang']) }}</label>
-                      <input type="text" class="form-control" id="server_name" name="name" placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
+                      <input type="text" class="form-control" id="server_name" name="name"
+                        placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
                     </div>
                   </div>
 
                 </div>
                 <br />
-                <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
+                <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small
+                    style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
                     data['lang']) }}</small></h4>
                 <hr>
                 <div class="row">
@@ -122,7 +128,8 @@
                     <div class="form-group">
                       <label for="min_memory1">{{ translate('serverWizard', 'minMem', data['lang']) }} <small> - {{
                           translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                      <input type="number" class="form-control" id="min_memory1" name="mem_min" value="1" step="0.5" min="0.5" required>
+                      <input type="number" class="form-control" id="min_memory1" name="mem_min" value="1" step="0.5"
+                        min="0.5" required>
                     </div>
                   </div>
 
@@ -130,7 +137,8 @@
                     <div class="form-group">
                       <label for="max_memory1">{{ translate('serverWizard', 'maxMem', data['lang']) }} <small> - {{
                           translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                      <input type="number" class="form-control" id="max_memory1" name="mem_max" value="2" step="0.5" min="0.5" required>
+                      <input type="number" class="form-control" id="max_memory1" name="mem_max" value="2" step="0.5"
+                        min="0.5" required>
                     </div>
                   </div>
 
@@ -138,7 +146,8 @@
                     <div class="form-group">
                       <label for="port1">{{ translate('serverWizard', 'serverPort', data['lang']) }} <small> - {{
                           translate('serverWizard', 'defaultPort', data['lang']) }}</small></label>
-                      <input type="number" class="form-control" id="port1" name="port" value="25565" step="1" min="1" max="65535 " required>
+                      <input type="number" class="form-control" id="port1" name="port" value="25565" step="1" min="1"
+                        max="65535 " required>
                     </div>
                   </div>
                   <div class="col-sm-12">
@@ -146,8 +155,10 @@
                       <div id="accordion-1">
                         <div class="card">
                           <div class="card-header p-2" id="Role-1">
-                            <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-1" aria-expanded="true" aria-controls="collapseRole-1">
-                              <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole', data['lang']) }}
+                            <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-1"
+                              aria-expanded="true" aria-controls="collapseRole-1">
+                              <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole', data['lang'])
+                              }}
                               <small style="text-transform: none;"> - {{ translate('serverWizard', 'autoCreate',
                                 data['lang']) }}</small>
                             </p>
@@ -156,7 +167,9 @@
                             <div class="card-body scroll">
                               <div class="form-group">
                                 {% for r in data['roles'] %}
-                                <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}" type="checkbox" value="{{ r['role_id'] }}">&nbsp; {{ r['role_name'].capitalize() }}</label></span>
+                                <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}"
+                                      type="checkbox" value="{{ r['role_id'] }}">&nbsp; {{ r['role_name'].capitalize()
+                                    }}</label></span>
                                 {% end %}
                               </div>
                             </div>
@@ -172,19 +185,24 @@
                 <button type="reset" class="btn btn-danger mr-2">{{ translate('serverWizard', 'resetForm', data['lang'])
                   }}</button>
               </fieldset>
-            </div>
-          </fieldset>
-          {% if not data["server_api"] and data["online"] %}
-          <div class="api-alert" style="position: absolute; top: -5px; z-index: 100; opacity: .99;">
-            <p style="color: white !important;"><i class="fas fa-exclamation-triangle" style="color: red;"></i>&nbsp;{{ translate('error', 'serverJars1', data['lang']) }}<a style="color: red;"; href="https://status.craftycontrol.com/status/craftycontrol" 
-              target="_blank">&nbsp;{{ translate('error', 'craftyStatus', data['lang']) }}</a>
-              &nbsp;{{ translate('error', 'serverJars2', data['lang']) }}</p></div>
-          {% end %}
-          {% if not data["online"] %}
-          <div class="api-alert" style="position: absolute; top: -5px; z-index: 100; opacity: .99;">
-            <p style="color: white !important;"><i class="fas fa-exclamation-triangle" style="color: red;"></i>&nbsp;{{ translate('error', 'noInternet', data['lang']) }}</p></div>
-          {% end %}
         </div>
+        </fieldset>
+        {% if not data["server_api"] and data["online"] %}
+        <div class="api-alert" style="position: absolute; top: -5px; z-index: 100; opacity: .99;">
+          <p style="color: white !important;"><i class="fas fa-exclamation-triangle" style="color: red;"></i>&nbsp;{{
+            translate('error', 'serverJars1', data['lang']) }}<a style="color: red;" ;
+              href="https://status.craftycontrol.com/status/craftycontrol" target="_blank">&nbsp;{{ translate('error',
+              'craftyStatus', data['lang']) }}</a>
+            &nbsp;{{ translate('error', 'serverJars2', data['lang']) }}</p>
+        </div>
+        {% end %}
+        {% if not data["online"] %}
+        <div class="api-alert" style="position: absolute; top: -5px; z-index: 100; opacity: .99;">
+          <p style="color: white !important;"><i class="fas fa-exclamation-triangle" style="color: red;"></i>&nbsp;{{
+            translate('error', 'noInternet', data['lang']) }}</p>
+        </div>
+        {% end %}
+      </div>
       </form>
     </div>
 
@@ -205,7 +223,8 @@
               <div class="col-sm-12">
                 <div class="form-group">
                   <label for="server_name">{{ translate('serverWizard', 'serverName', data['lang']) }}</label>
-                  <input type="text" class="form-control" id="server_name" name="name" value="" placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
+                  <input type="text" class="form-control" id="server_name" name="name" value=""
+                    placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
                 </div>
               </div>
 
@@ -213,14 +232,16 @@
                 <div class="form-group">
                   <label for="server">{{ translate('serverWizard', 'serverPath', data['lang']) }} <small>{{
                       translate('serverWizard', 'absoluteServerPath', data['lang']) }}</small></label>
-                  <input type="text" class="form-control" id="server_path" name="server_path" placeholder="/var/opt/server" required>
+                  <input type="text" class="form-control" id="server_path" name="server_path"
+                    placeholder="/var/opt/server" required>
                 </div>
               </div>
 
               <div class="col-sm-12">
                 <div class="form-group">
                   <label for="server_jar">{{ translate('serverWizard', 'serverJar', data['lang']) }}</label>
-                  <input type="text" class="form-control" id="server_jar" name="server_jar" value="" placeholder="paper.jar" required>
+                  <input type="text" class="form-control" id="server_jar" name="server_jar" value=""
+                    placeholder="paper.jar" required>
                 </div>
               </div>
 
@@ -228,7 +249,8 @@
 
             </div>
             <br />
-            <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
+            <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small
+                style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
                 data['lang']) }}</small></h4>
             <hr>
             <div class="row">
@@ -237,7 +259,8 @@
                 <div class="form-group">
                   <label for="min_memory2">{{ translate('serverWizard', 'minMem', data['lang']) }} <small> - {{
                       translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                  <input type="number" class="form-control" id="min_memory2" name="mem_min" value="1" step="0.5" min="0.5" required>
+                  <input type="number" class="form-control" id="min_memory2" name="mem_min" value="1" step="0.5"
+                    min="0.5" required>
                 </div>
               </div>
 
@@ -245,7 +268,8 @@
                 <div class="form-group">
                   <label for="max_memory2">{{ translate('serverWizard', 'maxMem', data['lang']) }} <small> - {{
                       translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                  <input type="number" class="form-control" id="max_memory2" name="mem_max" value="2" step="0.5" min="0.5" required>
+                  <input type="number" class="form-control" id="max_memory2" name="mem_max" value="2" step="0.5"
+                    min="0.5" required>
                 </div>
               </div>
 
@@ -253,7 +277,8 @@
                 <div class="form-group">
                   <label for="port2">{{ translate('serverWizard', 'serverPort', data['lang']) }} <small> - {{
                       translate('serverWizard', 'defaultPort', data['lang']) }}</small></label>
-                  <input type="number" class="form-control" id="port2" name="port" value="25565" step="1" min="1" max="65535" required>
+                  <input type="number" class="form-control" id="port2" name="port" value="25565" step="1" min="1"
+                    max="65535" required>
                 </div>
               </div>
               <div class="col-sm-12">
@@ -261,7 +286,8 @@
                   <div id="accordion-2">
                     <div class="card">
                       <div class="card-header p-2" id="Role-2">
-                        <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-2" aria-expanded="true" aria-controls="collapseRole-2">
+                        <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-2" aria-expanded="true"
+                          aria-controls="collapseRole-2">
                           <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole', data['lang']) }}
                           <small style="text-transform: none;"> - {{ translate('serverWizard', 'autoCreate',
                             data['lang']) }}</small>
@@ -271,7 +297,8 @@
                         <div class="card-body scroll">
                           <div class="form-group">
                             {% for r in data['roles'] %}
-                            <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}" type="checkbox" value="{{ r['role_id'] }}">&nbsp;
+                            <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}"
+                                  type="checkbox" value="{{ r['role_id'] }}">&nbsp;
                                 {{ r['role_name'].capitalize() }}</label></span>
                             {% end %}
                           </div>
@@ -311,7 +338,8 @@
                 <div class="col-sm-12">
                   <div class="form-group">
                     <label for="server_name">{{ translate('serverWizard', 'serverName', data['lang']) }}</label>
-                    <input type="text" class="form-control" id="server_name" name="name" value="" placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
+                    <input type="text" class="form-control" id="server_name" name="name" value=""
+                      placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
                   </div>
                 </div>
 
@@ -319,7 +347,8 @@
                   <div class="form-group">
                     <label for="server">{{ translate('serverWizard', 'zipPath', data['lang']) }} <small>{{
                         translate('serverWizard', 'absoluteZipPath', data['lang']) }}</small></label>
-                    <input type="text" class="form-control" id="zip_server_path" name="server_path" placeholder="/var/opt/server.zip" required>
+                    <input type="text" class="form-control" id="zip_server_path" name="server_path"
+                      placeholder="/var/opt/server.zip" required>
                   </div>
                 </div>
 
@@ -337,7 +366,8 @@
                 <div class="col-sm-12">
                   <div class="form-group">
                     <label for="server_jar">{{ translate('serverWizard', 'serverJar', data['lang']) }}</label>
-                    <input type="text" class="form-control" id="server_jar" name="server_jar" value="" placeholder="paper.jar" required>
+                    <input type="text" class="form-control" id="server_jar" name="server_jar" value=""
+                      placeholder="paper.jar" required>
                   </div>
                 </div>
               </div>
@@ -346,7 +376,8 @@
 
 
             <div class="col-sm-12">
-              <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
+              <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small
+                  style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
                   data['lang']) }}</small></h4>
               <hr>
               <div class="row">
@@ -354,7 +385,8 @@
                   <div class="form-group">
                     <label for="min_memory3">{{ translate('serverWizard', 'minMem', data['lang']) }} <small> - {{
                         translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                    <input type="number" class="form-control" id="min_memory3" name="mem_min" value="1" step="0.5" min="0.5" required>
+                    <input type="number" class="form-control" id="min_memory3" name="mem_min" value="1" step="0.5"
+                      min="0.5" required>
                   </div>
                 </div>
 
@@ -362,7 +394,8 @@
                   <div class="form-group">
                     <label for="max_memory3">{{ translate('serverWizard', 'maxMem', data['lang']) }} <small> - {{
                         translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                    <input type="number" class="form-control" id="max_memory3" name="mem_max" value="2" step="0.5" min="0.5" required>
+                    <input type="number" class="form-control" id="max_memory3" name="mem_max" value="2" step="0.5"
+                      min="0.5" required>
                   </div>
                 </div>
 
@@ -370,7 +403,8 @@
                   <div class="form-group">
                     <label for="port3">{{ translate('serverWizard', 'serverPort', data['lang']) }} <small> - {{
                         translate('serverWizard', 'defaultPort', data['lang']) }}</small></label>
-                    <input type="number" class="form-control" id="port3" name="port" value="25565" step="1" min="1" max="65535" required>
+                    <input type="number" class="form-control" id="port3" name="port" value="25565" step="1" min="1"
+                      max="65535" required>
                   </div>
                 </div>
 
@@ -379,7 +413,8 @@
                     <div id="accordion-3">
                       <div class="card">
                         <div class="card-header p-2" id="Role-3">
-                          <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-3" aria-expanded="true" aria-controls="collapseRole-3">
+                          <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-3" aria-expanded="true"
+                            aria-controls="collapseRole-3">
                             <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole', data['lang'])
                             }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'autoCreate',
                               data['lang']) }}</small>
@@ -389,7 +424,8 @@
                           <div class="card-body scroll">
                             <div class="form-group">
                               {% for r in data['roles'] %}
-                              <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}" type="checkbox" value="{{ r['role_id'] }}">&nbsp;
+                              <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}"
+                                    type="checkbox" value="{{ r['role_id'] }}">&nbsp;
                                   {{ r['role_name'].capitalize() }}</label></span>
                               {% end %}
                             </div>
@@ -404,7 +440,8 @@
                     <input type="text" class="form-control" id="zip_root_path" name="zip_root_path">
                   </div>
                 </div>
-                <div class="modal fade" id="dir_select" tabindex="-1" role="dialog" aria-labelledby="dir_select" aria-hidden="true">
+                <div class="modal fade" id="dir_select" tabindex="-1" role="dialog" aria-labelledby="dir_select"
+                  aria-hidden="true">
                   <div class="modal-dialog" role="document">
                     <div class="modal-content">
                       <div class="modal-header">
@@ -415,7 +452,8 @@
                         </button>
                       </div>
                       <div class="modal-body">
-                        <div class="tree-ctx-item" id="main-tree-div" data-path="" style="overflow: scroll; max-height:75%;">
+                        <div class="tree-ctx-item" id="main-tree-div" data-path=""
+                          style="overflow: scroll; max-height:75%;">
                           <input type="radio" class="root-input" id="main-tree-input" name="root_path" value="" checked>
                           <span id="main-tree" class="files-tree-title tree-caret-down root-dir" data-path="">
                             <i class="far fa-folder"></i>
@@ -435,7 +473,8 @@
                   </div>
                 </div>
               </div>
-              <button id="zip_submit" type="submit" title="You must select server root dir first" disabled class="btn btn-primary mr-2">{{ translate('serverWizard', 'importServerButton', data['lang'])
+              <button id="zip_submit" type="submit" title="You must select server root dir first" disabled
+                class="btn btn-primary mr-2">{{ translate('serverWizard', 'importServerButton', data['lang'])
                 }}</button>
               <button type="button" class="btn btn-danger mr-2 tree-reset">{{ translate('serverWizard', 'resetForm',
                 data['lang'])
@@ -461,17 +500,20 @@
 
             <div class="form-group">
               <label for="server_name">{{ translate('serverWizard', 'serverName', data['lang']) }}</label>
-              <input type="text" class="form-control" id="server_name" name="name" value="" placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
+              <input type="text" class="form-control" id="server_name" name="name" value=""
+                placeholder="{{ translate('serverWizard', 'myNewServer', data['lang']) }}" required>
             </div>
             <div class="form-group">
               <label for="server">{{ translate('serverWizard', 'serverUpload', data['lang']) }}</label>
               <div id="upload_input" class="input-group">
                 <div class="custom-file">
                   <input type="file" multiple="false" class="custom-file-input" id="file" name="file" required>
-                  <label id="fileLabel" class="custom-file-label" for="file">{{ translate('serverWizard', 'labelZipFile', data['lang']) }}</label>
+                  <label id="fileLabel" class="custom-file-label" for="file">{{ translate('serverWizard',
+                    'labelZipFile', data['lang']) }}</label>
                 </div>
                 <div class="input-group-append">
-                  <button type="button" class="btn btn-info upload-button" id="upload-button" onclick="sendFile()" disabled>{{ translate('serverWizard',
+                  <button type="button" class="btn btn-info upload-button" id="upload-button" onclick="sendFile()"
+                    disabled>{{ translate('serverWizard',
                     'uploadButton', data['lang']) }}</button>
                 </div>
               </div>
@@ -488,61 +530,68 @@
 
               <div class="form-group">
                 <label for="server_jar">{{ translate('serverWizard', 'serverJar', data['lang']) }}</label>
-                <input type="text" class="form-control" id="server_jar" name="server_jar" value="" placeholder="paper.jar" required>
+                <input type="text" class="form-control" id="server_jar" name="server_jar" value=""
+                  placeholder="paper.jar" required>
               </div>
 
-              <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
+              <h4 class="card-title">{{ translate('serverWizard', 'quickSettings', data['lang']) }} <small
+                  style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription',
                   data['lang']) }}</small></h4>
               <hr>
 
               <div class="form-group">
                 <label for="min_memory3">{{ translate('serverWizard', 'minMem', data['lang']) }} <small> - {{
                     translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                <input type="number" class="form-control" id="min_memory3" name="mem_min" value="1" step="0.5" min="0.5" required>
+                <input type="number" class="form-control" id="min_memory3" name="mem_min" value="1" step="0.5" min="0.5"
+                  required>
               </div>
 
               <div class="form-group">
                 <label for="max_memory3">{{ translate('serverWizard', 'maxMem', data['lang']) }} <small> - {{
                     translate('serverWizard', 'sizeInGB', data['lang']) }}</small></label>
-                <input type="number" class="form-control" id="max_memory3" name="mem_max" value="2" step="0.5" min="0.5" required>
+                <input type="number" class="form-control" id="max_memory3" name="mem_max" value="2" step="0.5" min="0.5"
+                  required>
               </div>
 
               <div class="form-group">
                 <label for="port3">{{ translate('serverWizard', 'serverPort', data['lang']) }} <small> - {{
                     translate('serverWizard', 'defaultPort', data['lang']) }}</small></label>
-                <input type="number" class="form-control" id="port3" name="port" value="25565" step="1" min="1" max="65535" required>
+                <input type="number" class="form-control" id="port3" name="port" value="25565" step="1" min="1"
+                  max="65535" required>
               </div>
 
-                <div class="form-group">
-                  <div id="accordion-3">
-                    <div class="card">
-                      <div class="card-header p-2" id="Role-3">
-                        <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-3" aria-expanded="true" aria-controls="collapseRole-3">
-                          <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole',
-                          data['lang'])
-                          }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'autoCreate',
-                            data['lang']) }}</small>
-                        </p>
-                      </div>
-                      <div id="collapseRole-3" class="collapse" aria-labelledby="Role-3" data-parent="">
-                        <div class="card-body scroll">
-                          <div class="form-group">
-                            {% for r in data['roles'] %}
-                            <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}" type="checkbox" value="{{ r['role_id'] }}">&nbsp;
-                                {{ r['role_name'].capitalize() }}</label></span>
-                            {% end %}
-                          </div>
+              <div class="form-group">
+                <div id="accordion-3">
+                  <div class="card">
+                    <div class="card-header p-2" id="Role-3">
+                      <p class="mb-0 p-0" data-toggle="collapse" data-target="#collapseRole-3" aria-expanded="true"
+                        aria-controls="collapseRole-3">
+                        <i class="fas fa-chevron-down"></i> {{ translate('serverWizard', 'addRole',
+                        data['lang'])
+                        }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'autoCreate',
+                          data['lang']) }}</small>
+                      </p>
+                    </div>
+                    <div id="collapseRole-3" class="collapse" aria-labelledby="Role-3" data-parent="">
+                      <div class="card-body scroll">
+                        <div class="form-group">
+                          {% for r in data['roles'] %}
+                          <span class="d-block menu-option"><label><input class="roles" name="{{ r['role_id'] }}"
+                                type="checkbox" value="{{ r['role_id'] }}">&nbsp;
+                              {{ r['role_name'].capitalize() }}</label></span>
+                          {% end %}
                         </div>
                       </div>
                     </div>
                   </div>
                 </div>
-                <div style="visibility: hidden;">
-                  <div class="form-group">
-                    <input type="text" class="form-control" id="zip_root_path" name="zip_root_path">
-                  </div>
+              </div>
+              <div style="visibility: hidden;">
+                <div class="form-group">
+                  <input type="text" class="form-control" id="zip_root_path" name="zip_root_path">
                 </div>
-                <div class="modal fade" id="dir_upload_select" tabindex="-1" role="dialog" aria-labelledby="dir_select"
+              </div>
+              <div class="modal fade" id="dir_upload_select" tabindex="-1" role="dialog" aria-labelledby="dir_select"
                 aria-hidden="true">
                 <div class="modal-dialog" role="document">
                   <div class="modal-content">
@@ -556,7 +605,8 @@
                     <div class="modal-body">
                       <div class="tree-ctx-item" id="main-tree-div-upload" data-path=""
                         style="overflow: scroll; max-height:75%;">
-                        <input type="radio" class="root-input" id="main-tree-input-upload" name="root_path" value="" checked>
+                        <input type="radio" class="root-input" id="main-tree-input-upload" name="root_path" value=""
+                          checked>
                         <span id="main-tree" class="files-tree-title tree-caret-down root-dir" data-path="">
                           <i class="far fa-folder"></i>
                           <i class="far fa-folder-open"></i>
@@ -575,18 +625,19 @@
                 </div>
               </div>
             </div>
-            <button id="upload_submit" type="submit" title="You must select server root dir first" disabled class="btn btn-primary mr-2">{{ translate('serverWizard', 'importServerButton', data['lang'])
+            <button id="upload_submit" type="submit" title="You must select server root dir first" disabled
+              class="btn btn-primary mr-2">{{ translate('serverWizard', 'importServerButton', data['lang'])
               }}</button>
             <button type="button" class="btn btn-danger mr-2 tree-reset">{{ translate('serverWizard', 'resetForm',
               data['lang'])
               }}</button>
-            </div>
-          </form>
-          </p>
         </div>
+        </form>
+        </p>
       </div>
     </div>
   </div>
+</div>
 <style>
   button>i.refresh-class {
     margin: 0px;
@@ -763,7 +814,7 @@
 
 {% block js %}
 <script>
-    document.getElementById("root_files_button").addEventListener("click", function (event) {
+  document.getElementById("root_files_button").addEventListener("click", function (event) {
     if (document.forms["zip"]["server_path"].value != "") {
       if (document.getElementById('root_files_button').classList.contains('clicked')) {
         show_file_tree();
@@ -771,7 +822,7 @@
       } else {
         document.getElementById('root_files_button').classList.add('clicked')
       }
-      var token = getCookie("_xsrf");
+      const token = getCookie("_xsrf");
       var dialog = bootbox.dialog({
         message: '<p class="text-center mb-0"><i class="fa fa-spin fa-cog"></i> Please wait while we gather your files...</p>',
         closeButton: false
@@ -783,125 +834,125 @@
     }
   });
   document.getElementById("root_upload_button").addEventListener("click", function (event) {
-      if (document.getElementById('root_upload_button').classList.contains('clicked')) {
-        show_file_tree();
-        return;
-      } else {
-        document.getElementById('root_upload_button').classList.add('clicked')
-      }
-      var token = getCookie("_xsrf");
-      var dialog = bootbox.dialog({
-        message: '<p class="text-center mb-0"><i class="fa fa-spin fa-cog"></i> Please wait while we gather your files...</p>',
-        closeButton: false
-      });
-      console.log("CALLING DIR")
-      getDirView();
-  });
-    var upload = false;
-    var file;
-    function sendFile() {
-      file = $("#file")[0].files[0]
-      document.getElementById("upload_input").innerHTML = '<div class="progress" style="width: 100%;"><div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i class="fa-solid fa-spinner"></i></div></div>'
-      let xmlHttpRequest = new XMLHttpRequest();
-      let token = getCookie("_xsrf")
-      let fileName = file.name
-      let target = '/upload'
-      let mimeType = file.type
-      let size = file.size
-      let type = 'server_import'
-
-      xmlHttpRequest.upload.addEventListener('progress', function (e) {
-
-        if (e.loaded <= size) {
-          var percent = Math.round(e.loaded / size * 100);
-          $(`#upload-progress-bar`).css('width', percent + '%');
-          $(`#upload-progress-bar`).html(percent + '%');
-        }
-      });
-
-      xmlHttpRequest.open('POST', target, true);
-      xmlHttpRequest.setRequestHeader('X-Content-Type', mimeType);
-      xmlHttpRequest.setRequestHeader('X-XSRFToken', token);
-      xmlHttpRequest.setRequestHeader('X-Content-Length', size);
-      xmlHttpRequest.setRequestHeader('X-Content-Disposition', 'attachment; filename="' + fileName + '"');
-      xmlHttpRequest.setRequestHeader('X-Content-Upload-Type', type);
-      xmlHttpRequest.setRequestHeader('X-FileName', fileName);
-      xmlHttpRequest.addEventListener('load', (event) => {
-        if (event.target.responseText == 'success') {
-          console.log('Upload for file', file.name, 'was successful!')
-          document.getElementById("upload_input").innerHTML = `<div class="card-header header-sm d-flex justify-content-between align-items-center" style="width: 100%;"><input value=${fileName} type="text" id="file-uploaded" disabled></input> 🔒</div>`;
-          document.getElementById("lower_half").style.visibility = "visible";
-          document.getElementById("lower_half").hidden = false;
-        }
-        else {
-          let response_text = JSON.parse(event.target.responseText);
-          var x = document.querySelector('.bootbox');
-          console.log(JSON.parse(event.target.responseText).info)
-          bootbox.alert({
-            message: JSON.parse(event.target.responseText).info,
-            callback: function () {
-              window.location.reload();
-            }
-          });
-          doUpload = false;
-        }
-      }, false);
-      xmlHttpRequest.addEventListener('error', (e) => {
-        console.error('Error while uploading file', file.name + '.', 'Event:', e)
-      }, false);
-      xmlHttpRequest.send(file);
+    if (document.getElementById('root_upload_button').classList.contains('clicked')) {
+      show_file_tree();
+      return;
+    } else {
+      document.getElementById('root_upload_button').classList.add('clicked')
     }
+    const token = getCookie("_xsrf");
+    var dialog = bootbox.dialog({
+      message: '<p class="text-center mb-0"><i class="fa fa-spin fa-cog"></i> Please wait while we gather your files...</p>',
+      closeButton: false
+    });
+    console.log("CALLING DIR")
+    getDirView();
+  });
+  var upload = false;
+  var file;
+  function sendFile() {
+    file = $("#file")[0].files[0]
+    document.getElementById("upload_input").innerHTML = '<div class="progress" style="width: 100%;"><div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">&nbsp;<i class="fa-solid fa-spinner"></i></div></div>'
+    let xmlHttpRequest = new XMLHttpRequest();
+    const token = getCookie("_xsrf")
+    let fileName = file.name
+    let target = '/upload'
+    let mimeType = file.type
+    let size = file.size
+    let type = 'server_import'
+
+    xmlHttpRequest.upload.addEventListener('progress', function (e) {
+
+      if (e.loaded <= size) {
+        var percent = Math.round(e.loaded / size * 100);
+        $(`#upload-progress-bar`).css('width', percent + '%');
+        $(`#upload-progress-bar`).html(percent + '%');
+      }
+    });
+
+    xmlHttpRequest.open('POST', target, true);
+    xmlHttpRequest.setRequestHeader('X-Content-Type', mimeType);
+    xmlHttpRequest.setRequestHeader('X-XSRFToken', token);
+    xmlHttpRequest.setRequestHeader('X-Content-Length', size);
+    xmlHttpRequest.setRequestHeader('X-Content-Disposition', 'attachment; filename="' + fileName + '"');
+    xmlHttpRequest.setRequestHeader('X-Content-Upload-Type', type);
+    xmlHttpRequest.setRequestHeader('X-FileName', fileName);
+    xmlHttpRequest.addEventListener('load', (event) => {
+      if (event.target.responseText == 'success') {
+        console.log('Upload for file', file.name, 'was successful!')
+        document.getElementById("upload_input").innerHTML = `<div class="card-header header-sm d-flex justify-content-between align-items-center" style="width: 100%;"><input value=${fileName} type="text" id="file-uploaded" disabled></input> 🔒</div>`;
+        document.getElementById("lower_half").style.visibility = "visible";
+        document.getElementById("lower_half").hidden = false;
+      }
+      else {
+        let response_text = JSON.parse(event.target.responseText);
+        var x = document.querySelector('.bootbox');
+        console.log(JSON.parse(event.target.responseText).info)
+        bootbox.alert({
+          message: JSON.parse(event.target.responseText).info,
+          callback: function () {
+            window.location.reload();
+          }
+        });
+        doUpload = false;
+      }
+    }, false);
+    xmlHttpRequest.addEventListener('error', (e) => {
+      console.error('Error while uploading file', file.name + '.', 'Event:', e)
+    }, false);
+    xmlHttpRequest.send(file);
+  }
 </script>
 <script type="text/javascript" src="../../static/assets/js/shared/root-dir.js"></script>
 
 <script>
-      function replacer(key, value) {
-        if (key === "roles"){
-          return value
-        }
-        if (key != "ignored_exits") {
-          if (typeof value == "boolean" || key === "host" || key === "version") {
-            return value
-          } else {
-            return (isNaN(value) ? value : +value);
-          }
-        } else {
-          return value;
-        }
+  function replacer(key, value) {
+    if (key === "roles") {
+      return value
+    }
+    if (key != "ignored_exits") {
+      if (typeof value == "boolean" || key === "host" || key === "version") {
+        return value
+      } else {
+        return (isNaN(value) ? value : +value);
       }
-      function calcRoles() {
-        let role_ids = $('.roles').map(function() {
-        if ($(this).is(':checked')){
-          return $(this).val();
-        }
-        }).get();
-        console.log(role_ids)
-        return role_ids
+    } else {
+      return value;
+    }
+  }
+  function calcRoles() {
+    let role_ids = $('.roles').map(function () {
+      if ($(this).is(':checked')) {
+        return $(this).val();
       }
-      async function send_server(data){
-        let token = getCookie("_xsrf")
-        let res = await fetch(`/api/v2/servers/`, {
-          method: 'POST',
-          headers: {
-            'X-XSRFToken': token
-          },
-          body: data,
-        });
-        let responseData = await res.json();
-        if (responseData.status === "ok") {
-          window.location.href = '/panel/dashboard';
-        } else {
+    }).get();
+    console.log(role_ids)
+    return role_ids
+  }
+  async function send_server(data) {
+    const token = getCookie("_xsrf")
+    let res = await fetch(`/api/v2/servers/`, {
+      method: 'POST',
+      headers: {
+        'X-XSRFToken': token
+      },
+      body: data,
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      window.location.href = '/panel/dashboard';
+    } else {
 
-          bootbox.alert({
-            title: responseData.error,
-            message: responseData.error_data
-          });
-        }
-      }
-    $(document).ready(function () {
+      bootbox.alert({
+        title: responseData.error,
+        message: responseData.error_data
+      });
+    }
+  }
+  $(document).ready(function () {
 
-      $("#download_jar").on("submit", async function (e) {
-        wait_msg();
+    $("#download_jar").on("submit", async function (e) {
+      wait_msg();
       e.preventDefault();
       let jarForm = document.getElementById("download_jar");
 
@@ -911,23 +962,23 @@
       console.log(formDataObject);
       let send_data = {
         "name": formDataObject.name,
-        "roles": calcRoles(), 
-        "monitoring_type": "minecraft_java", 
+        "roles": calcRoles(),
+        "monitoring_type": "minecraft_java",
         "minecraft_java_monitoring_data": {
           "host": "127.0.0.1",
           "port": formDataObject.port
         },
         "create_type": "minecraft_java",
         "minecraft_java_create_data": {
-        "create_type": "download_jar",
-        "download_jar_create_data": {
-          "category": formDataObject.version.split("|")[0],
-          "type": formDataObject.version.split("|")[1],
-          "version": formDataObject.version.split("|")[2],
-          "mem_min": formDataObject.mem_min,
-          "mem_max": formDataObject.mem_max,
-          "server_properties_port": formDataObject.port
-        }
+          "create_type": "download_jar",
+          "download_jar_create_data": {
+            "category": formDataObject.version.split("|")[0],
+            "type": formDataObject.version.split("|")[1],
+            "version": formDataObject.version.split("|")[2],
+            "mem_min": formDataObject.mem_min,
+            "mem_max": formDataObject.mem_max,
+            "server_properties_port": formDataObject.port
+          }
         }
       }
       console.log(send_data);
@@ -940,8 +991,8 @@
       send_server(formDataJsonString);
     });
 
-  $("#import-jar").on("submit", async function (e) {
-        wait_msg(true);
+    $("#import-jar").on("submit", async function (e) {
+      wait_msg(true);
       e.preventDefault();
       let jarForm = document.getElementById("import-jar");
 
@@ -952,21 +1003,21 @@
       let send_data = {
         "name": formDataObject.name,
         "roles": calcRoles(),
-        "monitoring_type": "minecraft_java", 
+        "monitoring_type": "minecraft_java",
         "minecraft_java_monitoring_data": {
           "host": "127.0.0.1",
           "port": formDataObject.port
         },
         "create_type": "minecraft_java",
         "minecraft_java_create_data": {
-        "create_type": "import_server",
-        "import_server_create_data": {
-          "existing_server_path": formDataObject.server_path,
-          "jarfile": formDataObject.server_jar,
-          "mem_min": formDataObject.mem_min,
-          "mem_max": formDataObject.mem_max,
-          "server_properties_port": formDataObject.port
-        }
+          "create_type": "import_server",
+          "import_server_create_data": {
+            "existing_server_path": formDataObject.server_path,
+            "jarfile": formDataObject.server_jar,
+            "mem_min": formDataObject.mem_min,
+            "mem_max": formDataObject.mem_max,
+            "server_properties_port": formDataObject.port
+          }
         }
       }
       console.log(send_data);
@@ -976,8 +1027,8 @@
       send_server(formDataJsonString);
     });
 
-      $("#import-zip").on("submit", async function (e) {
-        wait_msg(true);
+    $("#import-zip").on("submit", async function (e) {
+      wait_msg(true);
       e.preventDefault();
       let jarForm = document.getElementById("import-zip");
 
@@ -987,22 +1038,22 @@
       console.log(formDataObject);
       let send_data = {
         "name": formDataObject.name,
-        "roles": calcRoles(), 
-        "monitoring_type": "minecraft_java", 
+        "roles": calcRoles(),
+        "monitoring_type": "minecraft_java",
         "minecraft_java_monitoring_data": {
           "host": "127.0.0.1",
           "port": formDataObject.port
         },
         "create_type": "minecraft_java",
         "minecraft_java_create_data": {
-        "create_type": "import_server",
-        "import_server_create_data": {
-          "existing_server_path": formDataObject.root_path,
-          "jarfile": formDataObject.server_jar,
-          "mem_min": formDataObject.mem_min,
-          "mem_max": formDataObject.mem_max,
-          "server_properties_port": formDataObject.port
-        }
+          "create_type": "import_server",
+          "import_server_create_data": {
+            "existing_server_path": formDataObject.root_path,
+            "jarfile": formDataObject.server_jar,
+            "mem_min": formDataObject.mem_min,
+            "mem_max": formDataObject.mem_max,
+            "server_properties_port": formDataObject.port
+          }
         }
       }
       console.log(send_data);
@@ -1013,7 +1064,7 @@
     });
 
     $("#import-upload").on("submit", async function (e) {
-        wait_msg(true);
+      wait_msg(true);
       e.preventDefault();
       let jarForm = document.getElementById("import-upload");
 
@@ -1024,21 +1075,21 @@
       let send_data = {
         "name": formDataObject.name,
         "roles": calcRoles(),
-        "monitoring_type": "minecraft_java", 
+        "monitoring_type": "minecraft_java",
         "minecraft_java_monitoring_data": {
           "host": "127.0.0.1",
           "port": formDataObject.port
         },
         "create_type": "minecraft_java",
         "minecraft_java_create_data": {
-        "create_type": "import_server",
-        "import_server_create_data": {
-          "existing_server_path": formDataObject.root_path,
-          "jarfile": formDataObject.server_jar,
-          "mem_min": formDataObject.mem_min,
-          "mem_max": formDataObject.mem_max,
-          "server_properties_port": formDataObject.port
-        }
+          "create_type": "import_server",
+          "import_server_create_data": {
+            "existing_server_path": formDataObject.root_path,
+            "jarfile": formDataObject.server_jar,
+            "mem_min": formDataObject.mem_min,
+            "mem_max": formDataObject.mem_max,
+            "server_properties_port": formDataObject.port
+          }
         }
       }
       console.log(send_data);
@@ -1051,181 +1102,181 @@
 </script>
 
 <script>
-    $(".tree-reset").on("click", function () {
-      location.href = "/server/step1";
-    });
-    function dropDown(event) {
-      event.target.parentElement.children[1].classList.remove("d-none");
-      document.getElementById("overlay").classList.remove("d-none");
-    }
+  $(".tree-reset").on("click", function () {
+    location.href = "/server/step1";
+  });
+  function dropDown(event) {
+    event.target.parentElement.children[1].classList.remove("d-none");
+    document.getElementById("overlay").classList.remove("d-none");
+  }
 
-    function hide(event) {
-      var items = document.getElementsByClassName('menu');
-      items.forEach(item => {
-        item.classList.add("d-none");
-      })
+  function hide(event) {
+    var items = document.getElementsByClassName('menu');
+    items.forEach(item => {
+      item.classList.add("d-none");
+    })
 
-      document.getElementById("overlay").classList.add("d-none");
-    }
+    document.getElementById("overlay").classList.add("d-none");
+  }
 
-    $(document).ready(function () {
-      console.log('ready');
-      var forms = $('form.server-wizard');
-      forms.each(function (i, formEl) {
-        var form = $(formEl);
-        var min = form.find('[name=min_memory]');
-        var max = form.find('[name=max_memory]');
-        console.log(form, min, max)
-        min.change(function () {
-          check_sizes(max, min, 'min');
-        });
-        max.change(function () {
-          check_sizes(max, min, 'max');
-        });
+  $(document).ready(function () {
+    console.log('ready');
+    var forms = $('form.server-wizard');
+    forms.each(function (i, formEl) {
+      var form = $(formEl);
+      var min = form.find('[name=min_memory]');
+      var max = form.find('[name=max_memory]');
+      console.log(form, min, max)
+      min.change(function () {
+        check_sizes(max, min, 'min');
+      });
+      max.change(function () {
+        check_sizes(max, min, 'max');
       });
     });
+  });
+
+  function wait_msg(importing) {
+    bootbox.alert({
+      title: importing ? '{% raw translate("serverWizard", "importing", data["lang"]) %}' : '{% raw translate("serverWizard", "downloading", data["lang"]) %}',
+      message: importing ? '<i class="fas fa-cloud-download"></i> {% raw translate("serverWizard", "bePatient", data["lang"]) %}' : '<i class="fas fa-cloud-download"></i> {% raw translate("serverWizard", "bePatient", data["lang"]) %}<br><br><a href="https://serverjars.com" target="_blank" style="text-align: center;"><img src="../../static/assets/images/serverjars/FULL-WHITE.svg" alt="Powered by serverjars.com" width="40%"></a>',
+    });
+  }
+
+
+  function check_sizes(a, b, changed) {
+    max_mem = parseFloat(a.val());
+    min_mem = parseFloat(b.val());
+    if (max_mem < min_mem && changed === 'min') {
+      a.val(min_mem)
+    }
+    if (max_mem < min_mem && changed === 'max') {
+      b.val(max_mem)
+    }
+  }
+
+  async function refreshCache() {
+    document.getElementById("refresh-cache").classList.add("fa-spin")
+    const token = getCookie("_xsrf")
+    let res = await fetch(`/api/v2/crafty/exeCache`, {
+      method: 'GET',
+      headers: {
+        'X-XSRFToken': token
+      },
+    });
+    let responseData = await res.json();
+    if (responseData.status === "ok") {
+      document.getElementById("refresh-cache").classList.remove("fa-sync");
+      document.getElementById("refresh-cache").classList.remove("fa-spin");
+      document.getElementById("refresh-cache").classList.add("fa-check");
+      setTimeout(() => {
+        location.reload();
+      }, 2000);
+    } else {
 
-    function wait_msg(importing) {
       bootbox.alert({
-        title: importing ? '{% raw translate("serverWizard", "importing", data["lang"]) %}' : '{% raw translate("serverWizard", "downloading", data["lang"]) %}',
-        message: importing ? '<i class="fas fa-cloud-download"></i> {% raw translate("serverWizard", "bePatient", data["lang"]) %}': '<i class="fas fa-cloud-download"></i> {% raw translate("serverWizard", "bePatient", data["lang"]) %}<br><br><a href="https://serverjars.com" target="_blank" style="text-align: center;"><img src="../../static/assets/images/serverjars/FULL-WHITE.svg" alt="Powered by serverjars.com" width="40%"></a>',
+        title: responseData.error,
+        message: responseData.error
       });
     }
+  }
 
-
-    function check_sizes(a, b, changed) {
-      max_mem = parseFloat(a.val());
-      min_mem = parseFloat(b.val());
-      if (max_mem < min_mem && changed === 'min') {
-        a.val(min_mem)
-      }
-      if (max_mem < min_mem && changed === 'max') {
-        b.val(max_mem)
-      }
+  $('#file').change(function () {
+    console.log("File changed");
+    if ($('#file').val()) {
+      $('#upload-button').prop("disabled", false);
+      document.getElementById("fileLabel").innerHTML = $('#file').val().split('\\').pop().split('/').pop();
+      console.log("File changed good");
     }
-
-    async function refreshCache() {
-      document.getElementById("refresh-cache").classList.add("fa-spin")
-      let token = getCookie("_xsrf")
-        let res = await fetch(`/api/v2/crafty/exeCache`, {
-          method: 'GET',
-          headers: {
-            'X-XSRFToken': token
-          },
-        });
-        let responseData = await res.json();
-        if (responseData.status === "ok") {
-          document.getElementById("refresh-cache").classList.remove("fa-sync");
-          document.getElementById("refresh-cache").classList.remove("fa-spin");
-          document.getElementById("refresh-cache").classList.add("fa-check");
-          setTimeout(() => {
-            location.reload();
-          }, 2000);
-        } else {
-
-          bootbox.alert({
-            title: responseData.error,
-            message: responseData.error
-          });
-        }
-      }
-
-    $('#file').change(function () {
-      console.log("File changed");
-      if ($('#file').val()) {
-        $('#upload-button').prop("disabled", false);
-        document.getElementById("fileLabel").innerHTML = $('#file').val().split('\\').pop().split('/').pop();
-        console.log("File changed good");
-      }
-    });
+  });
 
 </script>
 <script type="text/javascript">
-    var text = '{% raw data["js_server_types"] %}';
-    var serverTypesLists = JSON.parse(text);
-    /* CountryChange() is called from the onchange event of a select element.
-    * param selectObj - the select object which fired the on change event.
-    */
-    function serverTypeChange(selectObj) {
-      // get the index of the selected option
-      var idx = document.getElementById('server_type').selectedIndex;
-      // get the value of the selected option
-      var cSelect = document.getElementById("server");
-      try {
-        var which = document.getElementById('server_type').options[idx].value;
-      } catch {
-        while (cSelect.options.length > 0) {
-          cSelect.remove(0);
-        }
-        return;
-      }
-      let server_type = which.split('|')[0];
-      let server = which.split('|')[1];
-      // use the selected option value to retrieve the list of items from the serverTypesLists array
-      let cList = serverTypesLists[server_type];
-      // get the country select element via its known id
-      var cSelect = document.getElementById("server");
-      // remove the current options from the country select
-      var len = cSelect.options.length;
+  var text = '{% raw data["js_server_types"] %}';
+  var serverTypesLists = JSON.parse(text);
+  /* CountryChange() is called from the onchange event of a select element.
+  * param selectObj - the select object which fired the on change event.
+  */
+  function serverTypeChange(selectObj) {
+    // get the index of the selected option
+    var idx = document.getElementById('server_type').selectedIndex;
+    // get the value of the selected option
+    var cSelect = document.getElementById("server");
+    try {
+      var which = document.getElementById('server_type').options[idx].value;
+    } catch {
       while (cSelect.options.length > 0) {
         cSelect.remove(0);
       }
-      var newOption;
-      // create new options ordered by ascending
-      cList[server].forEach(type => {
-        newOption = document.createElement("option");
-        newOption.value = which + "|" + type;  // assumes option string and value are the same
-        newOption.text = type;
-        // add the new option
-        try {
-          cSelect.add(newOption);  // this will fail in DOM browsers but is needed for IE
-        }
-        catch (e) {
-          cSelect.appendChild(newOption);
-        }
-      })
+      return;
     }
-
-    function serverJarChange(selectObj) {
-      let type_select = document.getElementById('server_jar')
-      let tidx = type_select.selectedIndex;
-      let val = type_select.options[tidx].value;
-      if (val == 'None') {
-        var jcSelect = document.getElementById("server_type");
-        while (jcSelect.options.length > 0) {
-          jcSelect.remove(0);
-        }
-        serverTypeChange(selectObj);
-        return;
+    let server_type = which.split('|')[0];
+    let server = which.split('|')[1];
+    // use the selected option value to retrieve the list of items from the serverTypesLists array
+    let cList = serverTypesLists[server_type];
+    // get the country select element via its known id
+    var cSelect = document.getElementById("server");
+    // remove the current options from the country select
+    var len = cSelect.options.length;
+    while (cSelect.options.length > 0) {
+      cSelect.remove(0);
+    }
+    var newOption;
+    // create new options ordered by ascending
+    cList[server].forEach(type => {
+      newOption = document.createElement("option");
+      newOption.value = which + "|" + type;  // assumes option string and value are the same
+      newOption.text = type;
+      // add the new option
+      try {
+        cSelect.add(newOption);  // this will fail in DOM browsers but is needed for IE
       }
-      // get the index of the selected option
-      var jidx = selectObj.selectedIndex;
-      // get the value of the selected option
-      var jwhich = selectObj.options[jidx].value;
-      // use the selected option value to retrieve the list of items from the serverTypesLists array
-      jcList = Object.keys(serverTypesLists[jwhich]);
-      // get the country select element via its known id
+      catch (e) {
+        cSelect.appendChild(newOption);
+      }
+    })
+  }
+
+  function serverJarChange(selectObj) {
+    let type_select = document.getElementById('server_jar')
+    let tidx = type_select.selectedIndex;
+    let val = type_select.options[tidx].value;
+    if (val == 'None') {
       var jcSelect = document.getElementById("server_type");
-      // remove the current options from the country select
-      var jlen = jcSelect.options.length;
       while (jcSelect.options.length > 0) {
         jcSelect.remove(0);
       }
-      var jnewOption;
-      // create new options ordered by ascending
-      jcList.forEach(type => {
-        jnewOption = document.createElement("option");
-        jnewOption.value = jwhich + "|" + type;  // assumes option string and value are the same
-        jnewOption.text = type;
-        // add the new option
-        try {
-          jcSelect.add(jnewOption);  // this will fail in DOM browsers but is needed for IE
-        }
-        catch (e) {
-          jcSelect.appendChild(jnewOption);
-        }
-      })
       serverTypeChange(selectObj);
+      return;
     }
+    // get the index of the selected option
+    var jidx = selectObj.selectedIndex;
+    // get the value of the selected option
+    var jwhich = selectObj.options[jidx].value;
+    // use the selected option value to retrieve the list of items from the serverTypesLists array
+    jcList = Object.keys(serverTypesLists[jwhich]);
+    // get the country select element via its known id
+    var jcSelect = document.getElementById("server_type");
+    // remove the current options from the country select
+    var jlen = jcSelect.options.length;
+    while (jcSelect.options.length > 0) {
+      jcSelect.remove(0);
+    }
+    var jnewOption;
+    // create new options ordered by ascending
+    jcList.forEach(type => {
+      jnewOption = document.createElement("option");
+      jnewOption.value = jwhich + "|" + type;  // assumes option string and value are the same
+      jnewOption.text = type;
+      // add the new option
+      try {
+        jcSelect.add(jnewOption);  // this will fail in DOM browsers but is needed for IE
+      }
+      catch (e) {
+        jcSelect.appendChild(jnewOption);
+      }
+    })
+    serverTypeChange(selectObj);
+  }
 </script>
 {% end %}
\ No newline at end of file