diff options
Diffstat (limited to 'rannak/mangud/partorg/kuulsused/script.js')
-rw-r--r-- | rannak/mangud/partorg/kuulsused/script.js | 70 |
1 files changed, 62 insertions, 8 deletions
diff --git a/rannak/mangud/partorg/kuulsused/script.js b/rannak/mangud/partorg/kuulsused/script.js index 60c3ffa..1ab5cef 100644 --- a/rannak/mangud/partorg/kuulsused/script.js +++ b/rannak/mangud/partorg/kuulsused/script.js @@ -4,11 +4,15 @@ document.addEventListener('DOMContentLoaded', () => { }); + const list_items = document.querySelectorAll(".list-item"); const lists = document.querySelectorAll(".list"); let draggedItem = null; + +// Draggable Items + for (let i=0; i < list_items.length; i++){ const item = list_items[i]; @@ -16,25 +20,36 @@ for (let i=0; i < list_items.length; i++){ item.addEventListener("dragstart", e => { draggedItem = item; setTimeout(() => (item.style.display = "none"), 0); + }); + item.addEventListener("dragend", e => { + setTimeout(() => { draggedItem.style.display = "block"; draggedItem = null}, 0); checkIfAllGood(); }); - for (let j=0; j < lists.length; j++){ - const list = lists[j]; - /* Event Listeners */ +} + + + + +// Dropping spots + +for (let j=0; j < lists.length; j++){ + const list = lists[j]; + + /* Event Listeners */ - list.addEventListener("dragenter",e => (e.preventDefault())); + list.addEventListener("dragenter",e => (e.preventDefault())); list.addEventListener("dragover",e => { e.preventDefault(); - list.style.backgroundColor = "rgba(0,0,0,0.5)"; + list.style.backgroundColor = "rgba(0,0,0,0.9)"; }); @@ -46,12 +61,46 @@ for (let i=0; i < list_items.length; i++){ list.addEventListener("drop",e => { if (list.children.length == 0 || list.className.includes("startBasket")) list.append(draggedItem); - list.style.backgroundColor = "rgba(0,0,0,0.5)"; + list.style.backgroundColor = "rgba(0,0,0,0.3)"; }) - } - } + + +// Smooth scroll stuff + +// const ekraaniPikkus = window.innerHeight; +// let d; +// if (ekraaniPikkus > 800) +// d = ekraaniPikkus / 8; +// else +// d = ekraaniPikkus / 4; +// +// console.log(ekraaniPikkus); +// console.log(document.body.scrollHeight); +// const maxScroll = document.body.scrollHeight; +// +// window.ondragover = function(e){ +// console.log("Pos: ",e.clientY); +// console.log(d); +// console.log("X: ", e.y); +// //console.log(e); +// +// if (e.clientY > (ekraaniPikkus - d)){ +// console.log("Should scroll down"); +// if (maxScroll > e.y+d) +// window.scrollTo(0, e.y + d); +// else +// window.scrollTo(0, maxScroll); +// } +// else if (e.clientY < (d)) +// window.scrollTo(0, e.y - d); +// } + + + + + function checkIfAllGood(){ let rightDone = []; @@ -73,3 +122,8 @@ function checkIfAllGood(){ btn.onclick = () => location.href = "../plakat"; } } + + + +/* The Scrolling on thing while dragging */ +// window.scrollTo(0, 500); |