mirror of
https://github.com/futurepress/epub.js.git
synced 2025-10-04 15:09:16 +02:00
new namespaces, strict mode, toc updated, jump to links
This commit is contained in:
parent
78e1c05ab0
commit
ce18f4ff15
13 changed files with 439 additions and 155 deletions
|
@ -1,9 +1,13 @@
|
|||
FP.app = {};
|
||||
var FPR = FPR || {};
|
||||
|
||||
FP.app.init = (function($){
|
||||
FPR.app = {};
|
||||
|
||||
FPR.app.init = (function($){
|
||||
"use strict";
|
||||
var Book,
|
||||
offline = false;
|
||||
offline = false,
|
||||
sidebarWidth = 40,
|
||||
windowWidth;
|
||||
|
||||
function init(bookURL){
|
||||
var search = window.location.search.match(/book=(.*)/),
|
||||
|
@ -13,16 +17,24 @@ FP.app.init = (function($){
|
|||
FP.core.crossBrowserColumnCss();
|
||||
|
||||
//-- Set up our sidebar
|
||||
$("#main").width($(window).width()-40);
|
||||
windowWidth = $(window).width();
|
||||
if(windowWidth > 550){
|
||||
$("#main").width(windowWidth-sidebarWidth);
|
||||
}else{
|
||||
$("#main").width(windowWidth);
|
||||
}
|
||||
|
||||
Book = new FP.Book("area");
|
||||
//Book = new FP.Book("area", "/the-hound-of-the-baskervilles/");
|
||||
|
||||
Book.listen("book:metadataReady", meta);
|
||||
Book.listen("book:tocReady", toc);
|
||||
Book.listen("book:chapterReady", chapterChange);
|
||||
Book.listen("book:online", goOnline);
|
||||
Book.listen("book:offline", goOffline);
|
||||
|
||||
//Book.setFootnotes(["glossterm", "footnote"]);//["glossterm", "footnote"]);
|
||||
|
||||
Book.start(bookURL + "/");
|
||||
|
||||
//-- Wait for Dom ready to handle jquery
|
||||
|
@ -34,7 +46,7 @@ FP.app.init = (function($){
|
|||
}
|
||||
|
||||
function meta(){
|
||||
var title = Book.getTitle();
|
||||
var title = Book.getTitle(),
|
||||
author = Book.getCreator(),
|
||||
$title = $("#book-title"),
|
||||
$author = $("#chapter-title");
|
||||
|
@ -46,40 +58,85 @@ FP.app.init = (function($){
|
|||
}
|
||||
|
||||
function toc(){
|
||||
var contents = Book.getTOC();
|
||||
$toc = $("#toc");
|
||||
var contents = Book.getTOC(),
|
||||
$toc = $("#toc"),
|
||||
$items;
|
||||
|
||||
$toc.empty();
|
||||
$items = generateTocItems(contents);
|
||||
|
||||
contents.forEach(function(item){
|
||||
$wrapper = $("<li>");
|
||||
|
||||
$item = $("<a href='#"+item.href+"' data-spinepos='"+item.spinePos+"'>"+item.label+"</a>");
|
||||
|
||||
//-- Handle sub items later
|
||||
/*
|
||||
if(item.subitems.length){
|
||||
$subitems = $("<ul>");
|
||||
item.subitems.forEach(function(subitem){
|
||||
$subitem = $("<li><a href='#"+subitem.href+"' data-spinepos='"+subitem.spinePos+"'>"+subitem.label+"</a></li>");
|
||||
$subitems.append($subitem);
|
||||
});
|
||||
$item.append($subitems);
|
||||
}
|
||||
*/
|
||||
|
||||
$item.on("click", function(e){
|
||||
$this = $(this);
|
||||
Book.displayChapter($this.data("spinepos"));
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$wrapper.append($item);
|
||||
$toc.append($wrapper);
|
||||
});
|
||||
$toc.append($items);
|
||||
|
||||
// contents.forEach(function(item){
|
||||
// $wrapper = $("<li id='toc-"+item.id+"'>");
|
||||
//
|
||||
// $item = $("<a href='#"+item.href+"' data-spinepos='"+item.spinePos+"'>"+item.label+"</a>");
|
||||
//
|
||||
//
|
||||
// $item.on("click", function(e){
|
||||
// $this = $(this);
|
||||
// Book.displayChapter($this.data("spinepos"));
|
||||
// e.preventDefault();
|
||||
// });
|
||||
//
|
||||
// $wrapper.append($item);
|
||||
//
|
||||
// if(item.subitems && item.subitems.length){
|
||||
// $subitems = $("<ul>");
|
||||
// item.subitems.forEach(function(subitem){
|
||||
// //console.log("subitem", subitem)
|
||||
// $subitem = $("<li id='toc-"+subitem.id+"'><a href='#"+subitem.href+"' data-spinepos='"+subitem.spinePos+"'>"+subitem.label+"</a></li>");
|
||||
// $subitems.append($subitem);
|
||||
// });
|
||||
// $wrapper.append($subitems);
|
||||
// }
|
||||
//
|
||||
// $toc.append($wrapper);
|
||||
// });
|
||||
|
||||
|
||||
}
|
||||
|
||||
function generateTocItems(contents){
|
||||
var $container = $("<ul>");
|
||||
|
||||
|
||||
contents.forEach(function(item){
|
||||
var $subitems,
|
||||
$wrapper = $("<li id='toc-"+item.id+"'>"),
|
||||
$item = $("<a href='"+item.href+"'>"+item.label+"</a>");
|
||||
|
||||
$item.data("spinepos", item.spinePos);
|
||||
|
||||
if(item.section) {
|
||||
$item.data("section", item.section);
|
||||
}
|
||||
|
||||
$item.on("click", function(e){
|
||||
var $this = $(this),
|
||||
url = $this.attr("href");
|
||||
//spinepos = $this.data("spinepos"),
|
||||
//section = $this.data("section") || false;
|
||||
|
||||
$(".openChapter").removeClass("openChapter");
|
||||
$this.parent().addClass("openChapter");
|
||||
|
||||
Book.show(url);
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$wrapper.append($item);
|
||||
|
||||
if(item.subitems && item.subitems.length){
|
||||
$subitems = generateTocItems(item.subitems);
|
||||
$wrapper.append($subitems);
|
||||
}
|
||||
|
||||
$container.append($wrapper);
|
||||
});
|
||||
return $container;
|
||||
}
|
||||
|
||||
function goOnline(){
|
||||
var $icon = $("#store");
|
||||
|
@ -94,22 +151,38 @@ FP.app.init = (function($){
|
|||
$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"),
|
||||
$window = $(window),
|
||||
sidebarWidth = 40;
|
||||
$window = $(window);
|
||||
|
||||
|
||||
$window.on("resize", function(){
|
||||
$main.width($window.width()-sidebarWidth);
|
||||
windowWidth = $(window).width();
|
||||
if(windowWidth > 550){
|
||||
$main.width(windowWidth-sidebarWidth);
|
||||
}else{
|
||||
$main.width(windowWidth);
|
||||
}
|
||||
});
|
||||
|
||||
$next.on("click", function(){
|
||||
|
@ -143,21 +216,35 @@ FP.app.init = (function($){
|
|||
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");
|
||||
}
|
||||
|
||||
$open.on("click", function(){
|
||||
if($sidebar.hasClass("open")){
|
||||
setTimeout(function(){
|
||||
$sidebar.removeClass("open");
|
||||
}, 500);
|
||||
$main.removeClass("closed");
|
||||
$icon.attr("src", "img/menu-icon.png");
|
||||
hideSidebar();
|
||||
}else{
|
||||
$sidebar.addClass("open");
|
||||
$main.addClass("closed");
|
||||
$icon.attr("src", "img/close.png");
|
||||
showSidebar();
|
||||
|
||||
$open.clickOutside(function(){
|
||||
hideSidebar();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
$network.on("click", function(){
|
||||
offline = !offline;
|
||||
Book.fromStorage(offline);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue