From bc6ed3ac18697bad7bab59619b269dea928f1312 Mon Sep 17 00:00:00 2001
From: ThaUnknown <6506529+ThaUnknown@users.noreply.github.com>
Date: Fri, 29 Jul 2022 19:54:15 +0200
Subject: [PATCH] feat: more explicit image search

---
 package.json                                  |  2 +-
 src/renderer/src/lib/NyaaBlock.svelte         |  2 +-
 src/renderer/src/lib/pages/home/Search.svelte | 16 ++++++++++++++++
 src/renderer/src/modules/anime.js             | 14 +++++++-------
 4 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index 816f8b6..6197a2a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "Miru",
-  "version": "2.10.4",
+  "version": "2.10.5",
   "author": "ThaUnknown_ <ThaUnknown@users.noreply.github.com>",
   "main": "src/index.js",
   "homepage": "https://github.com/ThaUnknown/miru#readme",
diff --git a/src/renderer/src/lib/NyaaBlock.svelte b/src/renderer/src/lib/NyaaBlock.svelte
index f58cb80..cca255d 100644
--- a/src/renderer/src/lib/NyaaBlock.svelte
+++ b/src/renderer/src/lib/NyaaBlock.svelte
@@ -1,5 +1,5 @@
 <script>
-let block = true
+let block = false
 
 async function testConnection () {
   try {
diff --git a/src/renderer/src/lib/pages/home/Search.svelte b/src/renderer/src/lib/pages/home/Search.svelte
index 63d37a3..8d3f944 100644
--- a/src/renderer/src/lib/pages/home/Search.svelte
+++ b/src/renderer/src/lib/pages/home/Search.svelte
@@ -1,5 +1,6 @@
 <script>
 import { getContext } from 'svelte'
+import { traceAnime } from '@/modules/anime.js'
 
 export let search
 export let current
@@ -41,6 +42,13 @@ function input () {
     searchTimeout = null
   }, 500)
 }
+function handleFile ({ target }) {
+  const { files } = target
+  if (files?.[0]) {
+    traceAnime(files[0], 'file')
+    target.value = null
+  }
+}
 </script>
 
 <div class='container-fluid row p-20' on:input={input}>
@@ -162,6 +170,14 @@ function input () {
       <option value='UPDATED_TIME_DESC' disabled hidden>Updated Date</option>
     </select>
   </div>
+  <input type='file' class='d-none' id='search-image' accept='image/*' on:input={handleFile}>
+  <div class='col-auto p-10 d-flex'>
+    <button class='btn bg-dark material-icons font-size-18 px-5 align-self-end shadow-lg border-0' type='button' on:click={searchClear} class:text-primary={!!current}>
+      <label for='search-image' class='pointer'>
+        image
+      </label>
+    </button>
+  </div>
   <div class='col-auto p-10 d-flex'>
     <button class='btn bg-dark material-icons font-size-18 px-5 align-self-end shadow-lg border-0' type='button' on:click={searchClear} class:text-primary={!!current}>
       delete
diff --git a/src/renderer/src/modules/anime.js b/src/renderer/src/modules/anime.js
index 6541f89..c83327d 100644
--- a/src/renderer/src/modules/anime.js
+++ b/src/renderer/src/modules/anime.js
@@ -13,9 +13,7 @@ window.addEventListener('paste', async e => { // WAIT image lookup on paste, or
   const item = e.clipboardData.items[0]
   if (item?.type.indexOf('image') === 0) {
     e.preventDefault()
-    const formData = new FormData()
-    formData.append('image', item.getAsFile())
-    traceAnime(formData, 'file')
+    traceAnime(item.getAsFile(), 'file')
   } else if (item?.type === 'text/plain') {
     item.getAsString(text => {
       if (torrentRx.exec(text)) {
@@ -36,16 +34,16 @@ window.addEventListener('paste', async e => { // WAIT image lookup on paste, or
     })
   }
 })
-function traceAnime (image, type) { // WAIT lookup logic
+export function traceAnime (image, type) { // WAIT lookup logic
   if (type === 'file') {
     const reader = new FileReader()
     reader.onload = e => {
       addToast({
         title: 'Looking up anime for image',
-        text: /* html */`<img class="w-200 rounded pt-5" src="${e.target.result}">`
+        text: /* html */`You can also paste an URL to an image!<br><img class="w-200 rounded pt-5" src="${e.target.result}">`
       })
     }
-    reader.readAsDataURL(image.get('image'))
+    reader.readAsDataURL(image)
   } else {
     addToast({
       title: 'Looking up anime for image',
@@ -55,9 +53,11 @@ function traceAnime (image, type) { // WAIT lookup logic
   let options
   let url = `https://api.trace.moe/search?cutBorders&url=${image}`
   if (type === 'file') {
+    const formData = new FormData()
+    formData.append('image', image)
     options = {
       method: 'POST',
-      body: image
+      body: formData
     }
     url = 'https://api.trace.moe/search'
   }