From f2318deacde703df99fce50800b58f7e6e759e8b Mon Sep 17 00:00:00 2001 From: Rasmus Luha Date: Sat, 5 Nov 2022 23:12:30 +0200 Subject: Little Restructuring --- rannak/algus/kaart/css/kaart.css | 31 - rannak/algus/kaart/index.html | 1011 --------------------------- rannak/algus/kaart/js/kaart.js | 30 - rannak/algus/utlused/css/utlused.css | 128 ---- rannak/algus/utlused/index.html | 80 --- rannak/algus/utlused/js/main.js | 209 ------ rannak/mangud/uliopilane/ajatelg/index.html | 13 +- 7 files changed, 7 insertions(+), 1495 deletions(-) delete mode 100644 rannak/algus/kaart/css/kaart.css delete mode 100644 rannak/algus/kaart/index.html delete mode 100644 rannak/algus/kaart/js/kaart.js delete mode 100644 rannak/algus/utlused/css/utlused.css delete mode 100644 rannak/algus/utlused/index.html delete mode 100644 rannak/algus/utlused/js/main.js (limited to 'rannak') diff --git a/rannak/algus/kaart/css/kaart.css b/rannak/algus/kaart/css/kaart.css deleted file mode 100644 index 60bb1f9..0000000 --- a/rannak/algus/kaart/css/kaart.css +++ /dev/null @@ -1,31 +0,0 @@ -svg path{ - fill: #00394f; - stroke: #eee !important; - stroke-width: .25 !important; -} - -svg path:hover { - fill: #006284; - transition: 0.6s !important; - cursor: pointer !important; - -} - -.moveOn{ - display: inline-block; - border: none; - padding: 6px 12px; - margin-botton: 0; - font-size: 1rem; - font-weight: normal; - text-align: center; - cursor: pointer; - border-radius: 4px; - background-color: #4BB543; - color: white; -} - -button:disabled{ - opacity: 0.5; -} - diff --git a/rannak/algus/kaart/index.html b/rannak/algus/kaart/index.html deleted file mode 100644 index 9160fd4..0000000 --- a/rannak/algus/kaart/index.html +++ /dev/null @@ -1,1011 +0,0 @@ - - - - - - Rännak - - - - - - - - -

Kaardimäng

Leia esimesed kümme riiki, kes tunnustasid De Facto Eesti iseseisvust -
(testiks leia Eesti, Holland ja Portugal)

- -

- - - - - - - - - - diff --git a/rannak/algus/kaart/js/kaart.js b/rannak/algus/kaart/js/kaart.js deleted file mode 100644 index 5224d79..0000000 --- a/rannak/algus/kaart/js/kaart.js +++ /dev/null @@ -1,30 +0,0 @@ -const riigid = document.querySelectorAll("svg path") - -// Praegu Eesti, Portugal, Holland -const leitavad = ["EE", "PT", "NL"] -let leitud = []; - -// Add click listener -for (let i = 0; i < riigid.length; i++){ - if (leitavad.includes(riigid[i].id)){ - riigid[i].addEventListener("click", e => { - e.target.style.fill = "#00FF00"; - if (!leitud.includes(e.target.id)) - leitud.push(riigid[i].id); - - if (leitavad.length == leitud.length) - moveOnEnable(); - }) - } - else{ - riigid[i].addEventListener("click", e => { - e.target.style.fill = "#FF0000"; - }) - } -} - -function moveOnEnable(){ - const btn = document.querySelector(".moveOn"); - btn.disabled = false; - btn.onclick = () => location.href = "../utlused"; -} diff --git a/rannak/algus/utlused/css/utlused.css b/rannak/algus/utlused/css/utlused.css deleted file mode 100644 index e7c5277..0000000 --- a/rannak/algus/utlused/css/utlused.css +++ /dev/null @@ -1,128 +0,0 @@ -/* Mäng ise */ -@import url('https://fonts.googleapis.com/css?family=Montserrat'); - -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - font-family: 'Montserrat', sans-serif; - background-color: #eee; - color: #111; - touch-action: none; -} - -.moveOn{ - display: inline-block; - border: none; - padding: 6px 12px; - margin-botton: 0; - font-size: 1rem; - font-weight: normal; - text-align: center; - cursor: pointer; - border-radius: 4px; - background-color: #4BB543; - color: white; -} - -button:disabled{ - opacity: 0.5; -} - -/* later added stuff here */ - -.wrapper { - outline: 1px solid gold; - position: relative; - display: flex; - flex-wrap: wrap; -} - -.empty { - width: 7rem; - height: 7rem; -} - -.drag { - position: absolute; - width: 7rem; - height: 7rem; - z-index: 1; -} - -.active { - background-color: grey !important; -} - -.done { - background-color: green !important; -} - -/* end of later added stuff */ - - -.draggable-elements { - display: flex; - justify-content: center; - margin: 2rem; -} -.draggable { - height: 5rem; - width: 5rem; - display: flex; - align-items: center; - justify-content: center; - font-size: 1.5rem; - margin: 0rem 1rem; - cursor: move; - transition: opacity 0.2s; -} - -.droppable { - height: 10rem; - width: 25rem; - margin: 1rem auto; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - text-align: center; - font-size: 8rem; - font-weight: bold; - background-color: #fff; - border: 3px dashed #111; - transition: border-width 0.2s, transform 0.2s, background-color 0.4s; -} -.droppable span { - font-size: 1.25rem; - pointer-events: none; /* The element is never the target of pointer events */ -} - -/* Drag and Drop Related Styling */ - -.droppable.droppable-hover { - /* background-color: #bee3f0; */ - border-width: 5px; - transform: scale(1.1); -} -.droppable.dropped { - border-style: solid; - color: #fff; -} -.droppable.dropped span { - font-weight: bolder; - margin-top: 0.5rem; -} -.droppable.dropped i { - pointer-events: none; -} -.draggable.dragged { - user-select: none; - cursor: default; -} -.draggable.dragged:hover { - opacity: 0.1; -} diff --git a/rannak/algus/utlused/index.html b/rannak/algus/utlused/index.html deleted file mode 100644 index f3e80f9..0000000 --- a/rannak/algus/utlused/index.html +++ /dev/null @@ -1,80 +0,0 @@ - - - - - - - Kuulsad Ütlused - - - - - - - - - -

- -

Heinz Valk

- -

Edgar Savisaar

- - -

Jüri Leesment

- -

Hando Runnel

- - -

Interrinde toeatjad

- -

Üks veel?

- - -

- -

- - - -

- -

"Eestlane olen ja eestlaseks jään"

"Ükskord me võidame niikuinii" (Eestimaa Laul 11.09.1988)

- -

"Toompead rünnatakse! Ma kordan - Toompead rünnatakse!"

"Maa tuleb täita lastega" (ans. Justamendi laul 1987)

- -

"Арнольд Рюйтель, выходи один!" 15.05.1990"

"Üks ütlus tuleks ehk veel siia?"

- -

- - - - - - - diff --git a/rannak/algus/utlused/js/main.js b/rannak/algus/utlused/js/main.js deleted file mode 100644 index 4262d41..0000000 --- a/rannak/algus/utlused/js/main.js +++ /dev/null @@ -1,209 +0,0 @@ -// Detecting part -const isMobile = function(){ - const match = window.matchMedia('(pointer:coarse)'); - return (match && match.matches) -} -console.log(`${isMobile() ? 'mobile' : 'not mobile'}`); - -// Global Variables for Mobile -let originalX = 0; -let originalY = 0; -let counter = 0; -let itemAppend = null; - -if (`${isMobile() ? 'mobile' : 'not mobile'}` == 'not mobile') { - - const draggableElements = document.querySelectorAll(".draggable"); - const droppableElements = document.querySelectorAll(".droppable"); - - draggableElements.forEach(elem => { - elem.addEventListener("dragstart", dragStart); // Fires as soon as the user starts dragging an item - This is where we can define the drag data - // elem.addEventListener("drag", drag); // Fires when a dragged item (element or text selection) is dragged - // elem.addEventListener("dragend", dragEnd); // Fires when a drag operation ends (such as releasing a mouse button or hitting the Esc key) - After the dragend event, the drag and drop operation is complete - }); - - droppableElements.forEach(elem => { - elem.addEventListener("dragenter", dragEnter); // Fires when a dragged item enters a valid drop target - elem.addEventListener("dragover", dragOver); // Fires when a dragged item is being dragged over a valid drop target, repeatedly while the draggable item is within the drop zone - elem.addEventListener("dragleave", dragLeave); // Fires when a dragged item leaves a valid drop target - elem.addEventListener("drop", drop); // Fires when an item is dropped on a valid drop target - }); - - // Drag and Drop Functions // - - //Events fired on the drag target - function dragStart(event) { - event.dataTransfer.setData("text", event.target.id); // or "text/plain" but just "text" would also be fine since we are not setting any other type/format for data value - } - - //Events fired on the drop target - function dragEnter(event) { - if(!event.target.classList.contains("dropped")) { - event.target.classList.add("droppable-hover"); - } - } - - function dragOver(event) { - if(!event.target.classList.contains("dropped")) { - event.preventDefault(); // Prevent default to allow drop - } - } - - function dragLeave(event) { - if(!event.target.classList.contains("dropped")) { - event.target.classList.remove("droppable-hover"); - } - } - - - function drop(event) { - - event.preventDefault(); // This is in order to prevent the browser default handling of the data - event.target.classList.remove("droppable-hover"); - const draggableElementData = event.dataTransfer.getData("text"); // Get the dragged data. This method will return any data that was set to the same type in the setData() method - const droppableElementData = event.target.getAttribute("data-draggable-id"); - const isCorrectMatching = draggableElementData === droppableElementData; - - if(isCorrectMatching) { - const draggableElement = document.getElementById(draggableElementData); - event.target.classList.add("dropped"); - // event.target.style.backgroundColor = draggableElement.style.color; // This approach works only for inline styles. A more general approach would be the following: - event.target.style.backgroundColor = window.getComputedStyle(draggableElement).color; - draggableElement.classList.add("dragged"); - draggableElement.setAttribute("draggable", "false"); - event.target.insertAdjacentHTML("afterbegin", ``); - - counter++; - console.log("counter:", counter) - if (counter == 6){ - const btn = document.querySelector(".moveOn"); - btn.disabled = false; - btn.onclick = () => location.href = "../../rolliValik"; - } - } // If isCorrectMatchingEnd - } // Drop Func End - -} // If Desktop End - - -//If mobile - -else{ - - const empty = Array.from(document.querySelectorAll('.empty')); - const drags = document.querySelectorAll('.drag'); - - drags.forEach(drag => { - drag.addEventListener('pointerdown', pointerDown); - drag.addEventListener('pointermove', pointerMove); - drag.addEventListener('pointerup', pointerUp); - }) - - - // Function when start touch - function pointerDown(e){ - e.preventDefault(); - - let remVal = parseInt(getComputedStyle(document.documentElement).fontSize); - originalTop = e.target.getBoundingClientRect().top - 2*remVal; - originalLeft = e.target.getBoundingClientRect().left - remVal; - } - - - // Function while movin - function pointerMove(e){ - e.preventDefault(); - - //Scrolling Part - if (window.innerHeight - e.screenY < 600){ - window.scrollBy({ - top: 100, // could be negative value - behavior: 'smooth' - }); - } - - else if (e.clientY < 200){ - window.scrollBy({ - top: -100, // could be negative value - behavior: 'smooth' - }); - } - - nimi = e.target; - if (!nimi.classList.contains('done')){ - - nimi.style.left = `${e.pageX - nimi.clientHeight/2}px`; - nimi.style.top = `${e.pageY - nimi.clientHeight/2}px`; - - empty.map(item => { - if ( - nimi.getBoundingClientRect().top + nimi.offsetWidth / 2 < item.getBoundingClientRect().bottom && - nimi.getBoundingClientRect().right - nimi.offsetWidth / 2 > item.getBoundingClientRect().left && - nimi.getBoundingClientRect().bottom - nimi.offsetWidth / 2 > item.getBoundingClientRect().top && - nimi.getBoundingClientRect().left + nimi.offsetWidth / 2 < item.getBoundingClientRect().right - ) { - item.classList.add('active'); - itemAppend = item; - } - else { - item.classList.remove('active'); - } - }); //empty.map loop end - } - - // if currentDrag has class done - else{ - console.log("has class done") - } - - } - - - // Function if touch is stopped - function pointerUp(e){ - e.preventDefault(); - - if (itemAppend != null){ - - if (itemAppend.classList.contains('active') && itemAppend.dataset.draggableId == this.id) { - this.classList.add('done') - this.parentElement.classList.add('done') - itemAppend.classList.add('done'); - itemAppend.classList.remove('active'); - - this.style.top = `${originalTop}px`; - this.style.left = `${originalLeft}px`; - //this.innerHTML=""; - - counter++; - console.log("counter:", counter) - if (counter == 6){ - const btn = document.querySelector(".moveOn"); - btn.disabled = false; - btn.onclick = () => location.href = "../../rolliValik"; - } - - } - else { - - this.style.top = `${originalTop}px`; - this.style.left = `${originalLeft}px`; - this.parentElement.appendChild(this); - itemAppend.classList.remove('active'); - } - } - else { - this.style.top = `${originalTop}px`; - this.style.left = `${originalLeft}px`; - console.log("FakAp"); - } // PointerUp Func End - - window.scroll({ - top: 0, - left: 0, - behavior: 'smooth' - }); - } - - -} // If mobile End diff --git a/rannak/mangud/uliopilane/ajatelg/index.html b/rannak/mangud/uliopilane/ajatelg/index.html index 5cd5881..2dd308e 100644 --- a/rannak/mangud/uliopilane/ajatelg/index.html +++ b/rannak/mangud/uliopilane/ajatelg/index.html @@ -37,16 +37,17 @@

(esmakordselt kõlas “Ei ole üksi ükski maa)”

Hirvepargi meeleavaldus

Sinine, must ja valge lipp esimest korda Pika Hermanni tornis

Tartu muinsuskaitsepäevad

Laulev revolutsioon, öölaulupeod

ENSV Keeleseadus, eesti keel riigikeeleks

Sinine, must ja valge lipp esimest korda Pika Hermanni tornis

Hirvepargi meeleavaldus

Ülemnõukogu otsus Eesti riiklikust iseseisvusest

Balti kett Tallinnast Vilniuseni

Eesti Kongress

Interrinne ründab Toompead

Augustiputš

Ülemnõukogu otsus Eesti riiklikust iseseisvusest

Interrinne ründab Toompead

Eesti Kongress

Laulev revolutsioon, öölaulupeod

+ -- cgit v1.2.3