From 1a1c2cced27863c37929ff90a49fe044040d0d54 Mon Sep 17 00:00:00 2001 From: Kenneth Jao Date: Thu, 19 Apr 2018 16:10:18 -0400 Subject: [PATCH 1/3] Added updating posts --- SmearcarDB/static/index.css | 59 ++++++++++++----- SmearcarDB/static/index.js | 113 ++++++++++++++++++++++++-------- SmearcarDB/templates/index.html | 24 +++++++ 3 files changed, 153 insertions(+), 43 deletions(-) diff --git a/SmearcarDB/static/index.css b/SmearcarDB/static/index.css index ae09500..182390e 100644 --- a/SmearcarDB/static/index.css +++ b/SmearcarDB/static/index.css @@ -170,6 +170,10 @@ a { opacity: 1; } +#home > div { + margin-bottom: 2vh; +} + .card { display: grid; border-radius: 2px; @@ -359,7 +363,7 @@ a { background-color: rgba(0, 0, 0, 0.05); } -#newLanguage, #editLanguage, #login, #addUser { +#newLanguage, #editLanguage, #login, #addUser, #writePost { position: absolute; width: 100%; height: 100%; @@ -368,7 +372,7 @@ a { background-color: rgba(0,0,0,0.4); } -#newLanguage > div, #editLanguage > div, #login > div, #addUser > div { +#newLanguage > div, #editLanguage > div, #login > div, #addUser > div, #writePost > div { position: absolute; width: 20%; height: 60%; @@ -388,11 +392,19 @@ a { grid-template-rows: 6vh 1fr 1fr 1fr 1fr; } -#loginUsername, #loginPassword, #addUserUsername, #addUserPassword { +#writePost > div { + margin-left: 30%; + margin-right: 30%; + width: 40%; + height: 60%; + grid-template-rows: 6vh 1fr 1fr 8fr 2fr; +} + +#loginUsername, #loginPassword, #addUserUsername, #addUserPassword, #writePostText, #writePostAuthor, #writePostTitle { margin-left: 5%; } -#login input, #addUser input { +#login input, #addUser input, #writePost textarea, #writePost input { border: 0; background-color: rgba(0,0,0,0.1); font-family: 'Saira Condensed', sans-serif; @@ -400,9 +412,20 @@ a { font-weight: 300; padding: 2%; width: 90%; + outline: none; } -#newLanguageName, #editLanguageName, #loginUsername, #addUserUsername { +#writePost input { + padding: 1%; + font-size: 100%; +} + +#writePost textarea { + height: 80%; + resize: none; +} + +#newLanguageName, #editLanguageName, #loginUsername, #addUserUsername, #writePostTitle { grid-row: 2; } @@ -418,7 +441,7 @@ a { grid-row: 1; } -#newLanguagePhonemes, #editLanguagePhonemes, #loginPassword, #addUserAuthority { +#newLanguagePhonemes, #editLanguagePhonemes, #loginPassword, #addUserAuthority, #writePostAuthor { grid-row: 3; } @@ -427,7 +450,7 @@ a { width: 90%; } -#addUserPassword { +#addUserPassword, #writePostText { grid-row: 4; } @@ -444,16 +467,16 @@ a { font-size: 1.5vh; } -#newLanguageSubmit, #editLanguageSubmit, #loginSubmit, #addUserSubmit { +#newLanguageSubmit, #editLanguageSubmit, #loginSubmit { display: grid; grid-row: 4; } -#addUserSubmit { +#addUserSubmit, #addUserSubmit, #writePostSubmit { grid-row: 5; } -#newLanguageSubmit p, #editLanguageSubmit p, #loginSubmit p, #addUserSubmit p { +#newLanguageSubmit p, #editLanguageSubmit p, #loginSubmit p, #addUserSubmit p, #writePostSubmit p { display: block; font-size: 3vh; margin: auto 10% auto; @@ -464,28 +487,32 @@ a { #header2 { display:grid; - grid-template-columns: 90% 10%; + grid-template-columns: 80% 10% 10%; grid-template-rows: 100%; } -#signIn, #addUserButton { +#signIn, #addUserButton, #addUpdateButton { display: grid; grid-template-columns: 70% 20%; grid-template-rows: 100%; - grid-column: 2; + grid-column: 3; grid-row: 1; cursor: pointer; } + +#addUpdateButton { + grid-column: 2; +} -#signIn:hover, #addUserButton:hover { +#signIn:hover, #addUserButton:hover, #addUpdateButton:hover, #writePostButton:hover { background-color: rgba(255,255,255,0.1); } -#signIn p, #signIn i, #addUserButton p, #addUserButton i { +#signIn p, #signIn i, #addUserButton p, #addUserButton i, #addUpdateButton p, #addUpdateButton i { margin: auto; font-size: 180%; } -#addData, #editData, #addUserButton { +#addData, #editData, #addUserButton, #addUpdateButton { display: none; } \ No newline at end of file diff --git a/SmearcarDB/static/index.js b/SmearcarDB/static/index.js index 80a39db..60368a1 100644 --- a/SmearcarDB/static/index.js +++ b/SmearcarDB/static/index.js @@ -324,35 +324,36 @@ document.onclick = function(event) { function homeCards() { - // TODO GET posts from server - + var home = document.getElementById("home"); + while (home.firstChild) { + home.removeChild(home.firstChild); + } $.ajax({ url: serverURL + '/updates', type: 'GET' }) - .then( - function success(incoming) { - var postList = incoming; - var home = document.getElementById("home"); - for(var i = 0; i < postList.length; i++) { - var div = document.createElement("div"); - div.className = "card"; - var h2 = document.createElement("h2"); - h2.textContent = postList[i].title; - div.appendChild(h2); - var h3 = document.createElement("h3"); - h3.textContent = postList[i].date; - div.appendChild(h3); - var p = document.createElement("p"); - p.innerHTML = postList[i].content; - div.appendChild(p); - home.appendChild(div); - } - }, - function error(e) { - console.log(e); + .then( + function success(incoming) { + var postList = incoming; + for(var i = postList.length - 1; i >= 0 ; i--) { + var div = document.createElement("div"); + div.className = "card"; + var h2 = document.createElement("h2"); + h2.textContent = postList[i].title; + div.appendChild(h2); + var h3 = document.createElement("h3"); + h3.textContent = postList[i].date; + div.appendChild(h3); + var p = document.createElement("p"); + p.innerHTML = postList[i].content; + div.appendChild(p); + home.appendChild(div); } - ); + }, + function error(e) { + console.log(e); + } + ); } @@ -463,6 +464,7 @@ document.getElementById("editData").onclick = function() { // Open edit language document.getElementById("signIn").onclick = function() { modal("login", true); }; document.getElementById("addUserButton").onclick = function() { modal("addUser", true); }; +document.getElementById("addUpdateButton").onclick = function() { modal("writePost", true); }; document.querySelectorAll("#newLanguageSubmit p")[0].onclick = function() { // Function for adding a language. if(!submittable) return; @@ -744,6 +746,7 @@ document.querySelectorAll("#loginSubmit p")[0].onclick = function() { document.getElementById("addData").style.display = "block"; document.getElementById("editData").style.display = "grid"; document.getElementById("addUserButton").style.display = "grid"; + document.getElementById("addUpdateButton").style.display = "grid"; document.getElementById("signIn").style.display = "none"; setTimeout(function() { info[0].value = ""; @@ -777,12 +780,11 @@ document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { this.style.backgroundColor = "rgba(0,0,0,0.2)"; var p = this; - $.ajax({ + $.ajax({ url: serverURL + '/editors', type: 'POST', dataType: "json", contentType: 'application/json;charset=UTF-8', - context: {counter: i}, data: JSON.stringify({ username: info[0].value, authority: info[2], @@ -810,7 +812,64 @@ document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { } } ); -} +}; + +document.querySelectorAll("#writePostSubmit p")[0].onclick = function() { + if(!submittable) return; + submittable = false; + var info = [ + document.querySelectorAll("#writePostTitle input")[0], + document.querySelectorAll("#writePostAuthor input")[0], + document.querySelectorAll("#writePostText textarea")[0] + ]; + if(info[0].value === "") { + alert("Please enter in a title!"); + submittable = true; + return; + } else if(info[1].value === "") { + alert("Please enter in an author!"); + submittable = true; + return; + } else if(info[2].value === "") { + alert("Please enter in a message!"); + submittable = true; + return; + } + this.innerText = "Processing..."; + this.style.backgroundColor = "rgba(0,0,0,0.2)"; + var p = this; + + $.ajax({ + url: serverURL + '/updates', + type: 'POST', + dataType: "json", + contentType: 'application/json;charset=UTF-8', + data: JSON.stringify({ + title: info[0].value, + author: info[1].value, + content: info[2].value, + editor: loginInfo + }) + }) + .then( + function success(incoming) { + modal("writePost", false); + homeCards(); + setTimeout(function() { + info[0].value = ""; + info[1].value = ""; + info[2].value = ""; + submittable = true; + p.innerText = "Submit!"; + p.style.backgroundColor = "#FEFEFE"; + }, 300); + }, + function error(e) { + alert("There was an error adding a post."); + console.log(e); + } + ); +}; /*function getTrelloCards() { Trello.authorize(); diff --git a/SmearcarDB/templates/index.html b/SmearcarDB/templates/index.html index 8e5a3a3..6eb4795 100644 --- a/SmearcarDB/templates/index.html +++ b/SmearcarDB/templates/index.html @@ -20,6 +20,10 @@

