From 0c1559c9220c7db531a22e5a8dd4501611e70796 Mon Sep 17 00:00:00 2001 From: Jakob Schrettenbrunner Date: Fri, 27 Jan 2017 00:44:28 +0100 Subject: [PATCH] convert frontend javascript into revealing module pattern --- .../pterodactyl/js/frontend/2fa-modal.js | 115 ++++++------ .../pterodactyl/js/frontend/server.socket.js | 149 +++++++++------- .../pterodactyl/js/frontend/serverlist.js | 117 +++++++------ .../themes/pterodactyl/js/frontend/tasks.js | 165 ++++++++++-------- 4 files changed, 301 insertions(+), 245 deletions(-) diff --git a/public/themes/pterodactyl/js/frontend/2fa-modal.js b/public/themes/pterodactyl/js/frontend/2fa-modal.js index 75fb621f0..935bd0f59 100644 --- a/public/themes/pterodactyl/js/frontend/2fa-modal.js +++ b/public/themes/pterodactyl/js/frontend/2fa-modal.js @@ -17,60 +17,75 @@ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // SOFTWARE. -$(document).ready(function () { - $('#close_reload').click(function () { - location.reload(); - }); - $('#do_2fa').submit(function (event) { - event.preventDefault(); - $.ajax({ - type: 'PUT', - url: Router.route('account.security.totp'), - headers: { - 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), - } - }).done(function (data) { - var image = new Image(); - image.src = data.qrImage; - $(image).load(function () { - $('#hide_img_load').slideUp(function () { - $('#qr_image_insert').attr('src', image.src).slideDown(); +var TwoFactorModal = (function () { + + function bindListeners() { + $(document).ready(function () { + $('#close_reload').click(function () { + location.reload(); + }); + $('#do_2fa').submit(function (event) { + event.preventDefault(); + + $.ajax({ + type: 'PUT', + url: Router.route('account.security.totp'), + headers: { + 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), + } + }).done(function (data) { + var image = new Image(); + image.src = data.qrImage; + $(image).load(function () { + $('#hide_img_load').slideUp(function () { + $('#qr_image_insert').attr('src', image.src).slideDown(); + }); + }); + $('#2fa_secret_insert').html(data.secret); + $('#open2fa').modal('show'); + }).fail(function (jqXHR) { + alert('An error occured while attempting to load the 2FA setup modal. Please try again.'); + console.error(jqXHR); + }); + + }); + $('#2fa_token_verify').submit(function (event) { + event.preventDefault(); + $('#submit_action').html(' Submit').addClass('disabled'); + + $.ajax({ + type: 'POST', + url: Router.route('account.security.totp'), + headers: { + 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), + }, + data: { + token: $('#2fa_token').val() + } + }).done(function (data) { + $('#notice_box_2fa').hide(); + if (data === 'true') { + $('#notice_box_2fa').html('
2-Factor Authentication has been enabled on your account. Press \'Close\' below to reload the page.
').slideDown(); + } else { + $('#notice_box_2fa').html('
The token provided was invalid.
').slideDown(); + } + }).fail(function (jqXHR) { + $('#notice_box_2fa').html('
There was an error while attempting to enable 2-Factor Authentication on this account.
').slideDown(); + console.error(jqXHR); + }).always(function () { + $('#submit_action').html('Submit').removeClass('disabled'); }); }); - $('#2fa_secret_insert').html(data.secret); - $('#open2fa').modal('show'); - }).fail(function (jqXHR) { - alert('An error occured while attempting to load the 2FA setup modal. Please try again.'); - console.error(jqXHR); }); + } - }); - $('#2fa_token_verify').submit(function (event) { - event.preventDefault(); - $('#submit_action').html(' Submit').addClass('disabled'); + return { + init: function () { + bindListeners(); + } + } - $.ajax({ - type: 'POST', - url: Router.route('account.security.totp'), - headers: { - 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), - }, - data: { - token: $('#2fa_token').val() - } - }).done(function (data) { - $('#notice_box_2fa').hide(); - if (data === 'true') { - $('#notice_box_2fa').html('
2-Factor Authentication has been enabled on your account. Press \'Close\' below to reload the page.
').slideDown(); - } else { - $('#notice_box_2fa').html('
The token provided was invalid.
').slideDown(); - } - }).fail(function (jqXHR) { - $('#notice_box_2fa').html('
There was an error while attempting to enable 2-Factor Authentication on this account.
').slideDown(); - console.error(jqXHR); - }).always(function () { - $('#submit_action').html('Submit').removeClass('disabled'); - }); - }); }); + +TwoFactorModal.init(); diff --git a/public/themes/pterodactyl/js/frontend/server.socket.js b/public/themes/pterodactyl/js/frontend/server.socket.js index c789b2854..3e97c2a62 100644 --- a/public/themes/pterodactyl/js/frontend/server.socket.js +++ b/public/themes/pterodactyl/js/frontend/server.socket.js @@ -17,79 +17,94 @@ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // SOFTWARE. -(function initSocket() { - if (typeof $.notifyDefaults !== 'function') { - console.error('Notify does not appear to be loaded.'); - return; + +var Server = (function () { + + function initSocket() { + if (typeof $.notifyDefaults !== 'function') { + console.error('Notify does not appear to be loaded.'); + return; + } + + if (typeof io !== 'function') { + console.error('Socket.io is reqired to use this panel.'); + return; + } + + $.notifyDefaults({ + placement: { + from: 'bottom', + align: 'right' + }, + newest_on_top: true, + delay: 2000, + animate: { + enter: 'animated zoomInDown', + exit: 'animated zoomOutDown' + } + }); + + var notifySocketError = false; + + window.Socket = io(Pterodactyl.node.scheme + '://' + Pterodactyl.node.fqdn + ':' + Pterodactyl.node.daemonListen + '/ws/' + Pterodactyl.server.uuid, { + 'query': 'token=' + Pterodactyl.server.daemonSecret, + }); + + Socket.io.on('connect_error', function (err) { + if(typeof notifySocketError !== 'object') { + notifySocketError = $.notify({ + message: 'There was an error attempting to establish a WebSocket connection to the Daemon. This panel will not work as expected.

