From bbdce23e574df25aac5f402e118db62598faca42 Mon Sep 17 00:00:00 2001
From: Eero Holmala <eero.holmala@hotmail.com>
Date: Tue, 19 Mar 2024 13:33:04 +0200
Subject: [PATCH] Added Web Tools Page: - Added very basic bootstrap styling -
 Added functioning QR Code Generator - Formatted site.webmanifest - Removed
 unused dependency injections from pages

---
 WretchedMachines/Pages/Index.cshtml.cs       |  6 ++--
 WretchedMachines/Pages/Privacy.cshtml        |  1 -
 WretchedMachines/Pages/Shared/_Layout.cshtml |  3 ++
 WretchedMachines/Pages/Webtools.cshtml       | 20 +++++++++++++
 WretchedMachines/Pages/Webtools.cshtml.cs    | 19 +++++++++++++
 WretchedMachines/wwwroot/js/site.js          | 30 ++++++++++++++++++--
 WretchedMachines/wwwroot/site.webmanifest    | 20 ++++++++++++-
 7 files changed, 91 insertions(+), 8 deletions(-)
 create mode 100644 WretchedMachines/Pages/Webtools.cshtml
 create mode 100644 WretchedMachines/Pages/Webtools.cshtml.cs

diff --git a/WretchedMachines/Pages/Index.cshtml.cs b/WretchedMachines/Pages/Index.cshtml.cs
index 759d5fa..a6c5460 100644
--- a/WretchedMachines/Pages/Index.cshtml.cs
+++ b/WretchedMachines/Pages/Index.cshtml.cs
@@ -7,15 +7,13 @@ namespace WretchedMachines.Pages;
 
 public class IndexModel : PageModel
 {
-    public readonly ILogger<IndexModel> _logger;
 
-    public IndexModel(ILogger<IndexModel> logger)
+    public IndexModel()
     {
-        _logger = logger;
     }
 
     public void OnGet()
     {
-        Log.Information("Test");
+        Log.Information("Index");
     }
 }
diff --git a/WretchedMachines/Pages/Privacy.cshtml b/WretchedMachines/Pages/Privacy.cshtml
index fa9990d..8c7b4a8 100644
--- a/WretchedMachines/Pages/Privacy.cshtml
+++ b/WretchedMachines/Pages/Privacy.cshtml
@@ -7,7 +7,6 @@
 
 <p>Use this page to detail your site's privacy policy.</p>
 <div>
-    <div id="qrcode"></div>
     <ul>
     @foreach(var item in Model.Items)
     {
diff --git a/WretchedMachines/Pages/Shared/_Layout.cshtml b/WretchedMachines/Pages/Shared/_Layout.cshtml
index 90b4f1b..89babd4 100644
--- a/WretchedMachines/Pages/Shared/_Layout.cshtml
+++ b/WretchedMachines/Pages/Shared/_Layout.cshtml
@@ -26,6 +26,9 @@
                         <li class="nav-item">
                             <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
                         </li>
+                        <li class="nav-item">
+                            <a class="nav-link text-dark" asp-area="" asp-page="/Webtools">Web Tools</a>
+                        </li>
                         <li class="nav-item">
                             <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
                         </li>
diff --git a/WretchedMachines/Pages/Webtools.cshtml b/WretchedMachines/Pages/Webtools.cshtml
new file mode 100644
index 0000000..f0882c9
--- /dev/null
+++ b/WretchedMachines/Pages/Webtools.cshtml
@@ -0,0 +1,20 @@
+@page
+@model WebtoolsModel
+@{
+    ViewData["Title"] = "Web Tools";
+}
+<div class="container" style="align-items:center">
+    <div class="row">
+        <h1>@ViewData["Title"]</h1>
+
+        <p>This page has a variety of web related tools.</p>
+    </div>
+    <div class="card" style="padding: 5rem; width: 50rem; align-items:center;">
+        <h2 class="card-title">QR Code Generator</h2>
+        <div class="card-body">
+            <div class="" id="qrcode"></div>
+            <br/>
+            <input class="input" id="qrcode-input" type="text" value="https://plugarii.com" style="width:100%"/>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/WretchedMachines/Pages/Webtools.cshtml.cs b/WretchedMachines/Pages/Webtools.cshtml.cs
new file mode 100644
index 0000000..13f54d2
--- /dev/null
+++ b/WretchedMachines/Pages/Webtools.cshtml.cs
@@ -0,0 +1,19 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Serilog;
+using WretchedMachines.DataAccess;
+
+namespace WretchedMachines.Pages;
+
+public class WebtoolsModel : PageModel
+{
+
+    public WebtoolsModel()
+    {
+    }
+
+    public void OnGet()
+    {
+        Log.Information("Webtools");
+    }
+}
diff --git a/WretchedMachines/wwwroot/js/site.js b/WretchedMachines/wwwroot/js/site.js
index 31e87b5..42bef74 100644
--- a/WretchedMachines/wwwroot/js/site.js
+++ b/WretchedMachines/wwwroot/js/site.js
@@ -4,5 +4,31 @@
 // Write your JavaScript code.
 
 $(function(){
-    new QRCode(document.getElementById("qrcode"), "https://plugarii.com");
-});
\ No newline at end of file
+
+    const qrCode = new QRCode(document.getElementById("qrcode"), "https://plugarii.com");
+    const input = document.getElementById("qrcode-input");
+
+    const remakeQRCode = (text)=>{
+        qrCode.clear();
+        qrCode.makeCode(text);
+    }
+
+    var text = input.value;
+
+    const processChanges = debounceLeading(() => {
+        text = input.value;
+        remakeQRCode(text)
+    });
+    input.addEventListener("keydown",processChanges); 
+});
+
+function debounceLeading(func, timeout = 300){
+    let timer;
+    return (...args) => {
+    clearTimeout(timer);
+    timer = setTimeout(() => {
+        func.apply(this, args);
+        }, timeout);
+    };
+}
+    
\ No newline at end of file
diff --git a/WretchedMachines/wwwroot/site.webmanifest b/WretchedMachines/wwwroot/site.webmanifest
index afaf924..7f0c967 100644
--- a/WretchedMachines/wwwroot/site.webmanifest
+++ b/WretchedMachines/wwwroot/site.webmanifest
@@ -1 +1,19 @@
-{"name":"Wretched Machines","short_name":"WretchedMachines","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
\ No newline at end of file
+{
+    "name": "Wretched Machines",
+    "short_name": "WretchedMachines",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}
\ No newline at end of file