Changeset 29787 for other-projects/nz-flag-design/trunk/main-form

Timestamp:

2015-03-17T00:27:22+13:00 (9 years ago)

Author:

davidb

Message:

Changes to support storing on the server side of the HSV histogram calculations

Location:

other-projects/nz-flag-design/trunk/main-form

Files:

• choose-canvas.html (modified) (6 diffs)
• choose-palette.html (modified) (3 diffs)
• enter-name.html (modified) (2 diffs)

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

@@ -74 +74 @@
         $.getJSON( "../similarity-2d/flag-aspect-ratios-json.jsp", function( data ) {
 
-            var scale_to_y_dim = 130;
+
+            //var scale_to_y_dim = 130;
+
+            // express scale_to_y_dim to use relative to height of window
+
+            var la_y_dim = $(window).height() - $('#aspect-ratio-div').position().top;
+            var scale_to_y_dim = la_y_dim/4;
+
+            //alert("scale_to_y_dim = " + scale_to_y_dim);
 
             var items = [];
@@ -131 +139 @@
                 p--;
               }
-/*
-              var nz_prioritized_flags = ratio_table.flags.sort( function (a, b) {
-                var a_title = a.replace(/^.*\//,"").replace(/\.(.*?)$/,"");
-                if (a_title == "nz") { 
-                  return -1;
-                }
-                else {
-                  return 0;
-                }
-              });
-*/
 
               $.each(nz_prioritized_flags, function(index, flag_filename) {                
@@ -174 +171 @@
 
           $('#aspect-ratio-div').append("<div class='centredDiv' style='width: 100%'>"+items.join("\n")+"</div>");
+
+
+          // now change the flag tooltip labels into their country names
+          $.getJSON( "../similarity-2d/iso-3166-keyed-by-alpha-2-countrycodes.json", function( data ) {
+
+          });
+
         });
       });
@@ -202 +206 @@
       <h2>Canvas Size</h2>          
       
-        <div class="dialog" id="dialog" title="Ratio Select Dialog" width="800px">
+        <div class="dialog" id="dialog" title="Flat Aspect Ratio Selection Panel" widthXX="800px">
             <br><br>
             <h2>Please choose from the following aspect ratios.</h2>
@@ -257 +261 @@
             }                               
             }
+
+
         </script>
         
@@ -264 +270 @@
     
       </div><!-- /content -->
+
+<!-- make persistent?
+      <div data-role="footer" style="width:100%;">
+    COSI: Centre of Open Source Innovation @ The University of Waikato.
+      </div>
+-->
       
     </div><!-- /page -->

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

@@ -35 +35 @@
       <span class="left story-icon research" ></span>
       <h2>Choose Colour Palette</h2>
-      <div>
-        <h3 style="font-size: large; position: relative; display: inline-block;">
+
+          <div class="dialog" id="dialog" title="Colour Palette Selection Panel" widthXX="800px">
+        <h2 style="position: relative; display: inline-block;">
           Click on a palette circle to select it, and change its colour using the colour picker to the right
-        </h3>
-        
+        </h2>       
         <a style="font-size: medium; padding-left: 10px;" 
            href="http://www.netstate.com/states/symb/flags/flag_design_principles.htm" target="_blank">
@@ -98 +98 @@
 
     console.log("ActivateColourPalette()");
+
+    // Page not shown yet, so the y-position of <svg> is still 0
+    // => make height purely a percentage of height
+        var la_y_dim = $(window).height();
+        var svg_y_dim = 0.5 * la_y_dim;
+    $('#svg-palette').css("height",svg_y_dim+"px");
 
         // init state-keeping variables
@@ -227 +233 @@
       return false;
     }
+
+
+    $(window).resize(function() {
+        console.log("choose-palette resize()");
+        console.log("position top = " + $('#svg-palette').position().top);
+        console.log("offset top = " + $('#svg-palette').offset().top);
+
+        var la_y_dim = $(window).height() - $('#svg-palette').offset().top;
+        var svg_y_dim = 0.65 * la_y_dim;
+    $('#svg-palette').css("height",svg_y_dim+"px");                    
+    });
 
 

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

@@ -25 +25 @@
         </div>  
       
-    <a target="_parent" href="../index.html" class="back-button back-left"></a>   
+<!--
+    <a target="_parent" href="../index.html" class="back-button back-left"></a>
+-->
       
     <div class="story-page">
@@ -31 +33 @@
       <!-- put custom content here -->    
       <div class="story-title">
-        <h1 id="enter-name-header" class="center">Enter Name</h1>
+        <h1 id="enter-name-header" class="center">Contact Details</h1>
 <!--
         <p class="center">- - xx </p>
 -->
-        <p>
-          Your Name: 
-        </p>
-        <form>
-          <input type="text" autofocus="autofocus" style="color: white;" />
+            <style>
+          input {
+            color: white;
+          }
+            </style>
+        <form style="width: 400px; margin-left:auto; margin-right:auto;">
+          <p>
+        Your Name: 
+          </p>
+          <input type="text" autofocus="autofocus" style="color: white;" name="name" />
+
+          <p>
+        Contact email: 
+          </p>
+          <input type="text" name="email" />
+
+
+          <div style="padding-top: 120px; padding-left: 100px; padding-right: 100px">
+        <input type="submit" value="Submit Flag Design" />
+          </div>
         </form>
       </div>