From ece8612b7077d1a71de21badb43d94b8af3ab10a Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Sun, 28 Apr 2019 16:42:25 +0200
Subject: can hit match api

---
 client/actions.js                    |  7 +++++++
 client/app.css                       |  3 +++
 client/components/query.component.js | 39 +++++++++++++++++++++++++++++++-----
 3 files changed, 44 insertions(+), 5 deletions(-)

diff --git a/client/actions.js b/client/actions.js
index dfcfa09..3fee515 100644
--- a/client/actions.js
+++ b/client/actions.js
@@ -25,3 +25,10 @@ export const submit = (url, threshold) => dispatch => {
   params.append('threshold', threshold)
   api(dispatch, post, 'similar', '/api/v1/similar', params)
 }
+
+export const submit = (url, threshold) => dispatch => {
+  const params = new FormData()
+  params.append('url', url)
+  params.append('threshold', threshold)
+  api(dispatch, post, 'similar', '/api/v1/match', params)
+}
diff --git a/client/app.css b/client/app.css
index aa525da..042485d 100644
--- a/client/app.css
+++ b/client/app.css
@@ -45,6 +45,9 @@ label {
   margin-top: 10px;
   flex-direction: column;
 }
+.query input[type=radio] {
+  cursor: pointer;
+}
 
 /* results */
 
diff --git a/client/components/query.component.js b/client/components/query.component.js
index 715ea92..d28d3a0 100644
--- a/client/components/query.component.js
+++ b/client/components/query.component.js
@@ -6,14 +6,18 @@ import * as actions from '../actions'
 
 import UploadImage from './uploadImage.component'
 
+const MATCH_THRESHOLD = 6
+const SIMILAR_THRESHOLD = 20
+
 class Query extends Component {
   state = {
     image: null,
     blob: null,
     url: "",
-    threshold: 20,
+    threshold: SIMILAR_THRESHOLD,
     searchType: 'file',
     thresholdChanged: false,
+    saveIfNotFound: false,
   }
 
   handleUpload(blob) {
@@ -22,15 +26,31 @@ class Query extends Component {
       URL.revokeObjectURL(image)
     }
     const url = URL.createObjectURL(blob)
-    this.setState({ image: url, blob, thresholdChanged: false })
+    this.setState({
+      image: url,
+      blob,
+      thresholdChanged: false,
+    })
     this.props.actions.upload(blob, threshold)
   }
 
   handleURL() {
-    const { url, threshold } = this.state
+    const { url, threshold, saveIfNotFound } = this.state
     if (!url || url.indexOf('http') !== 0) return
-    this.setState({ image: url, blob: null, thresholdChanged: false })
-    this.props.actions.submit(url, threshold)
+    let newThreshold = threshold
+    if (saveIfNotFound) {
+      newThreshold = SIMILAR_THRESHOLD
+      this.props.actions.match(url, threshold)
+    } else {
+      this.props.actions.submit(url, threshold)
+    }
+    this.setState({
+      image: url,
+      blob: null,
+      thresholdChanged: false,
+      saveIfNotFound: false,
+      threshold: newThreshold,
+    })
   }
 
   resubmit() {
@@ -107,6 +127,15 @@ class Query extends Component {
           />
           {thresholdChanged && <button onClick={this.resubmit.bind(this)}>Update</button>}
         </label>
+        {searchType === 'url' &&
+          <label>
+            <span>Save if not found</span>
+            <input
+              type='checkbox'
+              checked={saveIfNotFound}
+              onChange={e => this.setState({ saveIfNotFound: e.target.checked, threshold: e.target.checked ? MATCH_THRESHOLD : SIMILAR_THRESHOLD })}
+          </label>
+        }
         {image &&
           <div className='activeQuery'>
             <b>Query image</b>
-- 
cgit v1.2.3-70-g09d2