Last opened page is now stored (solves #166) (#178)

Co-authored-by: Adam Bem <adam.bem@zoho.eu>
Reviewed-on: #178
Reviewed-by: Mikolaj Widla <widlam@noreply.example.com>

Frontend/assets/css/frame.css

@@ -41,7 +41,7 @@ div#header {
     grid-column: 1;
 }
 
-iframe#frame {
+iframe#iframe {
     flex-grow: 1;
     background-color: #FFFFFF;
 }

Frontend/assets/scripts/dyn_host.js

@@ -1,6 +0,0 @@
-$(document).ready( function() {
-    document.getElementById("rest-mock").href =
-        window.location.protocol + "//" + window.location.hostname + ":8097";
-    
-});
-        

Frontend/assets/scripts/frame.js

@@ -1,6 +1,51 @@
+const tools = new Map();
 
+/**
+ * This functions imports other js file. I hate this solution, but other didn't work.
+ * 
+ * @function
+ * @name importScript
+ * @kind function
+ * @param {any} url
+ * @returns {void}
+ */
+function importScript(url) {
+    var script = document.createElement("script");
+    script.src = url;
+    document.head.appendChild(script);
+}
+
+/**
+ * Get address of Mock Services
+ * 
+ * @function
+ * @name getMockHost
+ * @kind function
+ * @returns {string}
+ */
+function getMockHost() {
+    return window.location.protocol + "//" + window.location.hostname + ":8097";
+}
+
+/**
+ * Function called after page is loaded
+ * 
+ * @function
+ * @name init
+ * @kind function
+ * @returns {void}
+ */
 function init() {
-    changeActiveTools('xmlTool', 'XML');
+    
+    tools.set("xpath", "tools/xpath.html");
+    tools.set("xsd", "tools/xsd.html");
+    tools.set("xslt", "tools/xslt.html");
+    tools.set("xmlform", "tools/xmlFormatter.html");
+    tools.set("jsonform", "tools/jsonFormatter.html");
+    tools.set("mock", getMockHost());
+
+    changeActiveTools('XML');
+    loadLastPage();
 }
 
 /**
@@ -12,26 +57,65 @@ function init() {
  * @param {any} activeClass class of elements that have to be shown
  * @param {any} activeCategoryButton class of category button that has to be active
  */
-function changeActiveTools(activeClass, activeCategoryButton) {
-    let tools = document.getElementById("toolList").children
+function changeActiveTools(activeCategoryButton) {
+    let toolList = document.getElementById("toolList").children;
+    let categoryToClass = new Map([["XML",  "xmlTool"],
+                                   ["JSON", "jsonTool"],
+                                   ["REST", "restTool"]]);
     
-    for (i = 0; i < tools.length; i++) {
-        if (tools[i].classList.contains(activeClass)) {
-            tools[i].style.display = "block";
-        }
-        else {
-            tools[i].style.display = "none";
-        }
+    let activeClass = categoryToClass.get(activeCategoryButton.toUpperCase());
+    if(activeClass == null) return;
+
+    for (i = 0; i < toolList.length; i++) {
+        if (toolList[i].classList.contains(activeClass))
+            toolList[i].style.display = "block";
+        else
+            toolList[i].style.display = "none";
     }
 
-    let categories = document.getElementById("menu").children
+    let categoryList = document.getElementById("menu").children;
 
-    for (i = 0; i < categories.length; i++) {
-        if (categories[i].innerText == activeCategoryButton) {
-            categories[i].classList.add("active")
-        }
-        else {
-            categories[i].classList.remove("active")
-        }
+    for (i = 0; i < categoryList.length; i++) {
+        if (categoryList[i].innerText == activeCategoryButton)
+            categoryList[i].classList.add("active");
+        else
+            categoryList[i].classList.remove("active");
     }
+}
+
+/**
+ * Function that changes active tool
+ * 
+ * @function
+ * @name changeTool
+ * @kind function
+ * @param {any} tool
+ * @returns {void}
+ */
+function changeTool(tool) {
+    const url = tools.get(tool);
+    localStorage.setItem("lastPage", tool);
+    document.getElementById("iframe").src = url;
+}
+
+/**
+ * Function that loads last used tool and sets active category accordingly
+ * 
+ * @function
+ * @name loadLastPage
+ * @kind function
+ * @returns {void}
+ */
+function loadLastPage() {
+    const lastPage = localStorage.getItem("lastPage");
+    switch (lastPage) { // XML category is default.
+        case "jsonform":
+            changeActiveTools('JSON');
+            break;
+        case "mock":
+            changeActiveTools('REST');
+            break;
+                    
+    }
+    document.getElementById("iframe").src = tools.get(lastPage);
 }