diff --git a/.glitch-assets b/.glitch-assets new file mode 100644 index 0000000..e69de29 diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..a54ac75 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,13 @@ +{ + "name": "cr-4241-a2-shortstack", + "version": "0.1.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "mime": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/mime/-/mime-2.6.0.tgz", + "integrity": "sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==" + } + } +} diff --git a/package.json b/package.json index 988f135..6a7ac75 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,12 @@ { - "name": "", - "version": "", - "description": "", - "author": "", + "name": "cr-4241-a2-shortstack", + "version": "0.1.0", + "description": "WPI CS 4241 second assignment", + "author": "Serena Mower", "scripts": { "start": "node server.improved.js" }, "dependencies": { - "mime": "^2.4.4" + "mime": "^2.6.0" } } diff --git a/public/css/style.css b/public/css/style.css index d5f842a..a234eba 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -1 +1,76 @@ -/*Style your own assignment! This is fun! */ \ No newline at end of file +/*Style your own assignment! This is fun! */ +@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap'); + +body { + text-align: center; + background-color: lightblue; + font-family: 'Courier Prime', monospace; + font-size: 20px; +} + +table { + text-align: left; + padding:2em; + color: black; + border: 2px solid black; + background-color: tan; + border-radius: 10px; +} + +input[type=text] { + background:transparent; + border: none; + border-bottom: 2px solid #000000; +} + +button { + transition-duration: 0.4s; + border-radius: 5px; + border-color: transparent; +} + +button:hover { + background-color: darkgray; + color:gray; +} + +.inputData { + margin-left: auto; + margin-right: auto; + text-align: left; + border-radius: 10px; + padding:2em; + color: black; +} + +.description { + margin-top:auto; + margin-bottom:auto; + width: 50em; + display: inline-block; +} + +.grid-container { + display: inline-grid +} + +.bookEntry { + color: black; + border: 2px solid black; + padding: 5px; + text-align: center; + +} + +#submitButton { + text-align: right; +} + +#currentData { + margin-left: auto; + margin-right: auto; + border: 20px; + border-collapse:collapse; +} + + diff --git a/public/index.html b/public/index.html index c56d620..463eec1 100644 --- a/public/index.html +++ b/public/index.html @@ -3,39 +3,54 @@ CS4241 Assignment 2 + -
- - -
+
+
+

Your Little Library

+

Welcome to Your Little Library! Keep track of all your books with this helpful website!

+

Enter a new book here!

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + +
Title of Book:
Author of Book:
Date Acquired (yyyy-mm-dd):
Have you read it yet? (Yes/No):
+
+

Enter the Book ID of the book you wish to burn (delete):

+
+ +

+
+

Your Bookshelf

