re-organized files, new build script
16
README.md
|
@ -37,9 +37,8 @@ then you can run the reader locally with the command
|
|||
http-server
|
||||
```
|
||||
|
||||
* [dev.html](http://localhost:8080/dev.html) will pull from the source files and should be used during development.
|
||||
* [index.html](http://localhost:8080/index.html) will use the minified production libraries in the dist/ folder.
|
||||
* [annotator.html](http://localhost:8080/annotator.html) is a dev branch for annotation development.
|
||||
* [dev.html](http://localhost:8080/examples/dev.html) will pull from the source files and should be used during development.
|
||||
* [index.html](http://localhost:8080/demo/index.html) will use the minified production libraries in the dist/ folder.
|
||||
|
||||
Building for Distribution
|
||||
-------------------------
|
||||
|
@ -110,13 +109,8 @@ Follow us on twitter: @Epubjs
|
|||
|
||||
+ http://twitter.com/#!/Epubjs
|
||||
|
||||
Similar projects:
|
||||
Other
|
||||
-------------------------
|
||||
|
||||
+ https://github.com/readium/readium-viewer-demo1
|
||||
|
||||
+ https://github.com/readium/Readium-Web-Components
|
||||
|
||||
#Other
|
||||
|
||||
EPUB is a registered trademark of the IDPF.
|
||||
EPUB is a registered trademark of the [IDPF](http://idpf.org/).
|
||||
|
||||
|
|
1483
build/epub.js
Normal file
262
build/hooks.js
Normal file
|
@ -0,0 +1,262 @@
|
|||
/*! FuturePress - v0.1.0 - 2013-06-04 */
|
||||
|
||||
EPUBJS.Hooks.register("beforeChapterDisplay").endnotes = function(callback, chapter){
|
||||
|
||||
var notes = chapter.doc.querySelectorAll('a[href]'),
|
||||
items = Array.prototype.slice.call(notes), //[].slice.call()
|
||||
attr = "epub:type",
|
||||
type = "noteref",
|
||||
popups = {};
|
||||
|
||||
|
||||
EPUBJS.core.addCss("css/popup.css", false, chapter.doc.head);
|
||||
|
||||
//console.log("notes", items)
|
||||
items.forEach(function(item){
|
||||
var epubType = item.getAttribute(attr),
|
||||
href,
|
||||
id,
|
||||
el,
|
||||
pop,
|
||||
pos,
|
||||
left,
|
||||
top,
|
||||
txt;
|
||||
|
||||
if(epubType != type) return;
|
||||
|
||||
href = item.getAttribute("href");
|
||||
id = href.replace("#", '');
|
||||
el = chapter.doc.getElementById(id);
|
||||
|
||||
|
||||
item.addEventListener("mouseover", showPop, false);
|
||||
item.addEventListener("mouseout", hidePop, false);
|
||||
|
||||
function showPop(){
|
||||
var poppos,
|
||||
iheight = chapter.iframe.height,
|
||||
iwidth = chapter.iframe.width,
|
||||
tip,
|
||||
pop,
|
||||
maxHeight = 225;
|
||||
|
||||
if(!txt) {
|
||||
pop = el.cloneNode(true);
|
||||
txt = pop.querySelector("p");
|
||||
}
|
||||
|
||||
//-- create a popup with endnote inside of it
|
||||
if(!popups[id]) {
|
||||
popups[id] = document.createElement("div");
|
||||
popups[id].setAttribute("class", "popup");
|
||||
|
||||
pop_content = document.createElement("div");
|
||||
|
||||
popups[id].appendChild(pop_content);
|
||||
|
||||
pop_content.appendChild(txt);
|
||||
pop_content.setAttribute("class", "pop_content");
|
||||
|
||||
chapter.bodyEl.appendChild(popups[id]);
|
||||
|
||||
//-- TODO: will these leak memory? - Fred
|
||||
popups[id].addEventListener("mouseover", onPop, false);
|
||||
popups[id].addEventListener("mouseout", offPop, false);
|
||||
|
||||
//-- Add hide on page change
|
||||
chapter.book.listenUntil("book:pageChanged", "book:chapterDestroy", hidePop);
|
||||
chapter.book.listenUntil("book:pageChanged", "book:chapterDestroy", offPop);
|
||||
|
||||
}
|
||||
|
||||
pop = popups[id];
|
||||
|
||||
|
||||
//-- get location of item
|
||||
itemRect = item.getBoundingClientRect();
|
||||
left = itemRect.left;
|
||||
top = itemRect.top;
|
||||
|
||||
//-- show the popup
|
||||
pop.classList.add("show");
|
||||
|
||||
//-- locations of popup
|
||||
popRect = pop.getBoundingClientRect();
|
||||
|
||||
//-- position the popup
|
||||
pop.style.left = left - popRect.width / 2 + "px";
|
||||
pop.style.top = top + "px";
|
||||
|
||||
|
||||
//-- Adjust max height
|
||||
if(maxHeight > iheight / 2.5) {
|
||||
maxHeight = iheight / 2.5;
|
||||
pop_content.style.maxHeight = maxHeight + "px";
|
||||
}
|
||||
|
||||
//-- switch above / below
|
||||
if(popRect.height + top >= iheight - 25) {
|
||||
pop.style.top = top - popRect.height + "px";
|
||||
pop.classList.add("above");
|
||||
}else{
|
||||
pop.classList.remove("above");
|
||||
}
|
||||
|
||||
//-- switch left
|
||||
if(left - popRect.width <= 0) {
|
||||
pop.style.left = left + "px";
|
||||
pop.classList.add("left");
|
||||
}else{
|
||||
pop.classList.remove("left");
|
||||
}
|
||||
|
||||
//-- switch right
|
||||
if(left + popRect.width / 2 >= iwidth) {
|
||||
//-- TEMP MOVE: 300
|
||||
pop.style.left = left - 300 + "px";
|
||||
|
||||
popRect = pop.getBoundingClientRect();
|
||||
pop.style.left = left - popRect.width + "px";
|
||||
//-- switch above / below again
|
||||
if(popRect.height + top >= iheight - 25) {
|
||||
pop.style.top = top - popRect.height + "px";
|
||||
pop.classList.add("above");
|
||||
}else{
|
||||
pop.classList.remove("above");
|
||||
}
|
||||
|
||||
pop.classList.add("right");
|
||||
}else{
|
||||
pop.classList.remove("right");
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
function onPop(){
|
||||
popups[id].classList.add("on");
|
||||
}
|
||||
|
||||
function offPop(){
|
||||
popups[id].classList.remove("on");
|
||||
}
|
||||
|
||||
function hidePop(){
|
||||
setTimeout(function(){
|
||||
popups[id].classList.remove("show");
|
||||
}, 100);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
if(callback) callback();
|
||||
|
||||
}
|
||||
|
||||
EPUBJS.Hooks.register("beforeChapterDisplay").smartimages = function(callback, chapter){
|
||||
|
||||
var image = chapter.doc.querySelectorAll('img'),
|
||||
items = Array.prototype.slice.call(image),
|
||||
iheight = chapter.iframe.height,
|
||||
oheight;
|
||||
|
||||
items.forEach(function(item){
|
||||
|
||||
function size() {
|
||||
var itemRect = item.getBoundingClientRect(),
|
||||
height = itemRect.height,
|
||||
top = itemRect.top;
|
||||
|
||||
iheight = chapter.iframe.height;
|
||||
|
||||
|
||||
if(height + top >= iheight) {
|
||||
|
||||
if(top < iheight/2) {
|
||||
item.style.maxHeight = iheight - top + "px";
|
||||
item.style.width= "auto";
|
||||
}else{
|
||||
|
||||
item.style.maxHeight = (height < iheight ? height : iheight) + "px";
|
||||
item.style.marginTop = iheight - top + "px";
|
||||
item.style.width= "auto";
|
||||
}
|
||||
|
||||
}else{
|
||||
item.style.removeProperty('max-height');
|
||||
item.style.removeProperty('margin-top');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
chapter.book.listenUntil("book:resized", "book:chapterDestroy", size);
|
||||
|
||||
size();
|
||||
|
||||
});
|
||||
|
||||
if(callback) callback();
|
||||
|
||||
}
|
||||
|
||||
EPUBJS.Hooks.register("beforeChapterDisplay").transculsions = function(callback, chapter){
|
||||
/*
|
||||
<aside ref="http://www.youtube.com/embed/DUL6MBVKVLI?html5=1" transclusion="video" width="560" height="315">
|
||||
<a href="http://www.youtube.com/embed/DUL6MBVKVLI"> Watch the National Geographic: The Last Roll of Kodachrome</a>
|
||||
</aside>
|
||||
*/
|
||||
|
||||
var trans = chapter.doc.querySelectorAll('[transclusion]'),
|
||||
items = Array.prototype.slice.call(trans);
|
||||
|
||||
items.forEach(function(item){
|
||||
var src = item.getAttribute("ref"),
|
||||
iframe = document.createElement('iframe'),
|
||||
orginal_width = item.getAttribute("width"),
|
||||
orginal_height = item.getAttribute("height"),
|
||||
parent = item.parentNode,
|
||||
width = orginal_width,
|
||||
height = orginal_height,
|
||||
ratio;
|
||||
|
||||
|
||||
function size() {
|
||||
width = orginal_width;
|
||||
height = orginal_height;
|
||||
|
||||
if(width > chapter.colWidth){
|
||||
ratio = chapter.colWidth / width;
|
||||
|
||||
width = chapter.colWidth;
|
||||
height = height * ratio;
|
||||
}
|
||||
|
||||
iframe.width = width;
|
||||
iframe.height = height;
|
||||
}
|
||||
|
||||
|
||||
size();
|
||||
|
||||
//-- resize event
|
||||
|
||||
|
||||
chapter.book.listenUntil("book:resized", "book:chapterDestroy", size);
|
||||
|
||||
iframe.src = src;
|
||||
|
||||
//<iframe width="560" height="315" src="http://www.youtube.com/embed/DUL6MBVKVLI" frameborder="0" allowfullscreen="true"></iframe>
|
||||
parent.replaceChild(iframe, item);
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
if(callback) callback();
|
||||
|
||||
|
||||
}
|
405
build/reader.js
Normal file
|
@ -0,0 +1,405 @@
|
|||
/*! FuturePress - v0.1.0 - 2013-06-04 */
|
||||
|
||||
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);
|
||||
}
|
||||
|
||||
loadSettings();
|
||||
//-- Create a new book object,
|
||||
// this will create an iframe in the el with the ID provided
|
||||
Book = new EPUBJS.Book("area");
|
||||
|
||||
//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.listen("book:online", goOnline);
|
||||
Book.listen("book:offline", goOffline);
|
||||
|
||||
//Book.registerHook("beforeChapterDisplay", EPUBJS.Hooks.transculsions.insert);
|
||||
|
||||
//-- Start loading / parsing of the book.
|
||||
// This must be done AFTER adding listeners or hooks
|
||||
Book.start(bookURL);
|
||||
|
||||
//-- Wait for Dom ready to handle jquery
|
||||
$(function() {
|
||||
controls();
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
function meta(){
|
||||
var title = Book.getTitle(),
|
||||
author = 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(){
|
||||
var contents = Book.getTOC(),
|
||||
$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
|
||||
|
||||
if(!Book.useHash){
|
||||
Book.show(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", "img/save.png");
|
||||
|
||||
}
|
||||
|
||||
function goOffline(){
|
||||
var $icon = $("#store");
|
||||
offline = true;
|
||||
$icon.attr("src", "img/saved.png");
|
||||
|
||||
}
|
||||
|
||||
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"),
|
||||
$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();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
//-- TODO: This doesn't seem to work
|
||||
$window.bind("touchy-swipe", function(event, phase, $target, data){
|
||||
|
||||
if(data.direction = "left"){
|
||||
Book.nextPage();
|
||||
}
|
||||
|
||||
if(data.direction = "right"){
|
||||
Book.prevPage();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
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", "img/close.png");
|
||||
}
|
||||
|
||||
function hideSidebar(){
|
||||
$book.css("pointer-events", "visible");
|
||||
$sidebar.removeClass("open");
|
||||
$main.removeClass("closed");
|
||||
$icon.attr("src", "img/menu-icon.png");
|
||||
}
|
||||
|
||||
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);
|
||||
//-- 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;
|
||||
}
|
||||
});
|
0
css/normalize.css → demo/css/normalize.css
vendored
0
img/.gitignore → demo/img/.gitignore
vendored
Before Width: | Height: | Size: 5 KiB After Width: | Height: | Size: 5 KiB |
Before Width: | Height: | Size: 7 KiB After Width: | Height: | Size: 7 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1 KiB After Width: | Height: | Size: 1 KiB |
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 947 B After Width: | Height: | Size: 947 B |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 278 B After Width: | Height: | Size: 278 B |
|
@ -11,8 +11,8 @@
|
|||
<link rel="stylesheet" href="css/normalize.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
|
||||
<script src="dist/libs/jquery-1.9.0.min.js"></script>
|
||||
<script src="dist/libs/modernizr-2.6.2.min.js"></script>
|
||||
<script src="js/libs/jquery-1.9.0.min.js"></script>
|
||||
<script src="js/libs/modernizr-2.6.2.min.js"></script>
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
|
@ -20,26 +20,26 @@
|
|||
if (document.readyState == "complete") {
|
||||
EPUBJS.VERSION = "0.1.6";
|
||||
|
||||
EPUBJS.filePath = "/epubjs/dist/";
|
||||
EPUBJS.filePath = "js/";
|
||||
fileStorage.filePath = EPUBJS.filePath + "libs/";
|
||||
|
||||
EPUBJSR.app.init("moby-dick");
|
||||
EPUBJSR.app.init("demo/moby-dick");
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<!-- Render -->
|
||||
<script src="dist/render.min.js"></script>
|
||||
<script src="js/epub.min.js"></script>
|
||||
|
||||
<!-- Hooks -->
|
||||
<script async src="dist/hooks/hooks.min.js"></script>
|
||||
<script async src="js/hooks.min.js"></script>
|
||||
|
||||
<!-- Reader -->
|
||||
<script src="dist/reader.min.js"></script>
|
||||
<script src="js/reader.min.js"></script>
|
||||
|
||||
<!-- fileStorage -->
|
||||
<script src="dist/libs/fileStorage.min.js"></script>
|
||||
<script src="js/libs/fileStorage.min.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
1
demo/js/epub.min.js
vendored
Normal file
1
demo/js/hooks.min.js
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
EPUBJS.Hooks.register("beforeChapterDisplay").endnotes=function(e,t){var n=t.doc.querySelectorAll("a[href]"),r=Array.prototype.slice.call(n),i="epub:type",s="noteref",o={};EPUBJS.core.addCss("css/popup.css",!1,t.doc.head),r.forEach(function(e){function d(){var n,r=t.iframe.height,i=t.iframe.width,s,f,l=225;p||(f=a.cloneNode(!0),p=f.querySelector("p")),o[u]||(o[u]=document.createElement("div"),o[u].setAttribute("class","popup"),pop_content=document.createElement("div"),o[u].appendChild(pop_content),pop_content.appendChild(p),pop_content.setAttribute("class","pop_content"),t.bodyEl.appendChild(o[u]),o[u].addEventListener("mouseover",v,!1),o[u].addEventListener("mouseout",m,!1),t.book.listenUntil("book:pageChanged","book:chapterDestroy",g),t.book.listenUntil("book:pageChanged","book:chapterDestroy",m)),f=o[u],itemRect=e.getBoundingClientRect(),c=itemRect.left,h=itemRect.top,f.classList.add("show"),popRect=f.getBoundingClientRect(),f.style.left=c-popRect.width/2+"px",f.style.top=h+"px",l>r/2.5&&(l=r/2.5,pop_content.style.maxHeight=l+"px"),popRect.height+h>=r-25?(f.style.top=h-popRect.height+"px",f.classList.add("above")):f.classList.remove("above"),c-popRect.width<=0?(f.style.left=c+"px",f.classList.add("left")):f.classList.remove("left"),c+popRect.width/2>=i?(f.style.left=c-300+"px",popRect=f.getBoundingClientRect(),f.style.left=c-popRect.width+"px",popRect.height+h>=r-25?(f.style.top=h-popRect.height+"px",f.classList.add("above")):f.classList.remove("above"),f.classList.add("right")):f.classList.remove("right")}function v(){o[u].classList.add("on")}function m(){o[u].classList.remove("on")}function g(){setTimeout(function(){o[u].classList.remove("show")},100)}var n=e.getAttribute(i),r,u,a,f,l,c,h,p;if(n!=s)return;r=e.getAttribute("href"),u=r.replace("#",""),a=t.doc.getElementById(u),e.addEventListener("mouseover",d,!1),e.addEventListener("mouseout",g,!1)}),e&&e()},EPUBJS.Hooks.register("beforeChapterDisplay").smartimages=function(e,t){var n=t.doc.querySelectorAll("img"),r=Array.prototype.slice.call(n),i=t.iframe.height,s;r.forEach(function(e){function n(){var n=e.getBoundingClientRect(),r=n.height,s=n.top;i=t.iframe.height,r+s>=i?s<i/2?(e.style.maxHeight=i-s+"px",e.style.width="auto"):(e.style.maxHeight=(r<i?r:i)+"px",e.style.marginTop=i-s+"px",e.style.width="auto"):(e.style.removeProperty("max-height"),e.style.removeProperty("margin-top"))}t.book.listenUntil("book:resized","book:chapterDestroy",n),n()}),e&&e()},EPUBJS.Hooks.register("beforeChapterDisplay").transculsions=function(e,t){var n=t.doc.querySelectorAll("[transclusion]"),r=Array.prototype.slice.call(n);r.forEach(function(e){function l(){u=i,a=s,u>t.colWidth&&(f=t.colWidth/u,u=t.colWidth,a*=f),r.width=u,r.height=a}var n=e.getAttribute("ref"),r=document.createElement("iframe"),i=e.getAttribute("width"),s=e.getAttribute("height"),o=e.parentNode,u=i,a=s,f;l(),t.book.listenUntil("book:resized","book:chapterDestroy",l),r.src=n,o.replaceChild(r,e)}),e&&e()};
|
|
@ -1,2 +1,2 @@
|
|||
/*! fileStorage - v0.1.0 - 2013-03-28 */var fileStorage = fileStorage || {};
|
||||
/*! fileStorage - v0.1.0 - 2013-06-04 */var fileStorage = fileStorage || {};
|
||||
var _requestFileSystem=self.requestFileSystem||self.webkitRequestFileSystem;const DBSIZE=5242880,DBTYPE=TEMPORARY;self.onmessage=function(e){var t=e.data;self.request(t,function(e){self.save(t,e,function(){self.postMessage(t)})})},self.openFs=function(e){if(self._fs){e&&e(self._fs);return}_requestFileSystem(DBTYPE,DBSIZE,function(t){self._fs=t,e&&e(t)},self.failure)},self.request=function(e,t){var n=new self.loadFile(e);n.succeeded=function(e){t&&t(e)},n.failed=function(e){self.postMessage("failed: "+e.toString())},n.start()},self.save=function(e,t,n){self.openFs(function(r){var i=e.split("/").slice(0,-1);self.createDir(r.root,i),r.root.getFile(e,{create:!0},function(r){r.createWriter(function(r){r.onwriteend=function(e){n(e)},r.onerror=function(t){self.postMessage("write error:"+self.errorHandler(err)+" path="+e)},r.write(t)})},self.failure)})},self.createDir=function(e,t){if(t[0]=="."||t[0]=="")t=t.slice(1);e.getDirectory(t[0],{create:!0},function(e){t.length&&createDir(e,t.slice(1))},self.failure)},self.failure=function(e){self.postMessage("failed: "+self.errorHandler(e))},self.errorHandler=function(e){switch(e.code){case FileError.QUOTA_EXCEEDED_ERR:return"QUOTA_EXCEEDED_ERR";case FileError.NOT_FOUND_ERR:return"NOT_FOUND_ERR";case FileError.SECURITY_ERR:return"SECURITY_ERR";case FileError.INVALID_MODIFICATION_ERR:return"INVALID_MODIFICATION_ERR";case FileError.INVALID_STATE_ERR:return"INVALID_STATE_ERR";default:return"Unknown Error"}},self.loadFile=function(e,t){var n=new XMLHttpRequest;return this.succeeded=function(e){t&&t(e)},this.failed=function(e){console.log("Error:",e)},this.start=function(){var t=this;n.open("GET",e,!0),n.responseType="blob",n.onload=function(e){this.status==200&&t.succeeded(this.response)},n.onerror=function(e){t.failed(this.status)},n.send()},{start:this.start,succeeded:this.succeeded,failed:this.failed}},self.openFs();
|
0
dist/libs/modernizr-2.6.2.min.js → demo/js/libs/modernizr-2.6.2.min.js
vendored
Executable file → Normal file
1
demo/js/libs/zip.min.js
vendored
Normal file
1
demo/js/reader.min.js
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
var EPUBJSR=EPUBJSR||{};EPUBJSR.app={},EPUBJSR.app.init=function(e){"use strict";function s(n){var s=window.location.search.match(/book=(.*)/),n=n||(s?s[1]:"moby-dick");EPUBJS.core.crossBrowserColumnCss(),i=e(window).width(),i>550?e("#main").width(i-r):e("#main").width(i),a(),t=new EPUBJS.Book("area"),t.listen("book:metadataReady",o),t.listen("book:tocReady",u),t.listen("book:bookReady",l),t.listen("book:chapterReady",p),t.listen("book:online",c),t.listen("book:offline",h),t.start(n),e(function(){d()})}function o(){var n=t.getTitle(),r=t.getCreator(),i=e("#book-title"),s=e("#chapter-title"),o=e("#title-seperator");document.title=n+" – "+r,i.html(n),s.html(r),o.show()}function u(){var n=t.getTOC(),r=e("#toc"),i,s;r.empty(),s=f(n,1),r.append(s),i=e(".toc_link"),i.on("click",function(n){var r=e(this),i=r.data("url");e(".openChapter").removeClass("openChapter"),r.parents("li").addClass("openChapter"),t.useHash||(t.show(i),n.preventDefault())})}function a(){var n="";localStorage.getItem("fontSize")?n=localStorage.getItem("fontSize"):(n="medium",localStorage.setItem("fontSize",n));var r=e("#settingsPanel");r.append("<ul></ul>");var i=e("<li><h3></h3></li>"),s=e("<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>");i.find("h3").text("Font Size").after(s),r.find("ul").append(i);var o=e('input[name="fontSize"]');o.each(function(){e(this).attr("value")==n&&e(this).attr("checked","checked"),e(this).on("click",function(){localStorage.setItem("fontSize",e(this).attr("value")),t.iframe.contentDocument.location.reload(!0)})})}function f(t,n){var r=e("<ul>"),i=n==1?"chapter":"section";return t.forEach(function(t){var s,o=e("<li id='toc-"+t.id+"'>"),u=e("<a class='toc_link "+i+"' href='#/"+t.href+"' data-url='"+t.href+"'>"+t.label+"</a>");o.append(u),t.subitems&&t.subitems.length&&(n++,s=f(t.subitems,n),o.append(s)),r.append(o)}),r}function l(){var n=e("#divider"),r=e("#loader");r.hide(),t.single||n.addClass("show")}function c(){var t=e("#store");n=!1,t.attr("src","img/save.png")}function h(){var t=e("#store");n=!0,t.attr("src","img/saved.png")}function p(t){var n=t.msg,r=e("#toc-"+n),i=e(".currentChapter");r.length&&(i.removeClass("currentChapter"),r.addClass("currentChapter"))}function d(){function y(){f.addClass("open"),u.addClass("closed"),c.attr("src","img/close.png")}function b(){a.css("pointer-events","visible"),f.removeClass("open"),u.removeClass("closed"),c.attr("src","img/menu-icon.png")}function w(){v.hide(),d.show()}function E(){d.hide(),v.show()}var s=e("#next"),o=e("#prev"),u=e("#main"),a=e("#area"),f=e("#sidebar"),l=e("#open"),c=l.find("img"),h=e("#network"),p=e("#setting"),d=e("#settingsPanel"),v=e("#toc"),m=e(window);m.on("resize",function(){i=e(window).width(),i>550?u.width(i-r):u.width(i)}),s.on("click",function(){t.nextPage()}),o.on("click",function(){t.prevPage()}),p.on("click",function(){d.is(":visible")?E():w()}),m.bind("touchy-swipe",function(e,n,r,i){(i.direction="left")&&t.nextPage(),(i.direction="right")&&t.prevPage()});var g=!1;e(document).keydown(function(e){if(g)return;if(e.keyCode==37)return o.trigger("click"),g=!0,setTimeout(function(){g=!1},100),!1;if(e.keyCode==39)return s.trigger("click"),g=!0,setTimeout(function(){g=!1},100),!1}),l.on("click",function(){f.hasClass("open")?b():y()}),h.on("click",function(){n=!n,t.fromStorage(n)})}var t,n=!1,r=0,i;return s}(jQuery),jQuery.fn.extend({clickOutside:function(e,t){var n=this;return jQuery(document).on("click.offer",function(r){if(t&&jQuery.inArray(r.target,t)>-1)return;if(jQuery.contains(n[0],r.target))return;jQuery(document).off("click.offer"),e(r,n)}),this}});
|
|
@ -15,9 +15,6 @@ Moby-Dick</title><link rel="stylesheet" href="css/stylesheet.css" type="text/css
|
|||
<p><span class="audio" id="c001s0001">Call me Ishmael.</span> <span class="audio" id="c001s0002">Some years ago—never mind how long precisely—having little or no money in my purse, and nothing particular to interest me on shore, I thought I would sail about a little and see the watery part of the world.</span> <span class="audio" id="c001s0003">It is a way I have of driving off the spleen and regulating the circulation.</span> <span class="audio" id="c001s0004">Whenever I find myself growing grim about the mouth; whenever it is a damp, drizzly November in my soul; whenever I find myself involuntarily pausing before coffin warehouses, and bringing up the rear of every funeral I meet; and especially whenever my hypos get such an upper hand of me, that it requires a strong moral principle to prevent me from deliberately stepping into the street, and methodically knocking people’s hats off—then, I account it high time to get to sea as soon as I can.</span> <span class="audio" id="c001s0005">This is my substitute for pistol and ball.</span> <span class="audio" id="c001s0006">With a philosophical flourish Cato throws himself upon his sword; I quietly take to the ship.</span> <span class="audio" id="c001s0007">There is nothing surprising in this.</span> <span class="audio" id="c001s0008">If they but knew it, almost all men in their degree, some time or other, cherish very nearly the same feelings towards the ocean with me.</span></p>
|
||||
<p><span class="audio" id="c001p0002">There now is your insular city of the Manhattoes, belted round by wharves as Indian isles by coral reefs—commerce surrounds it with her surf. Right and left, the streets take you waterward. Its extreme downtown is the battery, where that noble mole is washed by waves, and cooled by breezes, which a few hours previous were out of sight of land. Look at the crowds of water-gazers there.</span></p>
|
||||
<p><span class="audio" id="c001p0003">Circumambulate the city of a dreamy Sabbath afternoon. Go from Corlears Hook to Coenties Slip, and from thence, by Whitehall, northward. What do you see?—Posted like silent sentinels all around the town, stand thousands upon thousands of mortal men fixed in ocean reveries. Some leaning against the spiles; some seated upon the pier-heads; some looking over the bulwarks of ships from China; some high aloft in the rigging, as if striving to get a still better seaward peep. But these are all landsmen; of week days pent up in lath and plaster—tied to counters, nailed to benches, clinched to desks. How then is this? Are the green fields gone? What do they here?</span>
|
||||
<aside ref="http://www.youtube.com/embed/DUL6MBVKVLI?html5=1" transclusion="video" width="560" height="315">
|
||||
<a href="http://www.youtube.com/embed/DUL6MBVKVLI"> Watch the National Geographic: The Last Roll of Kodachrome</a>
|
||||
</aside>
|
||||
</p>
|
||||
<p><span class="audio" id="c001p0004">But look! here come more crowds, pacing straight for the water, and seemingly bound for a dive. Strange! Nothing will content them but the extremest limit of the land; loitering under the shady lee of yonder warehouses will not suffice. No. They must get just as nigh the water as they possibly can without falling in. And there they stand—miles of them—leagues. Inlanders all, they come from lanes and alleys, streets and avenues—north, east, south, and west. Yet here they all unite. Tell me, does the magnetic virtue of the needles of the compasses of all those ships attract them thither?</span></p>
|
||||
<p><span class="audio" id="c001p0005">Once more. Say you are in the country; in some high land of lakes. Take almost any path you please, and ten to one it carries you down in a dale, and leaves you there by a pool in the stream. There is magic in it. Let the most absent-minded of men be plunged in his deepest reveries—stand that man on his legs, set his feet a-going, and he will infallibly lead you to water, if water there be in all that region. Should you ever be athirst in the great American desert, try this experiment, if your caravan happen to be supplied with a metaphysical professor. Yes, as every one knows, meditation and water are wedded for ever.</span></p>
|