Refactored Demo Code, New Jquery, RSVP versions, font icons

build/hooks.js

@@ -183,6 +183,35 @@ EPUBJS.Hooks.register("beforeChapterDisplay").mathml = function(callback, render
     }
 }
 
+EPUBJS.Hooks.register("beforeChapterDisplay").pageTurns = function(callback, renderer){
+
+		var lock = false;
+
+		$(renderer.docEl).keydown(function(e){
+			if(lock) return;
+
+			if (e.keyCode == 37) { 
+				renderer.book.prevPage();
+				lock = true;
+				setTimeout(function(){
+					lock = false;
+				}, 100);
+				return false;
+			}
+
+			if (e.keyCode == 39) { 
+				renderer.book.nextPage();
+				lock = true;
+				setTimeout(function(){
+					lock = false;
+				}, 100);
+				return false;
+			}
+
+		});
+
+		if(callback) callback();
+}
 EPUBJS.Hooks.register("beforeChapterDisplay").smartimages = function(callback, chapter){
 		var images = chapter.doc.querySelectorAll('img'),
 			items = Array.prototype.slice.call(images),

build/hooks.min.js

@@ -1 +1 @@
-EPUBJS.Hooks.register("beforeChapterDisplay").endnotes=function(a,b){var c=b.doc.querySelectorAll("a[href]"),d=Array.prototype.slice.call(c),e="epub:type",f="noteref",g=EPUBJS.core.folder(location.pathname),h=g+EPUBJS.cssPath||g,i={};EPUBJS.core.addCss(h+"popup.css",!1,b.doc.head),d.forEach(function(a){function c(){var c,e=b.iframe.height,f=b.iframe.width,j=225;o||(c=l.cloneNode(!0),o=c.querySelector("p")),b.replaceLinks.bind(this),i[k]||(i[k]=document.createElement("div"),i[k].setAttribute("class","popup"),pop_content=document.createElement("div"),i[k].appendChild(pop_content),pop_content.appendChild(o),pop_content.setAttribute("class","pop_content"),b.bodyEl.appendChild(i[k]),i[k].addEventListener("mouseover",d,!1),i[k].addEventListener("mouseout",g,!1),b.book.on("renderer:pageChanged",h,this),b.book.on("renderer:pageChanged",g,this)),c=i[k],itemRect=a.getBoundingClientRect(),m=itemRect.left,n=itemRect.top,c.classList.add("show"),popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width/2+"px",c.style.top=n+"px",j>e/2.5&&(j=e/2.5,pop_content.style.maxHeight=j+"px"),popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),m-popRect.width<=0?(c.style.left=m+"px",c.classList.add("left")):c.classList.remove("left"),m+popRect.width/2>=f?(c.style.left=m-300+"px",popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width+"px",popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),c.classList.add("right")):c.classList.remove("right")}function d(){i[k].classList.add("on")}function g(){i[k].classList.remove("on")}function h(){setTimeout(function(){i[k].classList.remove("show")},100)}var j,k,l,m,n,o,p=a.getAttribute(e);p==f&&(j=a.getAttribute("href"),k=j.replace("#",""),l=b.doc.getElementById(k),a.addEventListener("mouseover",c,!1),a.addEventListener("mouseout",h,!1))}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").mathml=function(a,b){if(-1!==b.currentChapter.properties.indexOf("mathml")){b.iframe.contentWindow.mathmlCallback=a;var c=document.createElement("script");c.type="text/x-mathjax-config",c.innerHTML='        MathJax.Hub.Register.StartupHook("End",function () {           window.mathmlCallback();         });        MathJax.Hub.Config({jax: ["input/TeX","input/MathML","output/SVG"],extensions: ["tex2jax.js","mml2jax.js","MathEvents.js"],TeX: {extensions: ["noErrors.js","noUndefined.js","autoload-all.js"]},MathMenu: {showRenderer: false},menuSettings: {zoom: "Click"},messageStyle: "none"});                 ',b.doc.body.appendChild(c),EPUBJS.core.addScript("http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",null,b.doc.head)}else a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").smartimages=function(a,b){var c=b.doc.querySelectorAll("img"),d=Array.prototype.slice.call(c),e=b.bodyEl.clientHeight;d.forEach(function(a){function c(){var c,d=a.getBoundingClientRect(),f=d.height,g=d.top,h=a.getAttribute("data-height"),i=h||f;e=b.docEl.clientHeight,0>g&&(g=0),i+g>=e?(e/2>g?(c=e-g,a.style.maxHeight=c+"px",a.style.width="auto"):(c=e>i?i:e,a.style.maxHeight=c+"px",a.style.marginTop=e-g+"px",a.style.width="auto",console.log(c)),a.setAttribute("data-height",c)):(a.style.removeProperty("max-height"),a.style.removeProperty("margin-top"))}a.addEventListener("load",c,!1),b.on("renderer:resized",c),b.on("renderer:chapterUnloaded",function(){a.removeEventListener("load",c),b.off("renderer:resized",c)}),c()}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").transculsions=function(a,b){var c=b.doc.querySelectorAll("[transclusion]"),d=Array.prototype.slice.call(c);d.forEach(function(a){function c(){j=g,k=h,j>b.colWidth&&(d=b.colWidth/j,j=b.colWidth,k*=d),f.width=j,f.height=k}var d,e=a.getAttribute("ref"),f=document.createElement("iframe"),g=a.getAttribute("width"),h=a.getAttribute("height"),i=a.parentNode,j=g,k=h;c(),b.book.listenUntil("book:resized","book:chapterDestroy",c),f.src=e,i.replaceChild(f,a)}),a&&a()};
+EPUBJS.Hooks.register("beforeChapterDisplay").endnotes=function(a,b){var c=b.doc.querySelectorAll("a[href]"),d=Array.prototype.slice.call(c),e="epub:type",f="noteref",g=EPUBJS.core.folder(location.pathname),h=g+EPUBJS.cssPath||g,i={};EPUBJS.core.addCss(h+"popup.css",!1,b.doc.head),d.forEach(function(a){function c(){var c,e=b.iframe.height,f=b.iframe.width,j=225;o||(c=l.cloneNode(!0),o=c.querySelector("p")),b.replaceLinks.bind(this),i[k]||(i[k]=document.createElement("div"),i[k].setAttribute("class","popup"),pop_content=document.createElement("div"),i[k].appendChild(pop_content),pop_content.appendChild(o),pop_content.setAttribute("class","pop_content"),b.bodyEl.appendChild(i[k]),i[k].addEventListener("mouseover",d,!1),i[k].addEventListener("mouseout",g,!1),b.book.on("renderer:pageChanged",h,this),b.book.on("renderer:pageChanged",g,this)),c=i[k],itemRect=a.getBoundingClientRect(),m=itemRect.left,n=itemRect.top,c.classList.add("show"),popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width/2+"px",c.style.top=n+"px",j>e/2.5&&(j=e/2.5,pop_content.style.maxHeight=j+"px"),popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),m-popRect.width<=0?(c.style.left=m+"px",c.classList.add("left")):c.classList.remove("left"),m+popRect.width/2>=f?(c.style.left=m-300+"px",popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width+"px",popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),c.classList.add("right")):c.classList.remove("right")}function d(){i[k].classList.add("on")}function g(){i[k].classList.remove("on")}function h(){setTimeout(function(){i[k].classList.remove("show")},100)}var j,k,l,m,n,o,p=a.getAttribute(e);p==f&&(j=a.getAttribute("href"),k=j.replace("#",""),l=b.doc.getElementById(k),a.addEventListener("mouseover",c,!1),a.addEventListener("mouseout",h,!1))}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").mathml=function(a,b){if(-1!==b.currentChapter.properties.indexOf("mathml")){b.iframe.contentWindow.mathmlCallback=a;var c=document.createElement("script");c.type="text/x-mathjax-config",c.innerHTML='        MathJax.Hub.Register.StartupHook("End",function () {           window.mathmlCallback();         });        MathJax.Hub.Config({jax: ["input/TeX","input/MathML","output/SVG"],extensions: ["tex2jax.js","mml2jax.js","MathEvents.js"],TeX: {extensions: ["noErrors.js","noUndefined.js","autoload-all.js"]},MathMenu: {showRenderer: false},menuSettings: {zoom: "Click"},messageStyle: "none"});                 ',b.doc.body.appendChild(c),EPUBJS.core.addScript("http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",null,b.doc.head)}else a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").pageTurns=function(a,b){var c=!1;$(b.docEl).keydown(function(a){return c?void 0:37==a.keyCode?(b.book.prevPage(),c=!0,setTimeout(function(){c=!1},100),!1):39==a.keyCode?(b.book.nextPage(),c=!0,setTimeout(function(){c=!1},100),!1):void 0}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").smartimages=function(a,b){var c=b.doc.querySelectorAll("img"),d=Array.prototype.slice.call(c),e=b.bodyEl.clientHeight;d.forEach(function(a){function c(){var c,d=a.getBoundingClientRect(),f=d.height,g=d.top,h=a.getAttribute("data-height"),i=h||f;e=b.docEl.clientHeight,0>g&&(g=0),i+g>=e?(e/2>g?(c=e-g,a.style.maxHeight=c+"px",a.style.width="auto"):(c=e>i?i:e,a.style.maxHeight=c+"px",a.style.marginTop=e-g+"px",a.style.width="auto",console.log(c)),a.setAttribute("data-height",c)):(a.style.removeProperty("max-height"),a.style.removeProperty("margin-top"))}a.addEventListener("load",c,!1),b.on("renderer:resized",c),b.on("renderer:chapterUnloaded",function(){a.removeEventListener("load",c),b.off("renderer:resized",c)}),c()}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").transculsions=function(a,b){var c=b.doc.querySelectorAll("[transclusion]"),d=Array.prototype.slice.call(c);d.forEach(function(a){function c(){j=g,k=h,j>b.colWidth&&(d=b.colWidth/j,j=b.colWidth,k*=d),f.width=j,f.height=k}var d,e=a.getAttribute("ref"),f=document.createElement("iframe"),g=a.getAttribute("width"),h=a.getAttribute("height"),i=a.parentNode,j=g,k=h;c(),b.book.listenUntil("book:resized","book:chapterDestroy",c),f.src=e,i.replaceChild(f,a)}),a&&a()};

build/reader.js

@@ -383,6 +383,380 @@ EPUBJSR.app.init = (function($){
   return  init;
 
 })(jQuery);
+EPUBJS.reader = {};
+EPUBJS.reader.plugins = {}; //-- Attach extra view as plugins (like search?)
+
+(function(root) {
+
+	var previousReader = root.ePubReader || {};
+
+	var ePubReader = root.ePubReader = function(path, options) {
+		return new EPUBJS.Reader(path, options);
+	};
+
+	_.extend(ePubReader, {
+		noConflict : function() {
+			root.ePubReader = previousReader;
+			return this;
+		}
+	});
+
+	//exports to multiple environments
+	if (typeof define === 'function' && define.amd)
+	//AMD
+	define(function(){ return Reader; });
+	else if (typeof module != "undefined" && module.exports)
+	//Node
+	module.exports = ePubReader;
+
+})(window);
+
+EPUBJS.Reader = function(path, options) {
+	var reader = this;
+	var settings = _.defaults(options || {}, {
+		restore: true
+	});
+	var book = this.book = ePub(path, settings);
+
+	this.settings = settings;
+	this.offline = false;
+	this.sidebarOpen = false;
+
+	book.renderTo("viewer");
+	
+	reader.SettingsView = EPUBJS.reader.SettingsView.call(reader, book);
+	reader.ControlsView = EPUBJS.reader.ControlsView.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);
+			}
+		}
+		
+	});
+
+	book.getMetadata().then(function(meta) {
+		reader.MetaView = EPUBJS.reader.MetaView.call(reader, meta);
+	});
+
+	book.getToc().then(function(toc) {
+		reader.TocView = EPUBJS.reader.TocView.call(reader, toc);
+	});
+	
+	return this;
+};
+
+EPUBJS.reader.MetaView = function(meta) {
+	var title = meta.bookTitle,
+			author = meta.creator;
+
+	var $title = $("#book-title"),
+			$author = $("#chapter-title"),
+			$dash = $("#title-seperator");
+
+		document.title = title+" – "+author;
+
+		$title.html(title);
+		$author.html(author);
+		$dash.show();
+};
+
+EPUBJS.reader.ReaderView = function(book) {
+	var $main = $("#main"),
+			$divider = $("#divider"),
+			$loader = $("#loader"),
+			$next = $("#next"),
+			$prev = $("#prev");
+	
+	var slideIn = function() {
+		$main.removeClass("closed");
+	};
+	
+	var slideOut = function() {
+		$main.addClass("closed");
+	};
+	
+	var showLoader = function() {
+		$loader.show();
+	};
+	
+	var hideLoader = function() {
+		$loader.hide();
+	};
+	
+	var showDivider = function() {
+		$divider.addClass("show");
+	};
+	
+	var hideDivider = function() {
+		$divider.removeClass("show");
+	};
+	
+	var keylock = false;
+	
+	var arrowKeys = function(e) {		
+		if(e.keyCode == 37) { 
+			book.prevPage();
+			$prev.addClass("active");
+
+			keylock = true;
+			setTimeout(function(){
+				keylock = false;
+				$prev.removeClass("active");
+			}, 100);
+
+			 e.preventDefault();
+		}
+		if(e.keyCode == 39) { 
+			book.nextPage();
+			$next.addClass("active");
+			
+			keylock = true;
+			setTimeout(function(){
+				keylock = false;
+				$next.removeClass("active");
+			}, 100);
+			
+			 e.preventDefault();
+		}
+	}
+
+	document.addEventListener('keydown', arrowKeys, false);
+	
+	$next.on("click", function(e){
+		book.nextPage();
+		e.preventDefault();
+	});
+	
+	$prev.on("click", function(e){
+		book.prevPage();
+		e.preventDefault();
+	});
+	
+	//-- Hide the spinning loader
+	hideLoader();
+	
+	//-- If the book is using spreads, show the divider
+	if(!book.single) {
+		showDivider();
+	}
+	
+	return {
+		"slideOut" : slideOut,
+		"slideIn"  : slideIn,
+		"showLoader" : showLoader,
+		"hideLoader" : hideLoader,
+		"showDivider" : showDivider,
+		"hideDivider" : hideDivider
+	};
+};
+
+EPUBJS.reader.ControlsView = function(book) {
+	var reader = this;
+
+	var $store = $("#store"),
+			$fullscreen = $("#fullscreen"),
+			$fullscreenicon = $("#fullscreenicon"),
+			$cancelfullscreenicon = $("#cancelfullscreenicon"),
+			$slider = $("#slider"),
+			$main = $("#main"),
+			$sidebar = $("#sidebar"),
+			$settings = $("#settings"),
+			$bookmark = $("#bookmark");
+			
+	
+	var goOnline = function() {
+		reader.offline = false;
+		// $store.attr("src", $icon.data("save"));
+	};
+
+	var goOffline = function() {
+		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();
+		} else {
+			showSidebar();
+		}
+	});
+	
+	$fullscreen.on("click", function() {
+		screenfull.toggle($('#container')[0]);
+		$fullscreenicon.toggle();
+		$cancelfullscreenicon.toggle();
+	});
+	
+	$settings.on("click", function() {
+		reader.SettingsView.show();
+	});
+
+	$bookmark.on("click", function() {
+		$bookmark.addClass("icon-bookmark");
+		$bookmark.removeClass("icon-bookmark-empty");
+		console.log(reader.book.getCurrentLocationCfi());
+	});
+	
+	return {
+		
+	};
+};
+
+EPUBJS.reader.TocView = function(toc) {
+	var book = this.book;
+	
+	var $list = $("#tocView"),
+			docfrag = document.createDocumentFragment();
+	
+	var currentChapter = false;
+	
+	var generateTocItems = function(toc, level) {
+		var container = document.createElement("ul");
+		
+		if(!level) level = 1;
+
+		toc.forEach(function(chapter) {
+			var listitem = document.createElement("li"),
+					link = document.createElement("a");
+					toggle = document.createElement("a");
+			var subitems;
+			
+			listitem.id = "toc-"+chapter.id;
+
+			link.textContent = chapter.label;
+			link.href = chapter.href;
+			link.classList.add('toc_link');
+
+			listitem.appendChild(link);
+
+			if(chapter.subitems) {
+				level++;
+				subitems = generateTocItems(chapter.subitems, level);
+				toggle.classList.add('toc_toggle');
+				
+				listitem.insertBefore(toggle, link);
+				listitem.appendChild(subitems);
+			}
+			
+			
+			container.appendChild(listitem);
+			
+		});
+		
+		return container;
+	};
+	
+	var onShow = function() {
+		$list.show();
+	};
+	
+	var onHide = function() {
+		$list.hide();
+	};
+	
+	var chapterChange = function(e) {
+		var id = e.id,
+				$item = $list.find("#toc-"+id),
+				$current = $list.find(".currentChapter"),
+				$open = $list.find('.openChapter');
+
+		if($item.length){
+			
+			if($item != $current && $item.has(currentChapter).length > 0) {
+				$current.removeClass("currentChapter");
+			}
+			
+			$item.addClass("currentChapter");
+			
+			// $open.removeClass("openChapter");
+			$item.parents('li').addClass("openChapter");
+		}	  
+	};
+	
+	book.on('renderer:chapterDisplayed', chapterChange);
+
+	var tocitems = generateTocItems(toc);
+	
+	docfrag.appendChild(tocitems);
+	
+	$list.append(docfrag);
+	$list.find(".toc_link").on("click", function(event){
+			var url = this.getAttribute('href');
+
+			//-- Provide the Book with the url to show
+			//   The Url must be found in the books manifest
+			book.goto(url);
+			
+			$list.find(".currentChapter")
+					.addClass("openChapter")
+					.removeClass("currentChapter");
+					
+			$(this).parent('li').addClass("currentChapter");
+			
+			event.preventDefault();
+	});
+
+	$list.find(".toc_toggle").on("click", function(event){
+			var $el = $(this).parent('li'),
+					open = $el.hasClass("openChapter");
+			
+			if(open){
+				$el.removeClass("openChapter");
+			} else {
+				$el.addClass("openChapter");
+			}
+			event.preventDefault();
+	});
+	
+	return {
+		"show" : onShow,
+		"hide" : onHide
+	};
+};
+
+EPUBJS.reader.SettingsView = function() {
+	var book = this.book;
+
+	var $settings = $("#settingsPanel");
+
+	var onShow = function() {
+		$settings.show();
+	};
+
+	var onHide = function() {
+		$settings.hide();
+	};
+
+	return {
+		"show" : onShow,
+		"hide" : onHide
+	};
+};
 EPUBJSR.search = {};
 
 // Search Server -- https://github.com/futurepress/epubjs-search
