maru21
92bbebd2a1
fixed bug with sidebar click event not being cleared after accessing files and then pressing edit some cosmetic changes animations reimplemented bookshelfexport in localonly mode added logout functionality
308 lines
9.4 KiB
JavaScript
308 lines
9.4 KiB
JavaScript
import buildForm from "./form.js";
|
|
import { loadFileDivCallBack } from "./files.js";
|
|
import { retrieveData, clearData, getFileName, importBookShelf } from "./storage.js";
|
|
import { insertTextBlocks, modalNotifier } from "./evts.js";
|
|
import { createTemplate, createTemplateCallBack} from "./createTemplate.js";
|
|
import { getUsrId, sessionVerification } from "./scripts.js";
|
|
|
|
function loadTemplate(template, newFlag = false, loadOnly = false) {
|
|
document.getElementById("siteTitle").innerHTML = template.replace(/_/g, " ");
|
|
activeState.loadedTemplate = template;
|
|
|
|
if (newFlag) {
|
|
activeState.fileName = "none";
|
|
} else {
|
|
activeState.fileName = getFileName();
|
|
}
|
|
|
|
document.getElementById("navMob").className = document
|
|
.getElementById("navMob")
|
|
.className.replace(" w3-show", "");
|
|
if (screen.width < 993) {
|
|
let sidebar = document.getElementById("sidebar");
|
|
sidebar.style.display = "none";
|
|
document.getElementById("siteTitle").innerHTML = "TG";
|
|
}
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
let respText = decodeURIComponent(this.responseText);
|
|
if (loadOnly == "createTemplate") {
|
|
createTemplateCallBack(template, respText.split("!JSON_placeholder:")[0]);
|
|
return;
|
|
}
|
|
buildForm(respText, loadOnly);
|
|
if (loadOnly) {
|
|
loadFileDivCallBack();
|
|
return;
|
|
}
|
|
|
|
//retrieve previos userData / or preset data if newFile is called
|
|
let cdata;
|
|
if (newFlag) {
|
|
cdata = retrieveData("templatePreset", template);
|
|
} else {
|
|
cdata = retrieveData("userInputForce");
|
|
}
|
|
if (cdata != "") {
|
|
let res = "";
|
|
try {
|
|
res = JSON.parse(cdata);
|
|
} catch (e) {
|
|
console.log("error", cdata);
|
|
return;
|
|
}
|
|
retrieveForm(res);
|
|
}
|
|
|
|
//select first object and focus on it
|
|
let obj = JSON.parse(
|
|
window.sessionStorage.getItem("templateObjectsPurified")
|
|
);
|
|
let firstElement = document.getElementById(obj[0].word.replace(/ /g, "_"));
|
|
if (firstElement != null) firstElement.focus();
|
|
|
|
}
|
|
};
|
|
xhttp.open("GET", "php/?template=" + template, true);
|
|
xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded; charset=UTF-8');
|
|
xhttp.send();
|
|
}
|
|
|
|
function loadNewTemplate(template) {
|
|
|
|
//sessionVerfication check
|
|
if (!sessionVerification()) {
|
|
modalNotifier("Error: Session is not authenticated...", 0);
|
|
}
|
|
|
|
//set current page value in activeState object
|
|
activeState.activePage = "template";
|
|
|
|
let sidebarDiv = document.getElementById("sidebar");
|
|
sidebarDiv.replaceWith(sidebarDiv.cloneNode(true));
|
|
|
|
clearData("userInput", template);
|
|
loadTemplate(template, true);
|
|
}
|
|
|
|
function loadNavBar() {
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
let res = "";
|
|
try {
|
|
res = JSON.parse(this.responseText);
|
|
} catch (e) {
|
|
console.log("error", this.responseText);
|
|
return;
|
|
}
|
|
|
|
let divMob = document.getElementById("navMob");
|
|
for (let x in res) {
|
|
let aMob = document.createElement("a");
|
|
|
|
aMob.setAttribute("href", "#");
|
|
aMob.setAttribute("data-template", res[x][1]);
|
|
aMob.classList.add("w3-bar-item", "w3-button", "w3-padding-large");
|
|
aMob.innerHTML = res[x][0];
|
|
|
|
divMob.appendChild(aMob);
|
|
|
|
activeState.templates.push(res[x][1]);
|
|
}
|
|
let createEntry = document.createElement("a");
|
|
createEntry.setAttribute("href", "#");
|
|
createEntry.setAttribute("data-template", "createNew");
|
|
createEntry.classList.add("w3-bar-item", "w3-button", "w3-padding-large");
|
|
createEntry.innerHTML = "Manage templates";
|
|
|
|
divMob.appendChild(createEntry);
|
|
divMob.addEventListener("click", (e) => {
|
|
if (e.target && e.target.matches("a.w3-bar-item")) {
|
|
let template = e.target.dataset.template;
|
|
if (template == "createNew") {
|
|
createTemplate();
|
|
return;
|
|
}
|
|
loadNewTemplate(template);
|
|
}
|
|
});
|
|
}
|
|
};
|
|
xhttp.open("GET", "php/?templates", true);
|
|
xhttp.send();
|
|
}
|
|
function initTextBlocks() {
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
let res = "";
|
|
try {
|
|
res = JSON.parse(this.responseText);
|
|
} catch (e) {
|
|
console.log("error", this.responseText)
|
|
return;
|
|
}
|
|
const textBlocksHolder = document.getElementById("textBlocks");
|
|
const divReg = document.getElementById("navTb");
|
|
for (let x in res) {
|
|
if (res[x][1].length < 1) continue;
|
|
|
|
let aReg = document.createElement("a");
|
|
aReg.setAttribute("href", "#");
|
|
aReg.classList.add("w3-bar-item", "w3-hide-small", "w3-padding-small");
|
|
let textBlockText = res[x][1];
|
|
if (res[x][1].length > 80) {
|
|
textBlockText = res[x][1].substr(0, 80) + "...";
|
|
}
|
|
aReg.innerHTML = "<b>" + res[x][0] + ":</b> " + textBlockText;
|
|
divReg.appendChild(aReg);
|
|
|
|
const text = document.createTextNode(
|
|
res[x][0] + ": " + res[x][1] + "\n"
|
|
);
|
|
textBlocksHolder.appendChild(text);
|
|
}
|
|
divReg.addEventListener("click", (e) => {
|
|
if (e.target && e.target.matches("a.w3-bar-item")) {
|
|
insertTextBlocks(e.target);
|
|
}
|
|
});
|
|
}
|
|
};
|
|
xhttp.open("GET", "php/?textBlocks", true);
|
|
xhttp.send();
|
|
}
|
|
|
|
function setTemplatePreset(template, formData) {
|
|
//console.log(template +" : "+ formData);
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.open("POST", "php/?setForm");
|
|
xhttp.setRequestHeader("Accept", "application/json");
|
|
xhttp.setRequestHeader("Content-Type", "application/json");
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
//console.log(this.responseText);
|
|
}
|
|
};
|
|
let data = {
|
|
template: template,
|
|
data: formData,
|
|
};
|
|
|
|
xhttp.send(JSON.stringify(data));
|
|
}
|
|
|
|
function setNewTemplate(fileName, data) {
|
|
let obj = {
|
|
fileName: fileName,
|
|
data: data,
|
|
};
|
|
//console.log(template +" : "+ formData);
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.open("POST", "php/?setTemplate");
|
|
xhttp.setRequestHeader("Accept", "application/json");
|
|
xhttp.setRequestHeader("Content-Type", "application/json");
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
//console.log(this.responseText);
|
|
}
|
|
};
|
|
|
|
xhttp.send(JSON.stringify(obj));
|
|
}
|
|
|
|
function storeFilesToServer(data) {
|
|
//console.log(template +" : "+ formData);
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
if (this.responseText == "success") {
|
|
console.log("files saved");
|
|
}
|
|
}
|
|
};
|
|
xhttp.open("POST", "php/?storeFiles", true);
|
|
xhttp.setRequestHeader("Accept", "application/json");
|
|
xhttp.setRequestHeader("Content-Type", "application/json");
|
|
xhttp.send(JSON.stringify(data));
|
|
}
|
|
|
|
function checkForStoredDataOnServer() {
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
if (this.responseText == "none") {
|
|
} else {
|
|
activeState.serverFilesTs = this.responseText;
|
|
let btn = document.getElementById("importModalBtn");
|
|
btn.style.display = "";
|
|
}
|
|
}
|
|
};
|
|
xhttp.open("GET", "php/?storedFiles="+getUsrId(), true);
|
|
xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded; charset=UTF-8');
|
|
xhttp.send();
|
|
}
|
|
|
|
function delStoredDataOnServer() {
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
if (this.responseText == "none") {
|
|
let btn = document.getElementById("importModalBtn");
|
|
btn.style.display = "none";
|
|
}
|
|
}
|
|
};
|
|
xhttp.open("GET", "php/?storedFiles="+getUsrId()+"&del", true);
|
|
xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded; charset=UTF-8');
|
|
xhttp.send();
|
|
}
|
|
|
|
|
|
function retrieveForm(arr) {
|
|
for (let i = 0; i < arr.length; i++) {
|
|
let e = document.getElementById(arr[i].name);
|
|
if (e === null) {
|
|
e = document.getElementById(arr[i].name.split("cl-")[1]);
|
|
if (e === null) continue;
|
|
}
|
|
|
|
if (e.name.substr(0, 4) == "clM-") continue;
|
|
|
|
switch (e.nodeName) {
|
|
case "TEXTAREA":
|
|
e.innerHTML = arr[i].value;
|
|
break;
|
|
case "INPUT":
|
|
e.value = arr[i].value;
|
|
break;
|
|
case "SELECT":
|
|
for (let j = 0; j < e.options.length; j++) {
|
|
if (e.options[j].value == arr[i].value) {
|
|
// Item is found. Set its property and exit
|
|
e.options[j].selected = true;
|
|
break;
|
|
}
|
|
}
|
|
break;
|
|
default:
|
|
e.innerHTML = arr[i].value;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
export {
|
|
loadTemplate,
|
|
loadNavBar,
|
|
initTextBlocks,
|
|
loadNewTemplate,
|
|
setTemplatePreset,
|
|
setNewTemplate,
|
|
storeFilesToServer,
|
|
checkForStoredDataOnServer,
|
|
delStoredDataOnServer
|
|
};
|