Changeset 29809

Timestamp:

2015-03-23T10:39:09+13:00 (9 years ago)

Author:

davidb

Message:

Better computing info displayed

File:

• other-projects/nz-flag-design/trunk/main-form/iterative-design.html (modified) (1 diff)

other-projects/nz-flag-design/trunk/main-form/iterative-design.html

@@ -200 +200 @@
 
         function rankFlags() {
-          // First compute colour histogram for user drawn flag
-          var imageCanvas = document.getElementById('export_canvas');
-          var context = imageCanvas.getContext('2d');
-          var imageData = context.getImageData(0,0, imageCanvas.width, imageCanvas.height);
-
-          var outputArray = createHSLHistogramFromCanvasData(imageData,imageCanvas.width,imageCanvas.height,16);
-
-          // Now compare this colour histogram with the stored ones, updating the progress bar as we go
-
+          console.log("rankFlags()");
+
+          // Get a message up on the screen to the similarity calculation is on its way
           var $iframe = $('#similarity-2d-iframe').contents();
 
           var $flagArea     = $iframe.find('#flagArea');
           var $progressArea = $iframe.find('#progressArea');
+
+              $progressArea.find('span:first').text("Comparing new flag with existing flags from around the world");
+              $progressArea.slideDown();
                   var $progressBar  = $iframe.find('#progressBar');
 
-              $progressArea.find('span:first').text("Calculating flag similarity");
-              $progressArea.slideDown();
-
-          calcSimilarityValues(outputArray, $flagArea,$progressArea,$progressBar);
+
+          setTimeout(function() {
+            // Compute colour histogram for user drawn flag
+            var imageCanvas = document.getElementById('export_canvas');
+            var context = imageCanvas.getContext('2d');
+            var imageData = context.getImageData(0,0, imageCanvas.width, imageCanvas.height);
+
+            var outputArray = createHSLHistogramFromCanvasData(imageData,imageCanvas.width,imageCanvas.height,16);
+
+            // Now compare this colour histogram with the stored ones, updating the progress bar as we go
+
+
+            calcSimilarityValues(outputArray, $flagArea,$progressArea,$progressBar);
           
-          // And finally reorder them based on this
-          sortFlagsBySimilarityValue($iframe)
-
-              $progressArea.slideUp();
+            // And finally reorder them based on this
+            sortFlagsBySimilarityValue($iframe)
+
+                $progressArea.slideUp();
+          }, 500);
         }