do more correct indexedDB access
[mandelbrot-web.git] / js / mandelbrot.js
index 3278e70d6687549c6334474e6c40a081e7bf0230..dc86f870bcf3bac7b364468a7696ee693ba24efc 100644 (file)
@@ -3,7 +3,7 @@
  * You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 // Get the best-available indexedDB object.
-var iDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
+window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
 var mainDB;
 
 var gMainCanvas, gMainContext;
@@ -29,12 +29,12 @@ function Startup() {
 
   var initTile = new Image();
   initTile.src = "style/initial-overview.png";
-  gMainContext.drawImage(initTile, 0, 0);
+  initTile.onload = function() { gMainContext.drawImage(initTile, 0, 0); };
 }
 
 function initDB() {
   // Open DB.
-  var request = iDB.open("MainDB", 1);
+  var request = window.indexedDB.open("MainDB", 1);
   request.onerror = function(event) {
     // Errors can be handled here. Error codes explain in:
     // https://developer.mozilla.org/en/IndexedDB/IDBDatabaseException#Constants
@@ -72,8 +72,8 @@ function getAdjustVal(aName) {
       catch (e) { }
       if ((value < 10) || (value > 5000)) {
         value = 300;
-        gPrefs.set(prefname, value);
-        //document.getElementById(aName.replace(".", "_")).value = value;
+        gPrefs.set(aName, value);
+        document.getElementById(aName.replace(".", "_")).value = value;
       }
       return value;
     case "last_image.Cr_*":
@@ -160,18 +160,18 @@ function setVal(aName, aValue) {
   switch (aName) {
     case "image.width":
     case "image.height":
-      gPrefs.set(aName, value);
-      document.getElementById(aName.replace(".", "_")).value = value;
+      gPrefs.set(aName, aValue);
+      document.getElementById(aName.replace(".", "_")).value = aValue;
       break;
     case "last_image.Cr_*":
-      gPrefs.set("Cr_min", Cr_min);
-      gPrefs.set("Cr_max", Cr_max);
+      gPrefs.set("Cr_min", aValue.Cr_min);
+      gPrefs.set("Cr_max", aValue.Cr_max);
       document.getElementById("Cr_min").value = aValue.Cr_min;
       document.getElementById("Cr_max").value = aValue.Cr_max;
       break;
     case "last_image.Ci_*":
-      gPrefs.set("Ci_min", Ci_min);
-      gPrefs.set("Ci_max", Ci_max);
+      gPrefs.set("Ci_min", aValue.Ci_min);
+      gPrefs.set("Ci_max", aValue.Ci_max);
       document.getElementById("Ci_min").value = aValue.Ci_min;
       document.getElementById("Ci_max").value = aValue.Ci_max;
       break;
@@ -182,15 +182,65 @@ function setVal(aName, aValue) {
       setAlgorithm(aValue);
       break;
    case "color_palette":
-      setPalette(valueaValue);
+      setPalette(aValue);
       break;
    case "syncProportions":
-      gPrefs.set(aName, value);
+      gPrefs.set(aName, aValue);
       document.getElementById("proportional").value = aValue;
       break;
   }
 }
 
+function checkISValue(textbox, type) {
+  if (type == "coord") {
+    textbox.value = roundCoord(parseFloat(textbox.value));
+  }
+  else if (type == "dim") {
+    textbox.value = parseInt(textbox.value);
+  }
+}
+
+function recalcCoord(coord, target) {
+  var othercoord = (coord == "Ci") ? "Cr" : "Ci";
+  var owndim = (coord == "Ci") ? "height" : "width";
+  var otherdim = (coord == "Ci") ? "width" : "height";
+  var myscale;
+  if (target == "scale") {
+    myscale =
+      parseFloat(document.getElementById(coord + "_max").value) -
+      parseFloat(document.getElementById(coord + "_min").value);
+    document.getElementById(coord + "_scale").value = roundCoord(myscale);
+  }
+  else if (target == 'max') {
+    var mymax =
+      parseFloat(document.getElementById(coord + "_min").value) +
+      parseFloat(document.getElementById(coord + "_scale").value);
+    document.getElementById(coord + "_max").value = roundCoord(mymax);
+    myscale = document.getElementById(coord + "_scale").value;
+  }
+  if (document.getElementById("proportional").checked) {
+    var otherscale = myscale *
+      document.getElementById("image_" + otherdim).value /
+      document.getElementById("image_" + owndim).value;
+    document.getElementById(othercoord + "_scale").value = roundCoord(otherscale);
+    var othermax =
+      parseFloat(document.getElementById(othercoord + "_min").value) +
+      parseFloat(document.getElementById(othercoord + "_scale").value);
+    document.getElementById(othercoord + "_max").value = roundCoord(othermax);
+  }
+}
+
+function checkProportions() {
+  if (!document.getElementById("proportional").checked) {
+    recalcCoord("Cr", "scale");
+  }
+}
+
+function roundCoord(floatval) {
+  // We should round to 10 decimals here or so
+  return parseFloat(floatval.toFixed(10));
+}
+
 function adjustCoordsAndDraw(aC_min, aC_max) {
   var iWidth = getAdjustVal("image.width");
   var iHeight = getAdjustVal("image.height");
@@ -249,16 +299,8 @@ function drawImage() {
   var iterMax = getAdjustVal("iteration_max");
   var algorithm = getAdjustVal("use_algorithm");
 
-  var iWidth = canvas.width;
-  if ((iWidth < 10) || (iWidth > 5000)) {
-    iWidth = 300;
-    canvas.width = iWidth;
-  }
-  var iHeight = canvas.height;
-  if ((iHeight < 10) || (iHeight > 5000)) {
-    iHeight = 300;
-    canvas.height = iHeight;
-  }
+  var iWidth = getAdjustVal("image.width");
+  var iHeight = getAdjustVal("image.height");
 
   gCurrentImageData = {
     C_min: new complex(Cr_min, Ci_min),
@@ -268,6 +310,9 @@ function drawImage() {
     iterMax: iterMax
   };
 
+  canvas.width = iWidth;
+  canvas.height = iHeight;
+
   context.fillStyle = "rgba(255, 255, 255, 127)";
   context.fillRect(0, 0, canvas.width, canvas.height);