From a6cf1564d8b90f9c7f00c741efc9805473057545 Mon Sep 17 00:00:00 2001
From: unknown <tjeerd992@gmail.com>
Date: Thu, 20 Oct 2022 15:51:36 +0200
Subject: [PATCH] Fix issues on windows

---
 frontend/package.json.md5          |  2 +-
 frontend/src/App.svelte            | 45 +++++++++++++++-----------
 frontend/src/lib/Button.svelte     | 13 +++++++-
 frontend/src/lib/Header.svelte     | 20 +++++-------
 frontend/src/lib/Pathconfig.svelte | 51 ++++++++++++++++++++++++++----
 frontend/src/lib/Settings.svelte   | 33 +++++++++++++++++--
 go.mod                             |  8 ++---
 go.sum                             | 16 +++++-----
 main.go                            | 14 ++++++--
 9 files changed, 144 insertions(+), 58 deletions(-)

diff --git a/frontend/package.json.md5 b/frontend/package.json.md5
index d69931e..861cd4d 100755
--- a/frontend/package.json.md5
+++ b/frontend/package.json.md5
@@ -1 +1 @@
-3369211da39dcc63e89750b11fced2dd
\ No newline at end of file
+af281d83f29a49c45820e690cc0ab6e8
\ No newline at end of file
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index c192c63..e4bc1c0 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -8,15 +8,18 @@
   import Loader from "./lib/Loader.svelte";
 
   // CONSTANTS
-  const title = "WaterMarker";
-  const version = "1.2";
+  const version = "V1.3";
   const author = "ICheered";
   const authorLink = "https://icheered.nl";
 
   // PARAMETERS
-  // let sourceFolderPath = "/home/tjbakker/Documents/dev/vscode/go/WaterMarker/testfiles/source";
+  //let sourceFolderPath = "/home/tjbakker/Documents/dev/vscode/go/WaterMarker/testfiles/source";
   // let targetFolderPath = "/home/tjbakker/Documents/dev/vscode/go/WaterMarker/testfiles/watermarked";
   // let watermarkPath = "/home/tjbakker/Documents/dev/vscode/go/WaterMarker/testfiles/watermark.png";
+  
+  // let sourceFolderPath = "C:\\Users\\TJBakker\\Documents\\WaterMarker\\testfiles\\vertical";
+  // let targetFolderPath =  "C:\\Users\\TJBakker\\Documents\\WaterMarker\\testfiles\\watermarked";
+  // let watermarkPath =  "C:\\Users\\TJBakker\\Documents\\WaterMarker\\testfiles\\fotociewm.png";
 
   let sourceFolderPath = "";
   let targetFolderPath = "";
@@ -37,30 +40,28 @@
 
   let showLoader = false;
 
+  let showImagePreview = false;
+
   // FUNCTIONS
   let mainbuttontext = "";
