1 files changed, 34 insertions, 5 deletions

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>