added reset method to the enhance object, plus some comments

This commit is contained in:
Bala Clark 2010-07-15 10:59:27 +00:00
parent fa74081960
commit 06d60c72c6

View file

@ -39,7 +39,7 @@ function merge(a, b) {
function ComicBook(id, srcs, opts) { 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 this.srcs = srcs; // array of image srcs for pages
var defaults = { var defaults = {
@ -85,6 +85,22 @@ function ComicBook(id, srcs, opts) {
return (x <= canvas.width / 2) ? 'left' : 'right'; 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 {String} id The canvas ID to draw the comic on.
* @param {Object} srcs An array of all the comic page srcs, in order * @param {Object} srcs An array of all the comic page srcs, in order
@ -92,16 +108,11 @@ function ComicBook(id, srcs, opts) {
*/ */
ComicBook.prototype.draw = function () { ComicBook.prototype.draw = function () {
// setup canvas init();
canvas = document.getElementById(this.id);
context = canvas.getContext("2d");
// preload images if needed // preload images if needed
if (pages.length !== no_pages) { this.preload(this.srcs); } if (pages.length !== no_pages) { this.preload(this.srcs); }
else { this.drawPage(); } 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.overflowX = (canvas_width < window.innerWidth) ? "hidden" : "auto";
document.body.style.overflowY = (canvas_height < window.innerHeight) ? "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") { if (canvas_width < window.innerWidth && options.zoomMode === "manual") {
offsetW = (window.innerWidth - page_width) / 2; offsetW = (window.innerWidth - page_width) / 2;
if (options.displayMode === "double") { offsetW = offsetW - 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/ * 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? * TODO: abstract this into an "Enhance" object, separate from ComicBook?
*/ */
ComicBook.prototype.enhance = { 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) { brightness: function (options) {
// merge user options with defaults // merge user options with defaults
@ -311,13 +334,27 @@ function ComicBook(id, srcs, opts) {
contrast: options.contrast, contrast: options.contrast,
legacy: true legacy: true
}); });
init();
}, },
/**
* Force black and white
*/
desaturate: function () { desaturate: function () {
enhancements.desaturate = {}; enhancements.desaturate = {};
Pixastic.process(canvas, "desaturate", { average : false }); Pixastic.process(canvas, "desaturate", { average : false });
init();
}, },
/**
* Sharpen
*
* options:
* amount: number (-1 to infinity)
*
* @param {Object} options
*/
sharpen: function (options) { sharpen: function (options) {
var options = merge({ amount: 0 }, options); var options = merge({ amount: 0 }, options);
@ -325,6 +362,8 @@ function ComicBook(id, srcs, opts) {
Pixastic.process(canvas, "sharpen", { Pixastic.process(canvas, "sharpen", {
amount: options.amount amount: options.amount
}); });
init();
} }
}; };