@@ -403,7 +777,7 @@ EPUBJSR.search.request = function(q, callback) {
   });
 };
 
-EPUBJSR.search.View = function() {
+EPUBJSR.search.View = function(Book) {
 
   var $searchBox = $("#searchBox"),
       $searchResults = $("#searchResults"),
@@ -461,6 +835,8 @@ EPUBJSR.search.View = function() {
           var $this = $(this),
               cfi = $this.data("cfi");
           
+          e.preventDefault();
+          
           Book.gotoCfi(cfi);
           
           Book.on("renderer:chapterDisplayed", function() {
@@ -468,7 +844,7 @@ EPUBJSR.search.View = function() {
             $(iframeDoc).find('body').highlight(q, { element: 'span' });
           })
           
-          e.preventDefault();
+          
           
         });
         $li.append($item);

demo/css/main.css

@@ -58,14 +58,25 @@ body {
 #titlebar a {
   visibility: hidden;
   width: 18px;
+  height: 20px;
   overflow: hidden;
   display: inline-block;
+  opacity: .5;
 }
 
 #titlebar a::before {
   visibility: visible;
 }
 
+#titlebar a:hover {
+  opacity: .8;
+}
+
+#titlebar a:active {
+  opacity: 1;
+  margin: 1px -1px -1px 1px;
+}
+
 #book-title {
   font-weight: 600;
 }
