diff --git a/lib/.jshintrc b/lib/.jshintrc index 5ccc159..e310d21 100644 --- a/lib/.jshintrc +++ b/lib/.jshintrc @@ -15,7 +15,7 @@ "curly": true, "browser": true, "maxerr": 50, - "quotmark": "double", + "quotmark": "single", "trailing": false, "indent": 2 } diff --git a/lib/ComicBook.js b/lib/ComicBook.js index 8677575..7f086fd 100755 --- a/lib/ComicBook.js +++ b/lib/ComicBook.js @@ -20,14 +20,14 @@ - thumbnail browser - refactor so we are not using all these loose shared variables and other nastyness - use custom event emitters instead of hacky code - - properly bind "this" so we don't have to keep using "self" + - properly bind 'this' so we don't have to keep using 'self' - allow toolbar to be sticky - unit test / integrate with travis CI */ var ComicBook = (function ($) { - "use strict"; + 'use strict'; /** * Merge two arrays. Any properties in b will replace the same properties in @@ -40,7 +40,7 @@ var ComicBook = (function ($) { var prop; - if (typeof b === "undefined") { b = {}; } + if (typeof b === 'undefined') { b = {}; } for (prop in a) { if (a.hasOwnProperty(prop)) { @@ -60,12 +60,12 @@ var ComicBook = (function ($) { * @returns {ComicBookException} */ var ComicBookException = { - INVALID_ACTION: "invalid action", - INVALID_PAGE: "invalid page", - INVALID_PAGE_TYPE: "invalid page type", - UNDEFINED_CONTROL: "undefined control", - INVALID_ZOOM_MODE: "invalid zoom mode", - INVALID_NAVIGATION_EVENT: "invalid navigation event" + INVALID_ACTION: 'invalid action', + INVALID_PAGE: 'invalid page', + INVALID_PAGE_TYPE: 'invalid page type', + UNDEFINED_CONTROL: 'undefined control', + INVALID_ZOOM_MODE: 'invalid zoom mode', + INVALID_NAVIGATION_EVENT: 'invalid navigation event' }; function ComicBook(id, srcs, opts) { @@ -75,8 +75,8 @@ var ComicBook = (function ($) { this.srcs = srcs; // array of image srcs for pages var defaults = { - displayMode: "double", // single / double - zoomMode: "fitWidth", // manual / fitWidth + displayMode: 'double', // single / double + zoomMode: 'fitWidth', // manual / fitWidth manga: false, // true / false enhance: {}, keyboard: { @@ -85,7 +85,7 @@ var ComicBook = (function ($) { toolbar: 84, toggleLayout: 76 }, - libPath: "/lib/" + libPath: '/lib/' }; var options = merge(defaults, opts); // options array for internal use @@ -109,16 +109,16 @@ var ComicBook = (function ($) { var height = window.innerHeight + 1; if (shiv === false) { - shiv = $(document.createElement("div")) - .attr("id", "cb-width-shiv") + shiv = $(document.createElement('div')) + .attr('id', 'cb-width-shiv') .css({ - width: "100%", - position: "absolute", + width: '100%', + position: 'absolute', top: 0, - zIndex: "-1000" + zIndex: '-1000' }); - $("body").append(shiv); + $('body').append(shiv); } shiv.height(height); @@ -168,7 +168,7 @@ var ComicBook = (function ($) { // setup canvas canvas = document.getElementById(canvas_id); - context = canvas.getContext("2d"); + context = canvas.getContext('2d'); // render user controls if (controlsRendered === false) { @@ -177,8 +177,8 @@ var ComicBook = (function ($) { } // add page controls - window.addEventListener("keydown", self.navigation, false); - window.addEventListener("hashchange", checkHash, false); + window.addEventListener('keydown', self.navigation, false); + window.addEventListener('hashchange', checkHash, false); } /** @@ -195,14 +195,14 @@ var ComicBook = (function ($) { controls[name] = $template; // add event listeners to controls that specify callbacks - $template.find("*").andSelf().filter("[data-action][data-trigger]").each(function () { + $template.find('*').andSelf().filter('[data-action][data-trigger]').each(function () { var $this = $(this); - var trigger = $this.data("trigger"); - var action = $this.data("action"); + var trigger = $this.data('trigger'); + var action = $this.data('action'); // trigger a direct method if exists - if (typeof self[$this.data("action")] === "function") { + if (typeof self[$this.data('action')] === 'function') { $this.on(trigger, self[action]); } @@ -219,28 +219,28 @@ var ComicBook = (function ($) { }; ComicBook.prototype.getControl = function(control) { - if (typeof this.controls[control] !== "object") { - throw ComicBookException.UNDEFINED_CONTROL + " " + control; + if (typeof this.controls[control] !== 'object') { + throw ComicBookException.UNDEFINED_CONTROL + ' ' + control; } return this.controls[control]; }; ComicBook.prototype.showControl = function(control) { - this.getControl(control).show().addClass("open"); + this.getControl(control).show().addClass('open'); }; ComicBook.prototype.hideControl = function(control) { - this.getControl(control).removeClass("open").hide(); + this.getControl(control).removeClass('open').hide(); }; ComicBook.prototype.toggleControl = function(control) { - this.getControl(control).toggle().toggleClass("open"); + this.getControl(control).toggle().toggleClass('open'); }; ComicBook.prototype.toggleLayout = function() { - var $control = self.getControl("toolbar").find("[data-action=toggleLayout]"); - var displayMode = (options.displayMode === "single") ? "double" : "single"; + var $control = self.getControl('toolbar').find('[data-action=toggleLayout]'); + var displayMode = (options.displayMode === 'single') ? 'double' : 'single'; $control.removeClass(options.displayMode); $control.addClass(displayMode); @@ -258,14 +258,14 @@ var ComicBook = (function ($) { ComicBook.prototype.getPage = function(i) { if (i < 0 || i > srcs.length-1) { - throw ComicBookException.INVALID_PAGE + " " + i; + throw ComicBookException.INVALID_PAGE + ' ' + i; } - if (typeof pages[i] === "object") { + if (typeof pages[i] === 'object') { return pages[i]; } else { page_requested = i; - this.showControl("loadingOverlay"); + this.showControl('loadingOverlay'); } }; @@ -277,8 +277,8 @@ var ComicBook = (function ($) { init(); // resize navigation controls - $(".navigate").outerHeight(window.innerHeight); - $("#cb-loading-overlay").outerWidth(windowWidth()).height(window.innerHeight); + $('.navigate').outerHeight(window.innerHeight); + $('#cb-loading-overlay').outerWidth(windowWidth()).height(window.innerHeight); // preload images if needed if (pages.length !== no_pages) { @@ -294,9 +294,9 @@ var ComicBook = (function ($) { * @param new_scale {Number} Scale the canvas to this ratio */ ComicBook.prototype.zoom = function (new_scale) { - options.zoomMode = "manual"; + options.zoomMode = 'manual'; scale = new_scale; - if (typeof this.getPage(pointer) === "object") { this.drawPage(); } + if (typeof this.getPage(pointer) === 'object') { this.drawPage(); } }; ComicBook.prototype.zoomIn = function () { @@ -308,7 +308,7 @@ var ComicBook = (function ($) { }; ComicBook.prototype.fitWidth = function () { - options.zoomMode = "fitWidth"; + options.zoomMode = 'fitWidth'; ComicBook.prototype.drawPage(); }; @@ -323,7 +323,7 @@ var ComicBook = (function ($) { var rendered = false; var queue = []; - this.showControl("loadingOverlay"); + this.showControl('loadingOverlay'); function loadImage(i) { @@ -335,23 +335,23 @@ var ComicBook = (function ($) { pages[i] = this; loaded.push(i); - $("#cb-progress-bar .progressbar-value").css("width", Math.floor((loaded.length / no_pages) * 100) + "%"); + $('#cb-progress-bar .progressbar-value').css('width', Math.floor((loaded.length / no_pages) * 100) + '%'); // double page mode needs an extra page added - var buffer = (options.displayMode === "double" && pointer < srcs.length-1) ? 1 : 0; + var buffer = (options.displayMode === 'double' && pointer < srcs.length-1) ? 1 : 0; // start rendering the comic when the requested page is ready if ((rendered === false && ($.inArray(pointer + buffer, loaded) !== -1) || - (typeof page_requested === "number" && $.inArray(page_requested, loaded) !== -1)) + (typeof page_requested === 'number' && $.inArray(page_requested, loaded) !== -1)) ) { // if the user is waiting for a page to be loaded, render that one instead of the default pointer - if (typeof page_requested === "number") { + if (typeof page_requested === 'number') { pointer = page_requested-1; page_requested = false; } self.drawPage(); - self.hideControl("loadingOverlay"); + self.hideControl('loadingOverlay'); rendered = true; } @@ -359,7 +359,7 @@ var ComicBook = (function ($) { loadImage(queue[0]); queue.splice(0,1); } else { - $("#cb-status").delay(500).fadeOut(); + $('#cb-status').delay(500).fadeOut(); } }; } @@ -400,7 +400,7 @@ var ComicBook = (function ($) { }; ComicBook.prototype.pageLoaded = function (page_no) { - return (typeof loaded[page_no-1] !== "undefined"); + return (typeof loaded[page_no-1] !== 'undefined'); }; /** @@ -410,14 +410,14 @@ var ComicBook = (function ($) { var scrollY; - reset_scroll = (typeof reset_scroll !== "undefined") ? reset_scroll : true; + reset_scroll = (typeof reset_scroll !== 'undefined') ? reset_scroll : true; scrollY = reset_scroll ? 0 : window.scrollY; // if a specific page is given try to render it, if not bail and wait for preload() to render it - if (typeof page_no === "number" && page_no < srcs.length && page_no > 0) { + if (typeof page_no === 'number' && page_no < srcs.length && page_no > 0) { pointer = page_no-1; if (!this.pageLoaded(page_no)) { - this.showControl("loadingOverlay"); + this.showControl('loadingOverlay'); return; } } @@ -430,12 +430,12 @@ var ComicBook = (function ($) { var page = self.getPage(pointer); var page2 = false; - if (options.displayMode === "double" && pointer < srcs.length-1) { + if (options.displayMode === 'double' && pointer < srcs.length-1) { page2 = self.getPage(pointer + 1); } - if (typeof page !== "object") { - throw ComicBookException.INVALID_PAGE_TYPE + " " + typeof page; + if (typeof page !== 'object') { + throw ComicBookException.INVALID_PAGE_TYPE + ' ' + typeof page; } var width = page.width; @@ -446,16 +446,16 @@ var ComicBook = (function ($) { // show double page spreads on a single page is_double_page_spread = ( - typeof page2 === "object" && + typeof page2 === 'object' && (page.width > page.height || page2.width > page2.height) && - options.displayMode === "double" + options.displayMode === 'double' ); - if (is_double_page_spread) { options.displayMode = "single"; } + if (is_double_page_spread) { options.displayMode = 'single'; } - if (options.displayMode === "double") { + if (options.displayMode === 'double') { // for double page spreads, factor in the width of both pages - if (typeof page2 === "object") { width += page2.width; } + if (typeof page2 === 'object') { width += page2.width; } // if this is the last page and there is no page2, still keep the canvas wide else { width += width; } @@ -464,13 +464,13 @@ var ComicBook = (function ($) { // update the page scale if a non manual mode has been chosen switch (options.zoomMode) { - case "manual": - document.body.style.overflowX = "auto"; - zoom_scale = (options.displayMode === "double") ? scale * 2 : scale; + case 'manual': + document.body.style.overflowX = 'auto'; + zoom_scale = (options.displayMode === 'double') ? scale * 2 : scale; break; - case "fitWidth": - document.body.style.overflowX = "hidden"; + case 'fitWidth': + document.body.style.overflowX = 'hidden'; // scale up if the window is wider than the page, scale down if the window // is narrower than the page @@ -481,14 +481,14 @@ var ComicBook = (function ($) { break; default: - throw ComicBookException.INVALID_ZOOM_MODE + " " + options.zoomMode; + throw ComicBookException.INVALID_ZOOM_MODE + ' ' + options.zoomMode; } var canvas_width = page.width * zoom_scale; var canvas_height = page.height * zoom_scale; - var page_width = (options.zoomMode === "manual") ? page.width * scale : canvas_width; - var page_height = (options.zoomMode === "manual") ? page.height * scale : canvas_height; + var page_width = (options.zoomMode === 'manual') ? page.width * scale : canvas_width; + var page_height = (options.zoomMode === 'manual') ? page.height * scale : canvas_height; canvas_height = page_height; @@ -497,18 +497,18 @@ var ComicBook = (function ($) { canvas.height = (canvas_height < window.innerHeight) ? window.innerHeight : canvas_height; // work out a horizontal position that will keep the pages always centred - if (canvas_width < windowWidth() && options.zoomMode === "manual") { + if (canvas_width < windowWidth() && options.zoomMode === 'manual') { offsetW = (windowWidth() - page_width) / 2; - if (options.displayMode === "double") { offsetW = offsetW - page_width / 2; } + if (options.displayMode === 'double') { offsetW = offsetW - page_width / 2; } } // work out a vertical position that will keep the pages always centred - if (canvas_height < window.innerHeight && options.zoomMode === "manual") { + if (canvas_height < window.innerHeight && options.zoomMode === 'manual') { offsetH = (window.innerHeight - page_height) / 2; } // in manga double page mode reverse the page(s) - if (options.manga && options.displayMode === "double" && typeof page2 === "object") { + if (options.manga && options.displayMode === 'double' && typeof page2 === 'object') { var tmpPage = page; var tmpPage2 = page2; page = tmpPage2; @@ -517,11 +517,11 @@ var ComicBook = (function ($) { // draw the page(s) context.drawImage(page, offsetW, offsetH, page_width, page_height); - if (options.displayMode === "double" && typeof page2 === "object") { + if (options.displayMode === 'double' && typeof page2 === 'object') { context.drawImage(page2, page_width + offsetW, offsetH, page_width, page_height); } - this.pixastic = new Pixastic(context, options.libPath + "pixastic/"); + this.pixastic = new Pixastic(context, options.libPath + 'pixastic/'); // apply any image enhancements previously defined $.each(options.enhance, function(action, options) { @@ -529,33 +529,33 @@ var ComicBook = (function ($) { }); var current_page = - (options.displayMode === "double" && - pointer + 2 <= srcs.length) ? (pointer + 1) + "-" + (pointer + 2) : pointer + 1; + (options.displayMode === 'double' && + pointer + 2 <= srcs.length) ? (pointer + 1) + '-' + (pointer + 2) : pointer + 1; - this.getControl("toolbar") - .find("#current-page").text(current_page) + this.getControl('toolbar') + .find('#current-page').text(current_page) .end() - .find("#page-count").text(srcs.length); + .find('#page-count').text(srcs.length); // revert page mode back to double if it was auto switched for a double page spread - if (is_double_page_spread) { options.displayMode = "double"; } + if (is_double_page_spread) { options.displayMode = 'double'; } // disable the fit width button if needed - $("button.cb-fit-width").attr("disabled", (options.zoomMode === "fitWidth")); + $('button.cb-fit-width').attr('disabled', (options.zoomMode === 'fitWidth')); // disable prev/next buttons if not needed - $(".navigate").show(); + $('.navigate').show(); if (pointer === 0) { - $(".navigate-left").hide(); - $(".navigate-right").show(); + $('.navigate-left').hide(); + $('.navigate-right').show(); } - if (pointer === srcs.length-1 || (typeof page2 === "object" && pointer === srcs.length-2)) { - $(".navigate-left").show(); - $(".navigate-right").hide(); + if (pointer === srcs.length-1 || (typeof page2 === 'object' && pointer === srcs.length-2)) { + $('.navigate-left').show(); + $('.navigate-right').hide(); } - $(this).trigger("navigate"); + $(this).trigger('navigate'); // update hash location if (getHash() !== pointer) { @@ -582,7 +582,7 @@ var ComicBook = (function ($) { if (!page) { return false; } if (pointer + 1 < pages.length) { - pointer += (options.displayMode === "single" || is_double_page_spread) ? 1 : 2; + pointer += (options.displayMode === 'single' || is_double_page_spread) ? 1 : 2; try { self.drawPage(); } catch (e) {} @@ -607,7 +607,7 @@ var ComicBook = (function ($) { is_double_page_spread = (page.width > page.height); // need to run double page check again here as we are going backwards if (pointer > 0) { - pointer -= (options.displayMode === "single" || is_double_page_spread) ? 1 : 2; + pointer -= (options.displayMode === 'single' || is_double_page_spread) ? 1 : 2; self.drawPage(); } }; @@ -626,7 +626,7 @@ var ComicBook = (function ($) { }; ComicBook.prototype.desaturate = function () { - if ($(this).is(":checked")) { + if ($(this).is(':checked')) { self.enhance.desaturate(); } else { self.enhance.resaturate(); @@ -643,7 +643,7 @@ var ComicBook = (function ($) { * Powered by the awesome Pixastic: http://www.pixastic.com/ * * TODO: reset & apply all image enhancements each time before applying new one - * TODO: abstract this into an "Enhance" object, separate from ComicBook? + * TODO: abstract this into an 'Enhance' object, separate from ComicBook? */ ComicBook.prototype.enhance = { @@ -691,7 +691,7 @@ var ComicBook = (function ($) { */ brightness: function (params, reset) { - if (reset !== false) { this.reset("brightness"); } + if (reset !== false) { this.reset('brightness'); } // merge user options with defaults var opts = merge({ brightness: 0, contrast: 0 }, params); @@ -752,17 +752,17 @@ var ComicBook = (function ($) { ComicBook.prototype.navigation = function (e) { // disable navigation when the overlay is showing - if ($("#cb-loading-overlay").is(":visible")) { return false; } + if ($('#cb-loading-overlay').is(':visible')) { return false; } var side = false; switch (e.type) { - case "keydown": + case 'keydown': // navigation - if (e.keyCode === options.keyboard.previous) { side = "left"; } - if (e.keyCode === options.keyboard.next) { side = "right"; } + if (e.keyCode === options.keyboard.previous) { side = 'left'; } + if (e.keyCode === options.keyboard.next) { side = 'right'; } // display controls if (e.keyCode === options.keyboard.toolbar) { @@ -774,7 +774,7 @@ var ComicBook = (function ($) { break; default: - throw ComicBookException.INVALID_NAVIGATION_EVENT + " " + e.type; + throw ComicBookException.INVALID_NAVIGATION_EVENT + ' ' + e.type; } if (side) { @@ -783,13 +783,13 @@ var ComicBook = (function ($) { // western style (left to right) if (!options.manga) { - if (side === "left") { self.drawPrevPage(); } - if (side === "right") { self.drawNextPage(); } + if (side === 'left') { self.drawPrevPage(); } + if (side === 'right') { self.drawNextPage(); } } // manga style (right to left) else { - if (side === "left") { self.drawNextPage(); } - if (side === "right") { self.drawPrevPage(); } + if (side === 'left') { self.drawNextPage(); } + if (side === 'right') { self.drawPrevPage(); } } return false; @@ -805,12 +805,12 @@ var ComicBook = (function ($) { canvas.width = 0; canvas.height = 0; - window.removeEventListener("keydown", this.navigation, false); - window.removeEventListener("hashchange", checkHash, false); + window.removeEventListener('keydown', this.navigation, false); + window.removeEventListener('hashchange', checkHash, false); - setHash(""); + setHash(''); - // $(this).trigger("destroy"); + // $(this).trigger('destroy'); }; }