|
|
@@ -1,7 +1,13 @@ |
|
|
|
"use strict"; |
|
|
|
|
|
|
|
|
|
|
|
/* BEGIN KEYBOARD EVENTS */ |
|
|
|
var currentTabID; |
|
|
|
var tabContent; |
|
|
|
var onScreenTabCount; |
|
|
|
|
|
|
|
|
|
|
|
/* BEGIN EVENTS */ |
|
|
|
|
|
|
|
document.getElementById("name").addEventListener("keypress", function (e) { |
|
|
|
if (e.key === 'Enter') { |
|
|
|
initValidateLogin(); |
|
|
@@ -13,10 +19,16 @@ document.getElementById("password").addEventListener("keypress", function (e) { |
|
|
|
initValidateLogin(); |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
document.getElementById("tab1").addEventListener("click", function (e) { |
|
|
|
initSelectTab(e); |
|
|
|
}); |
|
|
|
|
|
|
|
/* END KEYBOARD EVENTS */ |
|
|
|
|
|
|
|
|
|
|
|
/* BEGIN INIT METHODS ACCESSIBLE BY DOCUMENT */ |
|
|
|
|
|
|
|
function initValidateLogin() { |
|
|
|
let name = document.getElementById("name").value; |
|
|
|
let password = document.getElementById("password").value; |
|
|
@@ -44,11 +56,22 @@ function initValidateLogin() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function initValidateSave() { |
|
|
|
function initValidateSave() { //TODO what if name is taken |
|
|
|
let name = document.getElementById("name-form").value; |
|
|
|
let text = document.getElementById("textarea").value; |
|
|
|
let password; |
|
|
|
if (document.getElementById("password-form").value === "") // existing user |
|
|
|
let tabCount = 0; |
|
|
|
let text = ""; |
|
|
|
let empty = true; |
|
|
|
tabContent.set(currentTabID, document.getElementById("textarea").value); |
|
|
|
tabContent.forEach(combineTabsLocalEvent); |
|
|
|
function combineTabsLocalEvent(values){ |
|
|
|
if (values !== "" && values != null){ |
|
|
|
tabCount++; |
|
|
|
empty = false; |
|
|
|
text += "|textdungeon-tab" + tabCount + "|" + values + "|textdungeon-end|"; |
|
|
|
} |
|
|
|
} |
|
|
|
if (document.getElementById("password-form").value === "") // logged in user |
|
|
|
password = sessionStorage.getItem(name); |
|
|
|
else |
|
|
|
password = document.getElementById("password-form").value; |
|
|
@@ -56,8 +79,8 @@ function initValidateSave() { |
|
|
|
blinkUtil(document.getElementById("name-form"), .1, 6, "whitesmoke", "#ff1a1a"); |
|
|
|
} else if (password === "" || password === null) { |
|
|
|
blinkUtil(document.getElementById("password-form"), .1, 6, "whitesmoke", "#ff1a1a"); |
|
|
|
} else if (text === "" || text === null) { |
|
|
|
document.getElementById("textarea").placeholder = "Cannot save an empty form."; |
|
|
|
} else if (empty) { |
|
|
|
document.getElementById("textarea").placeholder = "Cannot save an empty dungeon."; |
|
|
|
} else if (name.length > 60) { |
|
|
|
blinkUtil(document.getElementById("name-form"), .1, 6, "whitesmoke", "#ff1a1a"); |
|
|
|
document.getElementById("name-form").value = ""; |
|
|
@@ -72,7 +95,7 @@ function initValidateSave() { |
|
|
|
document.getElementById("name-form").placeholder = "Avoid special characters."; |
|
|
|
} else { |
|
|
|
sessionStorage.setItem(name, password); |
|
|
|
organizeSaveLocalEvent(name, password, text); |
|
|
|
saveLocalEvent(name, password, text, tabCount); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
@@ -91,6 +114,10 @@ function initEmptyForm() { |
|
|
|
document.getElementById("textarea").rows = window.innerHeight / 24; |
|
|
|
document.getElementById("page-form-menu").style.display = "inherit"; |
|
|
|
document.getElementById("page-form").style.display = "inherit"; |
|
|
|
onScreenTabCount = 1; |
|
|
|
currentTabID = "tab1"; |
|
|
|
tabContent = new Map(); |
|
|
|
tabContent.set("tab1", ""); |
|
|
|
} |
|
|
|
|
|
|
|
function initLogout() { |
|
|
@@ -101,6 +128,7 @@ function initLogout() { |
|
|
|
document.getElementById("page-form").style.display = "none"; |
|
|
|
document.getElementById("div-logo").style.display = "inherit"; |
|
|
|
document.getElementById("div-login-parent").style.display = "inherit"; |
|
|
|
document.querySelectorAll('.generated-tab').forEach(e => e.remove()); |
|
|
|
} |
|
|
|
|
|
|
|
function initAboutPage() { |
|
|
@@ -120,20 +148,31 @@ function initDelete() { |
|
|
|
} |
|
|
|
|
|
|
|
function initAddTab() { |
|
|
|
// TODO 10 charlength - 2 free |
|
|
|
document.getElementById("tabs").value = parseInt(document.getElementById("tabs").value) + 1; |
|
|
|
let tab = "<a id=\"tab" + document.getElementById("tabs").value + "\" class=\"item\" style=\"border: none;background-color: #252628;display: inherit;\">Tab</a>"; |
|
|
|
onScreenTabCount++; |
|
|
|
tabContent.set("tab" + onScreenTabCount, ""); |
|
|
|
let tab = "<a id=\"tab" + onScreenTabCount + "\" class=\"item generated-tab\" style=\"border: none;background-color: #252628;display: inherit;\">Tab</a>"; |
|
|
|
document.getElementById('div-helper-tabs').insertAdjacentHTML('beforebegin', tab); |
|
|
|
var newTab = document.getElementById("tab" + document.getElementById("tabs").value); |
|
|
|
var newTab = document.getElementById("tab" + onScreenTabCount); |
|
|
|
newTab.addEventListener("click", function (e) { |
|
|
|
selectTabLocalEvent(e); |
|
|
|
initSelectTab(e); |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
function initSelectTab(e) { |
|
|
|
tabContent.set(currentTabID, document.getElementById("textarea").value); |
|
|
|
document.getElementById(currentTabID).classList.remove("active"); |
|
|
|
document.getElementById(currentTabID).style.backgroundColor = "#252628"; |
|
|
|
document.getElementById(e.target.id).classList.add("active"); |
|
|
|
document.getElementById(e.target.id).style.backgroundColor = "#3d3e3f"; |
|
|
|
document.getElementById("textarea").value = tabContent.get(e.target.id); |
|
|
|
currentTabID = e.target.id; |
|
|
|
} |
|
|
|
|
|
|
|
/* END INIT METHODS ACCESSIBLE BY DOCUMENT */ |
|
|
|
|
|
|
|
|
|
|
|
/* BEGIN LOCAL EVENTS */ |
|
|
|
|
|
|
|
function loginLocalEvent(name, password) { |
|
|
|
let xmlrequest = new XMLHttpRequest(); |
|
|
|
xmlrequest.open("POST", "/"); |
|
|
@@ -145,14 +184,30 @@ function loginLocalEvent(name, password) { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function saveLocalEvent(name, password, text) { |
|
|
|
function saveLocalEvent(name, password, text, tabCount) { |
|
|
|
let xmlrequest = new XMLHttpRequest(); |
|
|
|
xmlrequest.open("POST", "/"); |
|
|
|
xmlrequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); |
|
|
|
xmlrequest.send("name=" + name + "&password=" + password + "&text=" + text); // not prod |
|
|
|
xmlrequest.onload = function () // not prod |
|
|
|
xmlrequest.send("name=" + name + "&password=" + password + "&text=" + text + "&tabs=" + tabCount); |
|
|
|
xmlrequest.onload = function () |
|
|
|
{ |
|
|
|
console.log(xmlrequest.response);// not prod |
|
|
|
saveResponseLocalEvent(xmlrequest.response); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function saveResponseLocalEvent(response) { |
|
|
|
// TODO NOTIFY |
|
|
|
let responseJson = JSON.parse(response); |
|
|
|
if (responseJson.DOCUMENT_TYPE==="DECRYPT_FAILURE"){ |
|
|
|
blinkUtil(document.getElementById("name-form"), .1, 6, "whitesmoke", "#ff1a1a"); |
|
|
|
document.getElementById("name-form").value = ""; |
|
|
|
document.getElementById("name-form").placeholder = "Existing name."; |
|
|
|
}else { |
|
|
|
document.getElementById("name-form").disabled = true; |
|
|
|
document.getElementById("password-form").style.display = "none"; |
|
|
|
document.getElementById("btn-logout").style.display = "inherit"; |
|
|
|
document.getElementById("btn-settings").style.display = "inherit"; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
@@ -191,7 +246,7 @@ function loginResponseLocalEvent(response) { |
|
|
|
} |
|
|
|
|
|
|
|
function populateFormLocalEvent(responseJson) { |
|
|
|
|
|
|
|
// TODO 10 charlength title |
|
|
|
document.getElementById("name-form").value = responseJson.DUNGEON.name; |
|
|
|
document.getElementById("name-form").disabled = "true"; |
|
|
|
document.getElementById("password-form").style.display = "none"; |
|
|
@@ -201,24 +256,11 @@ function populateFormLocalEvent(responseJson) { |
|
|
|
// TODO Tab Information |
|
|
|
} |
|
|
|
|
|
|
|
function organizeSaveLocalEvent(name, password, text) { |
|
|
|
// TODO Organize Tabs |
|
|
|
saveLocalEvent(name, password, text); |
|
|
|
document.getElementById("name-form").disabled = true; |
|
|
|
document.getElementById("password-form").style.display = "none"; |
|
|
|
document.getElementById("btn-logout").style.display = "inherit"; |
|
|
|
document.getElementById("btn-settings").style.display = "inherit"; |
|
|
|
// TODO Notify |
|
|
|
} |
|
|
|
|
|
|
|
function selectTabLocalEvent(e) { //TODO also pass curr selected tab |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
/* END LOCAL EVENTS */ |
|
|
|
|
|
|
|
|
|
|
|
/* BEGIN UTILITIES */ |
|
|
|
|
|
|
|
function blinkUtil(el, freq, rounds, color1, color2) { |
|
|
|
let state = false; |
|
|
|
let currRound = 0; |