diff --git a/public/assets/js/createChannelFunctions.js b/public/assets/js/createChannelFunctions.js index faef7189..379c9430 100644 --- a/public/assets/js/createChannelFunctions.js +++ b/public/assets/js/createChannelFunctions.js @@ -24,7 +24,7 @@ function publishNewChannel (event) { // prevent default so this script can handle submission event.preventDefault(); // validate submission - validateNewChannelSubmission(userName, password) + validationFunctions.validateNewChannelSubmission(userName, password) .then(() => { showChannelCreateInProgressDisplay(); return sendAuthRequest(userName, password, '/signup') // post the request diff --git a/public/assets/js/loginFunctions.js b/public/assets/js/loginFunctions.js index 4dfa3a20..5f3a13b0 100644 --- a/public/assets/js/loginFunctions.js +++ b/public/assets/js/loginFunctions.js @@ -47,7 +47,7 @@ function loginToChannel (event) { const password = document.getElementById('channel-login-password-input').value; // prevent default event.preventDefault() - validateNewChannelLogin(userName, password) + validationFunctions.validateNewChannelLogin(userName, password) .then(() => { // send request return sendAuthRequest(userName, password, '/login') @@ -71,9 +71,9 @@ function loginToChannel (event) { .catch(error => { const loginErrorDisplayElement = document.getElementById('login-error-display-element'); if (error.name){ - showError(loginErrorDisplayElement, error.message); + validationFunctions.showError(loginErrorDisplayElement, error.message); } else { - showError(loginErrorDisplayElement, 'There was an error logging into your channel'); + validationFunctions.showError(loginErrorDisplayElement, 'There was an error logging into your channel'); } }) } diff --git a/public/assets/js/publishFileFunctions.js b/public/assets/js/publishFileFunctions.js index 279d5960..6dfb8060 100644 --- a/public/assets/js/publishFileFunctions.js +++ b/public/assets/js/publishFileFunctions.js @@ -12,9 +12,9 @@ var publishFileFunctions = { // When a file is selected for publish, validate that file and // stage it so it will be ready when the publish button is clicked try { - validateFile(selectedFile); // validate the file's name, type, and size + validationFunctions.validateFile(selectedFile); // validate the file's name, type, and size } catch (error) { - showError(fileSelectionInputError, error.message); + validationFunctions.showError(fileSelectionInputError, error.message); return; } // set image preview, if an image was provided @@ -36,8 +36,8 @@ var publishFileFunctions = { const nameInput = document.getElementById('claim-name-input'); if (nameInput.value === "") { var filename = selectedFile.name.substring(0, selectedFile.name.indexOf('.')) - nameInput.value = cleanseClaimName(filename); - checkClaimName(nameInput.value); + nameInput.value = validationFunctions.cleanseClaimName(filename); + validationFunctions.checkClaimName(nameInput.value); } }, setImagePreview: function (selectedFile) { @@ -99,7 +99,6 @@ var publishFileFunctions = { } }, appendDataToFormData: function (file, metadata) { - console.log(metadata); var fd = new FormData(); fd.append('file', file) for (var key in metadata) { @@ -156,20 +155,20 @@ var publishFileFunctions = { const channelSelectError = document.getElementById('input-error-channel-select'); const publishSubmitError = document.getElementById('input-error-publish-submit'); // validate, submit, and handle response - validateFilePublishSubmission(stagedFiles, metadata) + validationFunctions.validateFilePublishSubmission(stagedFiles, metadata) .then( function() { that.publishFile(stagedFiles[0], metadata); }) .catch(error => { if (error.name === 'FileError') { - showError(fileSelectionInputError, error.message); + validationFunctions.showError(fileSelectionInputError, error.message); } else if (error.name === 'NameError') { - showError(claimNameError, error.message); + validationFunctions.showError(claimNameError, error.message); } else if (error.name === 'ChannelNameError'){ console.log(error); - showError(channelSelectError, error.message); + validationFunctions.showError(channelSelectError, error.message); } else { - showError(publishSubmitError, error.message); + validationFunctions.showError(publishSubmitError, error.message); } return; }) diff --git a/public/assets/js/validationFunctions.js b/public/assets/js/validationFunctions.js index a1814203..60ecf341 100644 --- a/public/assets/js/validationFunctions.js +++ b/public/assets/js/validationFunctions.js @@ -1,239 +1,231 @@ // validation function which checks the proposed file's type, size, and name -function validateFile(file) { - if (!file) { - console.log('no file found'); - throw new Error('no file provided'); - } - if (/'/.test(file.name)) { - console.log('file name had apostrophe in it'); - throw new Error('apostrophes are not allowed in the file name'); - } - // validate size and type - switch (file.type) { - case 'image/jpeg': - case 'image/jpg': - case 'image/png': - if (file.size > 10000000){ - console.log('file was too big'); - throw new Error('Sorry, images are limited to 10 megabytes.'); - } - break; - case 'image/gif': - if (file.size > 50000000){ - console.log('file was too big'); - throw new Error('Sorry, .gifs are limited to 50 megabytes.'); - } - break; - case 'video/mp4': - if (file.size > 50000000){ - console.log('file was too big'); - throw new Error('Sorry, videos are limited to 50 megabytes.'); - } - break; - default: - console.log('file type is not supported'); - throw new Error(file.type + ' is not a supported file type. Only, .jpeg, .png, .gif, and .mp4 files are currently supported.') - } -} - -// validation function that checks to make sure the claim name is valid -function validateClaimName (name) { - console.log('validating the claim name'); - // ensure a name was entered - if (name.length < 1) { - throw new NameError("You must enter a name for your url"); - } - // validate the characters in the 'name' field - const invalidCharacters = /[^A-Za-z0-9,-]/g.exec(name); - if (invalidCharacters) { - throw new NameError('"' + invalidCharacters + '" characters are not allowed'); - } -} - -function validateChannelName (name) { - name = name.substring(name.indexOf('@') + 1); - // ensure a name was entered - if (name.length < 1) { - throw new ChannelNameError("You must enter a name for your channel"); - } - // validate the characters in the 'name' field - const invalidCharacters = /[^A-Za-z0-9,-,@]/g.exec(name); - if (invalidCharacters) { - throw new ChannelNameError('"' + invalidCharacters + '" characters are not allowed'); - } -} - -function validatePassword (password) { - if (password.length < 1) { - throw new ChannelPasswordError("You must enter a password for you channel"); - } -} - -function cleanseClaimName(name) { - name = name.replace(/\s+/g, '-'); // replace spaces with dashes - name = name.replace(/[^A-Za-z0-9-]/g, ''); // remove all characters that are not A-Z, a-z, 0-9, or '-' - return name; -} - -// validation functions to check claim & channel name eligibility as the inputs change - -function isNameAvailable (name, apiUrl) { - const url = apiUrl + name; - return getRequest(url) -} - -function showError(errorDisplay, errorMsg) { - errorDisplay.hidden = false; - errorDisplay.innerText = errorMsg; -} - -function hideError(errorDisplay) { - errorDisplay.hidden = true; - errorDisplay.innerText = ''; -} - -function showSuccess (successElement) { - successElement.hidden = false; - successElement.innerHTML = "✔"; -} - -function hideSuccess (successElement) { - successElement.hidden = true; - successElement.innerHTML = ""; -} - -function checkAvailability(name, successDisplayElement, errorDisplayElement, validateName, isNameAvailable, errorMessage, apiUrl) { - try { - // check to make sure the characters are valid - validateName(name); - // check to make sure it is available - isNameAvailable(name, apiUrl) - .then(result => { - if (result === true) { - hideError(errorDisplayElement); - showSuccess(successDisplayElement) - } else { - hideSuccess(successDisplayElement); - showError(errorDisplayElement, errorMessage); +var validationFunctions = { + validateFile: function (file) { + if (!file) { + console.log('no file found'); + throw new Error('no file provided'); + } + if (/'/.test(file.name)) { + console.log('file name had apostrophe in it'); + throw new Error('apostrophes are not allowed in the file name'); + } + // validate size and type + switch (file.type) { + case 'image/jpeg': + case 'image/jpg': + case 'image/png': + if (file.size > 10000000) { + console.log('file was too big'); + throw new Error('Sorry, images are limited to 10 megabytes.'); } - }) - .catch(error => { - hideSuccess(successDisplayElement); - showError(errorDisplayElement, error.message); - }); - } catch (error) { - hideSuccess(successDisplayElement); - showError(errorDisplayElement, error.message); - } -} - -function checkClaimName(name){ - const successDisplayElement = document.getElementById('input-success-claim-name'); - const errorDisplayElement = document.getElementById('input-error-claim-name'); - checkAvailability(name, successDisplayElement, errorDisplayElement, validateClaimName, isNameAvailable, 'Sorry, that ending is already taken', '/api/isClaimAvailable/'); -} - -function checkChannelName(name){ - const successDisplayElement = document.getElementById('input-success-channel-name'); - const errorDisplayElement = document.getElementById('input-error-channel-name'); - name = `@${name}`; - checkAvailability(name, successDisplayElement, errorDisplayElement, validateChannelName, isNameAvailable, 'Sorry, that name is already taken', '/api/isChannelAvailable/'); -} - -// validation function which checks all aspects of the publish submission -function validateFilePublishSubmission(stagedFiles, metadata){ - const channelName = metadata.channelName; - const claimName = metadata.name; - return new Promise(function (resolve, reject) { - // 1. make sure 1 file was staged - if (!stagedFiles) { - reject(new FileError("Please select a file")); - return; - } else if (stagedFiles.length > 1) { - reject(new FileError("Only one file is allowed at a time")); - return; - } - // 2. validate the file's name, type, and size - try { - validateFile(stagedFiles[0]); - } catch (error) { - reject(error); - return; - } - // 3. validate that a channel was chosen - if (channelName === 'new' || channelName === 'login') { - reject(new ChannelNameError("Please log in to a channel")); - return; - }; - // 4. validate the claim name - try { - validateClaimName(claimName); - } catch (error) { - reject(error); - return; - } - // if all validation passes, check availability of the name (note: do we need to re-validate channel name vs. credentials as well?) - return isNameAvailable(claimName, '/api/isClaimAvailable/') - .then(result => { - if (result) { - resolve(); - } else { - reject(new NameError('Sorry, that ending is already taken')); + break; + case 'image/gif': + if (file.size > 50000000) { + console.log('file was too big'); + throw new Error('Sorry, .gifs are limited to 50 megabytes.'); } - }) - .catch(error => { + break; + case 'video/mp4': + if (file.size > 50000000) { + console.log('file was too big'); + throw new Error('Sorry, videos are limited to 50 megabytes.'); + } + break; + default: + console.log('file type is not supported'); + throw new Error(file.type + ' is not a supported file type. Only, .jpeg, .png, .gif, and .mp4 files are currently supported.') + } + }, + // validation function that checks to make sure the claim name is valid + validateClaimName: function (name) { + console.log('validating the claim name'); + // ensure a name was entered + if (name.length < 1) { + throw new NameError("You must enter a name for your url"); + } + // validate the characters in the 'name' field + const invalidCharacters = /[^A-Za-z0-9,-]/g.exec(name); + if (invalidCharacters) { + throw new NameError('"' + invalidCharacters + '" characters are not allowed'); + } + }, + validateChannelName: function (name) { + name = name.substring(name.indexOf('@') + 1); + // ensure a name was entered + if (name.length < 1) { + throw new ChannelNameError("You must enter a name for your channel"); + } + // validate the characters in the 'name' field + const invalidCharacters = /[^A-Za-z0-9,-,@]/g.exec(name); + if (invalidCharacters) { + throw new ChannelNameError('"' + invalidCharacters + '" characters are not allowed'); + } + }, + validatePassword: function (password) { + if (password.length < 1) { + throw new ChannelPasswordError("You must enter a password for you channel"); + } + }, + cleanseClaimName: function (name) { + name = name.replace(/\s+/g, '-'); // replace spaces with dashes + name = name.replace(/[^A-Za-z0-9-]/g, ''); // remove all characters that are not A-Z, a-z, 0-9, or '-' + return name; + }, + // validation functions to check claim & channel name eligibility as the inputs change + isNameAvailable: function (name, apiUrl) { + const url = apiUrl + name; + return getRequest(url) + }, + showError: function (errorDisplay, errorMsg) { + errorDisplay.hidden = false; + errorDisplay.innerText = errorMsg; + }, + hideError: function (errorDisplay) { + errorDisplay.hidden = true; + errorDisplay.innerText = ''; + }, + showSuccess: function (successElement) { + successElement.hidden = false; + successElement.innerHTML = "✔"; + }, + hideSuccess: function (successElement) { + successElement.hidden = true; + successElement.innerHTML = ""; + }, + checkAvailability: function (name, successDisplayElement, errorDisplayElement, validateName, errorMessage, apiUrl) { + var that = this; + try { + // check to make sure the characters are valid + validateName(name); + // check to make sure it is available + that.isNameAvailable(name, apiUrl) + .then(function (result) { + if (result === true) { + that.hideError(errorDisplayElement); + that.showSuccess(successDisplayElement) + } else { + that.hideSuccess(successDisplayElement); + that.showError(errorDisplayElement, errorMessage); + } + }) + .catch(error => { + that.hideSuccess(successDisplayElement); + that.showError(errorDisplayElement, error.message); + }); + } catch (error) { + that.hideSuccess(successDisplayElement); + that.showError(errorDisplayElement, error.message); + } + }, + checkClaimName: function (name) { + const successDisplayElement = document.getElementById('input-success-claim-name'); + const errorDisplayElement = document.getElementById('input-error-claim-name'); + this.checkAvailability(name, successDisplayElement, errorDisplayElement, this.validateClaimName, 'Sorry, that ending is already taken', '/api/isClaimAvailable/'); + }, + checkChannelName: function (name) { + const successDisplayElement = document.getElementById('input-success-channel-name'); + const errorDisplayElement = document.getElementById('input-error-channel-name'); + name = `@${name}`; + this.checkAvailability(name, successDisplayElement, errorDisplayElement, this.validateChannelName, 'Sorry, that name is already taken', '/api/isChannelAvailable/'); + }, + // validation function which checks all aspects of the publish submission + validateFilePublishSubmission: function (stagedFiles, metadata) { + const channelName = metadata.channelName; + const claimName = metadata.name; + var that = this; + return new Promise(function (resolve, reject) { + // 1. make sure 1 file was staged + if (!stagedFiles) { + reject(new FileError("Please select a file")); + return; + } else if (stagedFiles.length > 1) { + reject(new FileError("Only one file is allowed at a time")); + return; + } + // 2. validate the file's name, type, and size + try { + that.validateFile(stagedFiles[0]); + } catch (error) { reject(error); - }); - }); -} - -// validation function which checks all aspects of a new channel submission -function validateNewChannelSubmission(userName, password){ - const channelName = `@${userName}`; - return new Promise(function (resolve, reject) { - // 1. validate name - try { - validateChannelName(channelName); - } catch (error) { - return reject(error); - } - // 2. validate password - try { - validatePassword(password); - } catch (error) { - return reject(error); - } - // 3. if all validation passes, check availability of the name - isNameAvailable(channelName, '/api/isChannelAvailable/') // validate the availability - .then(result => { - if (result) { - resolve(); - } else { - reject(new ChannelNameError('Sorry, that name is already taken')); - } - }) - .catch( error => { - console.log('error evaluating channel name availability', error); + return; + } + // 3. validate that a channel was chosen + if (channelName === 'new' || channelName === 'login') { + reject(new ChannelNameError("Please log in to a channel")); + return; + } + ; + // 4. validate the claim name + try { + that.validateClaimName(claimName); + } catch (error) { reject(error); - }); - }); -} -// validation function which checks all aspects of a new channel login -function validateNewChannelLogin(userName, password){ - const channelName = `@${userName}`; - return new Promise(function (resolve, reject) { - // 1. validate name - try { - validateChannelName(channelName); - } catch (error) { - return reject(error); - } - // 2. validate password - try { - validatePassword(password); - } catch (error) { - return reject(error); - } - resolve(); - }); -} \ No newline at end of file + return; + } + // if all validation passes, check availability of the name (note: do we need to re-validate channel name vs. credentials as well?) + return that.isNameAvailable(claimName, '/api/isClaimAvailable/') + .then(result => { + if (result) { + resolve(); + } else { + reject(new NameError('Sorry, that ending is already taken')); + } + }) + .catch(error => { + reject(error); + }); + }); + }, + // validation function which checks all aspects of a new channel submission + validateNewChannelSubmission: function (userName, password) { + const channelName = `@${userName}`; + var that = this; + return new Promise(function (resolve, reject) { + // 1. validate name + try { + that.validateChannelName(channelName); + } catch (error) { + return reject(error); + } + // 2. validate password + try { + that.validatePassword(password); + } catch (error) { + return reject(error); + } + // 3. if all validation passes, check availability of the name + that.isNameAvailable(channelName, '/api/isChannelAvailable/') // validate the availability + .then(function(result) { + if (result) { + resolve(); + } else { + reject(new ChannelNameError('Sorry, that name is already taken')); + } + }) + .catch(function(error) { + console.log('error evaluating channel name availability', error); + reject(error); + }); + }); + }, + // validation function which checks all aspects of a new channel login + validateNewChannelLogin: function (userName, password) { + const channelName = `@${userName}`; + var that = this; + return new Promise(function (resolve, reject) { + // 1. validate name + try { + that.validateChannelName(channelName); + } catch (error) { + return reject(error); + } + // 2. validate password + try { + that.validatePassword(password); + } catch (error) { + return reject(error); + } + resolve(); + }); + } +}; \ No newline at end of file diff --git a/views/partials/channelCreationForm.handlebars b/views/partials/channelCreationForm.handlebars index 685edad9..911deae5 100644 --- a/views/partials/channelCreationForm.handlebars +++ b/views/partials/channelCreationForm.handlebars @@ -6,7 +6,7 @@
@ - +
diff --git a/views/partials/publishForm-Url.handlebars b/views/partials/publishForm-Url.handlebars index 5e88224b..d5200ae4 100644 --- a/views/partials/publishForm-Url.handlebars +++ b/views/partials/publishForm-Url.handlebars @@ -9,7 +9,7 @@ {{user.channelName}}:{{user.shortChannelId}} xyzThis will be a random id / - +