137 lines
3.2 KiB
JavaScript
137 lines
3.2 KiB
JavaScript
class Gallery {
|
|
constructor(uuid, meta) {
|
|
this.uuid = uuid
|
|
|
|
this.frame = document.createElement("div");
|
|
this.frame.setAttribute("class", "gallery");
|
|
|
|
this.count = document.createElement("div");
|
|
this.count.setAttribute("class", "count");
|
|
|
|
this.nodes = [];
|
|
|
|
this.gallery = meta;
|
|
}
|
|
|
|
set gallery(meta) {
|
|
if (meta == null) {
|
|
while (this.frame.firstChild) {
|
|
this.frame.removeChild(this.frame.firstChild);
|
|
}
|
|
this.nodes = [];
|
|
} else {
|
|
var elems = meta["elems"]
|
|
var counts = {}
|
|
for (var i = 0; i < elems.length; i++) {
|
|
var node = getnode(this.uuid, elems[i]);
|
|
this.frame.appendChild(node);
|
|
this.nodes.push(node);
|
|
if (counts[elems[i]["type"]] == undefined) {
|
|
counts[elems[i]["type"]] = 1
|
|
} else {
|
|
counts[elems[i]["type"]] += 1
|
|
}
|
|
}
|
|
this.counts = counts
|
|
}
|
|
}
|
|
|
|
set counts(counts) {
|
|
if (counts["GraphImage"] != undefined) {
|
|
var c = document.createElement("span")
|
|
var i = document.createElement("img");
|
|
i.setAttribute("src", "static/image.png");
|
|
i.setAttribute("alt", "imágenes");
|
|
c.innerHTML += counts["GraphImage"]
|
|
c.appendChild(i)
|
|
c.setAttribute("class", "count");
|
|
this.count.appendChild(c)
|
|
}
|
|
if (counts["GraphVideo"] != undefined) {
|
|
var c = document.createElement("span")
|
|
var i = document.createElement("img");
|
|
i.setAttribute("src", "static/video.png");
|
|
i.setAttribute("alt", "vídeos");
|
|
c.innerHTML += counts["GraphVideo"]
|
|
c.appendChild(i)
|
|
c.setAttribute("class", "count");
|
|
this.count.appendChild(c)
|
|
}
|
|
}
|
|
|
|
get node() {
|
|
var node = document.createElement("div");
|
|
node.appendChild(this.count);
|
|
node.appendChild(this.frame);
|
|
return node;
|
|
}
|
|
}
|
|
|
|
function getnode(uuid, meta) {
|
|
function getImageNode(uuid, meta) {
|
|
var path = "img/" + uuid + "/" + meta["file"];
|
|
var node = document.createElement("img");
|
|
var a = document.createElement("a");
|
|
node.setAttribute("src", path);
|
|
node.setAttribute("alt", path);
|
|
return node;
|
|
}
|
|
|
|
function getVideoNode(uuid, meta) {
|
|
var path = "img/" + uuid + "/" + meta["file"];
|
|
var video = document.createElement("video");
|
|
video.setAttribute("src", path);
|
|
video.setAttribute("controls", "");
|
|
return video;
|
|
}
|
|
|
|
function getGalleryNode(uuid, meta) {
|
|
return (new Gallery(uuid, meta)).node;
|
|
}
|
|
|
|
var node;
|
|
switch (meta["type"]) {
|
|
case "GraphImage":
|
|
node = getImageNode(uuid, meta);
|
|
break;
|
|
case "GraphVideo":
|
|
node = getVideoNode(uuid, meta);
|
|
break;
|
|
case "Gallery":
|
|
node = getGalleryNode(uuid, meta);
|
|
break;
|
|
}
|
|
return node;
|
|
}
|
|
|
|
function httpGetSync(url) {
|
|
var xmlHttp = new XMLHttpRequest();
|
|
xmlHttp.open("GET", url, false); // true for asynchronous
|
|
xmlHttp.send(null);
|
|
return xmlHttp.responseText;
|
|
}
|
|
|
|
function load() {
|
|
var meta = JSON.parse(httpGetSync("api/meta?uuid=" + uuid));
|
|
var view = document.querySelector("main");
|
|
var desc = document.querySelector("#desc");
|
|
var date = document.querySelector("#date");
|
|
|
|
var node = getnode(uuid, meta);
|
|
|
|
view.appendChild(node);
|
|
desc.innerText = meta["description"];
|
|
|
|
options = {
|
|
weekday: "long",
|
|
year: "numeric",
|
|
month:"long",
|
|
day:"numeric"
|
|
};
|
|
date.innerText = (new Date(meta["date"].replace(/-/g, "/"))).toLocaleString(window.navigator.language, options);
|
|
}
|
|
|
|
console.log(uuid)
|
|
|
|
window.onload = load;
|