' + err, + }, { + type: 'danger', + delay: 0 + }); + } + }); + + // Connected to Socket Successfully + Socket.on('connect', function () { + if (notifySocketError !== false) { + notifySocketError.close(); + notifySocketError = false; + } + }); + + Socket.on('initial status', function (data) { + setStatusIcon(data.status); + }); + + Socket.on('status', function (data) { + setStatusIcon(data.status); + }); } - if (typeof io !== 'function') { - console.error('Socket.io is reqired to use this panel.'); - return; + function setStatusIcon(status) { + switch (status) { + case 0: + $('#server_status_icon').html(' Offline'); + break; + case 1: + $('#server_status_icon').html(' Online'); + break; + case 2: + $('#server_status_icon').html(' Starting'); + break; + case 3: + $('#server_status_icon').html(' Stopping'); + break; + default: + break; + } } - $.notifyDefaults({ - placement: { - from: 'bottom', - align: 'right' + return { + init: function () { + initSocket(); }, - newest_on_top: true, - delay: 2000, - animate: { - enter: 'animated zoomInDown', - exit: 'animated zoomOutDown' - } - }); - var notifySocketError = false; + setStatusIcon: setStatusIcon, + } - window.Socket = io(Pterodactyl.node.scheme + '://' + Pterodactyl.node.fqdn + ':' + Pterodactyl.node.daemonListen + '/ws/' + Pterodactyl.server.uuid, { - 'query': 'token=' + Pterodactyl.server.daemonSecret, - }); - - Socket.io.on('connect_error', function (err) { - if(typeof notifySocketError !== 'object') { - notifySocketError = $.notify({ - message: 'There was an error attempting to establish a WebSocket connection to the Daemon. This panel will not work as expected.

