This commit is contained in:
Flummi
2019-05-19 01:45:45 +00:00
parent 1ba52a8361
commit 2a5651c00a
9 changed files with 169 additions and 119 deletions

View File

@@ -10,7 +10,7 @@ const calcItems = () => {
rt.ct.wrapper.pages.forEach(e => {
e.style.marginLeft = Math.max((width - (cols * (rt.layout.itemsize + rt.layout.margin)) + rt.layout.margin) / rt.layout.min_rows, 0) * 1.5 + "px";
e.style.paddingTop = Math.max((height - (rows * (rt.layout.itemsize + rt.layout.margin)) + rt.layout.margin) / rt.layout.min_rows, 0) + "px";
e.style.paddingTop = Math.max((height - (rows * (rt.layout.itemsize + rt.layout.margin)) + rt.layout.margin) / rt.layout.min_rows, 0) * 3 + "px";
});
return {
@@ -53,38 +53,44 @@ const getItems = async ({ el, opt = "" }) => {
rt.ct.header.pagepos.innerHTML = `items ${rt.items.first} - ${rt.items.last}`;
};
const getItem = async itemid => {
return await (await fetch(`${rt.api}/item/${itemid}`)).json();
};
const scrolltomiddle = el => {
el[0].scrollIntoView({ block: rt.vars.block });
el[2].scrollIntoView({ block: rt.vars.block });
el[1].scrollIntoView({ block: rt.vars.block });
};
const closeItemview = () => {
rt.tmp.hash = false;
window.location.hash = "";
rt.ct.tabs.item.removeEventListener("click", closeItemview);
rt.ct.wrapper.pages[1].querySelectorAll("a > img").forEach(f => {
f.style.boxShadow = null;
f.style.borderRadius = null;
f.style.transition = ".1s ease-out";
});
rt.ct.wrapper.items[1].innerHTML = "";
showLayer("page", true);
};
const showLayer = (layer, scroll = true) => {
// hide all pages
console.log(layer, rt.tmp.layer);
if(layer === rt.tmp.layer)
return;
rt.tmp.layer = layer;
for(let e in rt.ct.tabs)
rt.ct.tabs[e].style.display = "none";
// remove all events for reassigning
document.removeEventListener("wheel", events.wheel.item);
document.removeEventListener("wheel", events.wheel.page);
window.removeEventListener("resize", events.resize.item);
window.removeEventListener("resize", events.resize.page);
[...rt.ct.arrows] // remove itembuttons
.filter(e => ["left", "right"].includes(e.id))
.forEach(p => p.removeEventListener("click", events.wheel.item));
[...rt.ct.arrows] // remove pagebuttons
.filter(e => ["up", "down"].includes(e.id))
.forEach(p => p.removeEventListener("click", events.wheel.page));
rt.tmp.events.page = false;
rt.tmp.events.item = false;
switch(layer) {
case "page":
rt.ct.tabs.item.style.display = "none";
rt.ct.tabs.howto.style.display = "none";
document.addEventListener("wheel", events.wheel.page);
window.addEventListener("resize", events.resize.page);
[...rt.ct.arrows] // add pagebuttons
.filter(e => ["up", "down"].includes(e.id))
.forEach(p => p.addEventListener("click", events.wheel.page));
rt.tmp.events.page = true;
if(scroll)
scrolltomiddle(rt.ct.wrapper.pages);
@@ -94,11 +100,9 @@ const showLayer = (layer, scroll = true) => {
break;
case "item":
rt.ct.tabs.item.style.display = "block";
document.addEventListener("wheel", events.wheel.item);
window.addEventListener("resize", events.resize.item);
[...rt.ct.arrows] // add itembuttons
.filter(e => ["left", "right"].includes(e.id))
.forEach(p => p.addEventListener("click", events.wheel.item));
rt.tmp.events.item = true;
rt.ct.tabs.item.addEventListener("click", closeItemview);
if(scroll)
scrolltomiddle(rt.ct.wrapper.items);
@@ -111,11 +115,14 @@ const showLayer = (layer, scroll = true) => {
rt.ct.tabs.howto.style.display = "block";
break;
}
rt.tmp.scroll = false;
};
export default { // oof
calcItems: calcItems,
getItems: getItems,
getItem: getItem,
showLayer: showLayer,
scrolltomiddle: scrolltomiddle
scrolltomiddle: scrolltomiddle,
closeItemview: closeItemview
};