yetangitu/epub.js
1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-03 14:59:18 +02:00
Code Issues Releases Wiki Activity

Fixed isElementVisible to check for width and height of 0, added search view, added sidebar view

Browse source
This commit is contained in:
Fred Chasen 2013-12-31 17:27:46 -08:00
parent 787a5bd3d7
commit df2d006ec2
17 changed files with 489 additions and 858 deletions
Download patch file Download diff file Expand all files Collapse all files

4
Gruntfile.js
View file

@ -9,11 +9,11 @@ module.exports = function(grunt) {
},
concat : {
'build/epub.js': ['<banner>', 'libs/rsvp/rsvp.js', 'src/*.js'],
'build/reader.js': ['<banner>', 'reader/*.js'],
'build/reader.js': ['<banner>', 'reader/reader.js'],
'build/hooks.js': ['<banner>', 'hooks/default/*.js'],
'demo/js/libs/fileStorage.min.js': 'libs/fileStorage/fileStorage.min.js',
'demo/js/libs/loader_filesystem.min.js': 'libs/fileStorage/workers/loader_filesystem.min.js',
'demo/js/libs/jquery-1.9.0.min.js': 'libs/jquery/jquery-1.9.0.min.js',
'demo/js/libs/jquery-2.0.3.min.js': 'libs/jquery/jquery-2.0.3.min.js',
'demo/js/libs/inflate.js': 'libs/zip/inflate.js',
'demo/js/libs/screenfull.min.js': 'libs/screenfull.min.js'
},

56
build/epub.js
View file

