From 5f836e518f47c3fecd48a98c0b5cc5160db25443 Mon Sep 17 00:00:00 2001 From: Kevin MacMartin Date: Mon, 1 Aug 2016 21:26:54 -0400 Subject: [PATCH] Fix linter issues and update variable declarations to es6 in the js --- resources/assets/js/app.js | 8 +- resources/assets/js/contact.js | 54 +++--- resources/assets/js/dashboard.js | 290 ++++++++++++++-------------- resources/assets/js/site-vars.js | 4 +- resources/assets/js/subscription.js | 51 ++--- 5 files changed, 208 insertions(+), 199 deletions(-) diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js index a767c80..f339a57 100644 --- a/resources/assets/js/app.js +++ b/resources/assets/js/app.js @@ -1,13 +1,13 @@ // run once the document is ready $(document).ready(function() { - $('footer').stickyFooter({ content: '#page-content' }); - $(window).load(function() { $(this).trigger('resize'); }); + $("footer").stickyFooter({ content: "#page-content" }); + $(window).load(function() { $(this).trigger("resize"); }); switch (SiteVars.page) { - case '': + case "": subscriptionFormInit(); break; - case 'contact': + case "contact": contactFormInit(); break; } diff --git a/resources/assets/js/contact.js b/resources/assets/js/contact.js index 396a7d9..c376afd 100644 --- a/resources/assets/js/contact.js +++ b/resources/assets/js/contact.js @@ -1,55 +1,59 @@ // contact form functionality function contactFormInit() { - var $form = $('#contact-form'), - $input = $form.find(':input'), - $notify = $('#notification'), - contact = {}, + const $form = $("#contact-form"), + $input = $form.find(":input"), + $notify = $("#notification"); + + let contact = {}, submitting = false; - var getContactData = function() { + const getContactData = function() { contact = { - name: $('#name').val(), - email: $('#email').val(), - message: $('#message').val(), - _token: $('#token').val() + name: $("#name").val(), + email: $("#email").val(), + message: $("#message").val(), + _token: $("#token").val() }; }; - $('#submit').on('click', function(e) { + $("#submit").on("click", function(e) { + const $submit = $(this); + e.preventDefault(); - var $submit = $(this); if (!submitting) { submitting = true; getContactData(); $.ajax({ - type: 'POST', - url: '/contact-submit', + type: "POST", + url: "/contact-submit", data: contact }).always(function(response) { - $form.find('.error').removeClass('error'); - $notify.removeClass('visible'); + let responseJSON, errors, prop; - if (response === 'success') { - $input.attr('disabled', true); - $submit.addClass('disabled'); - $notify.text('Thanks for your message!').addClass('success').addClass('visible'); + $form.find(".error").removeClass("error"); + $notify.removeClass("visible"); + + if (response === "success") { + $input.attr("disabled", true); + $submit.addClass("disabled"); + $notify.text("Thanks for your message!").addClass("success").addClass("visible"); } else { - var responseJSON = response.responseJSON, - errors = 0; + responseJSON = response.responseJSON; + errors = 0; // add the error class to fields that haven't been filled out - for (var prop in responseJSON) { + for (prop in responseJSON) { if (responseJSON.hasOwnProperty(prop)) { - $('#' + prop).addClass('error'); + $("#" + prop).addClass("error"); errors++; } } if (errors > 0) { - $notify.find('span').text(errors); - $notify.addClass('visible'); + $notify.find("span").text(errors); + $notify.addClass("visible"); } // re-enable submitting diff --git a/resources/assets/js/dashboard.js b/resources/assets/js/dashboard.js index 35b20c8..cecea2a 100644 --- a/resources/assets/js/dashboard.js +++ b/resources/assets/js/dashboard.js @@ -3,157 +3,154 @@ jQuery.fn.reverse = [].reverse; // show the confirmation modal and run the supplied command if confirm is pressed function askConfirmation(message, command) { - var $confirmationModal = $('#confirmation-modal'), - $heading = $confirmationModal.find('.panel-heading'), - $cancelButton = $confirmationModal.find('.btn.cancel-button'), - $confirmButton = $confirmationModal.find('.btn.confirm-button'), + const $confirmationModal = $("#confirmation-modal"), + $heading = $confirmationModal.find(".panel-heading"), + $cancelButton = $confirmationModal.find(".btn.cancel-button"), + $confirmButton = $confirmationModal.find(".btn.confirm-button"), fadeTime = 250; // close the confirmation modal and unbind its events - var closeConfirmationModal = function() { + const closeConfirmationModal = function() { // unbind events - $(document).off('keyup', escapeModal); - $cancelButton.off('click', closeConfirmationModal); - $confirmButton.off('click', confirmModal); + $(document).off("keyup", escapeModal); + $cancelButton.off("click", closeConfirmationModal); + $confirmButton.off("click", confirmModal); // clear the heading $heading.empty(); // hide the modal $confirmationModal.css({ opacity: 0 }); - setTimeout(function() { $confirmationModal.css({ visibility: 'hidden' }); }, fadeTime); + setTimeout(function() { $confirmationModal.css({ visibility: "hidden" }); }, fadeTime); }; // close the modal if the escape button is pressed - var escapeModal = function(e) { - if (e.keyCode == 27) - closeConfirmationModal(); + const escapeModal = function(e) { + if (e.keyCode === 27) { closeConfirmationModal(); } }; // functionality to run when clicking the confirm button - var confirmModal = function() { + const confirmModal = function() { command(); closeConfirmationModal(); }; // hide the modal when the cancel button is pressed - $cancelButton.on('click', closeConfirmationModal); + $cancelButton.on("click", closeConfirmationModal); // hide the modal when the escape key is pressed - $(document).on('keyup', escapeModal); + $(document).on("keyup", escapeModal); // run the command and hide the modal when the confirm button is pressed - $confirmButton.on('click', confirmModal); + $confirmButton.on("click", confirmModal); // set the heading with the supplied message $heading.text(message); // show the confirmation modal $confirmationModal.css({ - visibility: 'visible', + visibility: "visible", opacity: 1 }); } // show the alert modal and display the provided message until accept is pressed function showAlert(message, command) { - var $alertModal = $('#alert-modal'), - $message = $alertModal.find('.message'), - $acceptButton = $alertModal.find('.btn.accept-button'), + const $alertModal = $("#alert-modal"), + $message = $alertModal.find(".message"), + $acceptButton = $alertModal.find(".btn.accept-button"), fadeTime = 250; // close the alert modal and unbind its events - var closeAlertModal = function() { + const closeAlertModal = function() { // unbind events - $(document).off('keyup', escapeModal); - $acceptButton.off('click', closeAlertModal); + $(document).off("keyup", escapeModal); + $acceptButton.off("click", closeAlertModal); // clear the message $message.empty(); // hide the modal $alertModal.css({ opacity: 0 }); - setTimeout(function() { $alertModal.css({ visibility: 'hidden' }); }, fadeTime); + setTimeout(function() { $alertModal.css({ visibility: "hidden" }); }, fadeTime); // if a command was passed run it now - if (command !== undefined) - command(); + if (command !== undefined) { command(); } }; // close the modal if the escape button is pressed - var escapeModal = function(e) { - if (e.keyCode == 27) - closeAlertModal(); + const escapeModal = function(e) { + if (e.keyCode === 27) { closeAlertModal(); } }; // hide the modal when the escape key is pressed - $(document).on('keyup', escapeModal); + $(document).on("keyup", escapeModal); // hide the modal when the accept button is pressed - $acceptButton.on('click', closeAlertModal); + $acceptButton.on("click", closeAlertModal); // set the message with the supplied message $message.text(message); // show the alert modal $alertModal.css({ - visibility: 'visible', + visibility: "visible", opacity: 1 }); } // initialize edit list functionality function editListInit() { - var editList = document.getElementById('edit-list'), + const editList = document.getElementById("edit-list"), $editList = $(editList), - model = $editList.data('model'); + model = $editList.data("model"); // initialize new button functionality - var newButtonInit = function() { - var $newButton = $('.btn.new-button'); + const newButtonInit = function() { + const $newButton = $(".btn.new-button"); - $newButton.on('click', function() { - window.location.href = '/dashboard/' + model + '-edit/new'; + $newButton.on("click", function() { + window.location.href = "/dashboard/" + model + "-edit/new"; }); }; // initialize edit button functionality - var editButtonInit = function() { - var $editButtons = $('.btn.edit-button'); + const editButtonInit = function() { + const $editButtons = $(".btn.edit-button"); - $editButtons.on('click', function() { - var $this = $(this), - $listItem = $this.closest('.list-group-item'), - itemId = $listItem.data('id'); + $editButtons.on("click", function() { + const $this = $(this), + $listItem = $this.closest(".list-group-item"), + itemId = $listItem.data("id"); // go to the edit page - window.location.href = '/dashboard/' + model + '-edit/' + itemId; + window.location.href = "/dashboard/" + model + "-edit/" + itemId; }); }; // initialize delete button functionality - var deleteButtonInit = function() { - var $deleteButtons = $('.btn.delete-button'); + const deleteButtonInit = function() { + const $deleteButtons = $(".btn.delete-button"); - $deleteButtons.on('click', function() { - var $this = $(this), - $listItem = $this.closest('.list-group-item'), - itemId = $listItem.data('id'); + $deleteButtons.on("click", function() { + const $this = $(this), + $listItem = $this.closest(".list-group-item"), + itemId = $listItem.data("id"); - askConfirmation('Are you sure you want to delete this?', function() { + askConfirmation("Are you sure you want to delete this?", function() { $.ajax({ - type: 'DELETE', - url: '/dashboard/delete', + type: "DELETE", + url: "/dashboard/delete", data: { - model: model, - id: itemId, - _token: $('#token').val() + model: model, + id: itemId, + _token: $("#token").val() } }).always(function(response) { - if (response === 'success') { + if (response === "success") { $listItem.slideUp(150, function() { $listItem.remove(); }); } else { - showAlert('ERROR: Failed to delete record'); + showAlert("ERROR: Failed to delete record"); } }); }); @@ -161,32 +158,32 @@ function editListInit() { }; // initialize sort functionality if data-sort is set - var sortRowInit = function() { - if ($editList.attr('data-sort')) { - var sortCol = $editList.data('sort'), - sortOrder = {}; + const sortRowInit = function() { + let sortOrder = {}, sortCol, sortable; - var sortable = Sortable.create(editList, { - handle: '.sort-icon', + if ($editList.attr("data-sort")) { + sortCol = $editList.data("sort"); + + sortable = Sortable.create(editList, { + handle: ".sort-icon", onUpdate: function() { // update the sortOrder object based on the updated order - $editList.find('.list-group-item').reverse().each(function(index) { - var thisId = $(this).data('id'); - sortOrder[thisId] = index; + $editList.find(".list-group-item").reverse().each(function(index) { + sortOrder[$(this).data("id")] = index; }); $.ajax({ - type: 'POST', - url: '/dashboard/reorder', + type: "POST", + url: "/dashboard/reorder", data: { - model: model, - order: sortOrder, + model: model, + order: sortOrder, column: sortCol, - _token: $('#token').val() + _token: $("#token").val() } }).always(function(response) { - if (response !== 'success') { - showAlert('ERROR: Sorting failed', function() { + if (response !== "success") { + showAlert("ERROR: Sorting failed", function() { document.location.reload(true); }); } @@ -203,41 +200,44 @@ function editListInit() { } function editItemInit() { - var $editItem = $('#edit-item'), - $submit = $('#submit'), - $backButton = $('#back'), - $textInputs = $('.text-input'), - $dateTimePickers = $('.date-time-picker'), - $mkdEditors = $('.mkd-editor'), - $imgUpload = $('#image-upload'), - $token = $('#_token'), - $spinner = $('#loading-modal'), + const $editItem = $("#edit-item"), + $submit = $("#submit"), + $backButton = $("#back"), + $textInputs = $(".text-input"), + $dateTimePickers = $(".date-time-picker"), + $mkdEditors = $(".mkd-editor"), + $imgUpload = $("#image-upload"), + $token = $("#_token"), + $spinner = $("#loading-modal"), fadeTime = 250, - model = $editItem.data('model'), - id = $editItem.data('id'), - allowTimes = [], + model = $editItem.data("model"), + id = $editItem.data("id"); + + let allowTimes = [], simplemde = [], formData = {}, - submitting = false; + submitting = false, + hours, + minutes; // show the loading modal - var showLoadingModal = function() { + const showLoadingModal = function() { $spinner.css({ - visibility: 'visible', + visibility: "visible", opacity: 1 }); }; // hide the loading modal - var hideLoadingModal = function() { + const hideLoadingModal = function() { $spinner.css({ opacity: 0 }); - setTimeout(function() { $spinner.css({ visibility: 'hidden' }); }, fadeTime); + setTimeout(function() { $spinner.css({ visibility: "hidden" }); }, fadeTime); }; // fill the formData object with data from all the form fields - var getFormData = function() { + const getFormData = function() { // function to add a column and value to the formData object - var addFormData = function(column, value) { + const addFormData = function(column, value) { // add the value to a key with the column name formData[column] = value; @@ -258,8 +258,8 @@ function editItemInit() { // add values from the contents of text-input class elements $textInputs.each(function() { - var $this = $(this), - column = $this.attr('id'), + const $this = $(this), + column = $this.attr("id"), value = $this.val(); addFormData(column, value); @@ -267,52 +267,54 @@ function editItemInit() { // add values from the contents of date-time-picker class elements $dateTimePickers.each(function() { - var $this = $(this), - column = $this.attr('id'), - value = $this.val() + ':00'; + const $this = $(this), + column = $this.attr("id"), + value = $this.val() + ":00"; addFormData(column, value); }); // add values from the contents of the markdown editor for mkd-editor class elements $mkdEditors.each(function() { - var $this = $(this), - column = $this.attr('id'), + const $this = $(this), + column = $this.attr("id"), value = simplemde[column].value(); addFormData(column, value); }); }; - var uploadImage = function(row_id) { + const uploadImage = function(row_id) { + let file; + // functionality to run on success - var returnSuccess = function() { + const returnSuccess = function() { hideLoadingModal(); - window.location.href = '/dashboard/' + model; + window.location.href = "/dashboard/" + model; }; // add the image from the image upload box for image-upload class elements - if ($imgUpload.length && $imgUpload.val() !== '') { - var file = new FormData(); + if ($imgUpload.length && $imgUpload.val() !== "") { + file = new FormData(); // add the file, id and model to the formData variable - file.append('file', $imgUpload[0].files[0]); - file.append('id', row_id); - file.append('model', model); + file.append("file", $imgUpload[0].files[0]); + file.append("id", row_id); + file.append("model", model); $.ajax({ - type: 'POST', - url: '/dashboard/image-upload', - data: file, + type: "POST", + url: "/dashboard/image-upload", + data: file, processData: false, contentType: false, - beforeSend: function(xhr) { xhr.setRequestHeader('X-CSRF-TOKEN', $token.val()); } + beforeSend: function(xhr) { xhr.setRequestHeader("X-CSRF-TOKEN", $token.val()); } }).always(function(response) { - if (response === 'success') { + if (response === "success") { returnSuccess(); } else { hideLoadingModal(); - showAlert('ERROR: Failed to upload image'); + showAlert("ERROR: Failed to upload image"); submitting = false; } }); @@ -322,16 +324,16 @@ function editItemInit() { }; // allow start time selection to start on the hour and every 15 minutes after - for (var hours=0; hours<=23; hours++) { - for (var minutes=0; minutes<=3; minutes++) { - allowTimes.push(hours + ':' + (minutes === 0 ? '00' : minutes * 15)); + for (hours = 0; hours <= 23; hours++) { + for (minutes = 0; minutes <= 3; minutes++) { + allowTimes.push(hours + ":" + (minutes === 0 ? "00" : minutes * 15)); } } // enable the datetimepicker for each element with the date-time-picker class $dateTimePickers.each(function() { $(this).datetimepicker({ - format: 'Y-m-d H:i', + format: "Y-m-d H:i", allowTimes: allowTimes, step: 15 }); @@ -339,46 +341,46 @@ function editItemInit() { // enable the markdown editor for each element with the mkd-editor class $mkdEditors.each(function() { - var $this = $(this), - column = $this.attr('id'); + const $this = $(this), + column = $this.attr("id"); simplemde[column] = new SimpleMDE({ element: this, toolbar: [ - 'bold', - 'italic', - '|', - 'heading-1', - 'heading-2', - 'heading-3', - '|', - 'quote', - 'unordered-list', - 'ordered-list', - 'link' + "bold", + "italic", + "|", + "heading-1", + "heading-2", + "heading-3", + "|", + "quote", + "unordered-list", + "ordered-list", + "link" ], - blockStyles: { italic: '_' }, + blockStyles: { italic: "_" }, autoDownloadFontAwesome: false, tabSize: 4, spellChecker: false }); setTimeout(function() { - simplemde[column].value($this.attr('value')); + simplemde[column].value($this.attr("value")); }, 100); }); // initialize back button - $backButton.on('click', function() { + $backButton.on("click", function() { if (!submitting) { - askConfirmation('Cancel and return to the ' + model + ' list?', function() { - window.location.href = '/dashboard/' + model; + askConfirmation("Cancel and return to the " + model + " list?", function() { + window.location.href = "/dashboard/" + model; }); } }); // initialize submit button - $submit.on('click', function() { + $submit.on("click", function() { if (!submitting) { submitting = true; @@ -390,15 +392,15 @@ function editItemInit() { // submit the update $.ajax({ - type: 'POST', - url: '/dashboard/edit', + type: "POST", + url: "/dashboard/edit", data: formData }).always(function(response) { if (/^id:[0-9][0-9]*$/.test(response)) { - uploadImage(response.replace(/^id:/, '')); + uploadImage(response.replace(/^id:/, "")); } else { hideLoadingModal(); - showAlert('ERROR: Failed to update record'); + showAlert("ERROR: Failed to update record"); submitting = false; } }); @@ -408,9 +410,9 @@ function editItemInit() { // run once the document is ready $(document).ready(function() { - if ($('#edit-list').length) { + if ($("#edit-list").length) { editListInit(); - } else if ($('#edit-item').length) { + } else if ($("#edit-item").length) { editItemInit(); } }); diff --git a/resources/assets/js/site-vars.js b/resources/assets/js/site-vars.js index faa586d..e57b915 100644 --- a/resources/assets/js/site-vars.js +++ b/resources/assets/js/site-vars.js @@ -1,3 +1,3 @@ -var SiteVars = { - page: location.href.replace(/^[^:]*:\/\/[^\/]*\//, '').replace(/(\/|#|\?).*/, '') +let SiteVars = { + page: location.href.replace(/^[^:]*:\/\/[^\/]*\//, "").replace(/(\/|#|\?).*/, "") }; diff --git a/resources/assets/js/subscription.js b/resources/assets/js/subscription.js index d2808cd..a30577e 100644 --- a/resources/assets/js/subscription.js +++ b/resources/assets/js/subscription.js @@ -1,58 +1,61 @@ // subscription form functionality function subscriptionFormInit() { - var $form = $('#subscription-form'), - $input = $form.find(':input'), - $notify = $('#notification'), - subscribe = {}, + const $form = $("#subscription-form"), + $input = $form.find(":input"), + $notify = $("#notification"); + + let subscribe = {}, submitting = false; - var getSubscribeData = function() { + const getSubscribeData = function() { subscribe = { - name: $('#name').val(), - email: $('#email').val(), - address: $('#address').val(), - _token: $('#token').val() + name: $("#name").val(), + email: $("#email").val(), + address: $("#address").val(), + _token: $("#token").val() }; }; - $('#submit').on('click', function(e) { + $("#submit").on("click", function(e) { e.preventDefault(); - var $submit = $(this); if (!submitting) { submitting = true; getSubscribeData(); $.ajax({ - type: 'POST', - url: '/subscription-submit', + type: "POST", + url: "/subscription-submit", data: subscribe }).always(function(response) { - $form.find('.error').removeClass('error'); - $notify.removeClass('visible').removeClass('error'); + let responseJSON, errors, prop; - if (response === 'success') { - $form.addClass('success'); + $form.find(".error").removeClass("error"); + $notify.removeClass("visible").removeClass("error"); + + if (response === "success") { + $form.addClass("success"); setTimeout(function() { - $notify.text('Thanks for subscribing!').addClass('success').addClass('visible'); + $notify.text("Thanks for subscribing!").addClass("success").addClass("visible"); $input.fadeOut(150); }, 1000); } else { - var responseJSON = response.responseJSON, - errors = 0; + responseJSON = response.responseJSON; + errors = 0; // add the error class to fields that haven't been filled out - for (var prop in responseJSON) { + for (prop in responseJSON) { if (responseJSON.hasOwnProperty(prop)) { - $('#' + prop).addClass('error'); + $("#" + prop).addClass("error"); errors++; } } // if there are no errors with form fields then there must have been an API error - if (errors === 0) - $notify.text('An error occurred. Are you already subscribed?').addClass('error').addClass('visible'); + if (errors === 0) { + $notify.text("An error occurred. Are you already subscribed?").addClass("error").addClass("visible"); + } // re-enable submitting submitting = false;