Changeset 29628 for other-projects/nz-flag-design
- Timestamp:
- 2014-12-15T09:33:58+13:00 (9 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
other-projects/nz-flag-design/trunk/similarity-2d/flag-processing.js
r29626 r29628 1 "use strict"; 1 2 2 3 var progressVal = 0; … … 4 5 var show_progress = 5; 5 6 6 var timeout_delay = 100; 7 var start_hist_delay = 4000; 8 var mini_delay = 300; 9 10 11 var hasLocalStorage = false; 12 var needToComputeHistograms = true; 13 var quantHSLHistogramArray; 14 7 15 8 16 function drawImage(imageObj, canvasId) { … … 29 37 } 30 38 31 imageData = drawImage(imageObj,'hsl_canvas');39 var imageData = drawImage(imageObj,'hsl_canvas'); 32 40 33 41 var outputLength = quant * quant * quant; … … 54 62 var y,p; 55 63 for (y=0,p=0; y<imageObj.height; y++) { 56 var x; 57 for (x=0; x<imageObj.width; x++,p+=4) { 64 // setTimeout(function() { 65 var x; 66 for (x=0; x<imageObj.width; x++,p+=4) { 58 67 // convert 4 byte data value into a colour pixel 59 68 var rgb_c = new RGBColour(data[p],data[p+1],data[p+2],data[p+3]/255.0); … … 78 87 //add the frequency of each colour to the histogram 79 88 outputArray[result] += count; 80 } 89 } 90 // },4); 81 91 } 82 92 … … 122 132 $progressArea.slideDown(); 123 133 } 134 135 img_list.sort(); 124 136 125 137 var root_img_re = /^.*\/(.*?)\..*?$/; … … 149 161 // Now move on and start computing colour histograms 150 162 setTimeout(function() 151 { computeFlagHistograms(img_list,$progressArea,$progressBar); }152 , timeout_delay);163 { doneDisplayFlags(img_list,$progressArea,$progressBar); } 164 ,start_hist_delay); 153 165 } 154 166 } 155 167 }; 156 168 157 imageObj.onclick = function() { 169 170 /* 171 $("h2").live('mousedown', function(e) { 172 if( (e.which == 1) ) { 173 alert("left button"); 174 }if( (e.which == 3) ) { 175 alert("right button"); 176 }else if( (e.which == 2) ) { 177 alert("middle button"); 178 } 179 e.preventDefault(); 180 }).live('contextmenu', function(e){ 181 e.preventDefault(); 182 }); 183 */ 184 185 186 187 imageObj.onclick = function(e) { 158 188 // Store result of HSL quantization in the image object/tag 159 189 if (!this.quantHSLHist) { … … 162 192 console.log(this.quantHSLHist); 163 193 } 164 flag_comparison_array[clicked_on_count] = this.quantHSLHist; 165 166 clicked_on_count++; 167 if (clicked_on_count==2) { 168 // trigger comparison 169 quantizedColourHistogramComparison(flag_comparison_array[0],flag_comparison_array[1]); 170 clicked_on_count=0; 171 } 194 195 if (e.which == 1 ) { 196 // Left => use in comparison pair 197 flag_comparison_array[clicked_on_count] = this.quantHSLHist; 198 199 clicked_on_count++; 200 if (clicked_on_count==2) { 201 // trigger comparison 202 quantizedColourHistogramComparison(flag_comparison_array[0],flag_comparison_array[1]); 203 clicked_on_count=0; 204 } 205 } 206 else if (e.which == 2) { 207 // Middle => fix on this and do similarity with everything else 208 var fix_id = this.id; 209 e.preventDefault(); 210 } 211 172 212 }; 173 213 … … 205 245 $progressArea,$progressBar) 206 246 } 207 , timeout_delay // any time delay causes break in 'rendering' thread, even 0!247 ,mini_delay // any time delay causes break in 'rendering' thread, even 0! 208 248 ); 209 249 … … 216 256 $progressArea.slideUp(); 217 257 } 218 } 219 } 258 259 doneComputingHistograms(img_list_len); 260 } 261 } 262 220 263 221 264 function computeFlagHistograms(img_list,$progressArea,$progressBar) … … 228 271 return; 229 272 } 273 230 274 231 275 $progressArea.find('span:first').text("Computing histograms:"); … … 244 288 $progressArea,$progressBar) 245 289 } 246 , timeout_delay // any time delay causes break in 'rendering' thread, even 0!290 ,mini_delay // any time delay causes break in 'rendering' thread, even 0! 247 291 ); 248 292 249 293 } 294 295 function doneComputingHistograms(img_list_len) 296 { 297 if (hasLocalStorage) { 298 // build up quantHSLHistogramArray from all the images 299 300 quantHSLHistogramArray = new Array(img_list_len); 301 var i; 302 for (i=0; i<img_list_len; i++) { 303 var flag_id = "flag-img-" + i; 304 var imageObj = document.getElementById(flag_id); 305 quantHSLHistogramArray[i] = imageObj.quantHSLHist; 306 } 307 308 console.log("Storing computed HSL histograms in localStorage"); 309 localStorage.quantHSLHistogramArray = JSON.stringify(quantHSLHistogramArray); 310 } 311 } 312 313 function doneDisplayFlags(img_list,$progressArea,$progressBar) 314 { 315 hasLocalStorage = false; 316 needToComputeHistograms = true; 317 318 if (typeof(Storage) !== "undefined") { 319 hasLocalStorage = true; 320 321 if (localStorage.quantHSLHistogramArray) { 322 323 console.log("Retrieving quantized HSL histograms"); 324 325 var stored_hist_array = JSON.parse(localStorage["quantHSLHistogramArray"]); 326 if (stored_hist_array.length == img_list.length) { 327 console.log("Different number of images detected => regenerating"); 328 329 // Assume if the number of images process hasn't changed, then neither 330 // has the stored historgram values 331 332 quantHSLHistogramArray = stored_hist_array; 333 334 var i; 335 for (i=0; i<img_list.length; i++) { 336 var flag_id = "flag-img-" + i; 337 var imageObj = document.getElementById(flag_id); 338 imageObj.quantHSLHist = quantHSLHistogramArray[i]; 339 } 340 341 342 needToComputeHistograms = false; 343 } 344 } 345 } 346 347 348 if (needToComputeHistograms) { 349 computeFlagHistograms(img_list,$progressArea,$progressBar); 350 } 351 else { 352 $progressArea.slideUp(); 353 doneComputingHistograms(img_list.length); 354 } 355 356 357 358 }
Note:
See TracChangeset
for help on using the changeset viewer.