+ + +
Book IDTitleAuthorAcquired DateRead Yet?Read Next Number
+
- diff --git a/public/js/scripts.js b/public/js/scripts.js index de052ea..92209be 100644 --- a/public/js/scripts.js +++ b/public/js/scripts.js @@ -1,3 +1,83 @@ -// Add some Javascript code here, to run on the front end. +const submit = function( e ) { + // prevent default form action from being carried out + e.preventDefault() -console.log("Welcome to assignment 2!") \ No newline at end of file + let title = document.querySelector("#title") + let author = document.querySelector("#author") + let acquiredDate = document.querySelector("#acquiredDate") + let readYet = document.querySelector("#readYet") + let readYetString = "" + + if ((readYet.value === "Yes") || (readYet.value === "yes")) { + readYetString = "Yes" + } else if ((readYet.value === "No") || (readYet.value === "no")) { + readYetString = "No" + } + + let json = { + "bookID": "", + "title": title.value, + "author": author.value, + "acquiredDate": acquiredDate.value, + "readYet": readYetString, + "readNextPos": "" + } + let body = JSON.stringify(json) + fetch( '/submit', { + method:'POST', + body + }) + .then( async function( response ) { + let library = await response.json() + refreshLibrary(library) + console.log( library ) + }) + return false + } + + function refreshLibrary(library) { + const bookshelf = document.getElementById("currentData") + bookshelf.innerHTML = "Book IDTitleAuthorAcquired DateRead Yet?Read Next Number" + + library.forEach((element, index) => { + let nonCSID = element.bookID + 1 + let nonCSPos = element.readNextPos + 1 + bookshelf.innerHTML += + "" + + nonCSID + "" + + element.title +"" + + element.author + "" + + element.acquiredDate + "" + + element.readYet + "" + + nonCSPos + "\n" + }) + } + + const deleteButton = function( e ) { + e.preventDefault() + + let bookID = document.querySelector("#deleteBookID") + + let json = { + "bookID": bookID.value + } + + let body = JSON.stringify(json) + fetch( '/deleteButton', { + method:'DELETE', + body + }) + .then( async function( response ) { + let library = await response.json() + refreshLibrary(library) + console.log( library ) + }) + return false + } + + window.onload = function() { + const button = document.getElementById( "submitButton" ) + button.onclick = submit + const deleteB = document.getElementById( "deleteButton" ) + deleteB.onclick = deleteButton + } diff --git a/server.improved.js b/server.improved.js index 26673fc..156b56c 100644 --- a/server.improved.js +++ b/server.improved.js @@ -6,17 +6,23 @@ const http = require( 'http' ), dir = 'public/', port = 3000 -const appdata = [ - { 'model': 'toyota', 'year': 1999, 'mpg': 23 }, - { 'model': 'honda', 'year': 2004, 'mpg': 30 }, - { 'model': 'ford', 'year': 1987, 'mpg': 14} -] +let appdata = [] + +//important to note that the way this array works (or at least is supposed to work) +//is that the key's are equal to the ranking they are at, and their values are the bookID. +//So readOrder[0] is supposed to equal the book that should be read the soonest +//aka the book that was aquired the longest ago and hasn't been read yet +let readOrder = [] + +let bookCount = 0 const server = http.createServer( function( request,response ) { if( request.method === 'GET' ) { handleGet( request, response ) }else if( request.method === 'POST' ){ handlePost( request, response ) + } else if ( request.method === 'DELETE' ){ + handleDelete( request, response ) } }) @@ -31,18 +37,121 @@ const handleGet = function( request, response ) { } const handlePost = function( request, response ) { - let dataString = '' - - request.on( 'data', function( data ) { + let dataString = "" + + request.on( "data", function( data ) { dataString += data }) - request.on( 'end', function() { + request.on( "end", function() { console.log( JSON.parse( dataString ) ) + let newSubmission = JSON.parse( dataString ) + console.log("newSubmission.readYet: " + newSubmission.readYet) + + //make a new book submission to the library data + newSubmission.bookID = bookCount + bookCount++ + const bookID = newSubmission.bookID + + //Below is supposed to sort and update readOrder and appdata + //It mostly works + + newSubmission.readNextPos = bookID + appdata.push( newSubmission ) + readOrder.push(bookID) + console.log( newSubmission ) + + readOrder = sort(readOrder, appdata) + + //puts the changed readNextPos into the appdata + readOrder.forEach((element, index) => { + let oldElement = appdata[element] + oldElement.readNextPos = index + oldElement.bookID = element + appdata[element] = oldElement + }) - // ... do something with the data here!!! + response.writeHead( 200, "OK", {'Content-Type': 'text/plain' }) + response.write( JSON.stringify( appdata )) + console.log(appdata) + response.end() + }) +} +const handleDelete = function ( request, response ) { + let dataString = "" + + request.on( "data", function( data ) { + dataString += data + }) + + request.on( "end", function() { + console.log( JSON.parse( dataString ) ) + let deleteRequest = JSON.parse( dataString ) + const deletedBookID = deleteRequest.bookID - 1 + deleteRequest.bookID = deletedBookID + const readOrderIndex = deleteRequest.readNextPos + if (!(bookCount == 0)) { + bookCount-- + } + + let newAppData = [] + let newReadOrder = [] + + //This is supposed to delete the element from appdata + //The first forEach loop adds all the elements smaller than the ID to newAppData + appdata.forEach((element, index) => { + console.log(element) + if (index < deletedBookID) { + newAppData.push(element) + } + //if the index is greater than the BookID being removed, the bookID is supposed + //to be lowered by one + else if (index > deletedBookID) { + let intRep = parseInt(element.bookID) + intRep-- + intRep.toString() + console.log(intRep) + element.bookID = intRep + newAppData.push(element) + } + }) + + //same thing as above but for readOrder + readOrder.forEach((element, index) => { + if (element < deletedBookID) { + newReadOrder.push(element) + } + else if (element > deletedBookID) { + element-- + newReadOrder.push(element) + } + }) + + //just some code to put the new arrays back into the old ones + appdata = [] + readOrder = [] + + newAppData.forEach((element, index) => { + appdata.push(element) + }) + + newReadOrder.forEach((element, index) => { + readOrder.push(element) + }) + + readOrder = sort(readOrder, appdata) + + //puts the changed readNextPos into the appdata + readOrder.forEach((element, index) => { + let oldElement = appdata[element] + oldElement.readNextPos = index + appdata[element] = oldElement + }) + response.writeHead( 200, "OK", {'Content-Type': 'text/plain' }) + response.write( JSON.stringify( appdata )) + console.log(appdata) response.end() }) } @@ -69,4 +178,109 @@ const sendFile = function( response, filename ) { }) } +//sort function +const sort = function(arr, arr2) { + for(let i = 1; i < arr2.length; i++) { + for(let j = i-1; j > -1; j--) { + let jPlus = j+1 + let returned = compareElems(jPlus, j, arr2) + console.log("Returned: " + returned + ", j+1: " + jPlus) + if (returned === j+1) { + [arr[j+1],arr[j]] = [arr[j],arr[j+1]] + } + } + } + return arr +} + +//helping sort function to compare whether ReadYet? is true and then calls compareDates +const compareElems = function( first, second, arr ) { + let firstEl = arr[first] + let firstRY = firstEl.readYet + let firstAD = firstEl.acquiredDate + let correctAD = firstAD + + let secondEl = arr[second] + let secondRY = secondEl.readYet + let secondAD = secondEl.acquiredDate + + if (firstRY === "No") { + if (secondRY === "No") { + console.log("Both No") + correctAD = compareDates(firstAD, secondAD) + } + else if (secondRY === "Yes") { + console.log("First No") + return first + } + } + else if (firstRY === "Yes") { + if (secondRY === "No") { + console.log("Second No") + return second + } + else if (secondRY === "Yes") { + console.log("Both Yes") + correctAD = compareDates(firstAD, secondAD) + } + } + console.log("CorrectAD: " + correctAD) + if (correctAD === firstAD) { + return first + } + else if (correctAD === secondAD) { + return second + } +} + +//compares the Dates +const compareDates = function( first, second ) { //yyyy-mm-dd + const firstYear = first.substring(0,4) + const firstY = parseInt(firstYear) + const firstMonth = first.substring(5,7) + const firstM = parseInt(firstMonth) + const firstDay = first.substring(8,10) + const firstD = parseInt(firstDay) + + const secondYear = second.substring(0,4) + const secondY = parseInt(secondYear) + const secondMonth = second.substring(5,7) + const secondM = parseInt(secondMonth) + const secondDay = second.substring(8,10) + const secondD = parseInt(secondDay) + + if (firstY < secondY) { + console.log("FirstY: " + firstY) + return first + } + else if (secondY < firstY) { + console.log("SecondY: " + secondY) + return second + } + else if (firstY === secondY) { + if (firstM < secondM) { + console.log("FirstM: " + firstM) + return first + } + else if (secondM < firstM) { + console.log("SecondM: " + secondM) + return second + } + else if (firstM === secondM) { + if (firstD < secondD) { + console.log("FirstD: " + firstD) + return first + } + else if (secondD < firstD) { + console.log("SecondD: " + secondD) + return second + } + else if (firstD === secondD) { + console.log("FirstD: " + firstD + "by default") + return first + } + } + } +} + server.listen( process.env.PORT || port ) diff --git a/shrinkwrap.yaml b/shrinkwrap.yaml new file mode 100644 index 0000000..ed455a9 --- /dev/null +++ b/shrinkwrap.yaml @@ -0,0 +1,15 @@ +dependencies: + mime: 2.6.0 +packages: + /mime/2.6.0: + dev: false + engines: + node: '>=4.0.0' + hasBin: true + resolution: + integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg== +registry: 'https://registry.npmjs.org/' +shrinkwrapMinorVersion: 9 +shrinkwrapVersion: 3 +specifiers: + mime: ^2.6.0