added reset method to the enhance object, plus some comments

lib/ComicBook.js

@@ -39,7 +39,7 @@ function merge(a, b) {
 
 function ComicBook(id, srcs, opts) {
 
-	this.id = id;		// canvas element id
+	var canvas_id = id;		// canvas element id
 	this.srcs = srcs;	// array of image srcs for pages
 
 	var defaults = {
@@ -84,24 +84,35 @@ function ComicBook(id, srcs, opts) {
 		// check if the user clicked on the left or right side
 		return (x <= canvas.width / 2) ? 'left' : 'right';
 	}
+	
+	/**
+	 * Setup the canvas element for use throughout the class.
+	 * 
+	 * @see #ComicBook.prototype.draw
+	 * @see #ComicBook.prototype.enhance
+	 */
+	function init() {
+	
+		// setup canvas
+		canvas = document.getElementById(canvas_id);
+		context = canvas.getContext("2d");
 
+		// add page controls
+		canvas.addEventListener("click", ComicBook.prototype.navigation, false);
+	};
+	
 	/* 
 	 * @param {String} id The canvas ID to draw the comic on.
 	 * @param {Object} srcs An array of all the comic page srcs, in order
 	 * @see #preload
 	 */
 	ComicBook.prototype.draw = function () {
-	
+		
-		// setup canvas
+		init();
-		canvas = document.getElementById(this.id);
+		
-		context = canvas.getContext("2d");
-
 		// preload images if needed
 		if (pages.length !== no_pages) { this.preload(this.srcs); }
 		else { this.drawPage(); }
-
-		// add page controls
-		canvas.addEventListener("click", ComicBook.prototype.navigation, false);
 	};
 
 	/*
@@ -229,7 +240,7 @@ function ComicBook(id, srcs, opts) {
 		document.body.style.overflowX = (canvas_width < window.innerWidth) ? "hidden" : "auto";
 		document.body.style.overflowY = (canvas_height < window.innerHeight) ? "hidden" : "auto";
 		
-		// work out a horizonal position that will keep the pages always centred
+		// work out a horizontal position that will keep the pages always centred
 		if (canvas_width < window.innerWidth && options.zoomMode === "manual") {
 			offsetW = (window.innerWidth - page_width) / 2;
 			if (options.displayMode === "double") { offsetW = offsetW - page_width / 2; }
@@ -287,16 +298,28 @@ function ComicBook(id, srcs, opts) {
 	 * 
 	 * Powered by the awesome Pixastic: http://www.pixastic.com/
 	 * 
-	 * FIXME: page navigation breaks after enhancements are applied
+	 * TODO: reset & apply all image enhancements each time before applying new one
-	 * TODO: reset()
-	 * TODO: allow multiple effects at once
-	 * 
 	 * TODO: abstract this into an "Enhance" object, separate from ComicBook?
 	 */
 	ComicBook.prototype.enhance = {
 		
-		reset: function () {},
+		/**
+		 * Render the page with no enhancements
+		 */
+		reset: function () {
+			enhancements = {};
+			ComicBook.prototype.drawPage();
+		},
 		
+		/**
+		 * Adjust brightness / contrast
+		 * 
+		 * options
+		 *    brightness (int) -150 to 150
+		 *    contrast: (float) -1 to infinity
+		 * 
+		 * @param {Object} options
+		 */
 		brightness: function (options) {
 			
 			// merge user options with defaults
@@ -311,13 +334,27 @@ function ComicBook(id, srcs, opts) {
 				contrast: options.contrast,
 				legacy: true
 			});
+			
+			init();
 		},
 		
+		/**
+		 * Force black and white
+		 */
 		desaturate: function () {
 			enhancements.desaturate = {};
 			Pixastic.process(canvas, "desaturate", { average : false });
+			init();
 		},
 		
+		/**
+		 * Sharpen
+		 * 
+		 * options:
+		 *   amount: number (-1 to infinity)
+		 * 
+		 * @param {Object} options 
+		 */
 		sharpen: function (options) {
 			
 			var options = merge({ amount: 0 }, options);
@@ -325,6 +362,8 @@ function ComicBook(id, srcs, opts) {
 			Pixastic.process(canvas, "sharpen", {
 				amount: options.amount
 			});
+			
+			init();
 		}
 	};