@@ -157,9 +168,9 @@ body {
   float: left;
 }
 
-#opener #slider {
+/* #opener #slider {
   width: 25px;
-}
+} */
 
 #metainfo {
   display: inline-block;
@@ -185,9 +196,13 @@ body {
   visibility: visible;
 }
 
-
 #controls a:hover {
-  color: #fff;
+  color: #AAA;
+}
+
+#controls a:active {
+  color: #AAA;
+  margin: 1px 0 -1px 6px;
 }
 
 #controls a.active,
@@ -245,11 +260,12 @@ input:-moz-placeholder {
   margin: -33px 0 0 -33px;
 }
 
-#toc {
+#tocView {
   overflow-x: hidden;
   overflow-y: hidden;
   width: 300px;
   height: 100%;
+  padding-top: 40px;
   visibility: hidden;
   -webkit-transition: visibility 0 ease .5s;
   -moz-transition: visibility 0 ease .5s;
@@ -257,21 +273,21 @@ input:-moz-placeholder {
 
 
 
-#sidebar.open #toc {
+#sidebar.open #tocView {
   overflow-y: auto;
   visibility: visible;
   -webkit-transition: visibility 0 ease 0;
   -moz-transition: visibility 0 ease 0;
 }
 
-#toc > ul {
-  margin-top: 50px;
+#tocView > ul{
+  margin-top: 15px;
   margin-bottom: 50px;
   padding-left: 20px;
   display: block;
 }
 
-#toc li {
+#tocView li {
   margin-bottom:10px;
   width: 225px;
   font-family: Georgia, "Times New Roman", Times, serif;
@@ -279,51 +295,70 @@ input:-moz-placeholder {
   text-transform: capitalize;
 }
 
-#toc li:active,
-#toc li.currentChapter
+#tocView li:active,
+#tocView li.currentChapter
 {
   list-style: none;
 }
 
-#toc a {
+#tocView a {
   color: #AAA;
   text-decoration: none;
 }
 
-#toc a.chapter {
+#tocView a.chapter {
   font-size: 1em;
 }
 
-#toc a.section {
+#tocView a.section {
   font-size: .8em;
 }
 
-#toc li.currentChapter > a,
-#toc li a:hover {
+#tocView li.currentChapter > a,
+#tocView li a:hover {
   color: #f1f1f1
 }
 
-#toc li.openChapter > a,
-#toc li a:hover {
+/* #tocView li.openChapter > a, */
+#tocView li a:hover {
   color: #E2E2E2;
 }
 
-#toc li ul {
+#tocView li ul {
   padding-left:10px;
   margin-top: 8px;
   display: none;
 }
 
-#toc li.currentChapter > ul,
-#toc li.openChapter > ul
-{
+#tocView li.currentChapter > ul,
+#tocView li.openChapter > ul {
   display: block;
 }
 
-#toc.hidden {
+#tocView.hidden {
   display: none;
 }
 
+.toc_toggle {
+  display: inline-block;
+  width: 14px;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+}
+
+.toc_toggle:before {
+  content: '▸';
+  color: #fff;
+  margin-right: -4px;
+}
+
+.currentChapter > .toc_toggle:before,
+.openChapter > .toc_toggle:before {
+  content: '▾';
+}
+
 #searchView {
   width: 300px;
   height: 100%;
@@ -467,15 +502,15 @@ input:-moz-placeholder {
   }
   
   
-  #toc {
+  #tocView {
     width: 260px;
   }
   
-  #toc li {
+  #tocView li {
     font-size: 12px;
   }
   
-  #toc > ul{
+  #tocView > ul{
     padding-left: 10px;
     webkit-padding-start:;
   }
@@ -512,14 +547,15 @@ input:-moz-placeholder {
 .icon-edit:before { content: '\e814'; } /* '' */
 .icon-menu:before { content: '\e802'; } /* '' */
 .icon-cog:before { content: '\e813'; } /* '' */
+.icon-resize-full:before { content: '\e812'; } /* '' */
 .icon-cancel-circled:before { content: '\e80e'; } /* '' */
-.icon-resize-small:before { content: '\e808'; } /* '' */
 .icon-up-dir:before { content: '\e80c'; } /* '' */
 .icon-right-dir:before { content: '\e80b'; } /* '' */
 .icon-angle-right:before { content: '\e809'; } /* '' */
 .icon-angle-down:before { content: '\e80a'; } /* '' */
+.icon-right:before { content: '\e815'; } /* '' */
 .icon-list-1:before { content: '\e803'; } /* '' */
 .icon-list-numbered:before { content: '\e801'; } /* '' */
 .icon-columns:before { content: '\e810'; } /* '' */
 .icon-list:before { content: '\e800'; } /* '' */
-.icon-resize-full:before { content: '\e812'; } /* '' */
+.icon-resize-small:before { content: '\e808'; } /* '' */

demo/dev.html

@@ -14,7 +14,7 @@
         <!-- <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";
@@ -27,7 +27,7 @@
                 EPUBJS.cssPath = "css/";
                 // fileStorage.filePath = EPUBJS.filePath;
 
-                EPUBJS.Reader("moby-dick/");
+                var reader = ePubReader("moby-dick/", { reload: true });
               }  
             };
         
@@ -58,10 +58,11 @@
         <script src="../src/renderer.js"></script>
         <script src="../src/epubcfi.js"></script>
         
-        <!-- Plugins -->
+        <!-- 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/reader.js"></script>
@@ -86,7 +87,7 @@
             <a id="notes" class="icon-edit">Notes</a>
            
           </div>
-          <div id="toc">
+          <div id="tocView">
           </div>
           <div id="searchView">
             <ul id="searchResults"></ul>

demo/font/fontello.svg

