Fix linter issues and update variable declarations to es6 in the js

This commit is contained in:
Kevin MacMartin 2016-08-01 21:26:54 -04:00
parent f07402573e
commit 5f836e518f
5 changed files with 208 additions and 199 deletions

View file

@ -1,13 +1,13 @@
// run once the document is ready // run once the document is ready
$(document).ready(function() { $(document).ready(function() {
$('footer').stickyFooter({ content: '#page-content' }); $("footer").stickyFooter({ content: "#page-content" });
$(window).load(function() { $(this).trigger('resize'); }); $(window).load(function() { $(this).trigger("resize"); });
switch (SiteVars.page) { switch (SiteVars.page) {
case '': case "":
subscriptionFormInit(); subscriptionFormInit();
break; break;
case 'contact': case "contact":
contactFormInit(); contactFormInit();
break; break;
} }

View file

@ -1,55 +1,59 @@
// contact form functionality // contact form functionality
function contactFormInit() { function contactFormInit() {
var $form = $('#contact-form'), const $form = $("#contact-form"),
$input = $form.find(':input'), $input = $form.find(":input"),
$notify = $('#notification'), $notify = $("#notification");
contact = {},
let contact = {},
submitting = false; submitting = false;
var getContactData = function() { const getContactData = function() {
contact = { contact = {
name: $('#name').val(), name: $("#name").val(),
email: $('#email').val(), email: $("#email").val(),
message: $('#message').val(), message: $("#message").val(),
_token: $('#token').val() _token: $("#token").val()
}; };
}; };
$('#submit').on('click', function(e) { $("#submit").on("click", function(e) {
const $submit = $(this);
e.preventDefault(); e.preventDefault();
var $submit = $(this);
if (!submitting) { if (!submitting) {
submitting = true; submitting = true;
getContactData(); getContactData();
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url: '/contact-submit', url: "/contact-submit",
data: contact data: contact
}).always(function(response) { }).always(function(response) {
$form.find('.error').removeClass('error'); let responseJSON, errors, prop;
$notify.removeClass('visible');
if (response === 'success') { $form.find(".error").removeClass("error");
$input.attr('disabled', true); $notify.removeClass("visible");
$submit.addClass('disabled');
$notify.text('Thanks for your message!').addClass('success').addClass('visible'); if (response === "success") {
$input.attr("disabled", true);
$submit.addClass("disabled");
$notify.text("Thanks for your message!").addClass("success").addClass("visible");
} else { } else {
var responseJSON = response.responseJSON, responseJSON = response.responseJSON;
errors = 0; errors = 0;
// add the error class to fields that haven't been filled out // 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)) { if (responseJSON.hasOwnProperty(prop)) {
$('#' + prop).addClass('error'); $("#" + prop).addClass("error");
errors++; errors++;
} }
} }
if (errors > 0) { if (errors > 0) {
$notify.find('span').text(errors); $notify.find("span").text(errors);
$notify.addClass('visible'); $notify.addClass("visible");
} }
// re-enable submitting // re-enable submitting

View file

@ -3,157 +3,154 @@ jQuery.fn.reverse = [].reverse;
// show the confirmation modal and run the supplied command if confirm is pressed // show the confirmation modal and run the supplied command if confirm is pressed
function askConfirmation(message, command) { function askConfirmation(message, command) {
var $confirmationModal = $('#confirmation-modal'), const $confirmationModal = $("#confirmation-modal"),
$heading = $confirmationModal.find('.panel-heading'), $heading = $confirmationModal.find(".panel-heading"),
$cancelButton = $confirmationModal.find('.btn.cancel-button'), $cancelButton = $confirmationModal.find(".btn.cancel-button"),
$confirmButton = $confirmationModal.find('.btn.confirm-button'), $confirmButton = $confirmationModal.find(".btn.confirm-button"),
fadeTime = 250; fadeTime = 250;
// close the confirmation modal and unbind its events // close the confirmation modal and unbind its events
var closeConfirmationModal = function() { const closeConfirmationModal = function() {
// unbind events // unbind events
$(document).off('keyup', escapeModal); $(document).off("keyup", escapeModal);
$cancelButton.off('click', closeConfirmationModal); $cancelButton.off("click", closeConfirmationModal);
$confirmButton.off('click', confirmModal); $confirmButton.off("click", confirmModal);
// clear the heading // clear the heading
$heading.empty(); $heading.empty();
// hide the modal // hide the modal
$confirmationModal.css({ opacity: 0 }); $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 // close the modal if the escape button is pressed
var escapeModal = function(e) { const escapeModal = function(e) {
if (e.keyCode == 27) if (e.keyCode === 27) { closeConfirmationModal(); }
closeConfirmationModal();
}; };
// functionality to run when clicking the confirm button // functionality to run when clicking the confirm button
var confirmModal = function() { const confirmModal = function() {
command(); command();
closeConfirmationModal(); closeConfirmationModal();
}; };
// hide the modal when the cancel button is pressed // 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 // 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 // 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 // set the heading with the supplied message
$heading.text(message); $heading.text(message);
// show the confirmation modal // show the confirmation modal
$confirmationModal.css({ $confirmationModal.css({
visibility: 'visible', visibility: "visible",
opacity: 1 opacity: 1
}); });
} }
// show the alert modal and display the provided message until accept is pressed // show the alert modal and display the provided message until accept is pressed
function showAlert(message, command) { function showAlert(message, command) {
var $alertModal = $('#alert-modal'), const $alertModal = $("#alert-modal"),
$message = $alertModal.find('.message'), $message = $alertModal.find(".message"),
$acceptButton = $alertModal.find('.btn.accept-button'), $acceptButton = $alertModal.find(".btn.accept-button"),
fadeTime = 250; fadeTime = 250;
// close the alert modal and unbind its events // close the alert modal and unbind its events
var closeAlertModal = function() { const closeAlertModal = function() {
// unbind events // unbind events
$(document).off('keyup', escapeModal); $(document).off("keyup", escapeModal);
$acceptButton.off('click', closeAlertModal); $acceptButton.off("click", closeAlertModal);
// clear the message // clear the message
$message.empty(); $message.empty();
// hide the modal // hide the modal
$alertModal.css({ opacity: 0 }); $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 a command was passed run it now
if (command !== undefined) if (command !== undefined) { command(); }
command();
}; };
// close the modal if the escape button is pressed // close the modal if the escape button is pressed
var escapeModal = function(e) { const escapeModal = function(e) {
if (e.keyCode == 27) if (e.keyCode === 27) { closeAlertModal(); }
closeAlertModal();
}; };
// hide the modal when the escape key is pressed // 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 // hide the modal when the accept button is pressed
$acceptButton.on('click', closeAlertModal); $acceptButton.on("click", closeAlertModal);
// set the message with the supplied message // set the message with the supplied message
$message.text(message); $message.text(message);
// show the alert modal // show the alert modal
$alertModal.css({ $alertModal.css({
visibility: 'visible', visibility: "visible",
opacity: 1 opacity: 1
}); });
} }
// initialize edit list functionality // initialize edit list functionality
function editListInit() { function editListInit() {
var editList = document.getElementById('edit-list'), const editList = document.getElementById("edit-list"),
$editList = $(editList), $editList = $(editList),
model = $editList.data('model'); model = $editList.data("model");
// initialize new button functionality // initialize new button functionality
var newButtonInit = function() { const newButtonInit = function() {
var $newButton = $('.btn.new-button'); const $newButton = $(".btn.new-button");
$newButton.on('click', function() { $newButton.on("click", function() {
window.location.href = '/dashboard/' + model + '-edit/new'; window.location.href = "/dashboard/" + model + "-edit/new";
}); });
}; };
// initialize edit button functionality // initialize edit button functionality
var editButtonInit = function() { const editButtonInit = function() {
var $editButtons = $('.btn.edit-button'); const $editButtons = $(".btn.edit-button");
$editButtons.on('click', function() { $editButtons.on("click", function() {
var $this = $(this), const $this = $(this),
$listItem = $this.closest('.list-group-item'), $listItem = $this.closest(".list-group-item"),
itemId = $listItem.data('id'); itemId = $listItem.data("id");
// go to the edit page // go to the edit page
window.location.href = '/dashboard/' + model + '-edit/' + itemId; window.location.href = "/dashboard/" + model + "-edit/" + itemId;
}); });
}; };
// initialize delete button functionality // initialize delete button functionality
var deleteButtonInit = function() { const deleteButtonInit = function() {
var $deleteButtons = $('.btn.delete-button'); const $deleteButtons = $(".btn.delete-button");
$deleteButtons.on('click', function() { $deleteButtons.on("click", function() {
var $this = $(this), const $this = $(this),
$listItem = $this.closest('.list-group-item'), $listItem = $this.closest(".list-group-item"),
itemId = $listItem.data('id'); 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({ $.ajax({
type: 'DELETE', type: "DELETE",
url: '/dashboard/delete', url: "/dashboard/delete",
data: { data: {
model: model, model: model,
id: itemId, id: itemId,
_token: $('#token').val() _token: $("#token").val()
} }
}).always(function(response) { }).always(function(response) {
if (response === 'success') { if (response === "success") {
$listItem.slideUp(150, function() { $listItem.remove(); }); $listItem.slideUp(150, function() { $listItem.remove(); });
} else { } 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 // initialize sort functionality if data-sort is set
var sortRowInit = function() { const sortRowInit = function() {
if ($editList.attr('data-sort')) { let sortOrder = {}, sortCol, sortable;
var sortCol = $editList.data('sort'),
sortOrder = {};
var sortable = Sortable.create(editList, { if ($editList.attr("data-sort")) {
handle: '.sort-icon', sortCol = $editList.data("sort");
sortable = Sortable.create(editList, {
handle: ".sort-icon",
onUpdate: function() { onUpdate: function() {
// update the sortOrder object based on the updated order // update the sortOrder object based on the updated order
$editList.find('.list-group-item').reverse().each(function(index) { $editList.find(".list-group-item").reverse().each(function(index) {
var thisId = $(this).data('id'); sortOrder[$(this).data("id")] = index;
sortOrder[thisId] = index;
}); });
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url: '/dashboard/reorder', url: "/dashboard/reorder",
data: { data: {
model: model, model: model,
order: sortOrder, order: sortOrder,
column: sortCol, column: sortCol,
_token: $('#token').val() _token: $("#token").val()
} }
}).always(function(response) { }).always(function(response) {
if (response !== 'success') { if (response !== "success") {
showAlert('ERROR: Sorting failed', function() { showAlert("ERROR: Sorting failed", function() {
document.location.reload(true); document.location.reload(true);
}); });
} }
@ -203,41 +200,44 @@ function editListInit() {
} }
function editItemInit() { function editItemInit() {
var $editItem = $('#edit-item'), const $editItem = $("#edit-item"),
$submit = $('#submit'), $submit = $("#submit"),
$backButton = $('#back'), $backButton = $("#back"),
$textInputs = $('.text-input'), $textInputs = $(".text-input"),
$dateTimePickers = $('.date-time-picker'), $dateTimePickers = $(".date-time-picker"),
$mkdEditors = $('.mkd-editor'), $mkdEditors = $(".mkd-editor"),
$imgUpload = $('#image-upload'), $imgUpload = $("#image-upload"),
$token = $('#_token'), $token = $("#_token"),
$spinner = $('#loading-modal'), $spinner = $("#loading-modal"),
fadeTime = 250, fadeTime = 250,
model = $editItem.data('model'), model = $editItem.data("model"),
id = $editItem.data('id'), id = $editItem.data("id");
allowTimes = [],
let allowTimes = [],
simplemde = [], simplemde = [],
formData = {}, formData = {},
submitting = false; submitting = false,
hours,
minutes;
// show the loading modal // show the loading modal
var showLoadingModal = function() { const showLoadingModal = function() {
$spinner.css({ $spinner.css({
visibility: 'visible', visibility: "visible",
opacity: 1 opacity: 1
}); });
}; };
// hide the loading modal // hide the loading modal
var hideLoadingModal = function() { const hideLoadingModal = function() {
$spinner.css({ opacity: 0 }); $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 // 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 // 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 // add the value to a key with the column name
formData[column] = value; formData[column] = value;
@ -258,8 +258,8 @@ function editItemInit() {
// add values from the contents of text-input class elements // add values from the contents of text-input class elements
$textInputs.each(function() { $textInputs.each(function() {
var $this = $(this), const $this = $(this),
column = $this.attr('id'), column = $this.attr("id"),
value = $this.val(); value = $this.val();
addFormData(column, value); addFormData(column, value);
@ -267,52 +267,54 @@ function editItemInit() {
// add values from the contents of date-time-picker class elements // add values from the contents of date-time-picker class elements
$dateTimePickers.each(function() { $dateTimePickers.each(function() {
var $this = $(this), const $this = $(this),
column = $this.attr('id'), column = $this.attr("id"),
value = $this.val() + ':00'; value = $this.val() + ":00";
addFormData(column, value); addFormData(column, value);
}); });
// add values from the contents of the markdown editor for mkd-editor class elements // add values from the contents of the markdown editor for mkd-editor class elements
$mkdEditors.each(function() { $mkdEditors.each(function() {
var $this = $(this), const $this = $(this),
column = $this.attr('id'), column = $this.attr("id"),
value = simplemde[column].value(); value = simplemde[column].value();
addFormData(column, value); addFormData(column, value);
}); });
}; };
var uploadImage = function(row_id) { const uploadImage = function(row_id) {
let file;
// functionality to run on success // functionality to run on success
var returnSuccess = function() { const returnSuccess = function() {
hideLoadingModal(); hideLoadingModal();
window.location.href = '/dashboard/' + model; window.location.href = "/dashboard/" + model;
}; };
// add the image from the image upload box for image-upload class elements // add the image from the image upload box for image-upload class elements
if ($imgUpload.length && $imgUpload.val() !== '') { if ($imgUpload.length && $imgUpload.val() !== "") {
var file = new FormData(); file = new FormData();
// add the file, id and model to the formData variable // add the file, id and model to the formData variable
file.append('file', $imgUpload[0].files[0]); file.append("file", $imgUpload[0].files[0]);
file.append('id', row_id); file.append("id", row_id);
file.append('model', model); file.append("model", model);
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url: '/dashboard/image-upload', url: "/dashboard/image-upload",
data: file, data: file,
processData: false, processData: false,
contentType: 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) { }).always(function(response) {
if (response === 'success') { if (response === "success") {
returnSuccess(); returnSuccess();
} else { } else {
hideLoadingModal(); hideLoadingModal();
showAlert('ERROR: Failed to upload image'); showAlert("ERROR: Failed to upload image");
submitting = false; submitting = false;
} }
}); });
@ -322,16 +324,16 @@ function editItemInit() {
}; };
// allow start time selection to start on the hour and every 15 minutes after // allow start time selection to start on the hour and every 15 minutes after
for (var hours=0; hours<=23; hours++) { for (hours = 0; hours <= 23; hours++) {
for (var minutes=0; minutes<=3; minutes++) { for (minutes = 0; minutes <= 3; minutes++) {
allowTimes.push(hours + ':' + (minutes === 0 ? '00' : minutes * 15)); allowTimes.push(hours + ":" + (minutes === 0 ? "00" : minutes * 15));
} }
} }
// enable the datetimepicker for each element with the date-time-picker class // enable the datetimepicker for each element with the date-time-picker class
$dateTimePickers.each(function() { $dateTimePickers.each(function() {
$(this).datetimepicker({ $(this).datetimepicker({
format: 'Y-m-d H:i', format: "Y-m-d H:i",
allowTimes: allowTimes, allowTimes: allowTimes,
step: 15 step: 15
}); });
@ -339,46 +341,46 @@ function editItemInit() {
// enable the markdown editor for each element with the mkd-editor class // enable the markdown editor for each element with the mkd-editor class
$mkdEditors.each(function() { $mkdEditors.each(function() {
var $this = $(this), const $this = $(this),
column = $this.attr('id'); column = $this.attr("id");
simplemde[column] = new SimpleMDE({ simplemde[column] = new SimpleMDE({
element: this, element: this,
toolbar: [ toolbar: [
'bold', "bold",
'italic', "italic",
'|', "|",
'heading-1', "heading-1",
'heading-2', "heading-2",
'heading-3', "heading-3",
'|', "|",
'quote', "quote",
'unordered-list', "unordered-list",
'ordered-list', "ordered-list",
'link' "link"
], ],
blockStyles: { italic: '_' }, blockStyles: { italic: "_" },
autoDownloadFontAwesome: false, autoDownloadFontAwesome: false,
tabSize: 4, tabSize: 4,
spellChecker: false spellChecker: false
}); });
setTimeout(function() { setTimeout(function() {
simplemde[column].value($this.attr('value')); simplemde[column].value($this.attr("value"));
}, 100); }, 100);
}); });
// initialize back button // initialize back button
$backButton.on('click', function() { $backButton.on("click", function() {
if (!submitting) { if (!submitting) {
askConfirmation('Cancel and return to the ' + model + ' list?', function() { askConfirmation("Cancel and return to the " + model + " list?", function() {
window.location.href = '/dashboard/' + model; window.location.href = "/dashboard/" + model;
}); });
} }
}); });
// initialize submit button // initialize submit button
$submit.on('click', function() { $submit.on("click", function() {
if (!submitting) { if (!submitting) {
submitting = true; submitting = true;
@ -390,15 +392,15 @@ function editItemInit() {
// submit the update // submit the update
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url: '/dashboard/edit', url: "/dashboard/edit",
data: formData data: formData
}).always(function(response) { }).always(function(response) {
if (/^id:[0-9][0-9]*$/.test(response)) { if (/^id:[0-9][0-9]*$/.test(response)) {
uploadImage(response.replace(/^id:/, '')); uploadImage(response.replace(/^id:/, ""));
} else { } else {
hideLoadingModal(); hideLoadingModal();
showAlert('ERROR: Failed to update record'); showAlert("ERROR: Failed to update record");
submitting = false; submitting = false;
} }
}); });
@ -408,9 +410,9 @@ function editItemInit() {
// run once the document is ready // run once the document is ready
$(document).ready(function() { $(document).ready(function() {
if ($('#edit-list').length) { if ($("#edit-list").length) {
editListInit(); editListInit();
} else if ($('#edit-item').length) { } else if ($("#edit-item").length) {
editItemInit(); editItemInit();
} }
}); });

View file

@ -1,3 +1,3 @@
var SiteVars = { let SiteVars = {
page: location.href.replace(/^[^:]*:\/\/[^\/]*\//, '').replace(/(\/|#|\?).*/, '') page: location.href.replace(/^[^:]*:\/\/[^\/]*\//, "").replace(/(\/|#|\?).*/, "")
}; };

View file

@ -1,58 +1,61 @@
// subscription form functionality // subscription form functionality
function subscriptionFormInit() { function subscriptionFormInit() {
var $form = $('#subscription-form'), const $form = $("#subscription-form"),
$input = $form.find(':input'), $input = $form.find(":input"),
$notify = $('#notification'), $notify = $("#notification");
subscribe = {},
let subscribe = {},
submitting = false; submitting = false;
var getSubscribeData = function() { const getSubscribeData = function() {
subscribe = { subscribe = {
name: $('#name').val(), name: $("#name").val(),
email: $('#email').val(), email: $("#email").val(),
address: $('#address').val(), address: $("#address").val(),
_token: $('#token').val() _token: $("#token").val()
}; };
}; };
$('#submit').on('click', function(e) { $("#submit").on("click", function(e) {
e.preventDefault(); e.preventDefault();
var $submit = $(this);
if (!submitting) { if (!submitting) {
submitting = true; submitting = true;
getSubscribeData(); getSubscribeData();
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url: '/subscription-submit', url: "/subscription-submit",
data: subscribe data: subscribe
}).always(function(response) { }).always(function(response) {
$form.find('.error').removeClass('error'); let responseJSON, errors, prop;
$notify.removeClass('visible').removeClass('error');
if (response === 'success') { $form.find(".error").removeClass("error");
$form.addClass('success'); $notify.removeClass("visible").removeClass("error");
if (response === "success") {
$form.addClass("success");
setTimeout(function() { setTimeout(function() {
$notify.text('Thanks for subscribing!').addClass('success').addClass('visible'); $notify.text("Thanks for subscribing!").addClass("success").addClass("visible");
$input.fadeOut(150); $input.fadeOut(150);
}, 1000); }, 1000);
} else { } else {
var responseJSON = response.responseJSON, responseJSON = response.responseJSON;
errors = 0; errors = 0;
// add the error class to fields that haven't been filled out // 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)) { if (responseJSON.hasOwnProperty(prop)) {
$('#' + prop).addClass('error'); $("#" + prop).addClass("error");
errors++; errors++;
} }
} }
// if there are no errors with form fields then there must have been an API error // if there are no errors with form fields then there must have been an API error
if (errors === 0) if (errors === 0) {
$notify.text('An error occurred. Are you already subscribed?').addClass('error').addClass('visible'); $notify.text("An error occurred. Are you already subscribed?").addClass("error").addClass("visible");
}
// re-enable submitting // re-enable submitting
submitting = false; submitting = false;