Update index.php

ufak bir değişiklik, verileri güncelleyen samimi arkadaşım Ömer Arda (Kelo)'ya verileri yanlış girdiğinde Web konsolda gözükecek not değiştirildi :)

.gitignore

@@ -2,3 +2,5 @@ build/*
 *.tar.gz
 *.zip
 /vendor/
+config.php
+data.toml

assets/css/yurdle.css

@@ -8,6 +8,17 @@
   border: 1px solid white;
 }
 
+.latest-guess {
+  visibility: hidden;
+  opacity: 0;
+}
+
+.latest-guess.fade {
+  visibility: inherit;
+  opacity: 1;
+  transition: opacity 1s;
+}
+
 .innot {
   text-align: center;
 }
@@ -27,8 +38,6 @@
   }
 }
 
-.guess-tr {}
-
 .guess-th {
   border: aliceblue 3px solid;
 }
@@ -70,3 +79,47 @@
 .type12::after {
   content: "👆"
 }
+
+
+/*  */
+/* AUTOCOMPLETE */
+/*  */
+
+.autocomplete {
+  /*the container must be positioned relative:*/
+  position: relative;
+  display: inline-block;
+  box-sizing: border-box;
+}
+
+.autocomplete-items {
+  box-sizing: border-box;
+  position: absolute;
+  border: 2px solid #10161d;
+  border-bottom: none;
+  border-top: none;
+  z-index: 99;
+  /*position the autocomplete items to be the same width as the container:*/
+  top: 100%;
+  left: 0;
+  right: 0;
+}
+
+.autocomplete-items div {
+  padding: 10px;
+  cursor: pointer;
+  background-color: #96939B;
+  border-bottom: 1px solid #10161d;
+}
+
+.autocomplete-items div:hover {
+  /*when hovering an item:*/
+  background-color: #00ADB5;
+  color: #e8e8e8;
+}
+
+.autocomplete-active {
+  /*when navigating through the items using the arrow keys:*/
+  background-color: #00ADB5 !important;
+  color: #e8e8e8;
+}

buildzip.sh

@@ -1,5 +1,6 @@
 #!/bin/bash
 
+set -x
 rm -rf build/
 mkdir build
 composer update
@@ -12,6 +13,11 @@ rm README.md
 rm yurdle_server.tar.gz
 rm buildzip.sh
 rm dockerserver.sh