@@ -0,0 +1,33 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Copyright (C) 2013 by original authors @ fontello.com</metadata>
+<defs>
+<font id="fontello" horiz-adv-x="1000" >
+<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
+<missing-glyph horiz-adv-x="1000" />
+<glyph glyph-name="search" unicode="&#xe807;" d="m643 386q0 103-74 176t-176 74t-177-74t-73-176t73-177t177-73t176 73t74 177z m286-465q0-29-22-50t-50-21q-30 0-50 21l-191 191q-100-69-223-69q-80 0-153 31t-125 84t-84 125t-31 153t31 152t84 126t125 84t153 31t152-31t126-84t84-126t31-152q0-123-69-223l191-191q21-21 21-51z" horiz-adv-x="928.6" />
+<glyph glyph-name="resize-full-1" unicode="&#xe804;" d="m784 111l127 128l0-336l-335 0l128 130l-128 127l79 79z m-431 686l-129-127l128-127l-80-80l-126 128l-128-129l0 335l335 0z m0-637l-129-127l129-130l-335 0l0 336l128-128l128 128z m558 637l0-335l-127 129l-128-128l-79 80l127 127l-128 127l335 0z" horiz-adv-x="928" />
+<glyph glyph-name="cancel-circled2" unicode="&#xe80f;" d="m612 248l-81-82q-6-5-13-5t-13 5l-76 77l-77-77q-5-5-13-5t-13 5l-81 82q-6 5-6 13t6 13l76 76l-76 76q-6 6-6 13t6 13l81 82q6 5 13 5t13-5l77-77l76 77q6 5 13 5t13-5l81-82q6-5 6-13t-6-13l-76-76l76-76q6-6 6-13t-6-13z m120 102q0 83-41 152t-110 111t-152 41t-153-41t-110-111t-41-152t41-152t110-111t153-41t152 41t110 111t41 152z m125 0q0-117-57-215t-156-156t-215-58t-216 58t-155 156t-58 215t58 215t155 156t216 58t215-58t156-156t57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="link" unicode="&#xe80d;" d="m812 171q0 23-15 38l-116 116q-16 16-38 16q-24 0-40-18q1-1 10-10t12-12t9-11t7-14t2-15q0-23-16-38t-38-16q-8 0-15 2t-14 7t-11 9t-12 12t-10 10q-19-17-19-40q0-23 16-38l115-116q15-15 38-15q22 0 38 15l82 81q15 16 15 37z m-392 394q0 22-15 38l-115 115q-16 16-38 16q-22 0-38-15l-82-82q-16-15-16-37q0-22 16-38l116-116q15-15 38-15q23 0 40 17q-2 2-11 11t-12 12t-8 10t-7 14t-2 16q0 22 15 38t38 15q9 0 16-2t14-7t10-8t12-12t11-11q18 17 18 41z m500-394q0-67-48-113l-82-81q-46-47-113-47q-68 0-114 48l-115 115q-46 47-46 114q0 68 49 116l-49 49q-48-49-116-49q-67 0-114 47l-116 116q-47 47-47 114t47 113l82 82q47 46 114 46q67 0 114-47l114-116q47-46 47-113q0-69-49-117l49-49q48 49 116 49q67 0 114-47l116-116q47-47 47-114z" horiz-adv-x="928.6" />
+<glyph glyph-name="bookmark" unicode="&#xe805;" d="m650 779q12 0 24-5q19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4q-27 0-47 18l-246 236l-246-236q-20-19-46-19q-13 0-25 5q-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
+<glyph glyph-name="bookmark-empty" unicode="&#xe806;" d="m643 707h-572v-693l237 227l49 47l50-47l236-227v693z m7 72q12 0 24-5q19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4q-27 0-47 18l-246 236l-246-236q-20-19-46-19q-13 0-25 5q-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
+<glyph glyph-name="download-cloud" unicode="&#xe811;" d="m714 332q0 8-5 13t-13 5h-125v196q0 8-5 13t-12 5h-108q-7 0-12-5t-5-13v-196h-125q-8 0-13-5t-5-13q0-8 5-13l196-196q5-5 13-5t13 5l196 196q5 6 5 13z m357-125q0-89-62-151t-152-63h-607q-103 0-177 73t-73 177q0 72 39 134t105 92q-1 17-1 24q0 118 84 202t202 84q87 0 159-49t105-129q40 35 93 35q59 0 101-42t42-101q0-43-23-77q72-17 119-76t46-133z" horiz-adv-x="1071.4" />
+<glyph glyph-name="edit" unicode="&#xe814;" d="m496 189l64 65l-85 85l-64-65v-31h53v-54h32z m245 402q-9 9-18 0l-196-196q-9-9 0-18t18 0l196 196q9 9 0 18z m45-331v-106q0-67-47-114t-114-47h-464q-67 0-114 47t-47 114v464q0 66 47 113t114 48h464q35 0 65-14q9-4 10-13q2-10-5-16l-27-28q-8-8-18-4q-13 3-25 3h-464q-37 0-63-26t-27-63v-464q0-37 27-63t63-27h464q37 0 63 27t26 63v70q0 7 5 12l36 36q8 8 20 4t11-16z m-54 411l161-160l-375-375h-161v160z m248-73l-51-52l-161 161l51 51q16 16 38 16t38-16l85-84q16-16 16-38t-16-38z" horiz-adv-x="1000" />
+<glyph glyph-name="menu" unicode="&#xe802;" d="m857 100v-71q0-15-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 25t25 11h785q15 0 26-11t10-25z m0 286v-72q0-14-10-25t-26-10h-785q-15 0-25 10t-11 25v72q0 14 11 25t25 10h785q15 0 26-10t10-25z m0 285v-71q0-15-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 26t25 10h785q15 0 26-10t10-26z" horiz-adv-x="857.1" />
+<glyph glyph-name="cog" unicode="&#xe813;" d="m571 350q0 59-41 101t-101 42t-101-42t-42-101t42-101t101-42t101 42t41 101z m286 61v-124q0-7-4-13t-11-7l-104-16q-10-30-21-51q19-27 59-77q6-6 6-13t-5-13q-15-21-55-61t-53-39q-7 0-14 5l-77 60q-25-13-51-21q-9-76-16-104q-4-16-20-16h-124q-8 0-14 5t-6 12l-16 103q-27 9-50 21l-79-60q-6-5-14-5q-8 0-14 6q-70 64-92 94q-4 5-4 13q0 6 5 12q8 12 28 37t30 40q-15 28-23 55l-102 15q-7 1-11 7t-5 13v124q0 7 5 13t10 7l104 16q8 25 22 51q-23 32-60 77q-6 7-6 14q0 5 5 12q15 20 55 60t53 40q7 0 15-5l77-60q24 13 50 21q9 76 17 104q3 15 20 15h124q7 0 13-4t7-12l15-103q28-9 50-21l80 60q5 5 13 5q7 0 14-5q72-67 92-95q4-5 4-13q0-6-4-12q-9-12-29-38t-30-39q14-28 23-55l102-15q7-1 12-7t4-13z" horiz-adv-x="857.1" />
+<glyph glyph-name="resize-full" unicode="&#xe812;" d="m421 261q0-8-5-13l-185-185l80-81q10-10 10-25t-10-25t-25-11h-250q-15 0-25 11t-11 25v250q0 15 11 25t25 11t25-11l80-80l185 185q6 6 13 6t13-6l64-63q5-6 5-13z m436 482v-250q0-15-10-25t-26-11t-25 11l-80 80l-185-185q-6-6-13-6t-13 6l-64 63q-5 6-5 13t5 13l186 185l-81 81q-10 10-10 25t10 25t25 11h250q15 0 26-11t10-25z" horiz-adv-x="857.1" />
+<glyph glyph-name="cancel-circled" unicode="&#xe80e;" d="m641 224q0 14-10 25l-101 101l101 101q10 11 10 25q0 15-10 26l-51 50q-10 11-25 11q-15 0-25-11l-101-101l-101 101q-11 11-26 11q-15 0-25-11l-50-50q-11-11-11-26q0-14 11-25l101-101l-101-101q-11-11-11-25q0-15 11-26l50-50q10-11 25-11q15 0 26 11l101 101l101-101q10-11 25-11q15 0 25 11l51 50q10 11 10 26z m216 126q0-117-57-215t-156-156t-215-58t-216 58t-155 156t-58 215t58 215t155 156t216 58t215-58t156-156t57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="up-dir" unicode="&#xe80c;" d="m571 171q0-14-10-25t-25-10h-500q-15 0-25 10t-11 25t11 26l250 250q10 10 25 10t25-10l250-250q10-11 10-26z" horiz-adv-x="571.4" />
+<glyph glyph-name="right-dir" unicode="&#xe80b;" d="m321 350q0-14-10-25l-250-250q-11-11-25-11t-25 11t-11 25v500q0 15 11 25t25 11t25-11l250-250q10-10 10-25z" horiz-adv-x="357.1" />
+<glyph glyph-name="angle-right" unicode="&#xe809;" d="m332 314q0-7-6-13l-260-260q-5-5-12-5t-13 5l-28 28q-6 6-6 13t6 13l219 219l-219 220q-6 5-6 12t6 13l28 28q5 6 13 6t12-6l260-260q6-5 6-13z" horiz-adv-x="357.1" />
+<glyph glyph-name="angle-down" unicode="&#xe80a;" d="m600 439q0-7-6-13l-260-260q-5-5-13-5t-12 5l-260 260q-6 6-6 13t6 13l27 28q6 6 13 6t13-6l219-219l220 219q5 6 13 6t12-6l28-28q6-5 6-13z" horiz-adv-x="642.9" />
+<glyph glyph-name="right" unicode="&#xe815;" d="m1000 404v-108q0-7-5-12t-13-5h-696v-125q0-12-11-17t-19 3l-215 196q-5 5-5 12q0 8 5 14l215 197q9 8 19 4q11-5 11-17v-125h696q8 0 13-5t5-12z" horiz-adv-x="1000" />
+<glyph glyph-name="list-1" unicode="&#xe803;" d="m143 118v-107q0-7-5-13t-13-5h-107q-7 0-13 5t-5 13v107q0 7 5 12t13 6h107q7 0 13-6t5-12z m0 214v-107q0-7-5-13t-13-5h-107q-7 0-13 5t-5 13v107q0 7 5 13t13 5h107q7 0 13-5t5-13z m0 214v-107q0-7-5-12t-13-6h-107q-7 0-13 6t-5 12v107q0 8 5 13t13 5h107q7 0 13-5t5-13z m857-428v-107q0-7-5-13t-13-5h-750q-7 0-12 5t-6 13v107q0 7 6 12t12 6h750q7 0 13-6t5-12z m-857 643v-107q0-8-5-13t-13-5h-107q-7 0-13 5t-5 13v107q0 7 5 12t13 6h107q7 0 13-6t5-12z m857-429v-107q0-7-5-13t-13-5h-750q-7 0-12 5t-6 13v107q0 7 6 13t12 5h750q7 0 13-5t5-13z m0 214v-107q0-7-5-12t-13-6h-750q-7 0-12 6t-6 12v107q0 8 6 13t12 5h750q7 0 13-5t5-13z m0 215v-107q0-8-5-13t-13-5h-750q-7 0-12 5t-6 13v107q0 7 6 12t12 6h750q7 0 13-6t5-12z" horiz-adv-x="1000" />
+<glyph glyph-name="list-numbered" unicode="&#xe801;" d="m213-54q0-45-31-70t-75-26q-60 0-96 37l31 49q28-25 60-25q16 0 28 8t12 24q0 35-59 31l-14 31q4 6 18 24t24 31t20 21v1q-9 0-27-1t-27 0v-30h-59v85h186v-49l-53-65q28-6 45-27t17-49z m1 350v-89h-202q-4 20-4 30q0 29 14 52t31 38t37 27t31 24t14 25q0 14-9 22t-22 7q-25 0-45-32l-47 33q13 28 40 44t59 16q40 0 68-23t28-63q0-28-19-51t-42-36t-42-28t-20-30h71v34h59z m786-178v-107q0-8-5-13t-13-5h-678q-8 0-13 5t-5 13v107q0 8 5 13t13 5h678q7 0 13-6t5-12z m-786 502v-56h-187v56h60q0 22 0 68t1 67v7h-1q-5-10-28-30l-40 42l76 71h59v-225h60z m786-216v-108q0-7-5-12t-13-5h-678q-8 0-13 5t-5 12v108q0 7 5 12t13 5h678q7 0 13-5t5-12z m0 285v-107q0-7-5-12t-13-6h-678q-8 0-13 6t-5 12v107q0 8 5 13t13 5h678q7 0 13-5t5-13z" horiz-adv-x="1000" />
+<glyph glyph-name="columns" unicode="&#xe810;" d="m89-7h340v643h-358v-625q0-8 6-13t12-5z m768 18v625h-357v-643h339q8 0 13 5t5 13z m72 678v-678q0-37-27-63t-63-27h-750q-36 0-63 27t-26 63v678q0 37 26 63t63 27h750q37 0 63-27t27-63z" horiz-adv-x="928.6" />
+<glyph glyph-name="list" unicode="&#xe800;" d="m100 200q20 0 35-15t15-35t-15-35t-35-15l-50 0q-20 0-35 15t-15 35t14 35t36 15l50 0z m0 200q20 0 35-15t15-35t-15-35t-35-15l-50 0q-20 0-35 15t-15 35t14 35t36 15l50 0z m0 200q20 0 35-15t15-35t-15-35t-35-15l-50 0q-20 0-35 15t-15 35t14 35t36 15l50 0z m200-100q-20 0-35 15t-15 35t15 35t35 15l350 0q22 0 36-15t14-35t-15-35t-35-15l-350 0z m350-100q22 0 36-15t14-35t-15-35t-35-15l-350 0q-20 0-35 15t-15 35t15 35t35 15l350 0z m0-200q22 0 36-15t14-35t-15-35t-35-15l-350 0q-20 0-35 15t-15 35t15 35t35 15l350 0z" horiz-adv-x="700" />
+<glyph glyph-name="resize-small" unicode="&#xe808;" d="m429 314v-250q0-14-11-25t-25-10t-25 10l-81 81l-185-186q-5-5-13-5t-13 5l-63 64q-6 5-6 13t6 13l185 185l-80 80q-11 11-11 25t11 25t25 11h250q14 0 25-11t11-25z m421 375q0-7-6-13l-185-185l80-80q11-11 11-25t-11-25t-25-11h-250q-14 0-25 11t-10 25v250q0 14 10 25t25 10t25-10l81-81l185 186q6 5 13 5t13-5l63-64q6-5 6-13z" horiz-adv-x="857.1" />
+</font>
+</defs>
+</svg>