/'smi:ɹ̠ka:ɹ̠/

+
+

Write Post

+ +

Login

@@ -170,6 +174,26 @@
+
+
+

Write New Update

+
+

Title:

+ +
+
+

Author:

+ +
+
+

Message:

+ +
+
+

Submit!

+
+
+
From 35091bb31537f3571ff26771d31b1e2b4f7905b9 Mon Sep 17 00:00:00 2001 From: Kenneth Jao Date: Thu, 19 Apr 2018 20:41:05 -0400 Subject: [PATCH 2/3] Standardized modal creation --- SmearcarDB/static/index.css | 56 +++++- SmearcarDB/static/index.js | 346 +++++++++++++++++++++++--------- SmearcarDB/templates/index.html | 95 +-------- 3 files changed, 302 insertions(+), 195 deletions(-) diff --git a/SmearcarDB/static/index.css b/SmearcarDB/static/index.css index 182390e..96be431 100644 --- a/SmearcarDB/static/index.css +++ b/SmearcarDB/static/index.css @@ -363,7 +363,7 @@ a { background-color: rgba(0, 0, 0, 0.05); } -#newLanguage, #editLanguage, #login, #addUser, #writePost { +/*#newLanguage, #editLanguage, #login, #addUser, #writePost { position: absolute; width: 100%; height: 100%; @@ -382,6 +382,10 @@ a { grid-template-rows: 6vh 5% 70% auto; } +#newLanguage > div { + grid-template-rows: 6vh 5% 5% 70% auto; +} + #login > div { height: 30%; grid-template-rows: 6vh 1fr 1fr 1fr; @@ -400,7 +404,7 @@ a { grid-template-rows: 6vh 1fr 1fr 8fr 2fr; } -#loginUsername, #loginPassword, #addUserUsername, #addUserPassword, #writePostText, #writePostAuthor, #writePostTitle { +#loginUsername, #loginPassword, #addUserUsername, #addUserPassword, #writePostText, #writePostAuthor, #writePostTitle, #newLanguageSource { margin-left: 5%; } @@ -429,7 +433,7 @@ a { grid-row: 2; } -#newLanguageName p, #editLanguageName p { +#newLanguageName p, #editLanguageName p, #newLanguageSource p { display: inline; margin-left: 5%; grid-row: 1; @@ -441,6 +445,10 @@ a { grid-row: 1; } +#newLanguageSource { + grid-row: 3; +} + #newLanguagePhonemes, #editLanguagePhonemes, #loginPassword, #addUserAuthority, #writePostAuthor { grid-row: 3; } @@ -467,12 +475,16 @@ a { font-size: 1.5vh; } -#newLanguageSubmit, #editLanguageSubmit, #loginSubmit { +#newLanguagePhonemes { + grid-row: 4; +} + +#editLanguageSubmit, #loginSubmit { display: grid; grid-row: 4; } -#addUserSubmit, #addUserSubmit, #writePostSubmit { +#addUserSubmit, #addUserSubmit, #writePostSubmit, #newLanguageSubmit { grid-row: 5; } @@ -483,7 +495,7 @@ a { padding: 1%; text-align: center; cursor: pointer; -} +}*/ #header2 { display:grid; @@ -515,4 +527,36 @@ a { #addData, #editData, #addUserButton, #addUpdateButton { display: none; +} + +.modal { + position: absolute; + width: 100%; + height: 100%; + display: none; + opacity: 0; + background-color: rgba(0,0,0,0.4); +} + +.modalSubmit { + display: block; + width: 70%; + font-size: 3vh; + margin: auto; + padding: 1%; + text-align: center; + cursor: pointer; +} + +.modal input, .modal textarea { + margin: 0 auto 0 auto; + border: 0; + background-color: rgba(0,0,0,0.1); + font-family: 'Saira Condensed', sans-serif; + font-size: 100%; + font-weight: 300; + padding: 1vh; + width: 90%; + outline: none; + resize: none; } \ No newline at end of file diff --git a/SmearcarDB/static/index.js b/SmearcarDB/static/index.js index 60368a1..a63103d 100644 --- a/SmearcarDB/static/index.js +++ b/SmearcarDB/static/index.js @@ -5,11 +5,10 @@ var data; var languageChart; var dataOpen = false; var submittable = true; +var dropOp = {}; +var dropOpStore = {}; var loginInfo = {}; -// var trelloInfo = {}; - - var navi = [ // Array containing navigation items in form [Font-Awesome class name, Display Text, Onclick function]. ["home", "Home", "home"], ["bar-chart", "Data Values", "dataValues1"], @@ -17,10 +16,6 @@ var navi = [ // Array containing navigation items in form [Font-Awesome class na ["info", "About", "about"] ]; -var members = [ - "Kenneth Jao", "Yaman Qalieh", "Enrico Colon" -]; - var authorityLabels = { 0: "#0: Full access", 1: "#1: Create updates", @@ -28,11 +23,137 @@ var authorityLabels = { 3: "#3: No access" }; -var dropOp = { - //Insert correct -}; -var dropOpStore = {}; +var modals = [ + { + name: "Add Language", + modal: "newLanguage", + button: "addData", + structure: { + width: "20%", + form: [ + { + name: "Name", + formType: "input" + }, + { + name: "Source", + formType: "input", + inputType: "file" + }, + { + name: "Phonemes", + formType: "textarea", + height: "25vh" + } + ] + } + }, + { + name: "Edit Language", + modal: "editLanguage", + button: "editData", + buttonClick: function() { + var langInfo = language(dropOpStore["langSelect"]); + document.querySelectorAll("#editLanguageName input")[0].value = langInfo.name; + var k = Object.keys(langInfo.phonemes); + var v = Object.values(langInfo.phonemes); + var str = ""; + for(var i = 0; i < k.length; i++) { + str += k[i] + " " + v[i] + ((i === k.length-1) ? "" : "\n"); + } + document.querySelectorAll("#editLanguagePhonemes textarea")[0].value = str; + //modal("editLanguage", true); + }, + structure: { + width: "20%", + form: [ + { + name: "Name", + formType: "input" + }, + { + name: "Source", + formType: "input", + inputType: "file" + }, + { + name: "Phonemes", + formType: "textarea", + height: "25vh" + } + ] + } + }, + { + name: "Login", + modal: "login", + button: "signIn", + structure: { + width: "20%", + form: [ + { + name: "Username", + formType: "input" + }, + { + name: "Password", + formType: "input", + inputType: "password" + }, + ] + } + }, + { + name: "Add User", + modal: "addUser", + button: "addUserButton", + structure: { + width: "20%", + form: [ + { + name: "Username", + formType: "input" + }, + { + name: "Authority", + formType: "input", + inputType: "number" + }, + { + name: "Password", + formType: "input", + inputType: "password" + } + ] + } + }, + { + name: "Write Update", + modal: "writePost", + button: "addUpdateButton", + structure: { + width: "40%", + form: [ + { + name: "Title", + formType: "input", + }, + { + name: "Author", + formType: "input", + }, + { + name: "Message", + formType: "textarea", + height: "18vh" + } + ] + } + }, +]; + + function Rnd(item,fig) { if(varType(item) === "Array") { @@ -117,6 +238,7 @@ function getData(updatePage) { dropOpUpdate("langSelect"); document.querySelectorAll(".dropdown[option='langSelect'] .opCont p[dropoption='"+(dropOpStore["langSelect"])+"']")[0].click(); } + generateModals(); }, function error(e) { console.log(e); @@ -258,9 +380,6 @@ function createDrop() { var p3 = document.createElement("p"); p3.className = "transition"; p3.id = "addData"; - p3.onclick = function() { // Open add language. - modal("newLanguage", true); - }; p3.appendChild(document.createTextNode("Add language...")); div2.appendChild(p3); } @@ -342,7 +461,7 @@ function homeCards() { h2.textContent = postList[i].title; div.appendChild(h2); var h3 = document.createElement("h3"); - h3.textContent = postList[i].date; + h3.textContent = postList[i].author + " - " + postList[i].date; div.appendChild(h3); var p = document.createElement("p"); p.innerHTML = postList[i].content; @@ -426,19 +545,7 @@ function modal(id, open) { } } -var modals = ["newLanguage", "editLanguage", "login", "addUser"]; -for(var i = 0; i < modals.length; i++) { - let id = modals[i]; - document.getElementById(modals[i]).onclick = function(event) { - modal(id, false); - for(var j = 0; j < document.getElementsByTagName("input"); j++) document.getElementsByTagName("input")[j].value = ""; - dropOpStore["authority"] = ""; - document.querySelectorAll(".dropdown[option=authority] .button p")[0].textContent = dropOp["authority"][1]; - }; - document.querySelectorAll("#"+modals[i]+" > div")[0].onclick = function(event) { event.stopPropagation(); }; -} - -document.querySelectorAll("#addUser > div")[0].onclick = function(event) { +/*document.querySelectorAll("#addUser > div")[0].onclick = function(event) { event.stopPropagation(); for (var i = 0; i < document.getElementsByClassName("dropdown").length; i++) { var opCont = document.querySelectorAll(".dropdown .opCont")[i]; @@ -447,26 +554,84 @@ document.querySelectorAll("#addUser > div")[0].onclick = function(event) { opCont.style.display = "none"; }, 300); } +}*/ + + +function generateModals() { + while(document.getElementsByClassName("modal").length > 0) { + document.getElementsByTagName("body")[0].removeChild(document.getElementsByClassName("modal")[0]); + } + for(var i = 0; i < modals.length; i++) { + let eachModal = modals[i]; + var overlay = document.createElement("div"); + overlay.id = modals[i].modal; + overlay.className = "transition modal"; + + var modalCont = document.createElement("div"); + modalCont.className = "card transition"; + modalCont.style.position = "absolute"; + modalCont.style.paddingBottom = "1vh"; + modalCont.style.width = modals[i].structure.width; + var marg = 50-parseInt(modals[i].structure.width.replace("%",""))/2; + modalCont.style.margin = "5% " + marg + "% 0 " + marg+"%"; + var h2 = document.createElement("h2"); + h2.appendChild(document.createTextNode(modals[i].name)); + h2.style.gridRow = "1"; + modalCont.appendChild(h2); + + var gridTemplate = "6vh "; + var form = modals[i].structure.form; + for(var j = 0; j < form.length; j++) { + gridTemplate += (form[j].formType === "input") ? "7vh " : "auto "; + var div = document.createElement("div"); + div.id = modals[i].modal + form[j].name; + div.style.marginLeft = "5%"; + div.style.gridRow = j+2; + var p = document.createElement("p"); + p.appendChild(document.createTextNode(form[j].name + ":")); + var input = document.createElement(form[j].formType); + if(form[j].inputType) input.type = form[j].inputType; + if(form[j].height) input.style.height = form[j].height; + + + div.appendChild(p); + div.appendChild(input); + modalCont.appendChild(div); + } + gridTemplate += "7vh"; + modalCont.style.gridTemplateRows = gridTemplate; + modalCont.style.gridTemplateColumns = "100%"; + + var submit = document.createElement("div"); + submit.id = modals[i].modal + "Submit"; + submit.style.gridRow = form.length+2; + submit.style.display = "grid"; + submit.onclick = function() { + (eachModal.submitClick)(); + } + var p2 = document.createElement("p"); + p2.className = "card modalSubmit"; // Refer to modalSubmit CSS to edit. + p2.appendChild(document.createTextNode("Submit!")); + submit.appendChild(p2); + modalCont.appendChild(submit); + + overlay.appendChild(modalCont); + document.getElementsByTagName("body")[0].appendChild(overlay); + console.log(modals[i].button); + document.getElementById(modals[i].button).onclick = function() { + if(eachModal.buttonClick) (eachModal.buttonClick)(); + modal(eachModal.modal, true); + } + + overlay.onclick = function(event) { + if(this !== event.target) return; + for(var i = 0; i < document.getElementsByTagName("input").length; i++) document.getElementsByTagName("input")[i].value = ""; + modal(eachModal.modal, false); + } + } } -document.getElementById("editData").onclick = function() { // Open edit language. - var langInfo = language(dropOpStore["langSelect"]); - document.querySelectorAll("#editLanguageName input")[0].value = langInfo.name; - var k = Object.keys(langInfo.phonemes); - var v = Object.values(langInfo.phonemes); - var str = ""; - for(var i = 0; i < k.length; i++) { - str += k[i] + " " + v[i] + ((i === k.length-1) ? "" : "\n"); - } - document.querySelectorAll("#editLanguagePhonemes textarea")[0].value = str; - modal("editLanguage", true); -}; - -document.getElementById("signIn").onclick = function() { modal("login", true); }; -document.getElementById("addUserButton").onclick = function() { modal("addUser", true); }; -document.getElementById("addUpdateButton").onclick = function() { modal("writePost", true); }; - -document.querySelectorAll("#newLanguageSubmit p")[0].onclick = function() { // Function for adding a language. +modals[0].submitClick = function() { // submitClick for newLanguage. if(!submittable) return; submittable = false; var name = document.querySelectorAll("#newLanguageName input")[0].value; @@ -493,16 +658,30 @@ document.querySelectorAll("#newLanguageSubmit p")[0].onclick = function() { // F } phonemes[info[i][0]] = num; } + + var formData = new FormData(); + var source = document.querySelectorAll("#newLanguageSource input")[0].files; + if(source.length === 0 || source[0].type) { + alert("Please give a source!"); + submittable = true; + return; + } + formData.append("source", source[0]); + formData.append("name", name); + formData.append("phonemes", phonemes); + formData.append("editor", loginInfo); + var newLanguage = { name: name, - source: null, + source: sourceData, phonemes: phonemes, editor: loginInfo }; - this.innerText = "Processing..."; - this.style.backgroundColor = "rgba(0,0,0,0.2)"; - var p = this; + var p = document.querySelectorAll("#newLanguageSubmit p ")[0] + p.innerText = "Processing..."; + p.style.backgroundColor = "rgba(0,0,0,0.2)"; + $.ajax({ url: serverURL + '/server', type: 'POST', @@ -530,7 +709,7 @@ document.querySelectorAll("#newLanguageSubmit p")[0].onclick = function() { // F ); }; -document.querySelectorAll("#editLanguageSubmit p")[0].onclick = function() { // Function for submitting edits to language. +modals[1].submitClick= function() { // submitClick for editLanguage. if(!submittable) return; var langInfo = language(dropOpStore["langSelect"]); submittable = false; @@ -561,9 +740,9 @@ document.querySelectorAll("#editLanguageSubmit p")[0].onclick = function() { // } console.log(newPhonemes); - this.innerText = "Processing..."; - this.style.backgroundColor = "rgba(0,0,0,0.2)"; - var p = this; + var p = document.querySelectorAll("#editLanguageSubmit p")[0] + p.innerText = "Processing..."; + p.style.backgroundColor = "rgba(0,0,0,0.2)"; var oldPhoneset = new Set(Object.keys(langInfo.phonemes)); var newPhoneset = new Set(Object.keys(newPhonemes)); @@ -728,7 +907,7 @@ document.querySelectorAll("#editLanguageSubmit p")[0].onclick = function() { // } }; -document.querySelectorAll("#loginSubmit p")[0].onclick = function() { +modals[2].submitClick = function() { // submitClick for login. var info = [ document.querySelectorAll("#loginUsername input")[0], document.querySelectorAll("#loginPassword input")[0] @@ -751,16 +930,16 @@ document.querySelectorAll("#loginSubmit p")[0].onclick = function() { setTimeout(function() { info[0].value = ""; info[1].value = ""; - }, 300) + }, 300); }; -document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { +modals[3].submitClick = function() { if(!submittable) return; submittable = false; var info = [ document.querySelectorAll("#addUserUsername input")[0], document.querySelectorAll("#addUserPassword input")[0], - parseInt(dropOpStore["authority"]) + document.querySelectorAll("#addUserAuthority input")[0] ]; if(info[0].value === "") { alert("Please enter in a username!"); @@ -776,9 +955,9 @@ document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { return; } - this.innerText = "Processing..."; - this.style.backgroundColor = "rgba(0,0,0,0.2)"; - var p = this; + var p = document.querySelectorAll("#addUserSubmit p")[0] + p.innerText = "Processing..."; + p.style.backgroundColor = "rgba(0,0,0,0.2)"; $.ajax({ url: serverURL + '/editors', @@ -787,7 +966,7 @@ document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { contentType: 'application/json;charset=UTF-8', data: JSON.stringify({ username: info[0].value, - authority: info[2], + authority: parseInt(info[2]), password: info[1].value, editor: loginInfo }) @@ -814,13 +993,13 @@ document.querySelectorAll("#addUserSubmit p")[0].onclick = function() { ); }; -document.querySelectorAll("#writePostSubmit p")[0].onclick = function() { +modals[4].submitClick = function() { if(!submittable) return; submittable = false; var info = [ document.querySelectorAll("#writePostTitle input")[0], document.querySelectorAll("#writePostAuthor input")[0], - document.querySelectorAll("#writePostText textarea")[0] + document.querySelectorAll("#writePostMessage textarea")[0] ]; if(info[0].value === "") { alert("Please enter in a title!"); @@ -835,11 +1014,12 @@ document.querySelectorAll("#writePostSubmit p")[0].onclick = function() { submittable = true; return; } - this.innerText = "Processing..."; - this.style.backgroundColor = "rgba(0,0,0,0.2)"; - var p = this; - $.ajax({ + var p = document.querySelectorAll("#writePostSubmit p")[0] + p.innerText = "Processing..."; + p.style.backgroundColor = "rgba(0,0,0,0.2)"; + + $.ajax({ url: serverURL + '/updates', type: 'POST', dataType: "json", @@ -871,35 +1051,7 @@ document.querySelectorAll("#writePostSubmit p")[0].onclick = function() { ); }; -/*function getTrelloCards() { - Trello.authorize(); - var cardArr, listArr, lists; - var cards = window.Trello.rest( - "GET", "boards/vm2c2IZd/cards", - function success() { - cardArr = JSON.parse(cards.responseText); - lists = window.Trello.rest( - "GET", "boards/vm2c2IZd/lists", - function success() { - listArr = JSON.parse(lists.responseText); - for(var i = 0; i < listArr.length; i++) { - var arr = cardArr.filter(function(obj) { - return obj.idList === listArr[i].id; - }).map(a => a.name); - trelloInfo[listArr[i].name] = arr; - } - }, - function error(e) { - console.log(e); - }); - }, - function error(e) { - console.log(e); - }); -}*/ - getData(); homeCards(); createNav(); -updateNav(navSelect); - +updateNav(navSelect); \ No newline at end of file diff --git a/SmearcarDB/templates/index.html b/SmearcarDB/templates/index.html index 6eb4795..e9a1db9 100644 --- a/SmearcarDB/templates/index.html +++ b/SmearcarDB/templates/index.html @@ -21,7 +21,7 @@
-

