15
15
</ head >
16
16
< body >
17
17
< div id ="results "> </ div >
18
-
18
+
19
19
< h1 > Mango Sorter</ h1 >
20
20
<!-- <h3>Demonstrates simple 320x240 capture & display</h3> -->
21
-
21
+
22
22
< div id ="my_camera "> </ div >
23
23
24
-
25
24
26
-
25
+
26
+
27
27
<!-- First, include the Webcam.js JavaScript Library -->
28
28
< script src ="https://cdnjs.cloudflare.com/ajax/libs/webcamjs/1.0.25/webcam.min.js "> </ script >
29
-
29
+
30
30
<!-- Configure a few settings and attach camera -->
31
31
< script language ="JavaScript ">
32
32
Webcam . set ( {
@@ -37,7 +37,7 @@ <h1>Mango Sorter</h1>
37
37
} ) ;
38
38
Webcam . attach ( '#my_camera' ) ;
39
39
</ script >
40
-
40
+
41
41
<!-- A button for taking snaps -->
42
42
< form >
43
43
< input type =button value ="Take Snapshot " onClick ="take_snapshot() ">
@@ -50,7 +50,7 @@ <h1>Mango Sorter</h1>
50
50
< hr >
51
51
< div id ="detectedColor "> </ div >
52
52
< div id ="hashedFile "> </ div >
53
-
53
+
54
54
<!-- Code to handle taking the snapshot and displaying it locally -->
55
55
< script language ="JavaScript ">
56
56
@@ -66,11 +66,11 @@ <h1>Mango Sorter</h1>
66
66
axios . get ( urlQuery ) . then ( function ( response ) {
67
67
68
68
console . log ( response . data ) ;
69
- document . getElementById ( 'hashedFile' ) . innerHTML =
69
+ document . getElementById ( 'hashedFile' ) . innerHTML =
70
70
'<h3>Hashed File :' + response . data + '</h3>' ;
71
-
71
+
72
72
} ) . then ( function ( response ) {
73
-
73
+
74
74
} ) . catch ( function ( error ) {
75
75
console . log ( error ) ;
76
76
} ) ;
@@ -83,8 +83,8 @@ <h1>Mango Sorter</h1>
83
83
// take snapshot and get image data
84
84
Webcam . snap ( function ( data_uri ) {
85
85
// display results in page
86
- document . getElementById ( 'results' ) . innerHTML =
87
- '<h2>Here is your image:</h2>' +
86
+ document . getElementById ( 'results' ) . innerHTML =
87
+ '<h2>Here is your image:</h2>' +
88
88
'<img src="' + data_uri + '"/>' ;
89
89
console . log ( data_uri ) ;
90
90
var noHeader = data_uri . replace ( / ^ d a t a : i m a g e \/ ( p n g | j p g | j p e g ) ; b a s e 6 4 , / , "" )
@@ -114,19 +114,19 @@ <h1>Mango Sorter</h1>
114
114
if ( temp . toString ( ) == 'red' ) {
115
115
console . log ( 'in website red' ) ;
116
116
redCount ++ ;
117
- document . getElementById ( 'detectedColor' ) . innerHTML =
117
+ document . getElementById ( 'detectedColor' ) . innerHTML =
118
118
'<h2>Color:Red</h2>' ;
119
119
console . log ( 'redCount' + redCount ) ;
120
120
} else if ( temp . toString ( ) == 'green' ) {
121
121
console . log ( 'in website green' )
122
122
greenCount ++ ;
123
- document . getElementById ( 'detectedColor' ) . innerHTML =
123
+ document . getElementById ( 'detectedColor' ) . innerHTML =
124
124
'<h2>Color:Green</h2>' ;
125
125
console . log ( 'greenCount' + greenCount ) ;
126
126
}
127
127
128
-
129
-
128
+
129
+
130
130
} ) . then ( function ( response ) {
131
131
132
132
@@ -148,33 +148,33 @@ <h1>Mango Sorter</h1>
148
148
149
149
150
150
// };
151
- e . open ( "POST" , "https://vision.googleapis.com/v1/images:annotate?key=AIzaSyAWMDKyl8B_CNEToy1fCwX8wh8LWLFf3_0 " , ! 0 ) ;
151
+ e . open ( "POST" , "https://vision.googleapis.com/v1/images:annotate?key=API_KEY_HERE " , ! 0 ) ;
152
152
e . send ( b )
153
-
153
+
154
154
155
155
156
156
// let request = {"requests":[{ "image":{ "content":noHeader}, "features": [{"type": "IMAGE_PROPERTIES"},]}] }
157
157
// console.log(request);
158
158
159
159
// axios.post('https://vision.googleapis.com/v1/images:annotate?key=AIzaSyAWMDKyl8B_CNEToy1fCwX8wh8LWLFf3_0', {
160
160
// b
161
-
161
+
162
162
// }).then(function (response) {
163
163
// console.log('inside success');
164
164
// console.log(response);
165
165
// }).catch(function (error) {
166
166
// console.log('inside error');
167
167
// console.log(error);
168
168
// });
169
-
170
-
169
+
170
+
171
171
172
172
173
173
174
174
175
175
} ) ;
176
176
}
177
177
</ script >
178
-
178
+
179
179
</ body >
180
- </ html >
180
+ </ html >
0 commit comments