+  let mainButtonDisabled = true;
   $: {
     if (sourceFolderPath == "" || targetFolderPath == "" || watermarkPath == "") {
       mainbuttontext = "Select source, target and watermark";
+      mainButtonDisabled = true;
     } else if (numberOfSourceFiles == 0) {
       mainbuttontext = "No images found in source folder!";
+      mainButtonDisabled = true;
     } else if (changedSettings) {
       mainbuttontext = "Generate preview";
+      mainButtonDisabled = false;
     } else {
       mainbuttontext = "Start processing!";
+      mainButtonDisabled = false;
     }
   }
 
   function generatePreview() {
-    // fetch("/home/tjbakker/Documents/dev/vscode/go/wails/testfiles/watermarked/DSC_0134.jpg")
-    //   .then((response) => response.blob())
-    //   .then((blob) => {
-    //     const reader = new FileReader();
-    //     reader.addEventListener("load", function () {
-    //       watermarkedpreviewImage.setAttribute("src", reader.result);
-    //     });
-    //     reader.readAsDataURL(blob);
-    //   });
     showLoader = true;
     console.log("Generating preview");
     FetchPreview(
@@ -78,6 +79,7 @@
         fetch(fetchpath)
           .then((response) => response.blob())
           .then((blob) => {
+            showImagePreview = true;
             const reader = new FileReader();
             reader.addEventListener("load", function () {
               watermarkedpreviewImage.setAttribute("src", reader.result);
@@ -133,7 +135,7 @@
       <div class="loadingtext">Processing image</div>
     </div>
   {/if}
-  <Header {title} {version} {author} {authorLink} />
+  <Header {version} {author} {authorLink} />
   <div class="maincontainer">
     <div class="settingscol">
       <div class="pathconfig">
@@ -145,6 +147,8 @@
             bind:numberOfSourceFiles
             bind:numberOfTargetFiles
             bind:watermarkpreviewImage
+            bind:changedSettings
+            bind:showImagePreview
           />
         </Card>
       </div>
@@ -156,8 +160,12 @@
     </div>
 
     <div class="mainview">
-      <img bind:this={watermarkedpreviewImage} src="" alt="Preview of the result" />
-      <Button bind:text={mainbuttontext} callback={mainButtonFunction} />
+      {#if showImagePreview == true} 
+        <img class="previewwindow" bind:this={watermarkedpreviewImage} src="" alt="Preview of the result" />
+      {:else}
+      <div class="previewwindow"/>
+      {/if}
+      <Button bind:text={mainbuttontext} bind:disabled={mainButtonDisabled} callback={mainButtonFunction} />
     </div>
   </div>
 </main>
@@ -190,13 +198,12 @@
     width: 75%;
     height: 100%;
   }
-  .mainview img {
-    max-width: 95%;
+  .previewwindow {
+    height: 489.25px;
     border-radius: 20px;
     margin: 10px;
     box-shadow: 0px 0px 20px #4d5056;
-    /* width: 733.875px; */
-    height: 489.25px;
+    text-align: center;
   }
 
   .settingscol {
diff --git a/frontend/src/lib/Button.svelte b/frontend/src/lib/Button.svelte
index 0abc935..7abbfd8 100644
--- a/frontend/src/lib/Button.svelte
+++ b/frontend/src/lib/Button.svelte
@@ -1,9 +1,10 @@
 <script>
   export let text, callback;
+  export let disabled = false;
 </script>
 
 <div>
-  <button on:click={callback}>{text}</button>
+  <button on:click={callback} class={disabled ? 'disabled' : ""}>{text}</button>
 </div>
 
 <style>
@@ -23,4 +24,14 @@
     background: #1583b3;
     color: white;
   }
+  .disabled {
+    background: #4d5056;
+    color: white;
+    cursor:not-allowed;
+  }
+  .disabled:hover{
+    color: white;
+    background: #4d5056;
+    
+  }
 </style>
diff --git a/frontend/src/lib/Header.svelte b/frontend/src/lib/Header.svelte
index 1819d9e..9dd8508 100644
--- a/frontend/src/lib/Header.svelte
+++ b/frontend/src/lib/Header.svelte
@@ -1,33 +1,29 @@
 <script>
-  export let title, version, authorLink, author;
+  export let version, authorLink, author;
 </script>
 
 <div class="topbar">
-  <div class="title">
-    {title}
+  <div class="author">
+    Made by <a  target="_blank" rel="noreferrer" href={authorLink}>{author}</a>
   </div>
   <div class="version">
     {version}
   </div>
-  <div class="author">
-    <a href={authorLink}>{author}</a>
-  </div>
+  
 </div>
-<div class="line" />
 
 <style>
   .topbar {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
+    text-align: left;
     height: 30px;
     color: black;
-  }
-  .line {
-    border-bottom: 1px solid white;
-    width: 100%;
+    padding: 5px;
   }
   a {
-    color: black;
+    color: #1caeee;
+    text-decoration: none;
   }
 </style>
diff --git a/frontend/src/lib/Pathconfig.svelte b/frontend/src/lib/Pathconfig.svelte
index 5a4a80d..24f7851 100644
--- a/frontend/src/lib/Pathconfig.svelte
+++ b/frontend/src/lib/Pathconfig.svelte
@@ -1,5 +1,9 @@
 <script>
-  import { SelectFolder, SelectFile, GetNumberOfFiles } from "../../wailsjs/go/main/App.js";
+  import {
+    SelectFolder,
+    SelectFile,
+    GetNumberOfFiles,
+  } from "../../wailsjs/go/main/App.js";
   import Button from "../lib/Button.svelte";
 
   export let sourceFolderPath,
@@ -7,12 +11,18 @@
     watermarkPath,
     numberOfSourceFiles,
     numberOfTargetFiles,
-    watermarkpreviewImage;
+    watermarkpreviewImage,
+    changedSettings,
+    showImagePreview;
+
+  let showWatermarkPreview = false;
 
   function selectSourceFolderPath() {
     SelectFolder().then((result) => {
       if (result.length) {
         sourceFolderPath = result;
+        changedSettings = true;
+        showImagePreview = false;
         GetNumberOfFiles(sourceFolderPath).then((result) => {
           numberOfSourceFiles = result;
         });
@@ -25,6 +35,21 @@
         targetFolderPath = result;
         GetNumberOfFiles(targetFolderPath).then((result) => {
           numberOfTargetFiles = result;
+          if (numberOfTargetFiles) {
+            if (
+              confirm(
+                "The output folder is not empty, files may be overwritten. Continue?"
+              )
+            ) {
+              // Save it!
+              console.log("Target folder is not empty but continuing anyways");
+            } else {
+              // Do nothing!
+              console.log("Not continuing");
+              targetFolderPath = ""
+              numberOfTargetFiles = 0
+            }
+          }
         });
       }
     });
@@ -35,12 +60,17 @@
       if (result.length) {
         watermarkPath = result;
 
-        const fetchpath = navigator.platform.includes("Linux") ? watermarkPath : window.location + watermarkPath;
+        const fetchpath = navigator.platform.includes("Linux")
+          ? watermarkPath
+          : window.location + watermarkPath;
         fetch(fetchpath)
           .then((response) => response.blob())
           .then((blob) => {
+            showWatermarkPreview = true;
+            showImagePreview = false;
             const reader = new FileReader();
             reader.addEventListener("load", function () {
+              changedSettings = true;
               watermarkpreviewImage.setAttribute("src", reader.result);
             });
             reader.readAsDataURL(blob);
@@ -54,7 +84,7 @@
   <div>
     <Button text="Select Source Folder" callback={selectSourceFolderPath} />
     <div>
-      {sourceFolderPath.match(/[^\/]+\/[^\/]+$/) ?? ""}
+      {sourceFolderPath.match(/[^\/|\\]+[\/|\\][^(\/|\\)]+$/) ?? ""}
     </div>
     <div>
       {numberOfSourceFiles ? numberOfSourceFiles + " files found" : ""}
@@ -63,7 +93,7 @@
   <div>
     <Button text="Select Target Folder" callback={selectTargetFolderPath} />
     <div>
-      {targetFolderPath.match(/[^\/]+\/[^\/]+$/) ?? ""}
+      {targetFolderPath.match(/[^\/|\\]+[\/|\\][^(\/|\\)]+$/) ?? ""}
     </div>
     <div>
       {numberOfTargetFiles ? numberOfTargetFiles + " files found" : ""}
@@ -73,10 +103,17 @@
   <div>
     <Button text="Select Watermark" callback={selectFilePath} />
     <div>
-      {watermarkPath.match(/[^\/]+\/[^\/]+$/) ?? ""}
+      {watermarkPath.match(/[^\/|\\]+[\/|\\][^(\/|\\)]+$/) ?? ""}
     </div>
 
-    <img class="watermarkpreview" bind:this={watermarkpreviewImage} src="" alt="Watermark preview" />
+    {#if showWatermarkPreview == true}
+      <img
+        class="watermarkpreview"
+        bind:this={watermarkpreviewImage}
+        src=""
+        alt="Watermark preview"
+      />
+    {/if}
   </div>
 </div>
 
diff --git a/frontend/src/lib/Settings.svelte b/frontend/src/lib/Settings.svelte
index f9ac265..b9e6691 100644
--- a/frontend/src/lib/Settings.svelte
+++ b/frontend/src/lib/Settings.svelte
@@ -12,15 +12,15 @@
     <input class="textfield" type="text" bind:value={watermarkOpacity} on:change={valuechanged} min="0" max="100" />
   </div>
   <div>
-    <input type="range" bind:value={watermarkOpacity} min="0" max="100" />
+    <input class="slider" type="range" bind:value={watermarkOpacity} min="0" max="100" />
   </div>
 
   <div class="row">
     <div class="text">Scale</div>
     <input class="textfield" type="text" bind:value={watermarkScale} on:change={valuechanged} min="0" max="100" />
   </div>
-  <div>
-    <input type="range" bind:value={watermarkScale} min="0" max="100" />
+  <div>    
+    <input class="slider" type="range" bind:value={watermarkScale} min="0" max="100" />
   </div>
   <div>Watermark location</div>
   <select bind:value={watermarkPosition} on:change={valuechanged}>
@@ -45,4 +45,31 @@
   .text {
     padding-top: 3px;
   }
+
+
+  @media screen and (-webkit-min-device-pixel-ratio:0) {
+    input[type='range'] {
+      overflow: hidden;
+      -webkit-appearance: none;
+      background-color: white;
+      border-radius: 5px;
+    }
+    
+    input[type='range']::-webkit-slider-runnable-track {
+      height: 10px;
+      -webkit-appearance: none;
+      color: #13bba4;
+      margin-top: -1px;
+      
+    }
+    
+    input[type='range']::-webkit-slider-thumb {
+      width: 6px;
+      -webkit-appearance: none;
+      height: 10px;
+      cursor: ew-resize;
+      background: black;
+      box-shadow: -80px 0 0 80px #1caeee;
+    }
+}
 </style>
diff --git a/go.mod b/go.mod
index 4f873a8..f4c6c09 100644
--- a/go.mod
+++ b/go.mod
@@ -4,7 +4,7 @@ go 1.18
 
 require (
 	github.com/nfnt/resize v0.0.0-20180221191011-83c6a9932646
-	github.com/wailsapp/wails/v2 v2.0.0
+	github.com/wailsapp/wails/v2 v2.1.0
 )
 
 require (
@@ -13,7 +13,7 @@ require (
 	github.com/google/uuid v1.1.2 // indirect
 	github.com/imdario/mergo v0.3.12 // indirect
 	github.com/jchv/go-winloader v0.0.0-20210711035445-715c2860da7e // indirect
-	github.com/labstack/echo/v4 v4.7.2 // indirect
+	github.com/labstack/echo/v4 v4.9.0 // indirect
 	github.com/labstack/gommon v0.3.1 // indirect
 	github.com/leaanthony/go-ansi-parser v1.0.1 // indirect
 	github.com/leaanthony/gosod v1.0.3 // indirect
@@ -27,8 +27,8 @@ require (
 	github.com/valyala/fasttemplate v1.2.1 // indirect
 	github.com/wailsapp/mimetype v1.4.1 // indirect
 	golang.org/x/crypto v0.0.0-20210921155107-089bfa567519 // indirect
-	golang.org/x/net v0.0.0-20211015210444-4f30a5c0130f // indirect
-	golang.org/x/sys v0.0.0-20220114195835-da31bd327af9 // indirect
+	golang.org/x/net v0.0.0-20220722155237-a158d28d115b // indirect
+	golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f // indirect
 	golang.org/x/text v0.3.7 // indirect
 )
 
diff --git a/go.sum b/go.sum
index 191b657..83d9d80 100644
--- a/go.sum
+++ b/go.sum
@@ -11,8 +11,8 @@ github.com/imdario/mergo v0.3.12 h1:b6R2BslTbIEToALKP7LxUvijTsNI9TAe80pLWN2g/HU=
 github.com/imdario/mergo v0.3.12/go.mod h1:jmQim1M+e3UYxmgPu/WyfjB3N3VflVyUjjjwH0dnCYA=
 github.com/jchv/go-winloader v0.0.0-20210711035445-715c2860da7e h1:Q3+PugElBCf4PFpxhErSzU3/PY5sFL5Z6rfv4AbGAck=
 github.com/jchv/go-winloader v0.0.0-20210711035445-715c2860da7e/go.mod h1:alcuEEnZsY1WQsagKhZDsoPCRoOijYqhZvPwLG0kzVs=
-github.com/labstack/echo/v4 v4.7.2 h1:Kv2/p8OaQ+M6Ex4eGimg9b9e6icoxA42JSlOR3msKtI=
-github.com/labstack/echo/v4 v4.7.2/go.mod h1:xkCDAdFCIf8jsFQ5NnbK7oqaF/yU1A1X20Ltm0OvSks=
+github.com/labstack/echo/v4 v4.9.0 h1:wPOF1CE6gvt/kmbMR4dGzWvHMPT+sAEUJOwOTtvITVY=
+github.com/labstack/echo/v4 v4.9.0/go.mod h1:xkCDAdFCIf8jsFQ5NnbK7oqaF/yU1A1X20Ltm0OvSks=
 github.com/labstack/gommon v0.3.1 h1:OomWaJXm7xR6L1HmEtGyQf26TEn7V6X88mktX9kee9o=
 github.com/labstack/gommon v0.3.1/go.mod h1:uW6kP17uPlLJsD3ijUYn3/M5bAxtlZhMI6m3MFxTMTM=
 github.com/leaanthony/debme v1.2.1 h1:9Tgwf+kjcrbMQ4WnPcEIUcQuIZYqdWftzZkBr+i/oOc=
@@ -48,13 +48,13 @@ github.com/valyala/fasttemplate v1.2.1 h1:TVEnxayobAdVkhQfrfes2IzOB6o+z4roRkPF52
 github.com/valyala/fasttemplate v1.2.1/go.mod h1:KHLXt3tVN2HBp8eijSv/kGJopbvo7S+qRAEEKiv+SiQ=
 github.com/wailsapp/mimetype v1.4.1 h1:pQN9ycO7uo4vsUUuPeHEYoUkLVkaRntMnHJxVwYhwHs=
 github.com/wailsapp/mimetype v1.4.1/go.mod h1:9aV5k31bBOv5z6u+QP8TltzvNGJPmNJD4XlAL3U+j3o=
-github.com/wailsapp/wails/v2 v2.0.0 h1:EsiIMQYi3XeAJvvJNYTWVSyaEYwuBsSFU9ACSq7Ly4s=
-github.com/wailsapp/wails/v2 v2.0.0/go.mod h1:z3os4dBFCOmPhFHjjEKY4KygTVFKAGECkS9/mKm1wEU=
+github.com/wailsapp/wails/v2 v2.1.0 h1:OJxPu/4vQxSwAjVVpSNiMVGyYyInpm0UtlDUgVxpaSo=
+github.com/wailsapp/wails/v2 v2.1.0/go.mod h1:zdc9YVrIijjuNNkLOO3UpTU6M12TJe6TlriL+3ttlMM=
 golang.org/x/crypto v0.0.0-20210921155107-089bfa567519 h1:7I4JAnoQBe7ZtJcBaYHi5UtiO8tQHbUSXxL+pnGRANg=
 golang.org/x/crypto v0.0.0-20210921155107-089bfa567519/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
 golang.org/x/net v0.0.0-20210505024714-0287a6fb4125/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
-golang.org/x/net v0.0.0-20211015210444-4f30a5c0130f h1:OfiFi4JbukWwe3lzw+xunroH1mnC1e2Gy5cxNJApiSY=
-golang.org/x/net v0.0.0-20211015210444-4f30a5c0130f/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
+golang.org/x/net v0.0.0-20220722155237-a158d28d115b h1:PxfKdU9lEEDYjdIzOtC4qFWgkU2rGHdKlKowJSMN9h0=
+golang.org/x/net v0.0.0-20220722155237-a158d28d115b/go.mod h1:XRhObCWvk6IyKnWLug+ECip1KBveYUHfp+8e9klMJ9c=
 golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20200810151505-1b9f1253b3ed/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
@@ -63,8 +63,8 @@ golang.org/x/sys v0.0.0-20210616045830-e2b7044e8c71/go.mod h1:oPkhp1MJrh7nUepCBc
 golang.org/x/sys v0.0.0-20210630005230-0f9fa26af87c/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.0.0-20210927094055-39ccf1dd6fa6/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.0.0-20211103235746-7861aae1554b/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.0.0-20220114195835-da31bd327af9 h1:XfKQ4OlFl8okEOr5UvAqFRVj8pY/4yfcXrddB8qAbU0=
-golang.org/x/sys v0.0.0-20220114195835-da31bd327af9/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f h1:v4INt8xihDGvnrfjMDVXGxw9wrfxYyCjk0KbXjhR55s=
+golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
 golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
 golang.org/x/text v0.3.7 h1:olpwvP2KacW1ZWvsR7uQhoyTYvKAupfQrRGBFM352Gk=
diff --git a/main.go b/main.go
index 9a0459f..688faed 100644
--- a/main.go
+++ b/main.go
@@ -9,6 +9,8 @@ import (
 
 	"github.com/wailsapp/wails/v2"
 	"github.com/wailsapp/wails/v2/pkg/options"
+	"strings"
+	"runtime"
 )
 
 //go:embed all:frontend/dist
@@ -25,8 +27,14 @@ func NewFileLoader() *FileLoader {
 func (h *FileLoader) ServeHTTP(res http.ResponseWriter, req *http.Request) {
 	var err error
 	// requestedFilename := strings.TrimPrefix(req.URL.Path, "/")
-	requestedFilename := req.URL.Path
-	//requestedFilename = "/home/tjbakker/Documents/dev/vscode/go/WaterMarker/testfiles/watermark.png"
+	// fmt.Printf("Vartype: %s\n", reflect.TypeOf(requestedFilename))
+
+	var requestedFilename string = ""
+	if runtime.GOOS == "windows" {
+		requestedFilename = strings.TrimPrefix(req.URL.Path, "/")
+	} else {
+		requestedFilename = req.URL.Path
+	}
 	println("Requesting file:", requestedFilename)
 	fileData, err := os.ReadFile(requestedFilename)
 	if err != nil {
@@ -43,7 +51,7 @@ func main() {
 
 	// Create application with options
 	err := wails.Run(&options.App{
-		Title:            "wails",
+		Title:            "WaterMarker",
 		Width:            1024,
 		Height:           650,
 		Assets:           assets,