759 lines
27 KiB
JavaScript
759 lines
27 KiB
JavaScript
var navSelect = "home";
|
|
var dataMode;
|
|
var serverURL = window.location.origin;
|
|
var data;
|
|
var languageChart;
|
|
var dataOpen = false;
|
|
var submittable = true;
|
|
|
|
// 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"],
|
|
["database", "Database and Files", "files"],
|
|
["info", "About", "about"]
|
|
];
|
|
|
|
var members = [
|
|
"Kenneth Jao", "Yaman Qalieh", "Enrico Colon"
|
|
];
|
|
|
|
var dropOp = {
|
|
//Insert correct
|
|
};
|
|
|
|
var dropOpStore = {};
|
|
|
|
// Left This so that the post function can be reused
|
|
|
|
// function temporary(data) {
|
|
// for(var i = 0; i < data.length; i++) {
|
|
// $.ajax({
|
|
// url: serverURL + '/server',
|
|
// type: 'POST',
|
|
// data: JSON.stringify(data[i]),
|
|
// dataType: "json",
|
|
// contentType: 'application/json;charset=UTF-8'
|
|
// })
|
|
// .then(
|
|
// function success(data) {
|
|
// console.log(data);
|
|
// },
|
|
// function error(e) {
|
|
// console.log(e);
|
|
// }
|
|
// );
|
|
// }
|
|
// }
|
|
|
|
// This Function is property of https://stackoverflow.com/questions/10015027/javascript-tofixed-not-rounding/32605063#32605063
|
|
function roundTo(n, digits) {
|
|
if (digits === undefined) {
|
|
digits = 0;
|
|
}
|
|
|
|
var multiplicator = Math.pow(10, digits);
|
|
n = parseFloat((n * multiplicator).toFixed(11));
|
|
return Math.round(n) / multiplicator;
|
|
}
|
|
|
|
|
|
function createNav() {
|
|
for (var i = 0; i < navi.length; i++) { // Create navigation tabs.
|
|
var side = document.getElementById("sidebar");
|
|
var div = document.createElement("div");
|
|
div.className = "navi transition";
|
|
div.setAttribute("option", navi[i][2]);
|
|
div.onclick = function() {
|
|
var op = this.getAttribute("option");
|
|
if (navSelect === op) return;
|
|
updateMain(op);
|
|
};
|
|
var ic = document.createElement("i");
|
|
ic.className = "fa fa-" + navi[i][0];
|
|
ic["aria-hidden"] = true;
|
|
var p = document.createElement("p");
|
|
p.appendChild(document.createTextNode(navi[i][1]));
|
|
div.appendChild(ic);
|
|
div.appendChild(p);
|
|
side.appendChild(div);
|
|
}
|
|
}
|
|
|
|
function updateMain(op) { // Updates the actual page.
|
|
updateNav(op);
|
|
document.getElementById(navSelect).style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById(navSelect).style.display = "none";
|
|
document.getElementById(op).style.display = "block";
|
|
setTimeout(function() {
|
|
document.getElementById(op).style.opacity = "1";
|
|
}, 30);
|
|
navSelect = op;
|
|
}, 300);
|
|
}
|
|
|
|
function updateNav(op) { // Updates the sidebar navigation.
|
|
var oldNav = document.querySelectorAll("[option=" + navSelect + "]")[0];
|
|
var newNav = document.querySelectorAll("[option=" + op + "]")[0];
|
|
oldNav.style.backgroundColor = "rgba(0,0,0,0)";
|
|
oldNav.style.color = "white";
|
|
newNav.style.backgroundColor = "#F8F3F0";
|
|
newNav.style.color = "#F47922";
|
|
}
|
|
|
|
function getData(updatePage) {
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'GET'
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
data = incoming;
|
|
generateDropOp();
|
|
createDrop();
|
|
if(updatePage === "add") {
|
|
dropOpUpdate("langSelect");
|
|
document.querySelectorAll(".dropdown[option='langSelect'] .opCont p[langid='"+(data.languages.length)+"']")[0].click();
|
|
} else if(updatePage === "edit") {
|
|
dropOpUpdate("langSelect");
|
|
document.querySelectorAll(".dropdown[option='langSelect'] .opCont p[langid='"+(dropOpStore["langSelect"])+"']")[0].click();
|
|
}
|
|
},
|
|
function error(e) {
|
|
console.log(e);
|
|
}
|
|
);
|
|
}
|
|
|
|
function language(language) {
|
|
return data.values.filter(function(element) {
|
|
return element.id === parseInt(language);
|
|
})[0];
|
|
}
|
|
|
|
function phoneme(p) {
|
|
return data.values.map(function(language) {
|
|
obj = {};
|
|
if (language.phonemes[p] !== undefined) {
|
|
obj[language.name] = language.phonemes[p];
|
|
return obj;
|
|
}
|
|
return undefined;
|
|
}).filter(function(a) {
|
|
return (a !== undefined);
|
|
});
|
|
}
|
|
|
|
document.getElementById("flipMode").onclick = function() {
|
|
dropOpStore["flipMode"] = (dropOpStore["flipMode"] === "language") ? "phoneme" : "language";
|
|
|
|
}
|
|
|
|
function generateDropOp() { // For options that change based on data.
|
|
dropOp["langSelect"] = [function() { // Function that occurs when change language.
|
|
// Generate info box material.
|
|
var langInfo = language(dropOpStore["langSelect"]);
|
|
var info = document.getElementById("langInfoCont");
|
|
var dataBox = document.getElementById("dataTableCont");
|
|
var graph = document.querySelectorAll("#langGraph > canvas")[0];
|
|
info.style.opacity = "0";
|
|
dataBox.style.opacity = "0";
|
|
graph.style.opacity = "0";
|
|
setTimeout(function() {
|
|
while (info.firstChild) {
|
|
info.removeChild(info.firstChild);
|
|
}
|
|
var p = document.createElement("p");
|
|
var p2 = document.createElement("p");
|
|
var a = document.createElement("a");
|
|
p.appendChild(document.createTextNode("Type: " + (langInfo.type || "N/A")));
|
|
p2.appendChild(document.createTextNode("Source: "));
|
|
if(langInfo.source === null) {
|
|
p2.appendChild(document.createTextNode("N/A"));
|
|
} else if(langInfo.source.length > 0) {
|
|
a.href = langInfo.source;
|
|
srcText = (langInfo.source.length > 60) ? langInfo.source.substring(0, 57) + "..." : langInfo.source;
|
|
a.appendChild(document.createTextNode(srcText));
|
|
p2.appendChild(a);
|
|
}
|
|
info.appendChild(p);
|
|
info.appendChild(p2);
|
|
|
|
// Generate data box material.
|
|
|
|
var phonemes = Object.keys(langInfo.phonemes).sort(Intl.Collator().compare);
|
|
|
|
while (dataBox.firstChild) {
|
|
dataBox.removeChild(dataBox.firstChild);
|
|
}
|
|
dataBox.style.gridTemplateColumns = "repeat("+Math.ceil(phonemes.length/6).toString() + ", 1fr)";
|
|
for(var i = 0; i < 9; i++) dataBox.appendChild(document.createElement("div")); // Extra divs will be filled if necessary.
|
|
for(i = 0; i < phonemes.length; i++) {
|
|
var tableNum = Math.floor(i/6);
|
|
var row = i+2-tableNum*7;
|
|
var p1 = document.createElement("p");
|
|
var p2 = document.createElement("p");
|
|
p1.style.textAlign = "right";
|
|
p2.style.textAlign = "left";
|
|
p1.style.borderRight = "1px solid #D5D5D5";
|
|
if(i%6 === 0) {
|
|
var pT1 = document.createElement("p");
|
|
var pT2 = document.createElement("p");
|
|
pT1.style.textAlign = "right";
|
|
pT2.style.textAlign = "left";
|
|
pT1.style.borderRight = "1px solid #D5D5D5";
|
|
pT1.style.borderBottom = "1px solid #D5D5D5";
|
|
pT2.style.borderBottom = "1px solid #D5D5D5";
|
|
pT1.appendChild(document.createTextNode("Phoneme"));
|
|
pT2.appendChild(document.createTextNode("Percent"));
|
|
dataBox.children[tableNum].appendChild(pT1);
|
|
dataBox.children[tableNum].appendChild(pT2);
|
|
}
|
|
p1.appendChild(document.createTextNode(phonemes[i]));
|
|
p2.appendChild(document.createTextNode(roundTo(langInfo.phonemes[phonemes[i]], 2)));
|
|
dataBox.children[tableNum].appendChild(p1);
|
|
dataBox.children[tableNum].appendChild(p2);
|
|
}
|
|
var graphData = Object.entries(langInfo.phonemes).sort(function(a,b) {
|
|
return b[1] - a[1];
|
|
});
|
|
graphData = [graphData.map(function(a,b) {
|
|
return a[0];
|
|
}), graphData.map(function(a,b) {
|
|
return a[1];
|
|
})];
|
|
// Generate graphs.
|
|
var ctx = graph.getContext("2d");
|
|
try {
|
|
languageChart.destroy();
|
|
} catch(err) {}
|
|
languageChart = new Chart(ctx, chartOptions(graphData));
|
|
info.style.opacity = "1";
|
|
dataBox.style.opacity = "1";
|
|
graph.style.opacity = "1";
|
|
}, 300);
|
|
}].concat(["Select language..."].concat(data.values.map(a=>a.id)));
|
|
}
|
|
|
|
function closeEditInput() {
|
|
try {
|
|
var input = document.getElementById("dataOpen");
|
|
var p = input.parentNode;
|
|
var patchData = {
|
|
action: 'phoneme_add',
|
|
data: {
|
|
language_id: language(dropOpStore["langSelect"]).id,
|
|
phoneme: p.previousSibling.innerText,
|
|
value: input.value
|
|
}
|
|
};
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'PATCH',
|
|
dataType: "json",
|
|
contentType: 'application/json;charset=UTF-8',
|
|
data: JSON.stringify(patchData)
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
p.appendChild(document.createTextNode(input.value));
|
|
p.removeChild(input);
|
|
},
|
|
function error(e) {
|
|
console.log(e);
|
|
}
|
|
);
|
|
dataOpen = false;
|
|
} catch(err) {}
|
|
}
|
|
|
|
function createDrop() {
|
|
var dropButtons = document.getElementsByClassName("dropdown");
|
|
for(var i = 0; i < dropButtons.length; i++) {
|
|
while(dropButtons[i].firstChild) dropButtons[i].removeChild(dropButtons[i].firstChild);
|
|
}
|
|
for (i = 0; i < dropButtons.length; i++) {
|
|
var div = document.createElement("div");
|
|
div.className = "button";
|
|
var p = document.createElement("p");
|
|
var op = dropButtons[i].getAttribute("option");
|
|
p.appendChild(document.createTextNode(dropOp[op][1]));
|
|
var ic = document.createElement("i");
|
|
ic.className = "fa fa-angle-down";
|
|
ic["aria-hidden"] = true;
|
|
div.appendChild(p);
|
|
div.appendChild(ic);
|
|
var div2 = document.createElement("div");
|
|
div2.className = "opCont transition";
|
|
|
|
var p3 = document.createElement("p");
|
|
p3.className = "transition";
|
|
p3.onclick = function() { // Open add language.
|
|
document.getElementById("newLanguage").style.display = "block";
|
|
setTimeout(function() {
|
|
document.getElementById("newLanguage").style.opacity = "1";
|
|
}, 10);
|
|
};
|
|
p3.appendChild(document.createTextNode("Add language..."));
|
|
div2.appendChild(p3);
|
|
|
|
for (var j = 2; j < dropOp[op].length; j++) {
|
|
var p2 = document.createElement("p");
|
|
p2.setAttribute("langId", dropOp[op][j]);
|
|
p2.className = "transition";
|
|
p2.onclick = function(e) {
|
|
e.stopPropagation();
|
|
dropOpStore[op] = this.getAttribute("langId");
|
|
dropOpUpdate(op);
|
|
let opCont = this.parentNode;
|
|
opCont.style.opacity = "0";
|
|
setTimeout(function() {
|
|
opCont.style.display = "none";
|
|
}, 300);
|
|
};
|
|
p2.appendChild(document.createTextNode(language(dropOp[op][j]).name));
|
|
div2.appendChild(p2);
|
|
}
|
|
|
|
div.onclick = function(e) {
|
|
e.stopPropagation();
|
|
let opCont = this.nextElementSibling;
|
|
if (opCont.style.display === "block") {
|
|
opCont.style.opacity = "0";
|
|
setTimeout(function() {
|
|
opCont.style.display = "none";
|
|
}, 300);
|
|
} else {
|
|
opCont.style.display = "block";
|
|
setTimeout(function() {
|
|
opCont.style.opacity = "1";
|
|
}, 30);
|
|
}
|
|
};
|
|
dropButtons[i].appendChild(div);
|
|
dropButtons[i].appendChild(div2);
|
|
}
|
|
}
|
|
|
|
function dropOpUpdate(op) {
|
|
var dropdown = document.querySelectorAll(".dropdown[option=" + op + "] .button p")[0];
|
|
dropdown.textContent = language(dropOpStore[op]).name;
|
|
(dropOp[op][0])();
|
|
}
|
|
|
|
document.onclick = function(event) {
|
|
for (var i = 0; i < document.getElementsByClassName("dropdown").length; i++) {
|
|
var opCont = document.querySelectorAll(".dropdown .opCont")[i];
|
|
opCont.style.opacity = "0";
|
|
setTimeout(function() {
|
|
opCont.style.display = "none";
|
|
}, 300);
|
|
}
|
|
};
|
|
|
|
function homeCards() {
|
|
// GET posts from server
|
|
var week = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
|
|
var month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
|
|
var examplePost = [
|
|
{
|
|
author: "Kenneth Jao",
|
|
title: "Test Post!",
|
|
content: "This is test post! <a target='_blank' href='https://google.com'>Link</a> This link should work.<br> Newlines work.",
|
|
date: new Date(2018, 0, 26, 4, 51)
|
|
}
|
|
];
|
|
var home = document.getElementById("home");
|
|
for(var i = 0; i < examplePost.length; i++) {
|
|
var div = document.createElement("div");
|
|
div.className = "card";
|
|
var h2 = document.createElement("h2");
|
|
h2.textContent = examplePost[i].title;
|
|
div.appendChild(h2);
|
|
var h3 = document.createElement("h3");
|
|
var dt = examplePost[i].date;
|
|
var smallDate = (function() {
|
|
var m = (dt.getMonth()+1).toString();
|
|
var d = (dt.getDay()+1).toString();
|
|
m = (m.length === 1) ? "0" + m : m;
|
|
d = (d.length === 1) ? "0" + d : d;
|
|
return m+"/"+d+"/"+dt.getFullYear().toString();
|
|
})();
|
|
var fullDate = week[dt.getDay()] + ", " + month[dt.getMonth()] + " " + dt.getDate().toString() + ", " + dt.getFullYear().toString();
|
|
h3.textContent = smallDate + " | " + fullDate;
|
|
div.appendChild(h3);
|
|
var p = document.createElement("p");
|
|
p.innerHTML = examplePost[i].content;
|
|
div.appendChild(p);
|
|
home.appendChild(div);
|
|
}
|
|
}
|
|
|
|
function chartOptions(graphData) {
|
|
return {
|
|
type: 'bar',
|
|
data: {
|
|
labels: graphData[0],
|
|
datasets: [{
|
|
label: "Phoneme Prevalence",
|
|
data: graphData[1],
|
|
backgroundColor: 'rgba(244, 121, 34, 0.7)',
|
|
borderColor: 'rgba(246, 112, 18, 1)',
|
|
borderWidth: 2
|
|
}]
|
|
},
|
|
options: {
|
|
legend: {
|
|
labels: {
|
|
fontFamily: "'Open Sans Condensed', sans-serif",
|
|
fontSize: 20
|
|
}
|
|
},
|
|
scales: {
|
|
yAxes: [{
|
|
scaleLabel: {
|
|
display: true,
|
|
labelString: "Phoneme (%)",
|
|
fontFamily: "'Open Sans Condensed', sans-serif",
|
|
fontSize: 20,
|
|
padding: 4
|
|
},
|
|
ticks: {
|
|
fontFamily: "'Open Sans Condensed', sans-serif",
|
|
fontSize: 20,
|
|
callback: function(value) {
|
|
return value + "%";
|
|
}
|
|
}
|
|
}],
|
|
xAxes: [{
|
|
scaleLabel: {
|
|
display: true,
|
|
labelString: "Percent Prevalence",
|
|
fontFamily: "'Open Sans Condensed', sans-serif",
|
|
fontSize: 20,
|
|
padding: 4
|
|
},
|
|
ticks: {
|
|
fontFamily: "'Open Sans Condensed', sans-serif",
|
|
fontSize: 20
|
|
}
|
|
}]
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
document.getElementById("newLanguage").onclick = function(event) { // Close add language.
|
|
document.getElementById("newLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("newLanguage").style.display = "none";
|
|
}, 300);
|
|
document.getElementById("editLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("editLanguage").style.display = "none";
|
|
}, 300);
|
|
};
|
|
|
|
document.querySelectorAll("#newLanguage > div")[0].onclick = function(event) {
|
|
event.stopPropagation();
|
|
};
|
|
|
|
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;
|
|
document.getElementById("editLanguage").style.display = "block";
|
|
setTimeout(function() {
|
|
document.getElementById("editLanguage").style.opacity = "1";
|
|
}, 10);
|
|
};
|
|
|
|
document.querySelectorAll("#newLanguageSubmit p")[0].onclick = function() {
|
|
if(!submittable) return;
|
|
submittable = false;
|
|
var name = document.querySelectorAll("#newLanguageName input")[0].value;
|
|
if(name === "") {
|
|
alert("Please enter in the name for language!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
var info = document.querySelectorAll("#newLanguagePhonemes textarea")[0].value;
|
|
if(info === "") {
|
|
alert("Please enter in the values for phonemes!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
info = info.split("\n");
|
|
var phonemes = {};
|
|
for(var i = 0; i < info.length; i++) {
|
|
info[i] = info[i].split(/[ ,]+/);
|
|
var num = parseFloat(info[i][1]);
|
|
if(isNaN(num)) {
|
|
alert("Value for " + info[i][0] + " is not a number or does not exist!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
phonemes[info[i][0]] = num;
|
|
}
|
|
var newLanguage = {
|
|
name: name,
|
|
source: null,
|
|
phonemes: phonemes
|
|
};
|
|
|
|
this.innerText = "Processing...";
|
|
this.style.backgroundColor = "rgba(0,0,0,0.2)";
|
|
var p = this;
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'POST',
|
|
dataType: "json",
|
|
contentType: 'application/json;charset=UTF-8',
|
|
data: JSON.stringify(newLanguage)
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
document.getElementById("newLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("newLanguage").style.display = "none";
|
|
submittable = true;
|
|
p.innerText = "Submit!";
|
|
p.style.backgroundColor = "#FEFEFE";
|
|
document.querySelectorAll("#newLanguageName input")[0].value = "";
|
|
document.querySelectorAll("#newLanguagePhonemes textarea")[0].value = "";
|
|
}, 300);
|
|
getData("add");
|
|
},
|
|
function error(e) {
|
|
alert("There was an error adding a language.");
|
|
console.log(e);
|
|
}
|
|
);
|
|
};
|
|
|
|
document.querySelectorAll("#editLanguageSubmit p")[0].onclick = function() {
|
|
if(!submittable) return;
|
|
var langInfo = language(dropOpStore["langSelect"]);
|
|
submittable = false;
|
|
var name = document.querySelectorAll("#editLanguageName input")[0].value;
|
|
if(name === "") {
|
|
alert("Please enter in the name for language!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
var info = document.querySelectorAll("#editLanguagePhonemes textarea")[0].value;
|
|
if(info === "") {
|
|
alert("Please enter in the values for phonemes!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
info = info.split("\n");
|
|
var newPhonemes = {};
|
|
for(var i = 0; i < info.length; i++) {
|
|
info[i] = info[i].split(/[ ,]+/);
|
|
var num = parseFloat(info[i][1]);
|
|
if(isNaN(num)) {
|
|
alert("Value for " + info[i][0] + " is not a number or does not exist!");
|
|
submittable = true;
|
|
return;
|
|
}
|
|
newPhonemes[info[i][0]] = num;
|
|
}
|
|
|
|
this.innerText = "Processing...";
|
|
this.style.backgroundColor = "rgba(0,0,0,0.2)";
|
|
var p = this;
|
|
|
|
var diffChange = [];
|
|
var diffRemove = [];
|
|
var phoKeys = Object.keys(langInfo.phonemes);
|
|
for(var i = 0; i < phoKeys.length; i++) {
|
|
if(newPhonemes[phoKeys[i]] === undefined) {
|
|
diffRemove.push(phoKeys[i]);
|
|
} else if(langInfo.phonemes[phoKeys[i]] !== newPhonemes[phoKeys[i]]) {
|
|
diffChange.push(phoKeys[i]);
|
|
} else {
|
|
continue;
|
|
}
|
|
}
|
|
|
|
var todo = {
|
|
name: newLanguage.name !== langInfo.name,
|
|
add: diffChange.length > 0,
|
|
remove: diffRemove.length > 0
|
|
};
|
|
|
|
var error = false;
|
|
|
|
if(todo.name) { // Ajax requests for changing name.
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'PATCH',
|
|
dataType: "json",
|
|
contentType: 'application/json;charset=UTF-8',
|
|
data: JSON.stringify({
|
|
action: "language_name_edit",
|
|
data: {
|
|
language_id: langInfo.id,
|
|
language_name: name
|
|
}
|
|
})
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
if(todo.name && !todo.add && !todo.remove) {
|
|
document.getElementById("editLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("editLanguage").style.display = "none";
|
|
submittable = true;
|
|
p.innerText = "Submit!";
|
|
p.style.backgroundColor = "#FEFEFE";
|
|
document.querySelectorAll("#editLanguageName input")[0].value = "";
|
|
document.querySelectorAll("#editLanguagePhonemes textarea")[0].value = "";
|
|
}, 300);
|
|
getData("edit");
|
|
}
|
|
},
|
|
function error(e) {
|
|
error = true;
|
|
alert("There was an error change the language name.");
|
|
console.log(e);
|
|
}
|
|
);
|
|
}
|
|
|
|
if(error) return;
|
|
|
|
for(var i = 0; i < diffChange.length; i++) { // Ajax requests for adding or editing phonemes.
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'PATCH',
|
|
dataType: "json",
|
|
contentType: 'application/json;charset=UTF-8',
|
|
context: {counter: i},
|
|
data: JSON.stringify({
|
|
action: "phoneme_add",
|
|
data: {
|
|
language_id: langInfo.id,
|
|
phoneme: diffChange[i],
|
|
value: newPhonemes[diffChange[i]]
|
|
}
|
|
})
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
if(todo.add && !todo.remove && this.counter === diffChange.length-1) {
|
|
document.getElementById("editLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("editLanguage").style.display = "none";
|
|
submittable = true;
|
|
p.innerText = "Submit!";
|
|
p.style.backgroundColor = "#FEFEFE";
|
|
document.querySelectorAll("#editLanguageName input")[0].value = "";
|
|
document.querySelectorAll("#editLanguagePhonemes textarea")[0].value = "";
|
|
}, 300);
|
|
getData("edit");
|
|
}
|
|
|
|
},
|
|
function error(e) {
|
|
error = true;
|
|
alert("There was an error change the phoneme values.");
|
|
console.log(e);
|
|
}
|
|
);
|
|
}
|
|
|
|
if(error) return;
|
|
|
|
console.log({
|
|
action: "phoneme_remove",
|
|
data: {
|
|
language_id: langInfo.id,
|
|
phoneme_id: diffRemove[i]
|
|
}
|
|
});
|
|
|
|
for(var i = 0; i < diffRemove.length; i++) { // Ajax requests for removing phoneme values.
|
|
$.ajax({
|
|
url: serverURL + '/server',
|
|
type: 'PATCH',
|
|
dataType: "json",
|
|
contentType: 'application/json;charset=UTF-8',
|
|
context: {counter: i},
|
|
data: JSON.stringify({
|
|
action: "phoneme_remove",
|
|
data: {
|
|
language_id: langInfo.id,
|
|
phoneme: diffRemove[i]
|
|
}
|
|
})
|
|
})
|
|
.then(
|
|
function success(incoming) {
|
|
if(this.counter === diffRemove.length-1) {
|
|
document.getElementById("editLanguage").style.opacity = "0";
|
|
setTimeout(function() {
|
|
document.getElementById("editLanguage").style.display = "none";
|
|
submittable = true;
|
|
p.innerText = "Submit!";
|
|
p.style.backgroundColor = "#FEFEFE";
|
|
document.querySelectorAll("#editLanguageName input")[0].value = "";
|
|
document.querySelectorAll("#editLanguagePhonemes textarea")[0].value = "";
|
|
}, 300);
|
|
getData("edit");
|
|
}
|
|
|
|
},
|
|
function error(e) {
|
|
error = true;
|
|
alert("There was an error removing phoneme values.");
|
|
console.log(e);
|
|
}
|
|
);
|
|
}
|
|
};
|
|
|
|
/*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);
|
|
|