demo/index.html

@@ -27,7 +27,7 @@
                 EPUBJS.cssPath = "css/";
                 // fileStorage.filePath = EPUBJS.filePath;
 
-                EPUBJSR.app.init("moby-dick/");
+                var reader = ePubReader("moby-dick/");
               }  
             };
         
@@ -52,35 +52,48 @@
     <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>
              
-            <!-- <input id="search" placeholder="search"> -->
-            <a id="network"><img id="store" src="img/save.png"></a>
-            <a id="setting"><img id="settings" src="img/settings.png"></a>
-            <a id="fullscreen">
-              <img id="fullscreenicon" src="img/fullscreen.png">
-              <img id="cancelfullscreenicon" src="img/cancelfullscreen.png" style="display: none">
-            </a>
             </div>
-          <div id="toc">
+            <div id="tocView">
+            </div>
+            <div id="searchView">
+              <ul id="searchResults"></ul>
             </div>
             <div id="settingsPanel">
             </div>
               
           </div>
           <div id="main">
-          <div id="opener">
-            <a id="open"><img src="img/menu-icon.png"></a>
-          </div>
+            
             <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>
+                <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="area"></div>
+            <div id="viewer"></div>
             <div id="next" class="arrow">›</div>
-          <div id="loader"><img src="img/loader.gif"></div>
+            
+            <div id="loader"><img src="../demo/img/loader.gif"></div>
         </div>
     </body>
 </html>

demo/js/hooks.min.js

