363 lines
12 KiB
JavaScript
363 lines
12 KiB
JavaScript
/**
|
|
* Removes a given element
|
|
*
|
|
* @param {DOMElement} id ID of the element to tear down.
|
|
*
|
|
* @return {void}
|
|
*/
|
|
async function removeElement(elem) {
|
|
while (elem.firstChild) {
|
|
elem.removeChild(elem.firstChild);
|
|
}
|
|
elem.parentElement.removeChild(elem);
|
|
}
|
|
|
|
|
|
/**
|
|
* Function toggleHash toggles a specified location.hash value.
|
|
*
|
|
* @param {string} identifier ID to toggle.
|
|
*
|
|
* @return {void}
|
|
*/
|
|
function toggleHash(identifier) {
|
|
if (window.location.hash == "#" + identifier) window.location.hash = "";
|
|
else window.location.hash = "#" + identifier;
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
|
|
let translations = {
|
|
"en" : {
|
|
"uploadFile" : "Upload file",
|
|
"submit" : "Submit",
|
|
"generate" : "Generate",
|
|
"embedCodeGenerator" : "Generator for embed code",
|
|
"helpEmbedCode" : "Here you can create embed code.",
|
|
"singleObjectTile" : "Single object (tile)",
|
|
"singleObjectDetails": "Single object (details)",
|
|
"singleCollection" : "Single collection",
|
|
"exhibitionCalendar" : "Exhibition calendar",
|
|
"eventCalendar" : "Event calendar",
|
|
},
|
|
"de" : {
|
|
"uploadFile" : "Eine Datei heraufladen",
|
|
"submit" : "Abschicken",
|
|
"generate" : "Generieren",
|
|
"embedCodeGenerator" : "Generator für Einbettungen",
|
|
"helpEmbedCode" : "Hier können sie den embed-code generieren.",
|
|
"singleObjectTile" : "Einzelobjekt (Kachel)",
|
|
"singleObjectDetails": "Einzelobjekt (Details)",
|
|
"singleCollection" : "Einzelsammlung",
|
|
"exhibitionCalendar" : "Ausstellungskalender",
|
|
"eventCalendar" : "Veranstaltungen (Kalender)",
|
|
}
|
|
};
|
|
|
|
var debugging = false;
|
|
|
|
/**
|
|
* Function queryPage queries a web page and runs the specified function over the output.
|
|
*
|
|
* @param string url URL to query.
|
|
* @param function func Callback function to run on the request after loading.
|
|
* @param boolean debug Enable / disable debug mode.
|
|
*
|
|
* @return boolean
|
|
*/
|
|
function queryPage (url, func, debug = false) {
|
|
|
|
let request = new XMLHttpRequest();
|
|
request.open('GET', url);
|
|
request.setRequestHeader("Cache-Control", "no-cache");
|
|
request.responseType = 'htm';
|
|
request.send();
|
|
request.onload = function() {
|
|
|
|
func(request, debug);
|
|
};
|
|
|
|
}
|
|
|
|
/**
|
|
* Returns a requested translation from an array in the currently used language.
|
|
*
|
|
* @param mixed[] list Translation variable.
|
|
* @param string specifier Specifies which translation to get.
|
|
*
|
|
* @return string
|
|
*/
|
|
function getTranslation(list, specifier) {
|
|
|
|
let preferedLang = document.getElementsByTagName("html")[0].getAttribute("lang");
|
|
|
|
if (list[preferedLang] !== undefined && list[preferedLang][specifier] !== null) return list[preferedLang][specifier];
|
|
return list["en"][specifier];
|
|
|
|
}
|
|
|
|
/**
|
|
* Function to get all GET variables passed by user
|
|
* Based on gion_13's answer at https://stackoverflow.com/questions/12049620/how-to-get-get-variables-value-in-javascript
|
|
*
|
|
* @return string[]
|
|
*/
|
|
function getGETvars () {
|
|
|
|
var output = {};
|
|
if(document.location.toString().indexOf('?') !== -1) {
|
|
var query = document.location
|
|
.toString()
|
|
// get the query string
|
|
.replace(/^.*?\?/, '')
|
|
// and remove any existing hash string (thanks, @vrijdenker)
|
|
.replace(/#.*$/, '')
|
|
.split('&');
|
|
|
|
for(var i = 0, l = query.length; i < l; i++) {
|
|
var aux = decodeURIComponent(query[i]).split('=');
|
|
output[aux[0]] = aux[1];
|
|
}
|
|
}
|
|
return (output);
|
|
|
|
}
|
|
|
|
/**
|
|
* Allow toggling of navigation.
|
|
*/
|
|
(function() {
|
|
|
|
let navigationMode = window.localStorage.getItem("navigationMode");
|
|
if (navigationMode === undefined || navigationMode === null) {
|
|
window.localStorage.setItem("navigationMode", "1");
|
|
navigationMode = "1";
|
|
}
|
|
|
|
if (navigationMode === "0") {
|
|
document.getElementById("mainNav").classList.toggle("invisible");
|
|
}
|
|
|
|
document.getElementById("toggleNavigation").addEventListener("click", function(e) {
|
|
|
|
if (navigationMode === "0") {
|
|
window.localStorage.setItem("navigationMode", "1");
|
|
navigationMode = "1";
|
|
}
|
|
else {
|
|
window.localStorage.setItem("navigationMode", "0");
|
|
navigationMode = "0";
|
|
}
|
|
|
|
document.getElementById("mainNav").classList.toggle("invisible");
|
|
|
|
});
|
|
|
|
})();
|
|
|
|
/**
|
|
* Open the URL given in the href attribute of the element with the given ID.
|
|
*
|
|
* @param {string} identifier ID of the element with whose href to replace location.href
|
|
*
|
|
* @return {void}
|
|
*/
|
|
function replaceWindowById(identifier) {
|
|
|
|
var link = document.getElementById(identifier);
|
|
|
|
if (link != null) {
|
|
window.location.href = link.href;
|
|
}
|
|
}
|
|
|
|
(async function() {
|
|
|
|
let trigger = document.getElementById("uploadFile");
|
|
if (trigger === undefined || trigger === null) return;
|
|
|
|
trigger.addEventListener("click", function(e) {
|
|
|
|
let overlay = document.createElement("div");
|
|
overlay.classList.add("overlay");
|
|
|
|
let uploadForm = document.createElement("form");
|
|
uploadForm.enctype = "multipart/form-data";
|
|
uploadForm.action = "files.php";
|
|
uploadForm.method = "POST";
|
|
|
|
let uploadLabel = document.createElement("label");
|
|
uploadLabel.textContent = getTranslation(translations, "uploadFile");
|
|
uploadLabel.for = "fileUploadInput";
|
|
|
|
let uploadSize = document.createElement("input");
|
|
uploadSize.type = "hidden";
|
|
uploadSize.name = "MAX_FILE_SIZE";
|
|
uploadSize.value = "300000";
|
|
|
|
let uploadTask = document.createElement("input");
|
|
uploadTask.type = "hidden";
|
|
uploadTask.name = "task";
|
|
uploadTask.value = "upload";
|
|
|
|
let uploadInput = document.createElement("input");
|
|
uploadInput.type = "file";
|
|
uploadInput.id = "fileUploadInput";
|
|
uploadInput.name = "file";
|
|
|
|
let uploadButton = document.createElement("button");
|
|
uploadButton.type = "submit";
|
|
uploadButton.textContent = getTranslation(translations, "submit");
|
|
|
|
uploadForm.appendChild(uploadLabel);
|
|
uploadForm.appendChild(uploadSize);
|
|
uploadForm.appendChild(uploadTask);
|
|
uploadForm.appendChild(uploadInput);
|
|
uploadForm.appendChild(uploadButton);
|
|
|
|
overlay.appendChild(uploadForm);
|
|
document.getElementsByTagName("body")[0].appendChild(overlay);
|
|
|
|
document.getElementsByTagName("body")[0].addEventListener('keydown', async function(e) {
|
|
if (e.keyCode != 27) return;
|
|
removeElement(overlay);
|
|
});
|
|
|
|
queryPage(
|
|
encodeURI('./files.php'),
|
|
function (request) {
|
|
let allFiles = JSON.parse(request.response);
|
|
|
|
for (let i = 0, max = allFiles.length; i < max; i++) {
|
|
console.log(allFiles[i]);
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
})();
|
|
|
|
/**
|
|
* Embed code generator.
|
|
*/
|
|
(function() {
|
|
|
|
function generateToolTip(toolTipID, toolTipText, toolTipTitle = "", triggerId = "") {
|
|
|
|
let trigger = document.createElement("span");
|
|
|
|
trigger.classList.add("newToolTipTag");
|
|
trigger.classList.add("helpToolTip");
|
|
trigger.setAttribute("data-for", toolTipID);
|
|
|
|
let toolTip = document.createElement("div");
|
|
toolTip.id = "tooltip_" + toolTipID;
|
|
toolTip.classList.add("newToolTip");
|
|
toolTip.setAttribute("data-title", toolTipTitle);
|
|
|
|
let toolTipCont = document.createElement("p");
|
|
toolTipCont.textContent = toolTipText;
|
|
toolTip.appendChild(toolTipCont);
|
|
|
|
trigger.appendChild(toolTip);
|
|
|
|
return trigger;
|
|
|
|
}
|
|
|
|
let generator = document.getElementById("embedGenerator");
|
|
if (generator === undefined || generator === null) return;
|
|
|
|
// Define generator types
|
|
|
|
let generatorTypes = [
|
|
["", "", false],
|
|
["singleObjectTile", getTranslation(translations, "singleObjectTile"), true],
|
|
["singleObjectDetails", getTranslation(translations, "singleObjectDetails"), true],
|
|
["singleCollectionTile", getTranslation(translations, "singleCollection"), true],
|
|
["exhibitionCalendar", getTranslation(translations, "exhibitionCalendar"), true],
|
|
["eventCalendar", getTranslation(translations, "eventCalendar"), true],
|
|
];
|
|
|
|
// Add help tooltip
|
|
|
|
let generatorLabelSpan = document.createElement("span");
|
|
generatorLabelSpan.classList.add("labelLine");
|
|
|
|
let generatorLabel = document.createElement("label");
|
|
generatorLabel.textContent = getTranslation(translations, "embedCodeGenerator");
|
|
|
|
generatorLabelSpan.appendChild(generatorLabel);
|
|
generatorLabelSpan.appendChild(generateToolTip("embedGeneratorToolTip", getTranslation(translations, "helpEmbedCode"), getTranslation(translations, "embedCodeGenerator")));
|
|
|
|
generator.appendChild(generatorLabelSpan);
|
|
|
|
let selectType = document.createElement("select");
|
|
|
|
for (let i = 0, max = generatorTypes.length; i < max; i++) {
|
|
let generatorOption = document.createElement("option");
|
|
generatorOption.value = generatorTypes[i][0];
|
|
generatorOption.textContent = generatorTypes[i][1];
|
|
generatorOption.setAttribute("data-useSpecifier", generatorTypes[i][2]);
|
|
selectType.appendChild(generatorOption);
|
|
}
|
|
|
|
generator.appendChild(selectType);
|
|
|
|
let generatorSpecifier = document.createElement("input");
|
|
generatorSpecifier.classList.add("invisible");
|
|
generator.appendChild(generatorSpecifier);
|
|
|
|
let buttonGenerate = document.createElement("a");
|
|
buttonGenerate.classList.add("buttonLike");
|
|
buttonGenerate.textContent = getTranslation(translations, "generate");
|
|
generator.appendChild(buttonGenerate);
|
|
|
|
let generatorField = document.createElement("fieldset");
|
|
|
|
let generatorFieldCont = document.createElement("div");
|
|
generatorField.appendChild(generatorFieldCont);
|
|
|
|
let generatorLegend = document.createElement("legend");
|
|
generatorField.appendChild(generatorLegend);
|
|
|
|
selectType.addEventListener('change', function(e) {
|
|
|
|
generatorSpecifier.value = "";
|
|
if (selectType.options[selectType.selectedIndex].getAttribute("data-useSpecifier") == "true") {
|
|
generatorSpecifier.classList.remove("invisible");
|
|
}
|
|
else generatorSpecifier.classList.add("invisible");
|
|
|
|
generatorLegend.textContent = selectType.options[selectType.selectedIndex].textContent;
|
|
generatorFieldCont.textContent = "";
|
|
|
|
});
|
|
|
|
function runGenerator() {
|
|
if (selectType.value == "") return;
|
|
generatorFieldCont.textContent = "[" + selectType.value + "]";
|
|
if (generatorSpecifier.value != "") {
|
|
generatorFieldCont.textContent += "{" + generatorSpecifier.value + "}";
|
|
}
|
|
}
|
|
|
|
generatorSpecifier.addEventListener('keydown', function(e) {
|
|
if (e.keyCode != 13) return;
|
|
e.stopPropagation(); e.preventDefault();
|
|
runGenerator();
|
|
});
|
|
buttonGenerate.addEventListener('click', function() { runGenerator(); });
|
|
|
|
generator.appendChild(generatorField);
|
|
|
|
if (debugging === true) {
|
|
console.log("Generated generator for pseudocode for embedding from museum-digital.");
|
|
}
|
|
|
|
})();
|
|
|
|
});
|
|
|