summaryrefslogtreecommitdiff
path: root/rannak/mangud/partorg
diff options
context:
space:
mode:
Diffstat (limited to 'rannak/mangud/partorg')
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/index.html139
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/avatar.pngbin0 -> 657556 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/kogan.jpgbin0 -> 1615437 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/laar.jpgbin0 -> 115333 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/lauristin.jpgbin0 -> 123371 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/ruutel.jpgbin0 -> 91185 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/savisaar.jpgbin0 -> 87392 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/pildid/valk.jpgbin0 -> 331930 bytes
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/script.js133
-rw-r--r--rannak/mangud/partorg/kuulsused.bak/styles.css101
-rw-r--r--rannak/mangud/partorg/kuulsused/index.html165
-rw-r--r--rannak/mangud/partorg/kuulsused/script.js70
-rw-r--r--rannak/mangud/partorg/kuulsused/styles.css59
13 files changed, 582 insertions, 85 deletions
diff --git a/rannak/mangud/partorg/kuulsused.bak/index.html b/rannak/mangud/partorg/kuulsused.bak/index.html
new file mode 100644
index 0000000..52a5245
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/index.html
@@ -0,0 +1,139 @@
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=, initial-scale=1.0">
+ <title>Kuulsused</title>
+ <link rel="stylesheet" href="styles.css">
+ <!-- Bootstrap - CSS only -->
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
+</head>
+
+<body class="bg-dark text-white">
+
+ <div class="container text-center text-white align-items-center pb-5">
+ <h1 class="pb-1 pt-2">Olulised isikud</h1>
+ <p>Vii kokku inimese nimi ja nägu.</p>
+
+ <div class="row">
+ <div>
+ <button class="moveOn" disabled>Liigu Edasi</button>
+ </div>
+
+ </div>
+
+ <!-- Button trigger modal -->
+ <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+ Sissejuhatus
+ </button>
+
+
+ </div>
+
+
+ <!-- Modal -->
+ <div class="modal fade text-black" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+
+ <div class="modal-header">
+ <div class="modalHeaderWrapper">
+ <h3 class="modal-title" id="myModalLabel">Sissejuhatus</h5>
+ </div>
+ <img class="avatar" alt="avatar" src="pildid/avatar.png"/>
+ </div>
+
+ <div class="modal-body">
+ Seltsimehed noored, olen meie ajakirjandusest, mis kahjuks ei ole enam maailma eesrindlikum,
+ välja lõiganud mitmete tänapäeva ENSV elus üht või teistpidi silma paistnud inimeste pildid.
+ <br/>
+ Mõned neist inimestest mulle ei meeldi, natsionalistid! Kas ka teie tunnete neid inimesi?
+ <br/>
+ Teeme proovi, <strong>ühendage nimi ja talle sobiv foto.</strong>
+ <br/> <br/>
+ Huvitav kas neid inimesi mäletatakse ka aastate pärast?
+ </div>
+
+ </div>
+ </div>
+ </div>
+
+
+ <!-- Esimene rida -->
+ <div class="lists">
+ <div class="row">
+
+ <div class="col imgBox text-center">
+ <img src="pildid/laar.jpg" alt="Mart Laar img">
+ <p>
+ 1990-1992 Eesti Vabariigi Ülemnõukogu liige. Eesti muinsuskaitse seltsi, Eesti komitee, Eesti kongressi liige.
+ </p>
+ <div id="laar" class="list"></div>
+ </div>
+
+ <div class="list col startBasket text-center">
+ <div id="laar" class="list-item" draggable="true">Mart Laar</div>
+ <div id="lauristin" class="list-item" draggable="true">Marju Lauristin</div>
+ <div id="ruutel" class="list-item" draggable="true">Arnold Rüütel</div>
+ <div id="savisaar" class="list-item" draggable="true">Edgar Savisaar</div>
+ <div id="kogan" class="list-item" draggable="true">Jevgeni Kogan</div>
+ <div id="valk" class="list-item" draggable="true">Heinz Valk</div>
+ </div>
+
+ <div class="col imgBox text-center">
+ <img src="pildid/lauristin.jpg" alt="Marju Lauristin img">
+ <p>
+ 1990-1992 EV Ülemnõukogu liige, juhataja asetäitja, 1990 Eesti Komitee liige
+ </p>
+ <div id="lauristin" class="list"></div>
+ </div>
+
+ </div>
+ </div>
+
+ <!-- Teine rida -->
+
+ <div class="lists">
+ <div class="row">
+
+ <div class="col-3 imgBox text-center">
+ <img src="pildid/ruutel.jpg" alt="Arnold Rüütel img">
+ <p>
+ 1990-1992 ENSV/ EV Ülemnõukogu esimees.
+ </p>
+ <div id="ruutel" class="list"></div>
+ </div>
+
+ <div class="col-3 imgBox text-center">
+ <img src="pildid/savisaar.jpg" alt="Savisaar img">
+ <p>
+ Üks Rahvarinde loojatest, 1990 Eesti NSV Valitsuse esimees, 20.08.1991 Eesti Vabariigi peaministri kohusetäitja.
+ </p>
+ <div id="savisaar" class="list"></div>
+ </div>
+
+ <div class="col-3 imgBox text-center">
+ <img src="pildid/valk.jpg" alt="Heniz img">
+ <p>
+ Kunstnik, Rahvarinde üks asutajaliikmeid, suurepärane kõnepidaja, andis meie revolutsioonile nime.
+ </p>
+ <div id="valk" class="list"></div>
+ </div>
+
+ <div class="col imgBox text-center">
+ <img src="pildid/kogan.jpg" alt="Kogan img">
+ <p>
+ Interrinde üks loojatest (1988) ning hiljem selle esimees. NSVL Rahvasaadikute kongressi liige, osales impeeriumimeelse saadikuterühma “Sojuz” tegevuses.
+ </p>
+ <div id="kogan" class="list"></div>
+ </div>
+
+ </div>
+ </div>
+
+ <script src="script.js"></script>
+
+ <!-- JavaScript Bundle with Popper -->
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
+</body>
+</html>
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/avatar.png b/rannak/mangud/partorg/kuulsused.bak/pildid/avatar.png
new file mode 100644
index 0000000..485a70c
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/avatar.png
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/kogan.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/kogan.jpg
new file mode 100644
index 0000000..9c592f3
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/kogan.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/laar.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/laar.jpg
new file mode 100644
index 0000000..a7cea18
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/laar.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/lauristin.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/lauristin.jpg
new file mode 100644
index 0000000..67c788d
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/lauristin.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/ruutel.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/ruutel.jpg
new file mode 100644
index 0000000..389287d
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/ruutel.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/savisaar.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/savisaar.jpg
new file mode 100644
index 0000000..57815c8
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/savisaar.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/pildid/valk.jpg b/rannak/mangud/partorg/kuulsused.bak/pildid/valk.jpg
new file mode 100644
index 0000000..c7afa8c
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/pildid/valk.jpg
Binary files differ
diff --git a/rannak/mangud/partorg/kuulsused.bak/script.js b/rannak/mangud/partorg/kuulsused.bak/script.js
new file mode 100644
index 0000000..aa054dd
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/script.js
@@ -0,0 +1,133 @@
+document.addEventListener('DOMContentLoaded', () => {
+ let btn = document.querySelector('.modalButton');
+ btn.click();
+});
+
+
+
+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];
+
+ /* Event Listeners */
+ 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();
+ });
+
+
+}
+
+
+
+
+// Dropping spots
+
+for (let j=0; j < lists.length; j++){
+ const list = lists[j];
+
+ /* Event Listeners */
+
+ list.addEventListener("dragenter",e => (e.preventDefault()));
+
+ list.addEventListener("dragover",e => {
+ e.preventDefault();
+ list.style.backgroundColor = "rgba(0,0,0,0.9)";
+ list.style.transform = "scale(1.3)";
+ });
+
+
+ list.addEventListener("dragleave",e => {
+ list.style.backgroundColor = "rgba(0,0,0,0.3)";
+ list.style.transform = "scale(1)";
+ });
+
+
+ list.addEventListener("drop",e => {
+ if (list.children.length == 0 || list.className.includes("startBasket"))
+ list.append(draggedItem);
+ list.style.backgroundColor = "rgba(0,0,0,0.3)";
+ list.style.transform = "scale(1)";
+
+ })
+}
+
+
+
+// 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 = [];
+
+ for (let j=0; j < lists.length; j++){
+ const list = lists[j];
+ if (list.className.includes("startBasket"))
+ continue;
+ else if (list.children.length == 1){
+ if (list.id == list.children[0].id){
+ if (!rightDone.includes(list.id))
+ rightDone.push(list.id);
+ }
+ }
+ } // For loop end
+
+ if (rightDone.length == 6) {
+ const btn = document.querySelector(".moveOn");
+ btn.disabled = false;
+ btn.onclick = () => location.href = "../plakat";
+ }
+}
+
+
+
+/* The Scrolling on thing while dragging */
+// window.scrollTo(0, 500);
diff --git a/rannak/mangud/partorg/kuulsused.bak/styles.css b/rannak/mangud/partorg/kuulsused.bak/styles.css
new file mode 100644
index 0000000..f4fb4c8
--- /dev/null
+++ b/rannak/mangud/partorg/kuulsused.bak/styles.css
@@ -0,0 +1,101 @@
+* {
+ box-sizing: border-box !important;
+}
+
+.lists{
+ margin-bottom: 20px !important;
+}
+/* Modal Stuff */
+
+
+.avatar {
+ border-radius: 20px;
+ width: 100% !important;
+}
+
+.modalHeaderWrapper{
+ text-align: center;
+ margin: 0 !important;
+ width: 100% !important;
+}
+
+.closeModalButton {
+ border-radius: 50px;
+}
+
+.modalButton{
+ position: absolute;
+ top: 0;
+ right: 0;
+ padding: 6px;
+ padding: 9px 25px;
+ background-color: rgba(0,136,169,1) !important;
+ border: none !important;
+ border-radius: 50px !important;
+ cursor: pointer !important;
+ transition: all 0.3 ease 0 !important;
+ margin: 3% !important;
+ font-size: 1.2rem !important;
+}
+
+.modalButton:hover{
+ background-color: rgba(0,136,169,0.8) !important;
+}
+
+
+/* Move On */
+
+.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;
+ cursor: not-allowed;
+}
+
+
+/* Other */
+
+
+.row {
+ margin: 0 5% !important;
+}
+
+img {
+ max-width: 15rem !important;
+ height: auto !important;
+ padding: .3rem;
+}
+
+
+.lists .list .list-item {
+ background-color: #b2beb5 !important;
+ color: #21201E;
+ margin: 0.5rem 0;
+ height: 2.5rem;
+ border-radius: 8px !important;
+ cursor: pointer;
+}
+
+.lists .list {
+ background-color: rgba(0, 0, 0, 0.3);
+ min-height: 2.5rem;
+ margin: .5rem;
+ border-radius: 8px !important;
+}
+
+.startBasket {
+ height: 100% !important;
+ min-height: 2rem;
+}
diff --git a/rannak/mangud/partorg/kuulsused/index.html b/rannak/mangud/partorg/kuulsused/index.html
index 4dfe755..b0503a2 100644
--- a/rannak/mangud/partorg/kuulsused/index.html
+++ b/rannak/mangud/partorg/kuulsused/index.html
@@ -2,8 +2,8 @@
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=, initial-scale=1.0">
- <title>Kuusused</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Kuulsused</title>
<link rel="stylesheet" href="styles.css">
<!-- Bootstrap - CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
@@ -12,7 +12,7 @@
<body class="bg-dark text-white">
<div class="container text-center text-white align-items-center pb-5">
- <h1 class="pb-1 pt-2">Kuulsused</h1>
+ <h1 class="pb-1 pt-2">Olulised isikud</h1>
<p>Vii kokku inimese nimi ja nägu.</p>
<div class="row">
@@ -59,78 +59,115 @@
</div>
- <!-- Esimene rida -->
- <div class="lists">
- <div class="row">
- <div class="col imgBox text-center">
- <img src="pildid/laar.jpg" alt="Mart Laar img">
- <p>
- "1990-1992 Eesti Vabariigi Ülemnõukogu liige. Eesti muinsuskaitse seltsi, Eesti komitee, Eesti kongressi liige."
- </p>
- <div id="laar" class="list"></div>
- </div>
+<div class="mainer">
- <div class="list col startBasket text-center">
- <div id="laar" class="list-item" draggable="true">Mart Laar</div>
- <div id="lauristin" class="list-item" draggable="true">Marju Lauristin</div>
- <div id="ruutel" class="list-item" draggable="true">Arnold Rüütel</div>
- <div id="savisaar" class="list-item" draggable="true">Edgar Savisaar</div>
- <div id="kogan" class="list-item" draggable="true">Jevgeni Kogan</div>
- <div id="valk" class="list-item" draggable="true">Heinz Valk</div>
- </div>
- <div class="col imgBox text-center">
- <img src="pildid/lauristin.jpg" alt="Marju Lauristin img">
- <p>
- "1990-1992 EV Ülemnõukogu liige, juhataja asetäitja, 1990 Eesti Komitee liige"
- </p>
+ <div class="list col startBasket text-center">
+ <div id="laar" class="list-item" draggable="true">Mart Laar</div>
+ <div id="lauristin" class="list-item" draggable="true">Marju Lauristin</div>
+ <div id="ruutel" class="list-item" draggable="true">Arnold Rüütel</div>
+ <div id="savisaar" class="list-item" draggable="true">Edgar Savisaar</div>
+ <div id="kogan" class="list-item" draggable="true">Jevgeni Kogan</div>
+ <div id="valk" class="list-item" draggable="true">Heinz Valk</div>
+ </div>
+
+ <!-- Carousell -->
+
+ <div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
+
+ <div class="carousel-indicators">
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="3" aria-label="Slide 4"></button>
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="4" aria-label="Slide 5"></button>
+ <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="5" aria-label="Slide 6"></button>
+ </div>
+
+ <div class="carousel-inner">
+
+ <div class="carousel-item active">
+ <img src="pildid/laar.jpg" class="d-block" alt="Mart Laar img">
+ <div class="text">
+ <p>
+ 1990-1992 Eesti Vabariigi Ülemnõukogu liige. Eesti muinsuskaitse seltsi, Eesti komitee, Eesti kongressi liige.
+ </p>
+ </div>
+ <div id="laar" class="list"></div>
+ </div>
+
+ <div class="carousel-item">
+ <img src="pildid/lauristin.jpg" class="d-block" alt="Marju Lauristin img">
+ <div class="text">
+ <p>
+ 1990-1992 EV Ülemnõukogu liige, juhataja asetäitja, 1990 Eesti Komitee liige
+ </p>
+ </div>
<div id="lauristin" class="list"></div>
- </div>
+ </div>
- </div>
- </div>
- <!-- Teine rida -->
+ <div class="carousel-item">
+ <img src="pildid/ruutel.jpg" class="d-block" alt="Arnold Rüütel img">
+ <div class="text">
+ <p>
+ 1990-1992 ENSV/ EV Ülemnõukogu esimees.
+ </p>
+ </div>
+ <div id="ruutel" class="list"></div>
+ </div>
- <div class="lists">
- <div class="row">
- <div class="col-3 imgBox text-center">
- <img src="pildid/ruutel.jpg" alt="Arnold Rüütel img">
- <p>
- "1990-1992 ENSV/ EV Ülemnõukogu esimees."
- </p>
- <div id="ruutel" class="list"></div>
- </div>
+ <div class="carousel-item">
+ <img src="pildid/savisaar.jpg" class="d-block" alt="Savisaar img">
+ <div class="text">
+ <p>
+ Üks Rahvarinde loojatest, 1990 Eesti NSV Valitsuse esimees, 20.08.1991 Eesti Vabariigi peaministri kohusetäitja.
+ </p>
+ </div>
+ <div id="savisaar" class="list"></div>
+ </div>
+
+
+ <div class="carousel-item">
+ <img src="pildid/valk.jpg" class="d-block" alt="Heniz img">
+ <div class="text">
+ <p>
+ Kunstnik, Rahvarinde üks asutajaliikmeid, suurepärane kõnepidaja, andis meie revolutsioonile nime.
+ </p>
+ </div>
+ <div id="valk" class="list"></div>
+ </div>
- <div class="col-3 imgBox text-center">
- <img src="pildid/savisaar.jpg" alt="Savisaar img">
- <p>
- "üks Rahvarinde loojatest, 1990 Eesti NSV Valitsuse esimees, 20.08.1991 Eesti Vabariigi peaministri kohusetäitja"
- </p>
- <div id="savisaar" class="list"></div>
- </div>
- <div class="col-3 imgBox text-center">
- <img src="pildid/valk.jpg" alt="Heniz img">
- <p>
- "kunstnik, Rahvarinde üks asutajaliikmeid, suurepärane kõnepidaja, andis meie revolutsioonile nime."
- </p>
- <div id="valk" class="list"></div>
- </div>
+ <div class="carousel-item">
+ <img src="pildid/kogan.jpg" class="d-block" alt="Kogan img">
+ <div class="text">
+ <p>
+ Interrinde üks loojatest (1988) ning hiljem selle esimees. NSVL Rahvasaadikute kongressi liige, osales impeeriumimeelse saadikuterühma “Sojuz” tegevuses.
+ </p>
+ </div>
+ <div id="kogan" class="list"></div>
+ </div>
+
+ </div>
+
+
+ <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
+ <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+ <span class="visually-hidden">Previous</span>
+ </button>
+
+ <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
+ <span class="carousel-control-next-icon" aria-hidden="true"></span>
+ <span class="visually-hidden">Next</span>
+ </button>
+
+ </div>
+
+</div>
- <div class="col imgBox text-center">
- <img src="pildid/kogan.jpg" alt="Kogan img">
- <p>
- "Interrinde üks loojatest (1988) ning hiljem selle esimees. NSVL Rahvasaadikute kongressi liige, osales impeeriumimeelse saadikuterühma “Sojuz” tegevuses."
- </p>
- <div id="kogan" class="list"></div>
- </div>
-
- </div>
- </div>
-
<script src="script.js"></script>
<!-- JavaScript Bundle with Popper -->
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);
diff --git a/rannak/mangud/partorg/kuulsused/styles.css b/rannak/mangud/partorg/kuulsused/styles.css
index f4fb4c8..108bde9 100644
--- a/rannak/mangud/partorg/kuulsused/styles.css
+++ b/rannak/mangud/partorg/kuulsused/styles.css
@@ -65,21 +65,51 @@ button:disabled{
}
-/* Other */
+/* Mainer */
+.mainer {
+ display: flex;
+ align-items: center;
+ border: 3px solid white;
+ border-radius: 10px;
+ margin: .7rem;
+ min-height: 80%;
+}
+
+.mainer .startBasket {
+ width: 40%;
+ padding: 1rem;
+}
+
+
+
+/* Carousel */
+.carousel {
+ border-left: 5px solid white;
+ padding: 1rem !important;
+ margin: auto !important;
+ width: 60% !important;
+ height: auto !important;
-.row {
- margin: 0 5% !important;
}
-img {
- max-width: 15rem !important;
+.carousel-item{text-align: center !important;}
+.carousel-item .text{padding-top: 10px !important;}
+
+.carousel-item img{
+ margin: auto !important;
+ max-width: 35% !important;
height: auto !important;
- padding: .3rem;
}
-
-.lists .list .list-item {
+.carousel-item .list {
+ background-color: rgba(0, 0, 0, 0.3);
+ min-height: 3.7rem;
+ margin: .5rem;
+ border-radius: 8px !important;
+}
+
+.list-item {
background-color: #b2beb5 !important;
color: #21201E;
margin: 0.5rem 0;
@@ -88,11 +118,14 @@ img {
cursor: pointer;
}
-.lists .list {
- background-color: rgba(0, 0, 0, 0.3);
- min-height: 2.5rem;
- margin: .5rem;
- border-radius: 8px !important;
+
+
+/* Other */
+
+.modal-header img {
+ max-width: 15rem !important;
+ height: auto !important;
+ padding: .3rem;
}
.startBasket {
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-23 03:35:01 +0000