diff --git a/public/scripts/manage.js b/public/scripts/manage.js index 1f4ff7e..8b0221b 100644 --- a/public/scripts/manage.js +++ b/public/scripts/manage.js @@ -10,13 +10,12 @@ function getGenderLetter(genderName) { } class Category { - constructor(name, getItems, listHeaders, listItem, addItem, submitItem, editItem) { + constructor(name, getItems, listHeaders, listItem, addItem, editItem) { this.name = name; this.getItems = getItems; this.listHeaders = listHeaders; this.listItem = listItem; this.addItem = addItem; - this.submitItem = submitItem; this.editItem = editItem; } } @@ -85,10 +84,10 @@ CATEGORIES.push(new Category( row.appendChild(spacerCell); }, async function addSport() { - window.location.href = "/manage/addsport"; + window.location.href = `/manage/sport`; }, - async function editSport() { - + async function editSport(id) { + window.location.href = `/manage/sport?sport=${id}` } )); @@ -294,6 +293,9 @@ async function listItems(category) { const editSpan = document.createElement('span'); const editButton = document.createElement('button'); editButton.textContent = "E"; + editButton.addEventListener('click', () => { + CATEGORIES[categoryDropdown.selectedIndex].editItem(item.id); + }); editSpan.appendChild(editButton); manageCell.appendChild(editSpan); diff --git a/public/scripts/manage/sport.js b/public/scripts/manage/sport.js new file mode 100644 index 0000000..2b12593 --- /dev/null +++ b/public/scripts/manage/sport.js @@ -0,0 +1,43 @@ +import * as Data from "../data.js"; + + +const mainHeader = document.getElementById('main-header'); +const nameTextbox = document.getElementById('name-textbox'); +const submitButton = document.getElementById('submit-button'); +const deleteButton = document.getElementById('delete-button'); +const submissionForm = document.getElementById('submission-form'); + + +async function initializeForm() { + let params = new URLSearchParams(location.search); + let sportID = params.get('sport') + if(sportID) { + mainHeader.textContent = "Edit Sport"; + + const sportName = await Data.getSportName(sportID); + + nameTextbox.value = sportName; + deleteButton.style.visibility = "visible"; + deleteButton.disabled = false; + + const sportIDInput = document.createElement('input'); + sportIDInput.setAttribute('name', 'sport'); + sportIDInput.setAttribute('value', sportID); + sportIDInput.setAttribute('type', 'hidden'); + submissionForm.appendChild(sportIDInput); + } + nameTextbox.disabled = false; + + nameTextbox.addEventListener('keyup', checkDataValidity); +} +initializeForm(); + +async function checkDataValidity() { + let dataIsValid = true; + + if(!nameTextbox.value) dataIsValid = false; + + + if(dataIsValid) submitButton.disabled = false; + else submitButton.disabled = true; +} \ No newline at end of file diff --git a/public/stylesheets/form.css b/public/stylesheets/form.css index 85b34bc..21abe10 100644 --- a/public/stylesheets/form.css +++ b/public/stylesheets/form.css @@ -31,4 +31,8 @@ form { #submit-button { margin-top: 1.5em; + } + + #delete-button { + visibility: hidden; } \ No newline at end of file diff --git a/routes/manage.js b/routes/manage.js index 04b2b9a..a42f734 100644 --- a/routes/manage.js +++ b/routes/manage.js @@ -33,7 +33,7 @@ router.post('/submitgame', function(req, res, next) { }); router.get('/addseason', function(req, res, next) { - res.render('manage/addseason', { title: 'Add season', currentYear : (new Date()).getFullYear() }); + res.render('manage/addseason', { title: 'Add Season', currentYear : (new Date()).getFullYear() }); }); router.post('/submitseason', function(req, res, next) { @@ -43,15 +43,16 @@ router.post('/submitseason', function(req, res, next) { .then(res.send("SUCCESS")); }); -router.get('/addsport', function(req, res, next) { - res.render('manage/addsport', { title: 'Add sport' }); +router.get('/sport', function(req, res, next) { + res.render('manage/addsport', { title: 'Add Sport' }); }); -router.post('/submitsport', function(req, res, next) { +router.post('/sport', function(req, res, next) { const name = req.body['name']; + const id = req.body['sport']; - sports.add(name) - .then(res.send("SUCCESS")); + if(id) sports.rename(id, name).then(res.redirect('/manage')); + else sports.add(name).then(res.redirect('/manage')); }); router.get('/adddivision', function(req, res, next) { diff --git a/views/manage/addsport.pug b/views/manage/addsport.pug index 7f7e5ad..5251b7e 100644 --- a/views/manage/addsport.pug +++ b/views/manage/addsport.pug @@ -6,14 +6,17 @@ block stylesheets block content div#mobile-view - h1 Add Sport - form(action='./submitsport', method='POST') + h1#main-header Add Sport + form#submission-form(action='./sport', method='POST') span(class='form-section') label Sport name span(class='form-section-input') - input(type="text", name="name") + input#name-textbox(type="text" name="name" disabled) span(class='form-section') - button#submit-button(type="submit") Submit + button#submit-button(type="submit" disabled) Submit + span(class='form-section') + button#delete-button(disabled) Delete + block scripts - script(src='/scripts/sport.js' type="module") \ No newline at end of file + script(src='/scripts/manage/sport.js' type="module") \ No newline at end of file