' + err, - }, { - type: 'danger', - delay: 0 - }); - } - }); - - // Connected to Socket Successfully - Socket.on('connect', function () { - if (notifySocketError !== false) { - notifySocketError.close(); - notifySocketError = false; - } - }); - - Socket.on('initial status', function (data) { - setStatusIcon(data.status); - }); - - Socket.on('status', function (data) { - setStatusIcon(data.status); - }); })(); -function setStatusIcon(status) { - switch (status) { - case 0: - $('#server_status_icon').html(' Offline'); - break; - case 1: - $('#server_status_icon').html(' Online'); - break; - case 2: - $('#server_status_icon').html(' Starting'); - break; - case 3: - $('#server_status_icon').html(' Stopping'); - break; - default: - break; - } -} +Server.init(); diff --git a/public/themes/pterodactyl/js/frontend/serverlist.js b/public/themes/pterodactyl/js/frontend/serverlist.js index 605c33d2f..019562eb0 100644 --- a/public/themes/pterodactyl/js/frontend/serverlist.js +++ b/public/themes/pterodactyl/js/frontend/serverlist.js @@ -17,59 +17,72 @@ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // SOFTWARE. -var Status = { - 0: 'Offline', - 1: 'Online', - 2: 'Starting', - 3: 'Stopping' -}; -(function updateServerStatus () { - $('.dynamic-update').each(function (index, data) { - var element = $(this); - var serverShortUUID = $(this).data('server'); - $.ajax({ - type: 'GET', - url: Router.route('server.ajax.status', { server: serverShortUUID }), - timeout: 5000, - headers: { - 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), - } - }).done(function (data) { - if (typeof data.status === 'undefined') { - element.find('[data-action="status"]').html('Error'); - return; - } - switch (data.status) { - case 0: - element.find('[data-action="status"]').html('Offline'); - break; - case 1: - element.find('[data-action="status"]').html('Online'); - break; - case 2: - element.find('[data-action="status"]').html('Starting'); - break; - case 3: - element.find('[data-action="status"]').html('Stopping'); - break; - } - if (data.status !== 0) { - var cpuMax = element.find('[data-action="cpu"]').data('cpumax'); - var currentCpu = data.proc.cpu.total; - if (cpuMax !== 0) { - currentCpu = parseFloat(((data.proc.cpu.total / cpuMax) * 100).toFixed(2).toString()); +var ServerList = (function () { + + var Status = { + 0: 'Offline', + 1: 'Online', + 2: 'Starting', + 3: 'Stopping' + }; + + function updateServerStatus () { + $('.dynamic-update').each(function (index, data) { + var element = $(this); + var serverShortUUID = $(this).data('server'); + $.ajax({ + type: 'GET', + url: Router.route('server.ajax.status', { server: serverShortUUID }), + timeout: 5000, + headers: { + 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), } - element.find('[data-action="memory"]').html(parseInt(data.proc.memory.total / (1024 * 1024))); - element.find('[data-action="cpu"]').html(currentCpu); - } else { - element.find('[data-action="memory"]').html('--'); - element.find('[data-action="cpu"]').html('--'); - } - }).fail(function (jqXHR) { - console.error(jqXHR); - element.find('[data-action="status"]').html('Error'); + }).done(function (data) { + if (typeof data.status === 'undefined') { + element.find('[data-action="status"]').html('Error'); + return; + } + switch (data.status) { + case 0: + element.find('[data-action="status"]').html('Offline'); + break; + case 1: + element.find('[data-action="status"]').html('Online'); + break; + case 2: + element.find('[data-action="status"]').html('Starting'); + break; + case 3: + element.find('[data-action="status"]').html('Stopping'); + break; + } + if (data.status !== 0) { + var cpuMax = element.find('[data-action="cpu"]').data('cpumax'); + var currentCpu = data.proc.cpu.total; + if (cpuMax !== 0) { + currentCpu = parseFloat(((data.proc.cpu.total / cpuMax) * 100).toFixed(2).toString()); + } + element.find('[data-action="memory"]').html(parseInt(data.proc.memory.total / (1024 * 1024))); + element.find('[data-action="cpu"]').html(currentCpu); + } else { + element.find('[data-action="memory"]').html('--'); + element.find('[data-action="cpu"]').html('--'); + } + }).fail(function (jqXHR) { + console.error(jqXHR); + element.find('[data-action="status"]').html('Error'); + }); }); - }); - setTimeout(updateServerStatus, 10000); + setTimeout(updateServerStatus, 10000); + } + + return { + init: function () { + updateServerStatus(); + } + }; + })(); + +ServerList.init(); diff --git a/public/themes/pterodactyl/js/frontend/tasks.js b/public/themes/pterodactyl/js/frontend/tasks.js index 38563a92b..b19e19556 100644 --- a/public/themes/pterodactyl/js/frontend/tasks.js +++ b/public/themes/pterodactyl/js/frontend/tasks.js @@ -17,86 +17,99 @@ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // SOFTWARE. -(function initTaskFunctions() { - $('[data-action="delete-task"]').click(function (event) { - var self = $(this); - swal({ - type: 'error', - title: 'Delete Task?', - text: 'Are you sure you want to delete this task? There is no undo.', - showCancelButton: true, - allowOutsideClick: true, - closeOnConfirm: false, - confirmButtonText: 'Delete Task', - confirmButtonColor: '#d9534f', - showLoaderOnConfirm: true - }, function () { - $.ajax({ - method: 'DELETE', - url: Router.route('server.tasks.delete', { - server: Pterodactyl.server.uuidShort, - id: self.data('id'), - }), - headers: { - 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), - } - }).done(function (data) { - swal({ - type: 'success', - title: '', - text: 'Task has been deleted.' - }); - self.parent().parent().slideUp(); - }).fail(function (jqXHR) { - console.error(jqXHR); - swal({ - type: 'error', - title: 'Whoops!', - text: 'An error occured while attempting to delete this task.' + +var Tasks = (function () { + + function initTaskFunctions() { + $('[data-action="delete-task"]').click(function (event) { + var self = $(this); + swal({ + type: 'error', + title: 'Delete Task?', + text: 'Are you sure you want to delete this task? There is no undo.', + showCancelButton: true, + allowOutsideClick: true, + closeOnConfirm: false, + confirmButtonText: 'Delete Task', + confirmButtonColor: '#d9534f', + showLoaderOnConfirm: true + }, function () { + $.ajax({ + method: 'DELETE', + url: Router.route('server.tasks.delete', { + server: Pterodactyl.server.uuidShort, + id: self.data('id'), + }), + headers: { + 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), + } + }).done(function (data) { + swal({ + type: 'success', + title: '', + text: 'Task has been deleted.' + }); + self.parent().parent().slideUp(); + }).fail(function (jqXHR) { + console.error(jqXHR); + swal({ + type: 'error', + title: 'Whoops!', + text: 'An error occured while attempting to delete this task.' + }); }); }); }); - }); - $('[data-action="toggle-task"]').click(function (event) { - var self = $(this); - swal({ - type: 'info', - title: 'Toggle Task', - text: 'This will toggle the selected task.', - showCancelButton: true, - allowOutsideClick: true, - closeOnConfirm: false, - confirmButtonText: 'Continue', - showLoaderOnConfirm: true - }, function () { - $.ajax({ - method: 'POST', - url: Router.route('server.tasks.toggle', { - server: Pterodactyl.server.uuidShort, - id: self.data('id'), - }), - headers: { - 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), - } - }).done(function (data) { - swal({ - type: 'success', - title: '', - text: 'Task has been toggled.' - }); - if (data.status !== 1) { - self.parent().parent().addClass('muted muted-hover'); - } else { - self.parent().parent().removeClass('muted muted-hover'); - } - }).fail(function (jqXHR) { - console.error(jqXHR); - swal({ - type: 'error', - title: 'Whoops!', - text: 'An error occured while attempting to toggle this task.' + $('[data-action="toggle-task"]').click(function (event) { + var self = $(this); + swal({ + type: 'info', + title: 'Toggle Task', + text: 'This will toggle the selected task.', + showCancelButton: true, + allowOutsideClick: true, + closeOnConfirm: false, + confirmButtonText: 'Continue', + showLoaderOnConfirm: true + }, function () { + $.ajax({ + method: 'POST', + url: Router.route('server.tasks.toggle', { + server: Pterodactyl.server.uuidShort, + id: self.data('id'), + }), + headers: { + 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'), + } + }).done(function (data) { + swal({ + type: 'success', + title: '', + text: 'Task has been toggled.' + }); + if (data.status !== 1) { + self.parent().parent().addClass('muted muted-hover'); + } else { + self.parent().parent().removeClass('muted muted-hover'); + } + }).fail(function (jqXHR) { + console.error(jqXHR); + swal({ + type: 'error', + title: 'Whoops!', + text: 'An error occured while attempting to toggle this task.' + }); }); }); }); - }); + } + + return { + init: function () { + initTaskFunctions(); + } + } + })(); + +Tasks.init();