From 5d34a6cd002e860cbc1bdda1ca9d12aebcd5dfe1 Mon Sep 17 00:00:00 2001
From: AymanSamir01 <oa1827166@gmail.com>
Date: Thu, 5 Oct 2023 19:26:25 +0300
Subject: [PATCH] 'auto'

---
 js/app.js | 92 ++++++++++++++++++++++++++++++++++++-------------------
 1 file changed, 61 insertions(+), 31 deletions(-)

diff --git a/js/app.js b/js/app.js
index 86f5d86..4158fd0 100644
--- a/js/app.js
+++ b/js/app.js
@@ -1,37 +1,67 @@
-document.getElementById("htmlCode").value="<div>\n\n</div>";
-document.getElementById("cssCode").value="<style>\n\n</style>";
-document.getElementById("jsCode").value="<script>\n\n</script>";
+document.getElementById("htmlCode").value = "<div>\n\n</div>";
+document.getElementById("cssCode").value = "<style>\n\n</style>";
+document.getElementById("jsCode").value = "<script>\n\n</script>";
 
-function showPreview(){
-    var htmlCode = document.getElementById("htmlCode").value;
-    var cssCode = ""+document.getElementById("cssCode").value+"";
-    var jsCode = ""+document.getElementById("jsCode").value+"";
-    var frame = document.getElementById("preview-window").contentWindow.document;
-    frame.open();
-    frame.write(htmlCode+cssCode+jsCode);
-    frame.close();
+function checkLocalStorage() {
+  if (localStorage.getItem("htmlCode")) {
+    let htmlStore = localStorage.getItem("htmlCode");
+    document.getElementById("htmlCode").value = htmlStore;
+  }
+  if (localStorage.getItem("cssCode")) {
+    let cssStore = localStorage.getItem("cssCode");
+    document.getElementById("cssCode").value = cssStore;
+  }
+  if (localStorage.getItem("jsCode")) {
+    let jsStore = localStorage.getItem("jsCode");
+    document.getElementById("jsCode").value = jsStore;
+  }
 }
+checkLocalStorage();
 
-function show(x){
-    document.getElementById("html").style.display="none";
-    document.getElementById("css").style.display="none";
-    document.getElementById("js").style.display="none";
-    document.getElementById("result").style.display="none";
-    document.getElementById(x).style.display="block";
+if (performance.navigation.type == performance.navigation.TYPE_RELOAD) {
+  checkLocalStorage();
+  showPreview();
 }
 
-function show_all(){
-    if(window.innerWidth>=992)
-    {
-        document.getElementById("html").style.display="block";
-        document.getElementById("css").style.display="block";
-        document.getElementById("js").style.display="block";
-        document.getElementById("result").style.display="block";
-    }
-    if(window.innerWidth<992 && document.getElementById("html").style.display=="block")
-    {
-        document.getElementById("css").style.display="none";
-        document.getElementById("js").style.display="none";
-        document.getElementById("result").style.display="none";
-    }
+function showPreview() {
+  var htmlCode = document.getElementById("htmlCode").value;
+  var cssCode = "" + document.getElementById("cssCode").value + "";
+  var jsCode = "" + document.getElementById("jsCode").value + "";
+  localStorage.setItem("htmlCode", htmlCode);
+  localStorage.setItem("cssCode", cssCode);
+  localStorage.setItem("jsCode", jsCode);
+  var frame = document.getElementById("preview-window").contentWindow.document;
+
+  frame.open();
+  frame.write(
+    localStorage.getItem("htmlCode") +
+      localStorage.getItem("cssCode") +
+      localStorage.getItem("jsCode")
+  );
+  frame.close();
+}
+
+function show(x) {
+  document.getElementById("html").style.display = "none";
+  document.getElementById("css").style.display = "none";
+  document.getElementById("js").style.display = "none";
+  document.getElementById("result").style.display = "none";
+  document.getElementById(x).style.display = "block";
+}
+
+function show_all() {
+  if (window.innerWidth >= 992) {
+    document.getElementById("html").style.display = "block";
+    document.getElementById("css").style.display = "block";
+    document.getElementById("js").style.display = "block";
+    document.getElementById("result").style.display = "block";
+  }
+  if (
+    window.innerWidth < 992 &&
+    document.getElementById("html").style.display == "block"
+  ) {
+    document.getElementById("css").style.display = "none";
+    document.getElementById("js").style.display = "none";
+    document.getElementById("result").style.display = "none";
+  }
 }