1515</ head >
1616< body >
1717 < div id ="results "> </ div >
18-
18+
1919 < h1 > Mango Sorter</ h1 >
2020 <!-- <h3>Demonstrates simple 320x240 capture & display</h3> -->
21-
21+
2222 < div id ="my_camera "> </ div >
2323
24-
2524
26-
25+
26+
2727 <!-- First, include the Webcam.js JavaScript Library -->
2828 < script src ="https://cdnjs.cloudflare.com/ajax/libs/webcamjs/1.0.25/webcam.min.js "> </ script >
29-
29+
3030 <!-- Configure a few settings and attach camera -->
3131 < script language ="JavaScript ">
3232 Webcam . set ( {
@@ -37,7 +37,7 @@ <h1>Mango Sorter</h1>
3737 } ) ;
3838 Webcam . attach ( '#my_camera' ) ;
3939 </ script >
40-
40+
4141 <!-- A button for taking snaps -->
4242 < form >
4343 < input type =button value ="Take Snapshot " onClick ="take_snapshot() ">
@@ -50,7 +50,7 @@ <h1>Mango Sorter</h1>
5050 < hr >
5151 < div id ="detectedColor "> </ div >
5252 < div id ="hashedFile "> </ div >
53-
53+
5454 <!-- Code to handle taking the snapshot and displaying it locally -->
5555 < script language ="JavaScript ">
5656
@@ -66,11 +66,11 @@ <h1>Mango Sorter</h1>
6666 axios . get ( urlQuery ) . then ( function ( response ) {
6767
6868 console . log ( response . data ) ;
69- document . getElementById ( 'hashedFile' ) . innerHTML =
69+ document . getElementById ( 'hashedFile' ) . innerHTML =
7070 '<h3>Hashed File :' + response . data + '</h3>' ;
71-
71+
7272 } ) . then ( function ( response ) {
73-
73+
7474 } ) . catch ( function ( error ) {
7575 console . log ( error ) ;
7676 } ) ;
@@ -83,8 +83,8 @@ <h1>Mango Sorter</h1>
8383 // take snapshot and get image data
8484 Webcam . snap ( function ( data_uri ) {
8585 // 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>' +
8888 '<img src="' + data_uri + '"/>' ;
8989 console . log ( data_uri ) ;
9090 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>
114114 if ( temp . toString ( ) == 'red' ) {
115115 console . log ( 'in website red' ) ;
116116 redCount ++ ;
117- document . getElementById ( 'detectedColor' ) . innerHTML =
117+ document . getElementById ( 'detectedColor' ) . innerHTML =
118118 '<h2>Color:Red</h2>' ;
119119 console . log ( 'redCount' + redCount ) ;
120120 } else if ( temp . toString ( ) == 'green' ) {
121121 console . log ( 'in website green' )
122122 greenCount ++ ;
123- document . getElementById ( 'detectedColor' ) . innerHTML =
123+ document . getElementById ( 'detectedColor' ) . innerHTML =
124124 '<h2>Color:Green</h2>' ;
125125 console . log ( 'greenCount' + greenCount ) ;
126126 }
127127
128-
129-
128+
129+
130130 } ) . then ( function ( response ) {
131131
132132
@@ -148,33 +148,33 @@ <h1>Mango Sorter</h1>
148148
149149
150150 // };
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 ) ;
152152 e . send ( b )
153-
153+
154154
155155
156156 // let request = {"requests":[{ "image":{ "content":noHeader}, "features": [{"type": "IMAGE_PROPERTIES"},]}] }
157157 // console.log(request);
158158
159159 // axios.post('https://vision.googleapis.com/v1/images:annotate?key=AIzaSyAWMDKyl8B_CNEToy1fCwX8wh8LWLFf3_0', {
160160 // b
161-
161+
162162 // }).then(function (response) {
163163 // console.log('inside success');
164164 // console.log(response);
165165 // }).catch(function (error) {
166166 // console.log('inside error');
167167 // console.log(error);
168168 // });
169-
170-
169+
170+
171171
172172
173173
174174
175175 } ) ;
176176 }
177177 </ script >
178-
178+
179179</ body >
180- </ html >
180+ </ html >
0 commit comments