+rm config.php
+rm composer.json
+rm composer.lock
 rm -rf build/
 sleep 1
 tar czf ../yurdle_server.tar.gz ./*
+
+set +x

index.php

@@ -25,9 +25,9 @@
   min-height: 100vh;">
         <form class="centered" style="margin-top: 10vh;" action="index.php" method="post">
           <label style="margin-bottom:1vh;" for="mainInput">Yurtlu Öğrencinin İsmini Giriniz</label>
-          <div><input style="width:80%;" class="input" type="text" id="mainInput" name="mainInput" placeholder="İsim Soyisim" /><input style="width:20%;" class="input" type="submit" value="Dene" /></div>
+          <div class="autocomplete"><input style="width:80%;" class="input" type="text" id="mainInput" name="mainInput" placeholder="İsim Soyisim" /><input style="width:20%;" class="input" type="submit" value="Dene" /></div>
         </form>
-        <div id="tebriks">
+        <div id="tebriks" style="display: none;">
 
         </div>
         <div id="tahminler">
@@ -38,13 +38,19 @@
         <div id="notices">
 
         </div>
+
+        <div id="tsparticles"></div>
         <hr style="width: 100%; box-sizing: border-box;">
-        <div id="sorumli" style="margin-top:auto;text-align:center;">Veri Sorumlusu: <b>Ömer Arda Muratoğlu</b><br>Her türlü kaldırılmasını, eklenmesini ve/veya değiştirilmesi istediğiniz veriler için kendisi ile iletişime geçiniz !</div>
+        <div style="margin-top:5px;text-align:center;"> <b>Dünün Şanslı Kişisi:</b> <span id="previous-person"><i>yükleniyor</i></span></div>
+        <hr style="width: 100%; box-sizing: border-box;">
+        <div id="sorumli" style="margin-top:5px;text-align:center;">Veri Sorumlusu: <b>Ömer Arda Muratoğlu</b><br>Her türlü kaldırılmasını, eklenmesini ve/veya değiştirilmesi istediğiniz veriler için kendisi ile iletişime geçiniz !</div>
+        <hr style="width: 100%; box-sizing: border-box;">
+        <div style="margin-top:5px;text-align:center;">Fikir için <b>Cem Deniz Akdeniz</b>'e Teşekkürler !</div>
         <hr style="width: 100%; box-sizing: border-box;">
         <div style="text-align:center;">Son veri güncelleme: <span id="latest-data"></span>
         </div>
       </div>
-      <div style="text-align: center;align-self:center;"><a href="https://asandikci.com/bagis/">Bana Bi' Kahve Ismarla ☕</a></div>
+      <div style="text-align: center;align-self:center;background-color: darkblue;border-radius:10px; padding:1px;"><a style="color: orange;font-weight:800;" href="https://asandikci.com/bagis/">👉 Bana Bi' Kahve Ismarla ☕</a></div>
     </article>
 
     <footer>
@@ -54,19 +60,109 @@
 
 
 </body>
+<script>
+  function callConfetti() {
+    const duration = 10 * 1000,
+      animationEnd = Date.now() + duration,
+      defaults = {
+        startVelocity: 30,
+        spread: 360,
+        ticks: 60,
+        zIndex: 0
+      };
+
+    function randomInRange(min, max) {
+      return Math.random() * (max - min) + min;
+    }
+
+    const interval = setInterval(function() {
+      const timeLeft = animationEnd - Date.now();
+
+      if (timeLeft <= 0) {
+        return clearInterval(interval);
+      }
+
+      const particleCount = 50 * (timeLeft / duration);
+
+      // since particles fall down, start a bit higher than random
+      confetti(
+        Object.assign({}, defaults, {
+          particleCount,
+          origin: {
+            x: randomInRange(0.1, 0.3),
+            y: Math.random() - 0.2
+          },
+        })
+      );
+      confetti(
+        Object.assign({}, defaults, {
+          particleCount,
+          origin: {
+            x: randomInRange(0.7, 0.9),
+            y: Math.random() - 0.2
+          },
+        })
+      );
+    }, 250);
+  }
+</script>
+<script>
+  function updateData() {
+    xmlHttp = new XMLHttpRequest();
+    xmlHttp.onreadystatechange = function() {
+      if (this.readyState == 4 && this.status == 200) {
+        var response = xmlHttp.responseText
+        if (response.includes("parseError")) {
+          console.error("VERİLER YANLIŞ ŞEKİLDE GİRİLMİŞ, LÜTFEN ifl/YurdleBackend PROJESİNDEKİ VERİ DOSYASINI KONTROL EDİNİZ");
+          console.warn(response);
+        } else if (response.includes("fileError")) {
+          console.error("VERİ DOSYASI SUNUCUDA BULUNAMADI, SUNUCUYU KONTROL EDİNİZ");
+          console.warn(response);
+        } else if (response.includes("success")) {
+          console.info("VERİLER BAŞARIYLA GÜNCELLENDİ")
+        } else {
+          console.warn("VERİ GÜNCELLENİRKEN BİR HATA OLUŞTU, SAYFAYI YENİLEMEYİ DENEYİN");
+        }
+      }
+    };
+    params = "updateData=yes";
+    xmlHttp.open("POST", "src/server.php", true);
+    xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
+    xmlHttp.send(params);
+    flag = true;
+    return;
+  }
+
+  function getPreviousData() {
+    xmlHttp = new XMLHttpRequest();
+    xmlHttp.onreadystatechange = function() {
+      if (this.readyState == 4 && this.status == 200) {
+        var response = xmlHttp.responseText;
+        document.getElementById("previous-person").innerHTML = "<b style='color:red';>" + response + "</b>";
+        console.debug("Dünün Şanslı Kişisi: " + response);
+      }
+    };
+    params = "getPreviousPerson=yes";
+    xmlHttp.open("POST", "src/server.php", true);
+    xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
+    xmlHttp.send(params);
+    flag = true;
+  }
+</script>
 <script>
   function isSameDay(a, b) {
     return a.toDateString() == b.toDateString();
   }
-
+  getPreviousData();
   if (localStorage.getItem("win") == null) {
     localStorage.setItem("win", "none");
   }
+  flagConf = 1;
   document.getElementById("tebriks").style.display = "none";
   if (localStorage.getItem("win") != null && localStorage.getItem("win") === "winned") {
-    console.log(localStorage.getItem("win"));
     document.getElementById("tebriks").style.display = "block";
     document.getElementById("tebriks").innerHTML = "Tebrikler, günün şanslı kişisini buldun!"
+    flagConf = 0;
   }
 
   // LOCAL STORAGE AND GUESS HANDLING
@@ -76,14 +172,18 @@
   } else {
     latest_visit = localStorage.getItem("latest_visit");
     if (isSameDay(new Date(latest_visit), date)) {
-      console.log("same day!");
+      console.debug("Kullanıcı Son Girişi İle Aynı Günde");
     } else {
-      console.log("different day!");
+      console.debug("Kullanıcı Farklı Bir Günde Giriş Yaptı, Statlar Sıfırlanıyor");
       localStorage.removeItem("guesses");
+      localStorage.removeItem("latest_guess");
+      localStorage.removeItem("win");
+      document.getElementById("tebriks").style.display = "none";
     }
     localStorage.setItem("latest_visit", date);
   }
-  <?php include './src/server.php'; ?>
+  <?php include __DIR__ . '/src/server.php'; ?>
+
   current_guess = "<?php
                     if ($_POST['mainInput'] != null) {
                       echo htmlspecialchars($_POST['mainInput']);
@@ -92,7 +192,7 @@
   flagSame = 0;
   if (localStorage.getItem("latest_guess") != null) {
     if (current_guess == localStorage.getItem("latest_guess")) {
-      console.warn("EN SON TAHMININIZ ILE ŞIMDIKI AYNI !!!")
+      console.warn("EN SON TAHMININIZ ILE ŞIMDIKI AYNI !!! (veya sayfayı yenilemiş/geri gelmiş de olabilirsiniz)")
       flagSame = 1;
     }
     localStorage.setItem("latest_guess", current_guess);
@@ -108,16 +208,17 @@
 
   var gj = JSON.parse('{"Guesses":[], "Values":[]}'); // guess json
   if (localStorage.getItem("guesses") != null) {
-    console.log("local storage get!");
+    console.debug("Local Storage Succesfully Get!");
     gj = JSON.parse(localStorage.getItem("guesses"));
   }
   if (current_guess != "" && flagSame == 0) {
     gj["Guesses"].push(current_guess);
-    console.warn(current_guess);
+    console.debug("Denenen Kişi: " + current_guess);
     gj["Values"].push(<?php if ($_POST['mainInput'] != null) {
                         $inner_cg = htmlspecialchars($_POST['mainInput']);
+                        echo "'" . json_encode(comparePerson(reversePerson($inner_cg)), JSON_UNESCAPED_UNICODE) . "'";
                       }
-                      echo "'" . json_encode(comparePerson(reversePerson($inner_cg)), JSON_UNESCAPED_UNICODE) . "'"; ?>);
+                      ?>);
     localStorage.setItem("guesses", JSON.stringify(gj));
   }
 
@@ -143,6 +244,8 @@
       tr.appendChild(th);
     }
 
+    // REVIEW Daha optimize ve karışık olmayacak şekilde yazılabilir
+
     for (let i = gj["Guesses"].length - 1; i >= 0; i--) {
       // revit = gj["Guesses"].length - i - 1;
       const tr = document.createElement("tr");
@@ -150,12 +253,17 @@
       table.appendChild(tr);
 
       indata = JSON.parse(gj["Values"][i]);
-      console.warn(indata);
+      // console.warn(indata);
       for (const key in criterias) {
         if (innerFlag) crit_num++;
         const td = document.createElement("td");
         const td_text = document.createTextNode(indata[key][1]);
+
+        // FIXME isim_soyisim renkli olmasın diye kontrol yapılıyor ama bu durumda isim soyisim haricinde diğer tüm özellikleri aynı olan başka biri daha olursa onu da doğru sayar !!!
         if (key != "isim_soyisim") {
+          if (i == gj["Guesses"].length - 1 && flagSame == 0) {
+            td.classList.add("latest-guess");
+          }
           switch (indata[key][0]) {
             case 0:
               td.classList.add("type0");
@@ -183,13 +291,34 @@
     }
   }
 
-  console.log(gj);
+  var lat = document.getElementsByClassName("latest-guess");
-  if (crit_num == (true_num + 1)) // +1 isim_soyisim sayılmadığı için
+  var le = lat.length;
-  {
+
-    console.warn(crit_num, true_num);
+  function delay(time) {
+    return new Promise(resolve => setTimeout(resolve, time));
+  }
+  async function delayeffect() {
+    for (let i = 0; i < lat.length; i++) {
+      const element = lat[i];
+      await delay(750);
+      element.classList.toggle('fade');
+    }
+  }
+  delayeffect();
+
+  async function yepwin() {
+    await delay(5000);
     document.getElementById("tebriks").style.display = "block";
     document.getElementById("tebriks").innerHTML = "Tebrikler, günün şanslı kişisini buldun!"
     localStorage.setItem("win", "winned");
+    if (flagConf) {
+      callConfetti();
+    }
+  }
+  // console.log(gj);
+  if (crit_num == (true_num + 1)) // +1 isim_soyisim sayılmadığı için
+  {
+    yepwin();
   }
 
 
@@ -207,8 +336,8 @@
     } else {
       innot = document.createElement("p");
       innot.classList.add("innot");
-      innot_text = document.createTextNode(element);
+      innot_text = element;
-      innot.appendChild(innot_text);
+      innot.innerHTML = innot_text;
       notic.appendChild(innot);
     }
   });
@@ -217,7 +346,7 @@
   // UPDATES
   const updates = <?php echo json_encode(sendDataDate()) ?>;
   document.getElementById("latest-data").innerHTML = updates[0];
-  console.log("günün kişisi güncellenme zamanı: " + updates[1]);
+  console.info("Günün Kişisi, Son Güncelleme Zamanı: " + updates[1]);
 
 
   /// AUTOCOMPLETE ///
@@ -329,8 +458,25 @@
   }
 
   const persons2 = <?php echo json_encode(getAllPersonNames(), JSON_UNESCAPED_UNICODE) ?>;
-
+  persons2.sort();
   autocomplete(document.getElementById("mainInput"), persons2);
 </script>
+<script>
+  var t = setInterval(tick, 1000);
+
+  function tick() {
+    var curTime = new Date();
+    if (curTime.getHours() == 0 && curTime.getMinutes() == 0 && curTime.getSeconds() > 1 && curTime.getSeconds() < 3) {
+      console.debug("Kullanıcının Ekranı Açıkken Farklı Bir Güne Geçiş Yapıldı, Statlar Sıfırlanıyor ve Kullanıcı Bilgilendiriliyor");
+      localStorage.removeItem("guesses");
+      localStorage.removeItem("latest_guess");
+      localStorage.removeItem("win");
+      document.getElementById("tebriks").style.display = "none";
+      document.getElementById("tahminler").innerHTML = "<h2 style='text-align:center;'>Gece Yarısını Geçtiniz, Lütfen Sayfayı Yenile<span style='color:red;'>ME</span>den direkt yeni tahminizde bulununuz👆</h2><p style='text-align:center;'>Kullanıcının cihazının saati baz alınmıştır, sunucunun yenilenmesi için birkaç saniye daha beklemeniz gerekebilir</p>"
+    }
+  }
+</script>
+<script src="https://cdn.jsdelivr.net/npm/@tsparticles/confetti@3.0.3/tsparticles.confetti.bundle.min.js"></script>
+
 
 </html>

src/previous.php

@@ -0,0 +1 @@
+<?php $PREVIOUS_PERSON = "aliberk_sandikci24";

src/server.php

@@ -2,58 +2,111 @@
 
 use Yosymfony\Toml\Toml;
 
-include 'todays.php';
+include __DIR__ . '/todays.php';
+include __DIR__ . '/previous.php';
+include __DIR__ . '/../config.php';
 require __DIR__ . '/../vendor/autoload.php';
 
 $parser = new Toml();
+$dock_local_test = 1;
 
-# Fetch remote data each 1 hour
+# Fetch Remote data and update data.toml (running each 10 min with cronjob)
-function updateRemoteData()
+function testData($toml)
 {
-  # PREREQUIRITIES Create a cronjob or a systemd service for update it regularly !
+  global $parser;
-
+  try {
-  # GET FROM GIT WITH ACCESS TOKEN AND SAVE TO data.toml
+    $array = $parser::Parse($toml);
-
+  } catch (Exception $e) {
-  # MAKE SURE FILE IS CHMOD 600 AND NOT ACCESSIBLE FROM USERSIDE !!!
+    $ans = 'Caught exception: ' .  $e->getMessage() . "\n";
-
+    return $ans;
-
+  }
-  parseTOML(); # parse again after update
+  return 0;
 }
 
+function updateRemoteData()
+{
+  global $DATAACCESS_TOKEN;
+  global $APP_NAME;
+  $string = file_get_contents("https://git.aliberksandikci.com.tr/api/v1/repos/ifl/YurdleBackend/raw/data.toml?access_token=" . $DATAACCESS_TOKEN);
+  if ($string === FALSE) {
+    echo "fileError: Could not read the file or could not get the file from server";
+    return;
+  } else if (testData($string) != 0) {
+    echo "parseError: " . testData($string);
+    return;
+  } else {
+    $file = __DIR__ . "/../data.toml";
+    file_put_contents($file, $string, LOCK_EX);
+  }
+  chmod("$file", 0700);
+  chown("$file", $APP_NAME);
 
-# Choose the todays person, everyday TSI 03:00
+  parseTOML(); // not necessary
+  echo "success";
+}
+
+# get random person
+function randomizerr($array)
+{
+  srand();
+  $random_number =  random_int(0, count($array) - 1);
+  $choosen = $array[$random_number];
+  return $choosen;
+}
+
+# Choose the todays person (running each day with cronjob)
 function chooseTodayPerson()
 {
-  # PREREQUIRIITES with cronjob or systemd, run this function everyday TSI 03.00
+  global $APP_NAME;
+  global $TODAYS_PERSON;
+  $data = parseTOML()["data"];
 
-  # parse toml
+  backupPreviousPerson($TODAYS_PERSON);
 
-  # get users array length
+  $personArr = array();
+  foreach ($data as $key => $value) {
+    array_push($personArr, $key);
+  }
 
-  # get a random number
 
-  # make this person todays person, change $TODAYS_PERSON variable in today.php
+
+  $choosen = randomizerr($personArr);
+  echo $choosen . "  -  " . $TODAYS_PERSON;
+  while ($choosen == $TODAYS_PERSON) {
+    echo "!!!";
+    $choosen = randomizerr($personArr);
+    echo $choosen . "  -  " . $TODAYS_PERSON;
+  }
+
+  $string = "<?php \$TODAYS_PERSON = \"$choosen\";";
+  $file = __DIR__ . "/todays.php";
+  file_put_contents($file, $string, LOCK_EX);
+  chmod("$file", 0700);
+  chown("$file", $APP_NAME);
+}
+
+# Backup previous person to previous.php file
+function backupPreviousPerson($previous)
+{
+  global $APP_NAME;
+
+  $string = "<?php \$PREVIOUS_PERSON = \"$previous\";";
+  $file = __DIR__ . "/previous.php";
+  file_put_contents($file, $string, LOCK_EX);
+  chmod("$file", 0700);
+  chown("$file", $APP_NAME);
+}
+
+# get Previous Person Name (isi_soyisim)
+function getPreviousPersonName()
+{
+  global $PREVIOUS_PERSON;
+  return parseTOML()["data"][$PREVIOUS_PERSON]["isim_soyisim"];
 }
 
 # Send all person names to frontend
 function getAllPersonNames()
 {
-  # Parse Toml
-  # get `users` array
-  # get isim_soyisim of each user in `users` array and add to newArr
-  # NewArr
-  # send these as arry to frontend 
-  # aliberk_sandikci24 -> "Aliberk Sandıkçı
-
-  // APPROACH 1: (needs public-> users array)
-  // $users = parseTOML()["public"]["users"];
-  // $arr = array();
-  // foreach ($users as $user) {
-  //   array_push($arr,  parseTOML()["data"][$user]["isim_soyisim"]);
-  // }
-  // return $arr;
-
-  //  APPROACH 2:
   $data = parseTOML()["data"];
   $arr = array();
   foreach ($data as $d) {
@@ -91,7 +144,6 @@ function sendDataDate()
     $arr[1] = date("d/m/Y H:i:s", filemtime(__DIR__ . "/" . $filename));
   }
 
-
   return $arr;
 }
 
@@ -167,7 +219,7 @@ function compareARR($guess, $todays, $krit)
 
   if ($equalNum == 0) {
     return 0;
-  } else if ($equalNum == count($todays)) {
+  } else if ($equalNum == count($todays) && $equalNum == count($guess)) {
     return 2;
   } else if ($equalNum >= 1) {
     return 1;
@@ -186,8 +238,15 @@ function getAPersonStats($person)
 function parseTOML()
 {
   global $parser;
-  $array = $parser::ParseFile("data.toml");
+  $array = $parser::ParseFile(__DIR__ . "/../data.toml");
   return $array;
 }
 
-comparePerson('aliberk_sandikci24');
+
+if ($_POST['updateData'] != null && $_POST['updateData'] == "yes") {
+  updateRemoteData();
+}
+
+if ($_POST['getPreviousPerson'] != null && $_POST['getPreviousPerson'] == "yes") {
+  echo getPreviousPersonName();
+}

src/todays.php

@@ -1,2 +1 @@
-<?php
+<?php $TODAYS_PERSON = "aliberk_sandikci24";
-$TODAYS_PERSON = "burak_sina_akbudak24";