@@ -1 +1 @@
-EPUBJS.Hooks.register("beforeChapterDisplay").endnotes=function(a,b){var c=b.doc.querySelectorAll("a[href]"),d=Array.prototype.slice.call(c),e="epub:type",f="noteref",g=EPUBJS.core.folder(location.pathname),h=g+EPUBJS.cssPath||g,i={};EPUBJS.core.addCss(h+"popup.css",!1,b.doc.head),d.forEach(function(a){function c(){var c,e=b.iframe.height,f=b.iframe.width,j=225;o||(c=l.cloneNode(!0),o=c.querySelector("p")),b.replaceLinks.bind(this),i[k]||(i[k]=document.createElement("div"),i[k].setAttribute("class","popup"),pop_content=document.createElement("div"),i[k].appendChild(pop_content),pop_content.appendChild(o),pop_content.setAttribute("class","pop_content"),b.bodyEl.appendChild(i[k]),i[k].addEventListener("mouseover",d,!1),i[k].addEventListener("mouseout",g,!1),b.book.on("renderer:pageChanged",h,this),b.book.on("renderer:pageChanged",g,this)),c=i[k],itemRect=a.getBoundingClientRect(),m=itemRect.left,n=itemRect.top,c.classList.add("show"),popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width/2+"px",c.style.top=n+"px",j>e/2.5&&(j=e/2.5,pop_content.style.maxHeight=j+"px"),popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),m-popRect.width<=0?(c.style.left=m+"px",c.classList.add("left")):c.classList.remove("left"),m+popRect.width/2>=f?(c.style.left=m-300+"px",popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width+"px",popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),c.classList.add("right")):c.classList.remove("right")}function d(){i[k].classList.add("on")}function g(){i[k].classList.remove("on")}function h(){setTimeout(function(){i[k].classList.remove("show")},100)}var j,k,l,m,n,o,p=a.getAttribute(e);p==f&&(j=a.getAttribute("href"),k=j.replace("#",""),l=b.doc.getElementById(k),a.addEventListener("mouseover",c,!1),a.addEventListener("mouseout",h,!1))}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").mathml=function(a,b){if(-1!==b.currentChapter.properties.indexOf("mathml")){b.iframe.contentWindow.mathmlCallback=a;var c=document.createElement("script");c.type="text/x-mathjax-config",c.innerHTML='        MathJax.Hub.Register.StartupHook("End",function () {           window.mathmlCallback();         });        MathJax.Hub.Config({jax: ["input/TeX","input/MathML","output/SVG"],extensions: ["tex2jax.js","mml2jax.js","MathEvents.js"],TeX: {extensions: ["noErrors.js","noUndefined.js","autoload-all.js"]},MathMenu: {showRenderer: false},menuSettings: {zoom: "Click"},messageStyle: "none"});                 ',b.doc.body.appendChild(c),EPUBJS.core.addScript("http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",null,b.doc.head)}else a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").smartimages=function(a,b){var c=b.doc.querySelectorAll("img"),d=Array.prototype.slice.call(c),e=b.bodyEl.clientHeight;d.forEach(function(a){function c(){var c,d=a.getBoundingClientRect(),f=d.height,g=d.top,h=a.getAttribute("data-height"),i=h||f;e=b.docEl.clientHeight,0>g&&(g=0),i+g>=e?(e/2>g?(c=e-g,a.style.maxHeight=c+"px",a.style.width="auto"):(c=e>i?i:e,a.style.maxHeight=c+"px",a.style.marginTop=e-g+"px",a.style.width="auto",console.log(c)),a.setAttribute("data-height",c)):(a.style.removeProperty("max-height"),a.style.removeProperty("margin-top"))}a.addEventListener("load",c,!1),b.on("renderer:resized",c),b.on("renderer:chapterUnloaded",function(){a.removeEventListener("load",c),b.off("renderer:resized",c)}),c()}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").transculsions=function(a,b){var c=b.doc.querySelectorAll("[transclusion]"),d=Array.prototype.slice.call(c);d.forEach(function(a){function c(){j=g,k=h,j>b.colWidth&&(d=b.colWidth/j,j=b.colWidth,k*=d),f.width=j,f.height=k}var d,e=a.getAttribute("ref"),f=document.createElement("iframe"),g=a.getAttribute("width"),h=a.getAttribute("height"),i=a.parentNode,j=g,k=h;c(),b.book.listenUntil("book:resized","book:chapterDestroy",c),f.src=e,i.replaceChild(f,a)}),a&&a()};
+EPUBJS.Hooks.register("beforeChapterDisplay").endnotes=function(a,b){var c=b.doc.querySelectorAll("a[href]"),d=Array.prototype.slice.call(c),e="epub:type",f="noteref",g=EPUBJS.core.folder(location.pathname),h=g+EPUBJS.cssPath||g,i={};EPUBJS.core.addCss(h+"popup.css",!1,b.doc.head),d.forEach(function(a){function c(){var c,e=b.iframe.height,f=b.iframe.width,j=225;o||(c=l.cloneNode(!0),o=c.querySelector("p")),b.replaceLinks.bind(this),i[k]||(i[k]=document.createElement("div"),i[k].setAttribute("class","popup"),pop_content=document.createElement("div"),i[k].appendChild(pop_content),pop_content.appendChild(o),pop_content.setAttribute("class","pop_content"),b.bodyEl.appendChild(i[k]),i[k].addEventListener("mouseover",d,!1),i[k].addEventListener("mouseout",g,!1),b.book.on("renderer:pageChanged",h,this),b.book.on("renderer:pageChanged",g,this)),c=i[k],itemRect=a.getBoundingClientRect(),m=itemRect.left,n=itemRect.top,c.classList.add("show"),popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width/2+"px",c.style.top=n+"px",j>e/2.5&&(j=e/2.5,pop_content.style.maxHeight=j+"px"),popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),m-popRect.width<=0?(c.style.left=m+"px",c.classList.add("left")):c.classList.remove("left"),m+popRect.width/2>=f?(c.style.left=m-300+"px",popRect=c.getBoundingClientRect(),c.style.left=m-popRect.width+"px",popRect.height+n>=e-25?(c.style.top=n-popRect.height+"px",c.classList.add("above")):c.classList.remove("above"),c.classList.add("right")):c.classList.remove("right")}function d(){i[k].classList.add("on")}function g(){i[k].classList.remove("on")}function h(){setTimeout(function(){i[k].classList.remove("show")},100)}var j,k,l,m,n,o,p=a.getAttribute(e);p==f&&(j=a.getAttribute("href"),k=j.replace("#",""),l=b.doc.getElementById(k),a.addEventListener("mouseover",c,!1),a.addEventListener("mouseout",h,!1))}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").mathml=function(a,b){if(-1!==b.currentChapter.properties.indexOf("mathml")){b.iframe.contentWindow.mathmlCallback=a;var c=document.createElement("script");c.type="text/x-mathjax-config",c.innerHTML='        MathJax.Hub.Register.StartupHook("End",function () {           window.mathmlCallback();         });        MathJax.Hub.Config({jax: ["input/TeX","input/MathML","output/SVG"],extensions: ["tex2jax.js","mml2jax.js","MathEvents.js"],TeX: {extensions: ["noErrors.js","noUndefined.js","autoload-all.js"]},MathMenu: {showRenderer: false},menuSettings: {zoom: "Click"},messageStyle: "none"});                 ',b.doc.body.appendChild(c),EPUBJS.core.addScript("http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",null,b.doc.head)}else a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").pageTurns=function(a,b){var c=!1;$(b.docEl).keydown(function(a){return c?void 0:37==a.keyCode?(b.book.prevPage(),c=!0,setTimeout(function(){c=!1},100),!1):39==a.keyCode?(b.book.nextPage(),c=!0,setTimeout(function(){c=!1},100),!1):void 0}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").smartimages=function(a,b){var c=b.doc.querySelectorAll("img"),d=Array.prototype.slice.call(c),e=b.bodyEl.clientHeight;d.forEach(function(a){function c(){var c,d=a.getBoundingClientRect(),f=d.height,g=d.top,h=a.getAttribute("data-height"),i=h||f;e=b.docEl.clientHeight,0>g&&(g=0),i+g>=e?(e/2>g?(c=e-g,a.style.maxHeight=c+"px",a.style.width="auto"):(c=e>i?i:e,a.style.maxHeight=c+"px",a.style.marginTop=e-g+"px",a.style.width="auto",console.log(c)),a.setAttribute("data-height",c)):(a.style.removeProperty("max-height"),a.style.removeProperty("margin-top"))}a.addEventListener("load",c,!1),b.on("renderer:resized",c),b.on("renderer:chapterUnloaded",function(){a.removeEventListener("load",c),b.off("renderer:resized",c)}),c()}),a&&a()},EPUBJS.Hooks.register("beforeChapterDisplay").transculsions=function(a,b){var c=b.doc.querySelectorAll("[transclusion]"),d=Array.prototype.slice.call(c);d.forEach(function(a){function c(){j=g,k=h,j>b.colWidth&&(d=b.colWidth/j,j=b.colWidth,k*=d),f.width=j,f.height=k}var d,e=a.getAttribute("ref"),f=document.createElement("iframe"),g=a.getAttribute("width"),h=a.getAttribute("height"),i=a.parentNode,j=g,k=h;c(),b.book.listenUntil("book:resized","book:chapterDestroy",c),f.src=e,i.replaceChild(f,a)}),a&&a()};

hooks/default/pageturns.js

@@ -0,0 +1,29 @@
+EPUBJS.Hooks.register("beforeChapterDisplay").pageTurns = function(callback, renderer){
+
+		var lock = false;
+
+		$(renderer.docEl).keydown(function(e){
+			if(lock) return;
+
+			if (e.keyCode == 37) { 
+				renderer.book.prevPage();
+				lock = true;
+				setTimeout(function(){
+					lock = false;
+				}, 100);
+				return false;
+			}
+
+			if (e.keyCode == 39) { 
+				renderer.book.nextPage();
+				lock = true;
+				setTimeout(function(){
+					lock = false;
+				}, 100);
+				return false;
+			}
+
+		});
+
+		if(callback) callback();
+}

reader/reader.js

@@ -0,0 +1,374 @@
+EPUBJS.reader = {};
+EPUBJS.reader.plugins = {}; //-- Attach extra view as plugins (like search?)
+
+(function(root) {
+
+	var previousReader = root.ePubReader || {};
+
+	var ePubReader = root.ePubReader = function(path, options) {
+		return new EPUBJS.Reader(path, options);
+	};
+
+	_.extend(ePubReader, {
+		noConflict : function() {
+			root.ePubReader = previousReader;
+			return this;
+		}
+	});
+
+	//exports to multiple environments
+	if (typeof define === 'function' && define.amd)
+	//AMD
+	define(function(){ return Reader; });
+	else if (typeof module != "undefined" && module.exports)
+	//Node
+	module.exports = ePubReader;
+
+})(window);
+
+EPUBJS.Reader = function(path, options) {
+	var reader = this;
+	var settings = _.defaults(options || {}, {
+		restore: true
+	});
+	var book = this.book = ePub(path, settings);
+
+	this.settings = settings;
+	this.offline = false;
+	this.sidebarOpen = false;
+
+	book.renderTo("viewer");
+	
+	reader.SettingsView = EPUBJS.reader.SettingsView.call(reader, book);
+	reader.ControlsView = EPUBJS.reader.ControlsView.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);
+			}
+		}
+		
+	});
+
+	book.getMetadata().then(function(meta) {
+		reader.MetaView = EPUBJS.reader.MetaView.call(reader, meta);
+	});
+
+	book.getToc().then(function(toc) {
+		reader.TocView = EPUBJS.reader.TocView.call(reader, toc);
+	});
+	
+	return this;
+};
+
+EPUBJS.reader.MetaView = function(meta) {
+	var title = meta.bookTitle,
+			author = meta.creator;
+
+	var $title = $("#book-title"),
+			$author = $("#chapter-title"),
+			$dash = $("#title-seperator");
+
+		document.title = title+" – "+author;
+
+		$title.html(title);
+		$author.html(author);
+		$dash.show();
+};
+
+EPUBJS.reader.ReaderView = function(book) {
+	var $main = $("#main"),
+			$divider = $("#divider"),
+			$loader = $("#loader"),
+			$next = $("#next"),
+			$prev = $("#prev");
+	
+	var slideIn = function() {
+		$main.removeClass("closed");
+	};
+	
+	var slideOut = function() {
+		$main.addClass("closed");
+	};
+	
+	var showLoader = function() {
+		$loader.show();
+	};
+	
+	var hideLoader = function() {
+		$loader.hide();
+	};
+	
+	var showDivider = function() {
+		$divider.addClass("show");
+	};
+	
+	var hideDivider = function() {
+		$divider.removeClass("show");
+	};
+	
+	var keylock = false;
+	
+	var arrowKeys = function(e) {		
+		if(e.keyCode == 37) { 
+			book.prevPage();
+			$prev.addClass("active");
+
+			keylock = true;
+			setTimeout(function(){
+				keylock = false;
+				$prev.removeClass("active");
+			}, 100);
+
+			 e.preventDefault();
+		}
+		if(e.keyCode == 39) { 
+			book.nextPage();
+			$next.addClass("active");
+			
+			keylock = true;
+			setTimeout(function(){
+				keylock = false;
+				$next.removeClass("active");
+			}, 100);
+			
+			 e.preventDefault();
+		}
+	}
+
+	document.addEventListener('keydown', arrowKeys, false);
+	
+	$next.on("click", function(e){
+		book.nextPage();
+		e.preventDefault();
+	});
+	
+	$prev.on("click", function(e){
+		book.prevPage();
+		e.preventDefault();
+	});
+	
+	//-- Hide the spinning loader
+	hideLoader();
+	
+	//-- If the book is using spreads, show the divider
+	if(!book.single) {
+		showDivider();
+	}
+	
+	return {
+		"slideOut" : slideOut,
+		"slideIn"  : slideIn,
+		"showLoader" : showLoader,
+		"hideLoader" : hideLoader,
+		"showDivider" : showDivider,
+		"hideDivider" : hideDivider
+	};
+};
+
+EPUBJS.reader.ControlsView = function(book) {
+	var reader = this;
+
+	var $store = $("#store"),
+			$fullscreen = $("#fullscreen"),
+			$fullscreenicon = $("#fullscreenicon"),
+			$cancelfullscreenicon = $("#cancelfullscreenicon"),
+			$slider = $("#slider"),
+			$main = $("#main"),
+			$sidebar = $("#sidebar"),
+			$settings = $("#settings"),
+			$bookmark = $("#bookmark");
+			
+	
+	var goOnline = function() {
+		reader.offline = false;
+		// $store.attr("src", $icon.data("save"));
+	};
+
+	var goOffline = function() {
+		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();
+		} else {
+			showSidebar();
+		}
+	});
+	
+	$fullscreen.on("click", function() {
+		screenfull.toggle($('#container')[0]);
+		$fullscreenicon.toggle();
+		$cancelfullscreenicon.toggle();
+	});
+	
+	$settings.on("click", function() {
+		reader.SettingsView.show();
+	});
+
+	$bookmark.on("click", function() {
+		$bookmark.addClass("icon-bookmark");
+		$bookmark.removeClass("icon-bookmark-empty");
+		console.log(reader.book.getCurrentLocationCfi());
+	});
+	
+	return {
+		
+	};
+};
+
+EPUBJS.reader.TocView = function(toc) {
+	var book = this.book;
+	
+	var $list = $("#tocView"),
+			docfrag = document.createDocumentFragment();
+	
+	var currentChapter = false;
+	
+	var generateTocItems = function(toc, level) {
+		var container = document.createElement("ul");
+		
+		if(!level) level = 1;
+
+		toc.forEach(function(chapter) {
+			var listitem = document.createElement("li"),
+					link = document.createElement("a");
+					toggle = document.createElement("a");
+			var subitems;
+			
+			listitem.id = "toc-"+chapter.id;
+
+			link.textContent = chapter.label;
+			link.href = chapter.href;
+			link.classList.add('toc_link');
+
+			listitem.appendChild(link);
+
+			if(chapter.subitems) {
+				level++;
+				subitems = generateTocItems(chapter.subitems, level);
+				toggle.classList.add('toc_toggle');
+				
+				listitem.insertBefore(toggle, link);
+				listitem.appendChild(subitems);
+			}
+			
+			
+			container.appendChild(listitem);
+			
+		});
+		
+		return container;
+	};
+	
+	var onShow = function() {
+		$list.show();
+	};
+	
+	var onHide = function() {
+		$list.hide();
+	};
+	
+	var chapterChange = function(e) {
+		var id = e.id,
+				$item = $list.find("#toc-"+id),
+				$current = $list.find(".currentChapter"),
+				$open = $list.find('.openChapter');
+
+		if($item.length){
+			
+			if($item != $current && $item.has(currentChapter).length > 0) {
+				$current.removeClass("currentChapter");
+			}
+			
+			$item.addClass("currentChapter");
+			
+			// $open.removeClass("openChapter");
+			$item.parents('li').addClass("openChapter");
+		}	  
+	};
+	
+	book.on('renderer:chapterDisplayed', chapterChange);
+
+	var tocitems = generateTocItems(toc);
+	
+	docfrag.appendChild(tocitems);
+	
+	$list.append(docfrag);
+	$list.find(".toc_link").on("click", function(event){
+			var url = this.getAttribute('href');
+
+			//-- Provide the Book with the url to show
+			//   The Url must be found in the books manifest
+			book.goto(url);
+			
+			$list.find(".currentChapter")
+					.addClass("openChapter")
+					.removeClass("currentChapter");
+					
+			$(this).parent('li').addClass("currentChapter");
+			
+			event.preventDefault();
+	});
+
+	$list.find(".toc_toggle").on("click", function(event){
+			var $el = $(this).parent('li'),
+					open = $el.hasClass("openChapter");
+			
+			if(open){
+				$el.removeClass("openChapter");
+			} else {
+				$el.addClass("openChapter");
+			}
+			event.preventDefault();
+	});
+	
+	return {
+		"show" : onShow,
+		"hide" : onHide
+	};
+};
+
+EPUBJS.reader.SettingsView = function() {
+	var book = this.book;
+
+	var $settings = $("#settingsPanel");
+
+	var onShow = function() {
+		$settings.show();
+	};
+
+	var onHide = function() {
+		$settings.hide();
+	};
+
+	return {
+		"show" : onShow,
+		"hide" : onHide
+	};
+};