@ -2138,8 +2138,8 @@ EPUBJS.Book.prototype.removeSavedSettings = function() {
};
EPUBJS.Book.prototype.applySavedSettings = function() {
var bookKey = this.settings.bookPath + ":" + this.settings.version;
stored = JSON.parse(localStorage.getItem(bookKey));
var bookKey = this.settings.bookPath + ":" + this.settings.version,
stored = JSON.parse(localStorage.getItem(bookKey));
if(EPUBJS.VERSION != stored.EPUBJSVERSION) return false;
this.settings = _.defaults(this.settings, stored);
@ -2500,7 +2500,7 @@ EPUBJS.Book.prototype._enqueue = function(command, args) {
this._q.push({
'command': command,
'arguments': args
'args': args
});
};
@ -2518,7 +2518,7 @@ EPUBJS.Book.prototype._rendered = function(err) {
this.trigger("book:rendered");
this._q.forEach(function(item){
book[item.command].apply(book, item.arguments);
book[item.command].apply(book, item.args);
});
};
@ -2528,7 +2528,7 @@ EPUBJS.Book.prototype.getHooks = function(){
var book = this,
plugs;
plugTypes = _.values(this.hooks);
var plugTypes = _.values(this.hooks); //-- unused
for (var plugType in this.hooks) {
plugs = _.values(EPUBJS.Hooks[plugType]);
@ -2590,17 +2590,16 @@ RSVP.EventTarget.mixin(EPUBJS.Book.prototype);
//-- Handle RSVP Errors
RSVP.on('error', function(event) {
console.error(event, event.detail);
//console.error(event, event.detail);
});
var listener = function(event){
console.log(event);
}
RSVP.configure('instrument', false);
RSVP.on('created', listener);
RSVP.on('chained', listener);
RSVP.on('fulfilled', listener);
RSVP.on('rejected', listener);
RSVP.configure('instrument', true); //-- true | will logging out all RSVP rejections
// RSVP.on('created', listener);
// RSVP.on('chained', listener);
// RSVP.on('fulfilled', listener);
RSVP.on('rejected', function(event){
console.error(event.detail, event.detail.message);
});
EPUBJS.Chapter = function(spineObject){
this.href = spineObject.href;
@ -2932,7 +2931,7 @@ EPUBJS.EpubCFI.prototype.pathTo = function(node) {
var stack = [],
children;
while(node && node.parentNode !== null ) {
while(node && node.parentNode !== null && node.parentNode.nodeType != 9) {
children = node.parentNode.children;
stack.unshift({
@ -2942,11 +2941,7 @@ EPUBJS.EpubCFI.prototype.pathTo = function(node) {
'index' : children ? Array.prototype.indexOf.call(children, node) : 0
});
if(node.parentNode.nodeName != "html") {
node = node.parentNode;
} else {
node = false;
}
node = node.parentNode;
}
return stack;
@ -4113,14 +4108,15 @@ EPUBJS.Renderer.prototype.findFirstVisible = function(startEl){
};
EPUBJS.Renderer.prototype.isElementVisible = function(el){
var left;
var rect;
if(el && typeof el.getBoundingClientRect === 'function'){
rect = el.getBoundingClientRect();
left = el.getBoundingClientRect().left;
if( left >= 0 &&
left < this.spreadWidth ) {
if( rect.width != 0 &&
rect.height != 0 &&
rect.left >= 0 &&
rect.left < this.spreadWidth ) {
return true;
}
}
@ -4224,11 +4220,11 @@ EPUBJS.replace.cssUrls = function(_store, base, text){
matches.forEach(function(str){
var full = EPUBJS.core.resolveUrl(base, str.replace(/url\(|[|\)|\'|\"]/g, ''));
replaced = _store.getUrl(full).then(function(url){
text = text.replace(str, 'url("'+url+'")');
}, function(e) {
console.error(e);
});
var replaced = _store.getUrl(full).then(function(url){
text = text.replace(str, 'url("'+url+'")');
}, function(e) {
console.error(e);
});
promises.push(replaced);
});

4
build/epub.min.js vendored
View file

File diff suppressed because one or more lines are too long

598
build/reader.js
View file

@ -1,388 +1,3 @@
var EPUBJSR = EPUBJSR || {};
EPUBJSR.app = {};
EPUBJSR.app.init = (function($){
"use strict";
var Book,
offline = false,
sidebarWidth = 0,
windowWidth;
function init(bookURL){
var search = window.location.search.match(/book=(.*)/),
bookURL = bookURL || (search ? search[1] : "moby-dick");
//-- Setup the browser prefixes
// EPUBJS.core.crossBrowserColumnCss();
//-- Set up our sidebar
windowWidth = $(window).width();
if(windowWidth > 550){
$("#main").width(windowWidth-sidebarWidth);
}else{
$("#main").width(windowWidth);
}
//-- Create a new book object,
// this will create an iframe in the el with the ID provided
Book = new EPUBJS.Book({ bookPath: bookURL, restore : true });
//Book.single = true;
//-- Add listeners to handle book events
//-- Full list of event are at start of book.js
// Book.listen("book:metadataReady", meta);
// Book.listen("book:tocReady", toc);
// Book.listen("book:bookReady", bookReady);
// Book.listen("book:chapterReady", chapterChange);
Book.on("book:online", goOnline);
Book.on("book:offline", goOffline);
Book.getMetadata().then(meta);
Book.getToc().then(toc);
Book.ready.all.then(bookReady);
Book.renderTo("area");
//Book.registerHook("beforeChapterDisplay", EPUBJS.Hooks.transculsions.insert);
//-- Start loading / parsing of the book.
// This must be done AFTER adding listeners or hooks
//Book.renderTo("area");
//-- Wait for Dom ready to handle jquery
$(function() {
controls();
});
return Book;
}
function meta(meta){
var title = meta.bookTitle,//Book.getTitle(),
author = meta.creator, //Book.getCreator(),
$title = $("#book-title"),
$author = $("#chapter-title"),
$dash = $("#title-seperator");
document.title = title+" – "+author;
$title.html(title);
$author.html(author);
$dash.show();
}
function toc(contents){
var $toc = $("#toc"),
$links,
$items;
$toc.empty();
//-- Recursively generate TOC levels
$items = generateTocItems(contents, 1);
$toc.append($items);
$links = $(".toc_link");
$links.on("click", function(e){
var $this = $(this),
url = $this.data("url");
$(".openChapter").removeClass("openChapter");
$this.parents('li').addClass("openChapter");
//-- Provide the Book with the url to show
// The Url must be found in the books manifest
Book.goto(url);
e.preventDefault();
});
}
function loadSettings() {
var userFont = "";
if (!localStorage.getItem("fontSize")) {
userFont = "medium";
localStorage.setItem("fontSize", userFont);
} else {
userFont = localStorage.getItem("fontSize");
}
var $settings = $("#settingsPanel");
$settings.append("<ul></ul>");
var $settingsItem = $("<li><h3></h3></li>");
var $fontSizes = $("<input type='radio' name='fontSize' value='x-small'><span class='xsmall'>Extra Small</span><br>" +
"<input type='radio' name='fontSize' value='small'><span class='small'>Small</span><br>" +
"<input type='radio' name='fontSize' value='medium'><span class='medium'>Medium</span><br>" +
"<input type='radio' name='fontSize' value='large'><span class='large'>Large</span><br>" +
"<input type='radio' name='fontSize' value='x-large'><span class='xlarge'>Extra Large</span>");
$settingsItem.find("h3").text('Font Size').after($fontSizes);
$settings.find("ul").append($settingsItem);
var $fontSizeButtons = $('input[name="fontSize"]');
$fontSizeButtons.each(function() {
if ($(this).attr("value") == userFont) {
$(this).attr("checked", "checked");
}
$(this).on("click", function() {
localStorage.setItem("fontSize", $(this).attr("value"));
//reload the page after selecting a new font
Book.iframe.contentDocument.location.reload(true);
});
});
//Single or double column
/*
var userLayout = "";
if (!localStorage.getItem("layout")) {
userLayout = "medium";
localStorage.setItem("layout", userLayout);
} else {
userLayout = localStorage.getItem("layout");
}
var $settings = $("#settingsPanel");
$settings.append("<ul></ul>");
var $settingsItem = $("<li><h3></h3></li>");
var $layout = $("<input type='radio' name='layout' value='singleColumn'><span class=''>Single Column</span><br>" +
"<input type='radio' name='layout' value='doubleColumn'><span class=''>Double Column</span><br>");
$settingsItem.find("h3").text('Font Size').after($layout);
$settings.find("ul").append($settingsItem);
var $layoutButtons = $('input[name="layout"]');
$layoutButtons.each(function() {
if ($(this).attr("value") == userLayout) {
$(this).attr("checked", "checked");
}
$(this).on("click", function() {
localStorage.setItem("layout", $(this).attr("value"));
//reload the page after selecting a new font
Book.iframe.contentDocument.location.reload(true);
});
});
//LineSpacing
var userLineSpacing = "";
//Contrast
var userContrast = "";
//Font Type
var userFontType = "";
*/
}
function generateTocItems(contents, level){
var $container = $("<ul>");
var type = (level == 1) ? "chapter" : "section";
contents.forEach(function(item){
var $subitems,
$wrapper = $("<li id='toc-"+item.id+"'>"),
$item = $("<a class='toc_link " + type + "' href='#/"+item.href+"' data-url='"+item.href+"'>"+item.label+"</a>");
$wrapper.append($item);
if(item.subitems && item.subitems.length){
level++;
$subitems = generateTocItems(item.subitems, level);
$wrapper.append($subitems);
}
$container.append($wrapper);
});
return $container;
}
function bookReady(){
var $divider = $("#divider"),
$loader = $("#loader");
$loader.hide();
if(!Book.single) {
$divider.addClass("show");
}
}
function goOnline(){
var $icon = $("#store");
offline = false;
$icon.attr("src", $icon.data("save"));
}
function goOffline(){
var $icon = $("#store");
offline = true;
$icon.attr("src", $icon.data("saved"));
}
function chapterChange(e) {
var id = e.msg,
$item = $("#toc-"+id),
$current = $(".currentChapter");
if($item.length){
$current.removeClass("currentChapter");
$item.addClass("currentChapter");
}
}
function controls(){
var $next = $("#next"),
$prev = $("#prev"),
$main = $("#main"),
$book = $("#area"),
$sidebar = $("#sidebar"),
$open = $("#open"),
$icon = $open.find("img"),
$network = $("#network"),
$settingLink = $("#setting"),
$settings = $("#settingsPanel"),
$toc = $("#toc"),
$fullscreen = $("#fullscreen"),
$fullscreenicon = $("#fullscreenicon"),
$cancelfullscreenicon = $("#cancelfullscreenicon"),
$window = $(window);
$window.on("resize", function(){
windowWidth = $(window).width();
if(windowWidth > 550){
$main.width(windowWidth-sidebarWidth);
}else{
$main.width(windowWidth);
}
});
$next.on("click", function(){
Book.nextPage();
});
$prev.on("click", function(){
Book.prevPage();
});
$settingLink.on("click", function() {
if (!$settings.is(":visible")) {
showSettings();
} else {
hideSettings();
}
});
$fullscreen.on("click", function () {
screenfull.toggle($('#container')[0]);
$fullscreenicon.toggle();
$cancelfullscreenicon.toggle();
});
var lock = false;
$(document).keydown(function(e){
if(lock) return;
if (e.keyCode == 37) {
$prev.trigger("click");
lock = true;
setTimeout(function(){
lock = false;
}, 100);
return false;
}
if (e.keyCode == 39) {
$next.trigger("click");
lock = true;
setTimeout(function(){
lock = false;
}, 100);
return false;
}
});
function showSidebar(){
//$book.css("pointer-events", "none"); //-- Avoid capture by ifrmae
$sidebar.addClass("open");
$main.addClass("closed");
$icon.attr("src", $icon.data("close"));
}
function hideSidebar(){
$book.css("pointer-events", "visible");
$sidebar.removeClass("open");
$main.removeClass("closed");
$icon.attr("src",$icon.data("open"));
}
function showSettings(){
$toc.hide();
$settings.show();
}
function hideSettings(){
$settings.hide();
$toc.show();
}
$open.on("click", function(){
if($sidebar.hasClass("open")){
hideSidebar();
}else{
showSidebar();
// $open.clickOutside(function(){
// hideSidebar();
// });
}
});
$network.on("click", function(){
offline = !offline;
Book.fromStorage(offline);
});
}
return init;
})(jQuery);
EPUBJS.reader = {};
EPUBJS.reader.plugins = {}; //-- Attach extra view as plugins (like search?)
@ -426,14 +41,15 @@ EPUBJS.Reader = function(path, options) {
reader.SettingsView = EPUBJS.reader.SettingsView.call(reader, book);
reader.ControlsView = EPUBJS.reader.ControlsView.call(reader, book);
reader.SidebarView = EPUBJS.reader.SidebarView.call(reader, book);
book.ready.all.then(function() {
reader.ReaderView = EPUBJS.reader.ReaderView.call(reader, book);
// Call Plugins
for(var plugin in EPUBJS.reader.plugins) {
if(obj.hasOwnProperty(prop)) {
plugin.call(reader, book);
if(EPUBJS.reader.plugins.hasOwnProperty(plugin)) {
reader[plugin] = EPUBJS.reader.plugins[plugin].call(reader, book);
}
}
@ -446,7 +62,7 @@ EPUBJS.Reader = function(path, options) {
book.getToc().then(function(toc) {
reader.TocView = EPUBJS.reader.TocView.call(reader, toc);
});
return this;
};
@ -555,6 +171,51 @@ EPUBJS.reader.ReaderView = function(book) {
};
};
EPUBJS.reader.SidebarView = function(book) {
var reader = this;
var $sidebar = $("#sidebar"),
$panels = $("#panels");
var activePanel = "TocView";
var changePanelTo = function(viewName) {
if(activePanel == viewName || typeof reader[viewName] === 'undefined' ) return;
reader[activePanel].hide();
reader[viewName].show();
activePanel = viewName;
$panels.find('.active').removeClass("active");
$panels.find("#show-" + viewName ).addClass("active");
};
var show = function() {
reader.sidebarOpen = true;
reader.ReaderView.slideOut();
$sidebar.addClass("open");
}
var hide = function() {
reader.sidebarOpen = false;
reader.ReaderView.slideIn();
$sidebar.removeClass("open");
}
$panels.find(".show_view").on("click", function(event) {
var view = $(this).data("view");
changePanelTo(view);
event.preventDefault();
});
return {
'show' : show,
'hide' : hide,
'activePanel' : activePanel,
'changePanelTo' : changePanelTo
};
};
EPUBJS.reader.ControlsView = function(book) {
var reader = this;
@ -567,8 +228,7 @@ EPUBJS.reader.ControlsView = function(book) {
$sidebar = $("#sidebar"),
$settings = $("#settings"),
$bookmark = $("#bookmark");
var goOnline = function() {
reader.offline = false;
// $store.attr("src", $icon.data("save"));
@ -578,31 +238,19 @@ EPUBJS.reader.ControlsView = function(book) {
reader.offline = true;
// $store.attr("src", $icon.data("saved"));
};
var showSidebar = function() {
reader.sidebarOpen = true;
reader.ReaderView.slideOut();
$sidebar.addClass("open");
$slider.addClass("icon-right");
$slider.removeClass("icon-menu");
}
var hideSidebar = function() {
reader.sidebarOpen = false;
reader.ReaderView.slideIn();
$sidebar.removeClass("open");
$slider.addClass("icon-menu");
$slider.removeClass("icon-right");
}
book.on("book:online", goOnline);
book.on("book:offline", goOffline);
$slider.on("click", function () {
if(reader.sidebarOpen) {
hideSidebar();
reader.SidebarView.hide();
$slider.addClass("icon-menu");
$slider.removeClass("icon-right");
} else {
showSidebar();
reader.SidebarView.show();
$slider.addClass("icon-right");
$slider.removeClass("icon-menu");
}
});
@ -621,7 +269,14 @@ EPUBJS.reader.ControlsView = function(book) {
$bookmark.removeClass("icon-bookmark-empty");
console.log(reader.book.getCurrentLocationCfi());
});
book.on('renderer:pageChanged', function(cfi){
//-- TODO: Check if bookmarked
$bookmark
.removeClass("icon-bookmark")
.addClass("icon-bookmark-empty");
});
return {
};
@ -756,125 +411,4 @@ EPUBJS.reader.SettingsView = function() {
"show" : onShow,
"hide" : onHide
};
};
EPUBJSR.search = {};
// Search Server -- https://github.com/futurepress/epubjs-search
EPUBJSR.search.SERVER = "http://localhost:5000";
EPUBJSR.search.request = function(q, callback) {
var fetch = $.ajax({
dataType: "json",
url: EPUBJSR.search.SERVER + "/search?q=" + encodeURIComponent(q)
});
fetch.fail(function(err) {
console.error(err);
});
fetch.done(function(results) {
callback(results);
});
};
EPUBJSR.search.View = function(Book) {
var $searchBox = $("#searchBox"),
$searchResults = $("#searchResults"),
$tocView = $("#toc"),
$searchView = $("#searchView"),
iframeDoc;
$searchBox.on("search", function(e) {
var q = $searchBox.val();
e.preventDefault();
//-- SearchBox is empty or cleared
if(q == '') {
$searchResults.empty();
$searchView.removeClass("shown");
$tocView.removeClass("hidden");
$(iframeDoc).find('body').unhighlight();
iframeDoc = false;
return;
}
if(!$searchView.hasClass("shown")) {
$searchView.addClass("shown");
$tocView.addClass("hidden");
}
$searchResults.empty();
$searchResults.append("<li><p>Searching...</p></li>");
EPUBJSR.search.request(q, function(data) {
var results = data.results;
$searchResults.empty();
if(iframeDoc) {
$(iframeDoc).find('body').unhighlight();
}
if(results.length == 0) {
$searchResults.append("<li><p>No Results Found</p></li>");
return;
}
iframeDoc = $("#area iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
results.forEach(function(result) {
var $li = $("<li></li>");
var $item = $("<a href='"+result.href+"' data-cfi='"+result.cfi+"'><span>"+result.title+"</span><p>"+result.highlight+"</p></a>");
$item.on("click", function(e) {
var $this = $(this),
cfi = $this.data("cfi");
e.preventDefault();
Book.gotoCfi(cfi);
Book.on("renderer:chapterDisplayed", function() {
iframeDoc = $("#area iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
})
});
$li.append($item);
$searchResults.append($li);
});
});
});
};
//-- http://stackoverflow.com/questions/2124684/jquery-how-click-anywhere-outside-of-the-div-the-div-fades-out
jQuery.fn.extend({
// Calls the handler function if the user has clicked outside the object (and not on any of the exceptions)
clickOutside: function(handler, exceptions) {
var $this = this;
jQuery(document).on("click.offer", function(event) {
if (exceptions && jQuery.inArray(event.target, exceptions) > -1) {
return;
} else if (jQuery.contains($this[0], event.target)) {
return;
} else {
jQuery(document).off("click.offer");
handler(event, $this);
}
});
return this;
}
});
};

14
demo/css/main.css
View file

@ -153,7 +153,7 @@ body {
-moz-transform: translate(300px, 0);
}
#controls {
#panels {
background: #4e4e4e;
position: absolute;
left: 0;
@ -182,7 +182,7 @@ body {
float: right;
}
#controls a {
#panels a {
visibility: hidden;
width: 18px;
height: 20px;
@ -192,21 +192,21 @@ body {
margin-left: 6px;
}
#controls a::before {
#panels a::before {
visibility: visible;
}
#controls a:hover {
#panels a:hover {
color: #AAA;
}
#controls a:active {
#panels a:active {
color: #AAA;
margin: 1px 0 -1px 6px;
}
#controls a.active,
#controls a.active:hover {
#panels a.active,
#panels a.active:hover {
color: #AAA;
}

84
demo/dev.html
View file

@ -27,7 +27,7 @@
EPUBJS.cssPath = "css/";
// fileStorage.filePath = EPUBJS.filePath;
var reader = ePubReader("moby-dick/", { reload: true });
window.Reader = ePubReader("moby-dick/", { reload: true });
}
};
@ -76,51 +76,49 @@
</head>
<body>
<div id="sidebar">
<div id="controls">
<input id="searchBox" placeholder="search" type="search">
<a id="searcher" class="icon-search">Search</a>
<a id="network" class="icon-list-1 active">TOC</a>
<a id="bookmarks" class="icon-bookmark">Bookmarks</a>
<a id="notes" class="icon-edit">Notes</a>
</div>
<div id="tocView">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
<div id="sidebar">
<div id="panels">
<input id="searchBox" placeholder="search" type="search">
<a id="show-SearchView" class="show_view icon-search" data-view="SearchView">Search</a>
<a id="show-TocView" class="show_view icon-list-1 active" data-view="TocView">TOC</a>
<a id="show-BookmarksView" class="show_view icon-bookmark" data-view="BookmarksView">Bookmarks</a>
<a id="show-NotesView" class="show_view icon-edit" data-view="NotesView">Notes</a>
</div>
<div id="tocView">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
<div id="main">
<div id="titlebar">
<div id="opener">
<a id="slider" class="icon-menu">Menu</a>
</div>
<div id="metainfo">
<span id="book-title"></span>
<span id="title-seperator">&nbsp;&nbsp;–&nbsp;&nbsp;</span>
<span id="chapter-title"></span>
</div>
<div id="title-controls">
<a id="bookmark" class="icon-bookmark-empty">Bookmark</a>
<a id="setting" class="icon-cog">Settings</a>
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="viewer"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
</div>
<div id="main">
<div id="titlebar">
<div id="opener">
<a id="slider" class="icon-menu">Menu</a>
</div>
<div id="metainfo">
<span id="book-title"></span>
<span id="title-seperator">&nbsp;&nbsp;–&nbsp;&nbsp;</span>
<span id="chapter-title"></span>
</div>
<div id="title-controls">
<a id="bookmark" class="icon-bookmark-empty">Bookmark</a>
<a id="setting" class="icon-cog">Settings</a>
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="viewer"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
</div>
</body>
</html>

89
demo/index.html
View file

@ -12,7 +12,7 @@
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/popup.css">
<script src="js/libs/jquery-1.9.0.min.js"></script>
<script src="js/libs/jquery-2.0.3.min.js"></script>
<script src="js/libs/zip.min.js"></script>
@ -50,50 +50,49 @@
</head>
<body>
<div id="sidebar">
<div id="controls">
<input id="searchBox" placeholder="search" type="search">
<a id="searcher" class="icon-search">Search</a>
<a id="network" class="icon-list-1 active">TOC</a>
<a id="bookmarks" class="icon-bookmark">Bookmarks</a>
<a id="notes" class="icon-edit">Notes</a>
</div>
<div id="tocView">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
</div>
<div id="main">
<div id="titlebar">
<div id="opener">
<a id="slider" class="icon-menu">Menu</a>
</div>
<div id="metainfo">
<span id="book-title"></span>
<span id="title-seperator">&nbsp;&nbsp;–&nbsp;&nbsp;</span>
<span id="chapter-title"></span>
</div>
<div id="title-controls">
<a id="bookmark" class="icon-bookmark-empty">Bookmark</a>
<a id="setting" class="icon-cog">Settings</a>
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="viewer"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
<div id="sidebar">
<div id="panels">
<input id="searchBox" placeholder="search" type="search">
<a id="show-SearchView" class="show_view icon-search" data-view="SearchView">Search</a>
<a id="show-TocView" class="show_view icon-list-1 active" data-view="TocView">TOC</a>
<a id="show-BookmarksView" class="show_view icon-bookmark" data-view="BookmarksView">Bookmarks</a>
<a id="show-NotesView" class="show_view icon-edit" data-view="NotesView">Notes</a>
</div>
<div id="tocView">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
</div>
<div id="main">
<div id="titlebar">
<div id="opener">
<a id="slider" class="icon-menu">Menu</a>
</div>
<div id="metainfo">
<span id="book-title"></span>
<span id="title-seperator">&nbsp;&nbsp;–&nbsp;&nbsp;</span>
<span id="chapter-title"></span>
</div>
<div id="title-controls">
<a id="bookmark" class="icon-bookmark-empty">Bookmark</a>
<a id="setting" class="icon-cog">Settings</a>
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="viewer"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
</div>
</body>
</html>

4
demo/js/epub.min.js vendored
View file

File diff suppressed because one or more lines are too long

6
demo/js/libs/jquery-2.0.3.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

2
demo/js/reader.min.js vendored
View file

File diff suppressed because one or more lines are too long

128
examples/search.html
View file

@ -14,82 +14,114 @@
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="epubjs/libs/jquery-1.9.0.min.js"><\/script>')</script>
-->
<script src="../libs/jquery/jquery-1.9.0.js"></script>
<script src="../libs/jquery/jquery-2.0.3.js"></script>
<script>
"use strict";
var Book;
document.onreadystatechange = function () {
if (document.readyState == "complete") {
EPUBJS.VERSION = "0.1.6";
EPUBJS.filePath = "js/libs/";
EPUBJS.cssPath = "css/";
// fileStorage.filePath = EPUBJS.filePath;
Book = EPUBJSR.app.init("moby-dick/");
$(function() {
EPUBJSR.search.View(Book);
});
window.Reader = ePubReader("../demo/moby-dick/", { reload: true });
}
};
</script>
<script src="../build/epub.min.js"></script>
<!--<script async src="epubjs/libs/jquery.touchy.min.js"></script>-->
<!-- zip -->
<script src="../libs/zip/zip.js"></script>
<script src="../libs/zip/zip-fs.js"></script>
<script src="../libs/zip/zip-ext.js"></script>
<script src="../libs/zip/inflate.js"></script>
<script src="../libs/zip/mime-types.js"></script>
<!-- Render -->
<script src="../libs/underscore/underscore.js"></script>
<script src="../libs/rsvp/rsvp.js"></script>
<script src="../libs/fileStorage/fileStorage.min.js"></script>
<script src="../src/base.js"></script>
<script src="../src/core.js"></script>
<script src="../src/unarchiver.js"></script>
<script src="../src/parser.js"></script>
<script src="../src/hooks.js"></script>
<script src="../src/book.js"></script>
<script src="../src/chapter.js"></script>
<script src="../src/renderer.js"></script>
<script src="../src/epubcfi.js"></script>
<!-- Hooks -->
<script async src="../hooks/default/transculsions.js"></script>
<script async src="../hooks/default/endnotes.js"></script>
<script async src="../hooks/default/smartimages.js"></script>
<script async src="../hooks/default/pageturns.js"></script>
<!-- Reader -->
<script src="../reader/utils.js"></script>
<script src="../reader/app.js"></script>
<script src="../reader/reader.js"></script>
<!-- Plugins -->
<script src="../reader/search.js"></script>
<!-- Full Screen -->
<script src="../demo/js/libs/screenfull.min.js"></script>
<!-- Highlights -->
<script src="../demo/js/libs/jquery.highlight.js"></script>
<script src="../hooks/extensions/highlight.js"></script>
<script async src="../hooks/extensions/highlight.js"></script>
</head>
<body>
<div id="sidebar">
<div id="controls">
<input id="searchBox" placeholder="search" type="search">
<a id="network"><img id="store" src="../demo/img/save.png" save="../demo/img/save.png" data-saved="../demo/img/saved.png"></a>
<a id="setting"><img id="settings" src="../demo/img/settings.png"></a>
<a id="fullscreen">
<img id="fullscreenicon" src="../demo/img/fullscreen.png">
<img id="cancelfullscreenicon" src="../demo/img/cancelfullscreen.png" style="display: none">
</a>
</div>
<div id="toc">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
<div id="sidebar">
<div id="panels">
<input id="searchBox" placeholder="search" type="search">
<a id="show-SearchView" class="show_view icon-search" data-view="SearchView">Search</a>
<a id="show-TocView" class="show_view icon-list-1 active" data-view="TocView">TOC</a>
<a id="show-BookmarksView" class="show_view icon-bookmark" data-view="BookmarksView">Bookmarks</a>
<a id="show-NotesView" class="show_view icon-edit" data-view="NotesView">Notes</a>
</div>
<div id="main">
<div id="tocView">
</div>
<div id="searchView">
<ul id="searchResults"></ul>
</div>
<div id="settingsPanel">
</div>
</div>
<div id="main">
<div id="titlebar">
<div id="opener">
<a id="open"><img src="../demo/img/menu-icon.png" data-close="../demo/img/close.png" data-open="../demo/img/menu-icon.png"></a>
<a id="slider" class="icon-menu">Menu</a>
</div>
<div id="titlebar">
<div id="metainfo">
<span id="book-title"></span>
<span id="title-seperator">&nbsp;&nbsp;–&nbsp;&nbsp;</span>
<span id="chapter-title"> </span>
<span id="chapter-title"></span>
</div>
<div id="title-controls">
<a id="bookmark" class="icon-bookmark-empty">Bookmark</a>
<a id="setting" class="icon-cog">Settings</a>
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="area"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
</div>
<div id="divider"></div>
<div id="prev" class="arrow">‹</div>
<div id="viewer"></div>
<div id="next" class="arrow">›</div>
<div id="loader"><img src="../demo/img/loader.gif"></div>
</div>
</body>
</html>

90
reader/reader.js
View file

@ -41,14 +41,15 @@ EPUBJS.Reader = function(path, options) {
reader.SettingsView = EPUBJS.reader.SettingsView.call(reader, book);
reader.ControlsView = EPUBJS.reader.ControlsView.call(reader, book);
reader.SidebarView = EPUBJS.reader.SidebarView.call(reader, book);
book.ready.all.then(function() {
reader.ReaderView = EPUBJS.reader.ReaderView.call(reader, book);
// Call Plugins
for(var plugin in EPUBJS.reader.plugins) {
if(obj.hasOwnProperty(prop)) {
plugin.call(reader, book);
if(EPUBJS.reader.plugins.hasOwnProperty(plugin)) {
reader[plugin] = EPUBJS.reader.plugins[plugin].call(reader, book);
}
}
@ -61,7 +62,7 @@ EPUBJS.Reader = function(path, options) {
book.getToc().then(function(toc) {
reader.TocView = EPUBJS.reader.TocView.call(reader, toc);
});
return this;
};
@ -170,6 +171,51 @@ EPUBJS.reader.ReaderView = function(book) {
};
};
EPUBJS.reader.SidebarView = function(book) {
var reader = this;
var $sidebar = $("#sidebar"),
$panels = $("#panels");
var activePanel = "TocView";
var changePanelTo = function(viewName) {
if(activePanel == viewName || typeof reader[viewName] === 'undefined' ) return;
reader[activePanel].hide();
reader[viewName].show();
activePanel = viewName;
$panels.find('.active').removeClass("active");
$panels.find("#show-" + viewName ).addClass("active");
};
var show = function() {
reader.sidebarOpen = true;
reader.ReaderView.slideOut();
$sidebar.addClass("open");
}
var hide = function() {
reader.sidebarOpen = false;
reader.ReaderView.slideIn();
$sidebar.removeClass("open");
}
$panels.find(".show_view").on("click", function(event) {
var view = $(this).data("view");
changePanelTo(view);
event.preventDefault();
});
return {
'show' : show,
'hide' : hide,
'activePanel' : activePanel,
'changePanelTo' : changePanelTo
};
};
EPUBJS.reader.ControlsView = function(book) {
var reader = this;
@ -182,8 +228,7 @@ EPUBJS.reader.ControlsView = function(book) {
$sidebar = $("#sidebar"),
$settings = $("#settings"),
$bookmark = $("#bookmark");
var goOnline = function() {
reader.offline = false;
// $store.attr("src", $icon.data("save"));
@ -193,31 +238,19 @@ EPUBJS.reader.ControlsView = function(book) {
reader.offline = true;
// $store.attr("src", $icon.data("saved"));
};
var showSidebar = function() {
reader.sidebarOpen = true;
reader.ReaderView.slideOut();
$sidebar.addClass("open");
$slider.addClass("icon-right");
$slider.removeClass("icon-menu");
}
var hideSidebar = function() {
reader.sidebarOpen = false;
reader.ReaderView.slideIn();
$sidebar.removeClass("open");
$slider.addClass("icon-menu");
$slider.removeClass("icon-right");
}
book.on("book:online", goOnline);
book.on("book:offline", goOffline);
$slider.on("click", function () {
if(reader.sidebarOpen) {
hideSidebar();
reader.SidebarView.hide();
$slider.addClass("icon-menu");
$slider.removeClass("icon-right");
} else {
showSidebar();
reader.SidebarView.show();
$slider.addClass("icon-right");
$slider.removeClass("icon-menu");
}
});
@ -236,7 +269,14 @@ EPUBJS.reader.ControlsView = function(book) {
$bookmark.removeClass("icon-bookmark-empty");
console.log(reader.book.getCurrentLocationCfi());
});
book.on('renderer:pageChanged', function(cfi){
//-- TODO: Check if bookmarked
$bookmark
.removeClass("icon-bookmark")
.addClass("icon-bookmark-empty");
});
return {
};

212
reader/search.js
View file

@ -1,99 +1,129 @@
EPUBJSR.search = {};
EPUBJS.reader.search = {};
// Search Server -- https://github.com/futurepress/epubjs-search
EPUBJSR.search.SERVER = "http://localhost:5000";
EPUBJS.reader.search.SERVER = "http://localhost:5000";
EPUBJSR.search.request = function(q, callback) {
var fetch = $.ajax({
dataType: "json",
url: EPUBJSR.search.SERVER + "/search?q=" + encodeURIComponent(q)
});
EPUBJS.reader.search.request = function(q, callback) {
var fetch = $.ajax({
dataType: "json",
url: EPUBJS.reader.search.SERVER + "/search?q=" + encodeURIComponent(q)
});
fetch.fail(function(err) {
console.error(err);
});
fetch.fail(function(err) {
console.error(err);
});
fetch.done(function(results) {
callback(results);
});
fetch.done(function(results) {
callback(results);
});
};
EPUBJSR.search.View = function(Book) {
var $searchBox = $("#searchBox"),
$searchResults = $("#searchResults"),
$tocView = $("#toc"),
$searchView = $("#searchView"),
iframeDoc;
$searchBox.on("search", function(e) {
var q = $searchBox.val();
e.preventDefault();
//-- SearchBox is empty or cleared
if(q == '') {
$searchResults.empty();
$searchView.removeClass("shown");
$tocView.removeClass("hidden");
$(iframeDoc).find('body').unhighlight();
iframeDoc = false;
return;
}
if(!$searchView.hasClass("shown")) {
$searchView.addClass("shown");
$tocView.addClass("hidden");
}
$searchResults.empty();
$searchResults.append("<li><p>Searching...</p></li>");
EPUBJSR.search.request(q, function(data) {
var results = data.results;
$searchResults.empty();
if(iframeDoc) {
$(iframeDoc).find('body').unhighlight();
}
if(results.length == 0) {
$searchResults.append("<li><p>No Results Found</p></li>");
return;
}
iframeDoc = $("#area iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
results.forEach(function(result) {
var $li = $("<li></li>");
var $item = $("<a href='"+result.href+"' data-cfi='"+result.cfi+"'><span>"+result.title+"</span><p>"+result.highlight+"</p></a>");
$item.on("click", function(e) {
var $this = $(this),
cfi = $this.data("cfi");
e.preventDefault();
Book.gotoCfi(cfi);
Book.on("renderer:chapterDisplayed", function() {
iframeDoc = $("#area iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
})
});
$li.append($item);
$searchResults.append($li);
});
});
});
EPUBJS.reader.plugins.SearchView = function(Book) {
var reader = this;
var $searchBox = $("#searchBox"),
$searchResults = $("#searchResults"),
$tocView = $("#tocView"),
$searchView = $("#searchView"),
iframeDoc;
var searchShown = false;
var onShow = function() {
query();
searchShown = true;
$searchView.addClass("shown");
};
var onHide = function() {
searchShown = false;
$searchView.removeClass("shown");
};
var query = function() {
var q = $searchBox.val();
if(q == '') {
return;
}
$searchResults.empty();
$searchResults.append("<li><p>Searching...</p></li>");
EPUBJS.reader.search.request(q, function(data) {
var results = data.results;
$searchResults.empty();
if(iframeDoc) {
$(iframeDoc).find('body').unhighlight();
}
if(results.length == 0) {
$searchResults.append("<li><p>No Results Found</p></li>");
return;
}
iframeDoc = $("#viewer iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
results.forEach(function(result) {
var $li = $("<li></li>");
var $item = $("<a href='"+result.href+"' data-cfi='"+result.cfi+"'><span>"+result.title+"</span><p>"+result.highlight+"</p></a>");
$item.on("click", function(e) {
var $this = $(this),
cfi = $this.data("cfi");
e.preventDefault();
Book.gotoCfi(cfi);
Book.on("renderer:chapterDisplayed", function() {
iframeDoc = $("#viewer iframe")[0].contentDocument;
$(iframeDoc).find('body').highlight(q, { element: 'span' });
})
});
$li.append($item);
$searchResults.append($li);
});
});
};
$searchBox.on("search", function(e) {
var q = $searchBox.val();
//-- SearchBox is empty or cleared
if(q == '') {
$searchResults.empty();
if(reader.SidebarView.activePanel != "SearchView") {
reader.SidebarView.changePanelTo("TocView");
}
$(iframeDoc).find('body').unhighlight();
iframeDoc = false;
return;
}
if(reader.SidebarView.activePanel != "SearchView") {
reader.SidebarView.changePanelTo("SearchView");
}
e.preventDefault();
});
return {
"show" : onShow,
"hide" : onHide
};
};

27
src/book.js
View file

@ -365,8 +365,8 @@ EPUBJS.Book.prototype.removeSavedSettings = function() {
};
EPUBJS.Book.prototype.applySavedSettings = function() {
var bookKey = this.settings.bookPath + ":" + this.settings.version;
stored = JSON.parse(localStorage.getItem(bookKey));
var bookKey = this.settings.bookPath + ":" + this.settings.version,
stored = JSON.parse(localStorage.getItem(bookKey));
if(EPUBJS.VERSION != stored.EPUBJSVERSION) return false;
this.settings = _.defaults(this.settings, stored);
@ -727,7 +727,7 @@ EPUBJS.Book.prototype._enqueue = function(command, args) {
this._q.push({
'command': command,
'arguments': args
'args': args
});
};
@ -745,7 +745,7 @@ EPUBJS.Book.prototype._rendered = function(err) {
this.trigger("book:rendered");
this._q.forEach(function(item){
book[item.command].apply(book, item.arguments);
book[item.command].apply(book, item.args);
});
};
@ -755,7 +755,7 @@ EPUBJS.Book.prototype.getHooks = function(){
var book = this,
plugs;
plugTypes = _.values(this.hooks);
var plugTypes = _.values(this.hooks); //-- unused
for (var plugType in this.hooks) {
plugs = _.values(EPUBJS.Hooks[plugType]);
@ -817,14 +817,13 @@ RSVP.EventTarget.mixin(EPUBJS.Book.prototype);
//-- Handle RSVP Errors
RSVP.on('error', function(event) {
console.error(event, event.detail);
//console.error(event, event.detail);
});
var listener = function(event){
console.log(event);
}
RSVP.configure('instrument', false);
RSVP.on('created', listener);
RSVP.on('chained', listener);
RSVP.on('fulfilled', listener);
RSVP.on('rejected', listener);
RSVP.configure('instrument', true); //-- true | will logging out all RSVP rejections
// RSVP.on('created', listener);
// RSVP.on('chained', listener);
// RSVP.on('fulfilled', listener);
RSVP.on('rejected', function(event){
console.error(event.detail, event.detail.message);
});

8
src/epubcfi.js
View file

@ -45,7 +45,7 @@ EPUBJS.EpubCFI.prototype.pathTo = function(node) {
var stack = [],
children;
while(node && node.parentNode !== null ) {
while(node && node.parentNode !== null && node.parentNode.nodeType != 9) {
children = node.parentNode.children;
stack.unshift({
@ -55,11 +55,7 @@ EPUBJS.EpubCFI.prototype.pathTo = function(node) {
'index' : children ? Array.prototype.indexOf.call(children, node) : 0
});
if(node.parentNode.nodeName != "html") {
node = node.parentNode;
} else {
node = false;
}
node = node.parentNode;
}
return stack;

11
src/renderer.js
View file

@ -652,14 +652,15 @@ EPUBJS.Renderer.prototype.findFirstVisible = function(startEl){
};
EPUBJS.Renderer.prototype.isElementVisible = function(el){
var left;
var rect;
if(el && typeof el.getBoundingClientRect === 'function'){
rect = el.getBoundingClientRect();
left = el.getBoundingClientRect().left;
if( left >= 0 &&
left < this.spreadWidth ) {
if( rect.width != 0 &&
rect.height != 0 &&
rect.left >= 0 &&
rect.left < this.spreadWidth ) {
return true;
}
}

10
src/replace.js
View file

@ -80,11 +80,11 @@ EPUBJS.replace.cssUrls = function(_store, base, text){
matches.forEach(function(str){
var full = EPUBJS.core.resolveUrl(base, str.replace(/url\(|[|\)|\'|\"]/g, ''));
replaced = _store.getUrl(full).then(function(url){
text = text.replace(str, 'url("'+url+'")');
}, function(e) {
console.error(e);
});
var replaced = _store.getUrl(full).then(function(url){
text = text.replace(str, 'url("'+url+'")');
}, function(e) {
console.error(e);
});
promises.push(replaced);
});