Start of online image editing support.

web/data/config.html

@@ -58,6 +58,12 @@
       change only, and does not hide the uploaders actual identity.
     </p>
 
+    <p>A watcher can be configured to hold uploads. This causes the new images seen 
+      by the watcher to be held for review on the <a href="/uploads.html">uploads page</a>.
+        This allows each image to be individually uploaded or skipped.
+
+    </p>
+
     <p>Exclusions can be specified, zero or more arbitrary strings. If any
       file matches one of those strings then it will not be uploaded. This is most
       often used if you use software (like Steam) which automatically creates thumbnails

web/data/dau.css

@@ -42,6 +42,10 @@ body {
   max-width: 52em;
 }
 
+.DAU-container-editor {
+  
+}
+
 pre {
   background-color: black;
   color: aliceblue;

web/data/editor.html

@@ -0,0 +1,52 @@
+{{ define "content" }}
+
+<main role="main" class="" style="height:100%;" x-data="editor()" x-init="setup_canvas();">
+  <p>
+    <button type="button" @click="add_some_text()" class="btn btn-primary">Add text</button>
+    <button type="button" @click="export_image()" class="btn btn-primary">Take a dump</button>
+  </p>
+  <canvas id="c"></canvas>
+  <img :src="img_data">
+</main>
+
+{{ end }}
+
+{{ define "js" }}
+
+<script>
+
+function editor() {
+  return {
+    canvas: null, img_data: "", scaleFactor: 1.0,
+    setup_canvas() {
+      // seriously javascript? just imagine, in 2021....
+      var url = new URL(window.location);
+      var id = url.searchParams.get("id");
+      var self = this;
+      self.canvas = new fabric.Canvas('c');
+      
+      fabric.Image.fromURL('/rest/image/'+id, function(oImg) {
+        // self.canvas.setDimensions({width: oImg.width, height: oImg.height});
+        oImg.selectable = false;
+        
+        self.canvas.add(oImg);
+        // self.canvas.setHeight(self.canvas.getHeight() * (self.scaleFactor));
+        // self.canvas.setWidth(self.canvas.getWidth() * (self.scaleFactor));
+        // self.canvas.setZoom(self.scaleFactor);
+      });
+    },
+    export_image() {
+      this.img_data = this.canvas.toDataURL({multiplier: 1/this.scaleFactor});
+    },
+    add_some_text() {
+      var text = new fabric.Textbox('hello world', { left: 100, top: 100, fontSize: 20 });
+      this.canvas.add(text);
+    },
+
+  }
+}
+  
+</script>
+
+
+{{ end }}

web/data/uploads.html

@@ -22,7 +22,9 @@
               <button @click="start_upload(ul.id)" type="button" class="btn btn-primary">upload</button>
               <button @click="skip_upload(ul.id)" type="button" class="btn btn-primary">reject</button>
             </td>
-            <td><img :src="'/rest/image/'+ul.id+'/thumb'"></td>
+            <td>
+              <td><a x-bind:href="'/editor.html?id='+ul.id"><img x-bind:src="'/rest/image/'+ul.id+'/thumb'"></a></td>
+            </td>
           </tr>
         </template>
 
@@ -47,7 +49,9 @@
             <td>
               <button @click="start_upload(ul.id)" type="button" class="btn btn-primary">upload</button>
             </td>
-            <td><img :src="'/rest/image/'+ul.id+'/thumb'"></td>
+            <td>
+              <img :src="'/rest/image/'+ul.id+'/thumb'">
+            </td>
           </tr>
         </template>
 
@@ -70,7 +74,9 @@
          <tr>
            <td x-text="ul.original_file"></td>
            <td x-text="ul.state"></td>
-           <td><img :src="'/rest/image/'+ul.id+'/thumb'"></td>
+           <td>
+            <img :src="'/rest/image/'+ul.id+'/thumb'">
+          </td>
          </tr>
        </template>
 

web/data/wrapper.tmpl

@@ -12,6 +12,8 @@
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>
   <script src="//unpkg.com/alpinejs" defer></script>
 
+<script src="https://cdn.jsdelivr.net/npm/fabric@4.6.0/dist/fabric.min.js"></script>
+
   <style>
   .bd-placeholder-img {
     font-size: 1.125rem;

web/server.go

@@ -5,10 +5,12 @@ import (
 	"encoding/json"
 	"fmt"
 	"html/template"
+	"io"
 	"io/ioutil"
 	"log"
 	"mime"
 	"net/http"
+	"os"
 	"path/filepath"
 	"strconv"
 	"strings"
@@ -193,6 +195,30 @@ func (ws *WebService) imageThumb(w http.ResponseWriter, r *http.Request) {
 	}
 }
 
+func (ws *WebService) image(w http.ResponseWriter, r *http.Request) {
+
+	vars := mux.Vars(r)
+	id, err := strconv.ParseInt(vars["id"], 10, 32)
+	if err != nil {
+		returnJSONError(w, "bad id")
+		return
+	}
+
+	ul := ws.Uploader.UploadById(int32(id))
+	if ul == nil {
+		returnJSONError(w, "bad id")
+		return
+	}
+
+	img, err := os.Open(ul.OriginalFilename)
+	if err != nil {
+		returnJSONError(w, "could not open image file")
+		return
+	}
+	defer img.Close()
+	io.Copy(w, img)
+}
+
 func (ws *WebService) modifyUpload(w http.ResponseWriter, r *http.Request) {
 
 	w.Header().Set("Content-Type", "application/json")
@@ -250,6 +276,7 @@ func (ws *WebService) StartWebServer() {
 	r.HandleFunc("/rest/upload/{id:[0-9]+}/{change}", ws.modifyUpload)
 
 	r.HandleFunc("/rest/image/{id:[0-9]+}/thumb", ws.imageThumb)
+	r.HandleFunc("/rest/image/{id:[0-9]+}", ws.image)
 
 	r.HandleFunc("/rest/config", ws.handleConfig)
 	r.PathPrefix("/").HandlerFunc(ws.getStatic)