From a0b302d3a6799c57eb824e8537f9aaa83455cd7b Mon Sep 17 00:00:00 2001
From: UnacceptableBehaviour <fernandez.simon@gmail.com>
Date: Thu, 13 Feb 2025 16:12:02 +0000
Subject: [PATCH] Upload Download POC

---
 docs/index.html          |  4 ++--
 docs/static/paycheck.css |  7 ++-----
 docs/static/paycheck.js  | 38 ++++++++++++++++++++++++++++++++++++++
 3 files changed, 42 insertions(+), 7 deletions(-)

diff --git a/docs/index.html b/docs/index.html
index 66bd5e4..8ca24e1 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -443,8 +443,8 @@
             </div>
             <span class="flexrow-middle-space space-box"></span>
             <div class="cloud-butn">
-              <img id="export-button-down" src="static/assets/icons/butn-DWN.svg" alt="Export">              
-              <img id="export-button-up" src="static/assets/icons/butn-UP.svg" alt="Export">
+              <img id="export_button_get" src="static/assets/icons/butn-DWN.svg" alt="Export">              
+              <img id="export_button_save" src="static/assets/icons/butn-UP.svg" alt="Export">
             </div>
           </div>
     
diff --git a/docs/static/paycheck.css b/docs/static/paycheck.css
index 01d8019..2ebce87 100644
--- a/docs/static/paycheck.css
+++ b/docs/static/paycheck.css
@@ -113,9 +113,6 @@ body {
   align-items: center;
 }
 
-.flexrow-button-header-button {
-    /*text-align: center;*/
-}
 
 .flexrow-button-header-text {
     flex-grow: 1;
@@ -212,7 +209,7 @@ body {
 }
 
 
-#calc_button, #export-button-up, #export-button-down {
+#calc_button, #export_button_save, #export_button_get {
   width: 10vw;
 }
 #quick_calc_hrs {
@@ -404,7 +401,7 @@ label.imgSelect input[accept*="image"] {
 
 
 #ct_debug {
-  disply: none;
+  display: none;
 }
 
 
diff --git a/docs/static/paycheck.js b/docs/static/paycheck.js
index 4e04e86..778001c 100644
--- a/docs/static/paycheck.js
+++ b/docs/static/paycheck.js
@@ -466,6 +466,28 @@ class PayCycle4wk {
     });
   }
 
+  retrieveFromServer() {
+    fetch("https://127.0.0.1:50015/save", {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+      }
+    })
+    .then((response) => {
+      if (!response.ok) {
+        throw new Error("Network response was not ok");
+      }
+      return response.json();
+    })
+    .then((data) => {
+      console.log("Successfully retrieved from server:", data);
+      // Process the retrieved data as needed
+    })
+    .catch((error) => {
+      console.error("There was a problem with the fetch operation:", error);
+    });
+  }
+
   // call on submit & week change
   updateModelFromForms() {
     // cycle through days parse content into relevant object
@@ -1015,6 +1037,22 @@ window.addEventListener('load',function(){
     });  
   }  
 
+  // export_button_save
+  // export_button_get
+  if (document.querySelector('#export_button_save')) {
+    document.querySelector('#export_button_save').addEventListener('click', function(event){  
+      console.log('[ S A V E ] JSON >> clicked');      
+      pc.persistentSave(true); // true - push to cloud
+    });  
+  }
+
+  if (document.querySelector('#export_button_get')) {
+    document.querySelector('#export_button_get').addEventListener('click', function(event){  
+      console.log('[ G E T ] JSON >>  clicked');
+      pc.retrieveFromServer();
+    });  
+  }  
+
   // SERVICE WORKER i/f
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.register('/paycheck/service_worker.js')