new changelog section in wynnfo, empty cache + reload button added

builder.js

@@ -3,7 +3,7 @@ const url_tag = location.hash.slice(1);
 // console.log(url_tag);
 
 
-const BUILD_VERSION = "7.0.7";
+const BUILD_VERSION = "7.0.8";
 
 function setTitle() {
     let text;

loadheader.js

@@ -32,7 +32,7 @@
     </button>
 </div>
 */
-let header_icon_map = new Map([
+let header_icon_map_left = new Map([
     ["index",["builder","WynnBuilder"]],
     ["crafter",["crafter","WynnCrafter"]],
     ["items",["searcher","WynnAtlas"]],
@@ -45,7 +45,7 @@ function setHeaders() {
     let headerleft = document.getElementById("headerleft");
     let headerright = document.getElementById("headerright");
 
-    for (const [name,data] of header_icon_map) {
+    for (const [name,data] of header_icon_map_left) {
         let a_elem = document.createElement("a");
         let img = document.createElement("img");
         let div = document.createElement("div");
@@ -72,6 +72,30 @@ function setHeaders() {
     toggle_icon_button.onclick = function() {toggleIcons()};
     toggle_icon_button.textContent = "Use Old Icons";
     headerright.appendChild(toggle_icon_button);
+
+    let reload_div = document.createElement("div");
+    let reload_button = document.createElement("button");
+    reload_button.classList.add("button");
+    reload_button.style.left = '0px';
+    reload_button.style.top = '0px';
+    reload_button.style.width = '48px';
+    reload_button.style.height = '48px';
+    reload_button.style.padding = '0px';
+    reload_button.onclick = hardReload;
+    let reload_img = document.createElement("img");
+    reload_img.src = "/media/icons/new/reload.png"
+    reload_img.style.width = "100%";
+    let reload_tooltip;
+    reload_tooltip = createTooltip(reload_tooltip, "p", "Reload", reload_button, ["center","reloadtooltip"]);
+    //reload_tooltip.style.position = "relative";
+    reload_tooltip.style.left = "-50%";
+    reload_tooltip.style.top = "70%";
+
+    reload_div.appendChild(reload_button); 
+    reload_button.appendChild(reload_img);
+    headerright.appendChild(reload_div);
+ 
+
     console.log("Set Header");
 }
 

utils.js

@@ -362,3 +362,14 @@ function toggleButton(button_id) {
         }
     }
 }
+
+/** A utility function that reloads the page forcefully. 
+ * 
+ */
+async function hardReload() {
+    //https://gist.github.com/rmehner/b9a41d9f659c9b1c3340
+    const dbs = await window.indexedDB.databases();
+    await dbs.forEach(db => { window.indexedDB.deleteDatabase(db.name) });
+
+    location.reload();
+}

wynnfo/index.html

@@ -29,6 +29,7 @@
             </div>
         </main>
         <script type="text/javascript" src = "scripts/main.js"></script>
+        <script type="text/javascript" src = "../utils.js"></script>
         <script type="text/javascript" src = "../loadheader.js"></script>
         <script type="text/javascript" src = "../icons.js"></script>
         </body>

wynnfo/scripts/main.js

@@ -1,12 +1,28 @@
 // ['Title', ["type of paper","file name"]]
 const pdfs = new Map([
-    ["Wynncraft Damage Calculation",["mechanics", "Damage_calculation", "hppeng, ferricles, et al.", "A complete guide to Wynncraft's damage calculations. Includes formulas, tested game values, and worked examples."]],
+    ["Wynncraft Damage Calculation",
-    ["Crafted Weapon Powder Mechanics",["mechanics", "Crafted_Weapon_Powder_Mechanics", "ferricles", "A short guide to the mechanics of powder application on crafted weapons. Includes formulas and a worked example."]],
+        ["Mechanics", "Damage_calculation", "hppeng, ferricles, et al.", "A complete guide to Wynncraft's damage calculations. Includes formulas, tested game values, and worked examples."
-    ["Spell Costs",["mechanics", "Spell_Costs", "Bart MC, ferricles", "A documentation of spell costs and the mechanics of spell cost reduction."]],
+    ]],
+    ["Crafted Weapon Powder Mechanics",
+        ["Mechanics", "Crafted_Weapon_Powder_Mechanics", "ferricles", "A short guide to the mechanics of powder application on crafted weapons. Includes formulas and a worked example."
+    ]],
+    ["Spell Costs",
+        ["Mechanics", "Spell_Costs", "Bart MC, ferricles", "A documentation of spell costs and the mechanics of spell cost reduction."
+    ]],
     //[title ,[genre, filename, author(s), abstract/desc]]
 ]);
 
-const sections = ["mechanics", "documentation", "history"]
+
+const changelog = new Map([
+    ["7.0.8",
+        [" + Created Changelog section in Wynnfo",
+        " + Added an empty cache + reload button to the right header",
+        " - Deleted lack of on-page documentation",
+    ]],
+    //[title ,[genre, filename, author(s), abstract/desc]]
+]);
+
+const sections = ["Changelog", "Mechanics", "History" ]
 
 function init() {
     initSections();
@@ -62,6 +78,38 @@ function init() {
             console.log("Invalid paper type for " + title + ": " + pdf[0]);
         }
     }
+
+    let sec = document.getElementById("Changelog-section");
+    for ([version, changes] of changelog) {
+        let pre = document.createElement("pre");
+        let firstline = document.createElement("div");
+        firstline.style.display = "flex";
+        firstline.style.justifyContent = "space-between";
+
+        let titleElem = document.createElement("p");
+        titleElem.textContent = "Version " + version;
+
+        pre.appendChild(firstline);
+        firstline.appendChild(titleElem);
+        sec.appendChild(document.createElement("br"));
+        sec.appendChild(pre);
+
+        let ul = document.createElement("ul");
+        ul.style.listStyle = "none";
+        for (change of changes) {
+            let li = document.createElement("li");
+            li.textContent = change;
+            if (change.substring(0,3) === " + ") {
+                li.classList.add("positive");
+            } else if (change.substring(0,3) === " - ") {
+                li.classList.add("negative");
+            } else {
+            }
+            ul.appendChild(li);
+        }
+
+        pre.appendChild(ul);
+    }
 }
 
 function initSections() {

wynnfo/styles/index.css

@@ -342,3 +342,13 @@ ul{
     word-break: break-word;
     white-space: pre-wrap;
 }
+
+.positive {
+    color: #5f5;
+    /*text-shadow: 2px 2px 0 #153f15;*/
+}
+
+.negative {
+    color: #f55;
+    /*text-shadow: 2px 2px 0 #1f1515;*/
+}