src/book.js

@@ -73,7 +73,7 @@ EPUBJS.Book = function(options){
 	
 	this.ready.all = RSVP.all(this.readyPromises);
 
-	this.ready.all.then(this._ready);
+	this.ready.all.then(this._ready.bind(this));
 	
 	this._q = [];
 	this.isRendered = false;
@@ -93,7 +93,6 @@ EPUBJS.Book = function(options){
 	//-- Listen for these promises:
 	//-- book.opened.then()
 	//-- book.rendered.then()
-
 };
 
 //-- Check bookUrl and start parsing book Assets or load them from storage 
@@ -109,7 +108,7 @@ EPUBJS.Book.prototype.open = function(bookPath, forceReload){
 
 	// console.log("saved", saved, !forceReload)
 	//-- Remove the previous settings and reload
-	if(saved && !forceReload){
+	if(saved){
 		//-- Apply settings, keeping newer ones
 		this.applySavedSettings();
 	}
@@ -202,30 +201,29 @@ EPUBJS.Book.prototype.unpack = function(_containerPath){
 	
 					book.loadXml(book.settings.navUrl).
 						then(function(navHtml){
-						return parse.nav(navHtml); // Grab Table of Contents
+							return parse.nav(navHtml, book.spineIndexByURL, book.spine); // Grab Table of Contents
 						}).then(function(toc){
 							book.toc = book.contents.toc = toc;
 							book.ready.toc.resolve(book.contents.toc);
+						}, function(error) {
+							book.ready.toc.resolve(false);
 						});
-
 				} else if(contents.tocPath) {
 					book.settings.tocUrl = book.settings.contentsPath + contents.tocPath;
 
 					book.loadXml(book.settings.tocUrl).
 						then(function(tocXml){
-								return parse.toc(tocXml); // Grab Table of Contents
+								return parse.toc(tocXml, book.spineIndexByURL, book.spine); // Grab Table of Contents
 						}).then(function(toc){
 							book.toc = book.contents.toc = toc;
 							book.ready.toc.resolve(book.contents.toc);
+						}, function(error) {
+							book.ready.toc.resolve(false);
 						});
 
 				} else {
 					book.ready.toc.resolve(false);
 				}
-
-			}).
-			fail(function(error) {
-				console.error(error);
 			});
 };
 
