* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* 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;
+var mainDB;
+
+var gMainCanvas, gMainContext;
var gColorPalette = [];
var gStartTime = 0;
var gCurrentImageData;
var gLastImageData;
function Startup() {
- var img = document.getElementById("mbrotImage");
- img.addEventListener("mouseup", imgEvHandler, false);
- img.addEventListener("mousedown", imgEvHandler, false);
- img.addEventListener("mousemove", imgEvHandler, false);
- img.addEventListener("touchstart", imgEvHandler, false);
- img.addEventListener("touchend", imgEvHandler, false);
- img.addEventListener("touchcancel", imgEvHandler, false);
- img.addEventListener("touchleave", imgEvHandler, false);
- img.addEventListener("touchmove", imgEvHandler, false);
+ initDB();
+
+ gMainCanvas = document.getElementById("mbrotImage");
+ gMainContext = gMainCanvas.getContext("2d");
+
+ gMainCanvas.addEventListener("mouseup", imgEvHandler, false);
+ gMainCanvas.addEventListener("mousedown", imgEvHandler, false);
+ gMainCanvas.addEventListener("mousemove", imgEvHandler, false);
+ gMainCanvas.addEventListener("touchstart", imgEvHandler, false);
+ gMainCanvas.addEventListener("touchend", imgEvHandler, false);
+ gMainCanvas.addEventListener("touchcancel", imgEvHandler, false);
+ gMainCanvas.addEventListener("touchleave", imgEvHandler, false);
+ gMainCanvas.addEventListener("touchmove", imgEvHandler, false);
+
+ var initTile = new Image();
+ initTile.src = "style/initial-overview.png";
+ gMainContext.drawImage(initTile, 0, 0);
+}
+
+function initDB() {
+ // Open DB.
+ var request = iDB.open("MainDB", 1);
+ request.onerror = function(event) {
+ // Errors can be handled here. Error codes explain in:
+ // https://developer.mozilla.org/en/IndexedDB/IDBDatabaseException#Constants
+ //document.getElementById("debug").textContent =
+ // "error opening mainDB: " + event.target.errorCode;
+ };
+ request.onsuccess = function(event) {
+ //document.getElementById("debug").textContent = "mainDB opened.";
+ mainDB = request.result;
+ };
+ request.onupgradeneeded = function(event) {
+ mainDB = request.result;
+ //document.getElementById("debug").textContent = "mainDB upgraded.";
+ // Create a "prefs" objectStore.
+ var prefsStore = mainDB.createObjectStore("prefs");
+ // Create a "bookmarks" objectStore.
+ var bmStore = mainDB.createObjectStore("bookmarks");
+ mainDB.onversionchange = function(event) {
+ mainDB.close();
+ mainDB = undefined;
+ initDB();
+ };
+ };
}
function getAdjustVal(aName) {
catch (e) { }
if ((value < 10) || (value > 5000)) {
value = 300;
+ gPrefs.set(prefname, value);
//document.getElementById(aName.replace(".", "_")).value = value;
}
return value;
(Cr_max < -3) || (Cr_max > 2) || (Cr_min >= Cr_max)) {
Cr_min = -2.0; Cr_max = 1.0;
}
+ gPrefs.set("Cr_min", Cr_min);
+ gPrefs.set("Cr_max", Cr_max);
document.getElementById("Cr_min").value = Cr_min;
document.getElementById("Cr_max").value = Cr_max;
return {Cr_min: Cr_min, Cr_max: Cr_max};
(Ci_max < -2.5) || (Ci_max > 2.5) || (Ci_min >= Ci_max)) {
Ci_min = -1.5; Ci_max = 1.5;
}
+ gPrefs.set("Ci_min", Ci_min);
+ gPrefs.set("Ci_max", Ci_max);
document.getElementById("Ci_min").value = Ci_min;
document.getElementById("Ci_max").value = Ci_max;
return {Ci_min: Ci_min, Ci_max: Ci_max};
value = document.getElementById("proportional").value;
}
catch(e) {
+ gPrefs.set(prefname, value);
document.getElementById("proportional").value = value;
}
return value;
switch (aName) {
case "image.width":
case "image.height":
+ gPrefs.set(aName, value);
document.getElementById(aName.replace(".", "_")).value = value;
break;
case "last_image.Cr_*":
+ gPrefs.set("Cr_min", Cr_min);
+ gPrefs.set("Cr_max", 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);
document.getElementById("Ci_min").value = aValue.Ci_min;
document.getElementById("Ci_max").value = aValue.Ci_max;
break;
setPalette(valueaValue);
break;
case "syncProportions":
+ gPrefs.set(aName, value);
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");
}
function drawImage() {
- var canvas = document.getElementById("mbrotImage");
- var context = canvas.getContext("2d");
+ var canvas = gMainCanvas;
+ var context = gMainContext;
document.getElementById("calcTime").textContent = "--";
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),
iterMax: iterMax
};
+ canvas.width = iWidth;
+ canvas.height = iHeight;
+
context.fillStyle = "rgba(255, 255, 255, 127)";
context.fillRect(0, 0, canvas.width, canvas.height);
}
function setIter(aIter) {
+ gPrefs.set("iteration_max", aIter);
document.getElementById("iterMax").value = aIter;
}
function setPalette(aPaletteID) {
+ gPrefs.set("color_palette", aPaletteID);
document.getElementById("palette").value = aPaletteID;
gColorPalette = getColorPalette(aPaletteID);
}
function setAlgorithm(algoID) {
+ gPrefs.set("use_algorithm", algoID);
//document.getElementById("algorithm").value = algoID;
}
+
+var gPrefs = {
+ objStore: "prefs",
+
+ get: function(aKey, aCallback) {
+ if (!mainDB)
+ return;
+ var transaction = mainDB.transaction([this.objStore]);
+ var request = transaction.objectStore(this.objStore).get(aKey);
+ request.onsuccess = function(event) {
+ aCallback(request.result, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ aCallback(undefined, event);
+ };
+ },
+
+ set: function(aKey, aValue, aCallback) {
+ if (!mainDB)
+ return;
+ var success = false;
+ var transaction = mainDB.transaction([this.objStore], "readwrite");
+ var objStore = transaction.objectStore(this.objStore);
+ var request = objStore.put(aValue, aKey);
+ request.onsuccess = function(event) {
+ success = true;
+ if (aCallback)
+ aCallback(success, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ if (aCallback)
+ aCallback(success, event);
+ };
+ },
+
+ unset: function(aKey, aCallback) {
+ if (!mainDB)
+ return;
+ var success = false;
+ var transaction = mainDB.transaction([this.objStore], "readwrite");
+ var request = transaction.objectStore(this.objStore).delete(aKey);
+ request.onsuccess = function(event) {
+ success = true;
+ if (aCallback)
+ aCallback(success, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ if (aCallback)
+ aCallback(success, event);
+ }
+ }
+};
+
+var gBMStore = {
+ objStore: "bookmarks",
+
+ getList: function(aCallback) {
+ if (!mainDB)
+ return;
+ var transaction = mainDB.transaction([this.objStore]);
+ var objStore = transaction.objectStore(this.objStore);
+ if (objStore.getAll) { // currently Mozilla-specific
+ objStore.getAll().onsuccess = function(event) {
+ aCallback(event.target.result);
+ };
+ }
+ else { // Use cursor (standard method).
+ var BMs = {};
+ objStore.openCursor().onsuccess = function(event) {
+ var cursor = event.target.result;
+ if (cursor) {
+ BMs[cursor.key] = cursor.value;
+ cursor.continue();
+ }
+ else {
+ aCallback(BMs);
+ }
+ };
+ }
+ },
+
+ get: function(aKey, aCallback) {
+ if (!mainDB)
+ return;
+ var transaction = mainDB.transaction([this.objStore]);
+ var request = transaction.objectStore(this.objStore).get(aKey);
+ request.onsuccess = function(event) {
+ aCallback(request.result, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ aCallback(undefined, event);
+ };
+ },
+
+ set: function(aKey, aValue, aCallback) {
+ if (!mainDB)
+ return;
+ var success = false;
+ var transaction = mainDB.transaction([this.objStore], "readwrite");
+ var objStore = transaction.objectStore(this.objStore);
+ var request = objStore.put(aValue, aKey);
+ request.onsuccess = function(event) {
+ success = true;
+ if (aCallback)
+ aCallback(success, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ if (aCallback)
+ aCallback(success, event);
+ };
+ },
+
+ unset: function(aKey, aCallback) {
+ if (!mainDB)
+ return;
+ var success = false;
+ var transaction = mainDB.transaction([this.objStore], "readwrite");
+ var request = transaction.objectStore(this.objStore).delete(aKey);
+ request.onsuccess = function(event) {
+ success = true;
+ if (aCallback)
+ aCallback(success, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ if (aCallback)
+ aCallback(success, event);
+ }
+ },
+
+ clear: function(aCallback) {
+ if (!mainDB)
+ return;
+ var success = false;
+ var transaction = mainDB.transaction([this.objStore], "readwrite");
+ var request = transaction.objectStore(this.objStore).clear();
+ request.onsuccess = function(event) {
+ success = true;
+ if (aCallback)
+ aCallback(success, event);
+ };
+ request.onerror = function(event) {
+ // Errors can be handled here.
+ if (aCallback)
+ aCallback(success, event);
+ }
+ }
+};