Write Post

+

Update

@@ -68,7 +68,7 @@
-
+

Currently in progress!

@@ -105,95 +105,6 @@
-
-
-

Add Language

-
-

Name:

- -
-
-

Phonemes:

- -
-
-

Submit!

-
-
-
-
-
-

Edit Language

-
-

Name:

- -
-
-

Phonemes:

- -
-
-

Submit!

-
-
-
-
-
-

Login

-
-

Username:

- -
-
-

Password:

- -
-
-

Submit!

-
-
-
-
-
-

Add New User

-
-

Username:

- -
-
-

Authority:

-
-
-
-
-

Password:

- -
-
-

Submit!

-
-
-
-
-
-

Write New Update

-
-

Title:

- -
-
-

Author:

- -
-
-

Message:

- -
-
-

Submit!

-
-
-
From 8e3aca8e20707eaaa053bafca4a7d326d9cc5d09 Mon Sep 17 00:00:00 2001 From: Kenneth Jao Date: Thu, 19 Apr 2018 20:47:37 -0400 Subject: [PATCH 3/3] css cleanup --- SmearcarDB/static/index.css | 134 ------------------------------------ 1 file changed, 134 deletions(-) diff --git a/SmearcarDB/static/index.css b/SmearcarDB/static/index.css index 96be431..58f7baf 100644 --- a/SmearcarDB/static/index.css +++ b/SmearcarDB/static/index.css @@ -363,140 +363,6 @@ a { background-color: rgba(0, 0, 0, 0.05); } -/*#newLanguage, #editLanguage, #login, #addUser, #writePost { - position: absolute; - width: 100%; - height: 100%; - display: none; - opacity: 0; - background-color: rgba(0,0,0,0.4); -} - -#newLanguage > div, #editLanguage > div, #login > div, #addUser > div, #writePost > div { - position: absolute; - width: 20%; - height: 60%; - margin: 5% 40% 0 40%; - background-color: #F8F3F0; - grid-template-columns: 1fr; - grid-template-rows: 6vh 5% 70% auto; -} - -#newLanguage > div { - grid-template-rows: 6vh 5% 5% 70% auto; -} - -#login > div { - height: 30%; - grid-template-rows: 6vh 1fr 1fr 1fr; -} - -#addUser > div { - height: 40%; - grid-template-rows: 6vh 1fr 1fr 1fr 1fr; -} - -#writePost > div { - margin-left: 30%; - margin-right: 30%; - width: 40%; - height: 60%; - grid-template-rows: 6vh 1fr 1fr 8fr 2fr; -} - -#loginUsername, #loginPassword, #addUserUsername, #addUserPassword, #writePostText, #writePostAuthor, #writePostTitle, #newLanguageSource { - margin-left: 5%; -} - -#login input, #addUser input, #writePost textarea, #writePost input { - border: 0; - background-color: rgba(0,0,0,0.1); - font-family: 'Saira Condensed', sans-serif; - font-size: 120%; - font-weight: 300; - padding: 2%; - width: 90%; - outline: none; -} - -#writePost input { - padding: 1%; - font-size: 100%; -} - -#writePost textarea { - height: 80%; - resize: none; -} - -#newLanguageName, #editLanguageName, #loginUsername, #addUserUsername, #writePostTitle { - grid-row: 2; -} - -#newLanguageName p, #editLanguageName p, #newLanguageSource p { - display: inline; - margin-left: 5%; - grid-row: 1; -} - -#newLanguageName input, #editLanguageName input { - margin: auto 0 auto 0; - width: 50%; - grid-row: 1; -} - -#newLanguageSource { - grid-row: 3; -} - -#newLanguagePhonemes, #editLanguagePhonemes, #loginPassword, #addUserAuthority, #writePostAuthor { - grid-row: 3; -} - -#addUserAuthority { - margin-left: 5%; - width: 90%; -} - -#addUserPassword, #writePostText { - grid-row: 4; -} - -#newLanguagePhonemes p, #editLanguagePhonemes p { - margin-left: 5%; -} - -#newLanguagePhonemes textarea, #editLanguagePhonemes textarea { - width: 90%; - margin-left: 5%; - height: 90%; - resize: none; - font-family: 'Saira Condensed', sans-serif; - font-size: 1.5vh; -} - -#newLanguagePhonemes { - grid-row: 4; -} - -#editLanguageSubmit, #loginSubmit { - display: grid; - grid-row: 4; -} - -#addUserSubmit, #addUserSubmit, #writePostSubmit, #newLanguageSubmit { - grid-row: 5; -} - -#newLanguageSubmit p, #editLanguageSubmit p, #loginSubmit p, #addUserSubmit p, #writePostSubmit p { - display: block; - font-size: 3vh; - margin: auto 10% auto; - padding: 1%; - text-align: center; - cursor: pointer; -}*/ - #header2 { display:grid; grid-template-columns: 80% 10% 10%;