@@ -614,8 +612,8 @@ EPUBJS.Book.prototype.goto = function(url){
 	split = url.split("#");
 	chapter = split[0];
 	section = split[1] || false;
-	absoluteURL = (chapter.search("://") === -1) ? (this.settings.contentsPath + chapter) : chapter;
-	spinePos = this.spineIndexByURL[absoluteURL];
+	// absoluteURL = (chapter.search("://") === -1) ? (this.settings.contentsPath + chapter) : chapter;
+	spinePos = this.spineIndexByURL[chapter];
 
 	//-- If link fragment only stay on current chapter
 	if(!chapter){
@@ -639,16 +637,14 @@ EPUBJS.Book.prototype.goto = function(url){
 };
 
 EPUBJS.Book.prototype.preloadNextChapter = function() {
-	var temp = document.createElement('iframe'),
-		next;
+	var next;
 
 	if(this.spinePos >= this.spine.length){
 		return false;
 	}
 		
 	next = new EPUBJS.Chapter(this.spine[this.spinePos + 1]);
-	
-	EPUBJS.core.request(next.href);
+	EPUBJS.core.request(next.absolute);
 };
 
 
@@ -736,8 +732,7 @@ EPUBJS.Book.prototype._enqueue = function(command, args) {
 
 };
 
-EPUBJS.Book.prototype._ready = function(err) {
-	var book = this;
+EPUBJS.Book.prototype._ready = function() {
 
 	this.trigger("book:ready");
 
@@ -819,3 +814,17 @@ EPUBJS.Book.prototype.triggerHooks = function(type, callback, passed){
 
 //-- Enable binding events to book
 RSVP.EventTarget.mixin(EPUBJS.Book.prototype);
+
+//-- Handle RSVP Errors
+RSVP.on('error', function(event) {
+	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);

src/chapter.js

@@ -1,5 +1,6 @@
 EPUBJS.Chapter = function(spineObject){
 	this.href = spineObject.href;
+	this.absolute = spineObject.url;
 	this.id = spineObject.id;
 	this.spinePos = spineObject.index;
 	this.properties = spineObject.properties;
@@ -23,11 +24,11 @@ EPUBJS.Chapter.prototype.url = function(store){
 
 	if(store){
 		if(!this.tempUrl) {
-			this.tempUrl = store.getUrl(this.href);
+			this.tempUrl = store.getUrl(this.absolute);
 		}
 		return this.tempUrl;
 	}else{
-		deferred.resolve(this.href); //-- this is less than ideal but keeps it a promise
+		deferred.resolve(this.absolute); //-- this is less than ideal but keeps it a promise
 		return deferred.promise;
 	}
 

src/parser.js

@@ -137,7 +137,8 @@ EPUBJS.Parser.prototype.manifest = function(manifestXml){
 			properties = item.getAttribute('properties') || '';
 		
 		manifest[id] = {
-			'href' : baseUrl + href, //-- Absolute URL for loading with a web worker
+			'href' : href,
+			'url' : baseUrl + href, //-- Absolute URL for loading with a web worker
 			'type' : type,
       'properties' : properties
 		};
@@ -162,6 +163,7 @@ EPUBJS.Parser.prototype.spine = function(spineXml, manifest){
 			'linear' : item.getAttribute('linear') || '',
 			'properties' : manifest[Id].properties || '',
 			'href' : manifest[Id].href,
+			'url' :  manifest[Id].url,
 			'index' : index
 		};
 		
@@ -171,7 +173,7 @@ EPUBJS.Parser.prototype.spine = function(spineXml, manifest){
 	return spine;
 };
 
-EPUBJS.Parser.prototype.nav = function(navHtml){
+EPUBJS.Parser.prototype.nav = function(navHtml, spineIndexByURL, bookSpine){
 	var navEl = navHtml.querySelector('nav'), //-- [*|type="toc"] * Doesn't seem to work
 		idCounter = 0;
 	
@@ -218,11 +220,24 @@ EPUBJS.Parser.prototype.nav = function(navHtml){
 		if(length === 0) return false;
 		
 		items.forEach(function(item){
-			var id = item.getAttribute('id') || 'epubjs-autogen-toc-id-' + (idCounter++),
+			var id = item.getAttribute('id') || false,
 				content = findAnchorOrSpan(item),
 				href = content.getAttribute('href') || '',
 				text = content.textContent || "",
-				subitems = getTOC(item);
+				split = href.split("#"),
+				baseUrl = split[0],
+				subitems = getTOC(item),
+				spinePos = spineIndexByURL[baseUrl],
+				spineItem;
+				
+			if(!id) {
+				if(spinePos) {
+					spineItem = bookSpine[spinePos];				
+					id = spineItem.id
+				} else {
+					id = 'epubjs-autogen-toc-id-' + (idCounter++);
+				}
+			}
 			
 			item.setAttribute('id', id); // Ensure all elements have an id
 			list.push({
@@ -241,7 +256,7 @@ EPUBJS.Parser.prototype.nav = function(navHtml){
 	return getTOC(navEl);
 };
 
-EPUBJS.Parser.prototype.toc = function(tocXml){
+EPUBJS.Parser.prototype.toc = function(tocXml, spineIndexByURL, bookSpine){
 	var navMap = tocXml.querySelector("navMap");
 	if(!navMap) return [];
 	
@@ -265,13 +280,27 @@ EPUBJS.Parser.prototype.toc = function(tocXml){
 		}
 		
 		items.forEach(function(item){
-			var id = item.getAttribute('id'),
+			var id = item.getAttribute('id') || false,
 				content = item.querySelector("content"),
 				src = content.getAttribute('src'),
-				split = src.split("#"),
 				navLabel = item.querySelector("navLabel"),
 				text = navLabel.textContent ? navLabel.textContent : "",
+				split = src.split("#"),
+				baseUrl = split[0],
+				spinePos = spineIndexByURL[baseUrl],
+				spineItem,
 				subitems = getTOC(item);
+
+			if(!id) {
+				if(spinePos) {
+					spineItem = bookSpine[spinePos];				
+					id = spineItem.id
+				} else {
+					id = 'epubjs-autogen-toc-id-' + (idCounter++);
+				}
+			}
+			
+			
 			list.unshift({
 						"id": id,
 						"href": src,