this.updateFromParams(params);
// Start AJAX request for OL data
- this.getOpenLibraryJSON(this.gotOpenLibraryRecord);
-
-}
-
-// XXXmang
-BookReader.prototype.gotOpenLibraryRecord = function(olObject) {
- // console.log(olObject);
- if (olObject) {
- if (olObject['table_of_contents']) {
- console.log('xxx updating table of contents');
- br.updateTOC(olObject['table_of_contents']); // XXX
- }
- }
-}
-
-BookReader.prototype.updateTOC = function(tocEntries) {
- this.removeChapters();
- for (var i = 0; i < tocEntries.length; i++) {
- this.addChapterFromEntry(tocEntries[i]);
- }
-}
-
-/*
- * Example table of contents entry - this format is defined by Open Library
- * {
- * "pagenum": "17",
- * "level": 1,
- * "label": "CHAPTER I",
- * "type": {"key": "/type/toc_item"},
- * "title": "THE COUNTRY AND THE MISSION"
- * }
- */
-BookReader.prototype.addChapterFromEntry = function(tocEntryObject) {
- console.log(tocEntryObject);
- var pageIndex = this.getPageIndex(tocEntryObject['pagenum']);
- // Only add if we know where it is
- if (pageIndex) {
- this.addChapter(tocEntryObject['title'], tocEntryObject['pagenum'], pageIndex);
+ if (this.getOpenLibraryRecord) {
+ this.getOpenLibraryRecord(this.gotOpenLibraryRecord);
}
}
// $$$ should make this work inside the BookReader div (self-contained), rather than after
$('#BookReader').after(
- '<div id="BRnav"><div id="BRnavpos"><div id="pager"></div><div id="BRnavline"></div></div></div>'
+ '<div id="BRnav">'
+ + '<div id="BRpage">'
+ + '<button class="BRicon book_left"></button>'
+ + '<button class="BRicon book_right"></button>'
+ + '</div>'
+ + '<div id="BRnavpos">'
+ + '<div id="BRfiller"></div>'
+ + '<div id="BRpager">'
+ + '<div id="BRslider">'
+ + '<div id="slider"></div>'
+ + '<div id="pager"></div>'
+ // XXXmang update code to update pagenum
+ + '<div id="pagenum"><span>n141</span> / 325</div>'
+ + '</div>'
+ + '</div>'
+ + '<div id="BRnavline">'
+ + '<div class="BRnavend" id="BRnavleft"></div>'
+ + '<div class="BRnavend" id="BRnavright"></div>'
+ + '</div>'
+ + '</div>'
+ + '</div>'
);
/*
-<!-- LOAD SEARCH RESULTS FIRST SO CHAPTER INDICATORS CAN APPEAR IN FRONT -->
- <div class="search" style="left:80%;" title="Search result">
- <div class="query">The Kingdom of the Future, for instance, though interesting in a Caley Robinson way, with its cold, mystical colour relieved by touches of warm reddish browns, and its big draped figures, was a composition in the past, and did not stimulate the <strong><a href="">emotional</a></strong> powers of the observer with a suggestion of coming ages or a prophecy of progress. <span>Page 26</span></div>
- </div>
-
- <div class="search" style="left:22%;" title="Search result">
- <div class="query">A related distinction is between the emotion and the results of the emotion, principally behaviors and <strong><a href="">emotional</a></strong> expressions. People often behave in certain ways as a direct result of their <strong><a href="">emotional</a></strong> state, such as crying, fighting or fleeing. <span>Page 27</span></div>
- </div>
-
- <div class="search" style="left:75%;" title="Search result">
- <div class="query">A related distinction is between the emotion and the results of the emotion, principally behaviors and <strong><a href="">emotional</a></strong> expressions. People often behave in certain ways as a direct result of their <strong><a href="">emotional</a></strong> state, such as crying, fighting or fleeing. <span>Page 27</span></div>
- </div>
-
- <div class="chapter" style="left:1%;">
- <div class="title">I. The Minotaur <span>|</span> Page 1</div>
- </div>
-
- <div class="chapter" style="left:17%;">
- <div class="title">II. The Griffon <span>|</span> Page 44</div>
- </div>
-
- <div class="chapter" style="left:30%;">
- <div class="title">III. The Firedrake <span>|</span> Page 129</div>
- </div>
-
- <div class="chapter" style="left:67.5%;">
- <div class="title">V. The Pegasus <span>|</span> Page 201</div>
- </div>
-
- <div class="chapter" style="left:90%;">
- <div class="title">VI. The Goblin <span>|</span> Page 255</div>
- </div>
-
<div class="searchChap" style="left:49%;" title="Search result">
<div class="query">
A related distinction is between the emotion and the results of the emotion, principally behaviors and <strong><a href="">emotional</a></strong> expressions. People often behave in certain ways as a direct result of their <strong><a href="">emotional</a></strong> state, such as crying, fighting or fleeing. <span>Page 163</span>
<div class="queryChap">IV. The Witch <span>|</span> Page 163</div>
</div>
</div>
-
- </div>
-</div>
*/
/* $$$mang search results and chapters should automatically coalesce
});
});
*/
-
- // XXXmang testing
- this.addSearchResult('hi there', '25', 22);
- $("#pager").draggable({axis:'x',containment:'parent'});
}
BookReader.prototype.addSearchResult = function(queryString, pageNumber, pageIndex) {
});
}
+/*
+ * Remove all chapters.
+ */
BookReader.prototype.removeChapters = function() {
$('#BRnavpos .chapter').remove();
}
+/*
+ * Update the table of contents based on array of TOC entries.
+ */
+BookReader.prototype.updateTOC = function(tocEntries) {
+ this.removeChapters();
+ for (var i = 0; i < tocEntries.length; i++) {
+ this.addChapterFromEntry(tocEntries[i]);
+ }
+}
+
+/*
+ * Example table of contents entry - this format is defined by Open Library
+ * {
+ * "pagenum": "17",
+ * "level": 1,
+ * "label": "CHAPTER I",
+ * "type": {"key": "/type/toc_item"},
+ * "title": "THE COUNTRY AND THE MISSION"
+ * }
+ */
+BookReader.prototype.addChapterFromEntry = function(tocEntryObject) {
+ console.log(tocEntryObject);
+ var pageIndex = this.getPageIndex(tocEntryObject['pagenum']);
+ // Only add if we know where it is
+ if (pageIndex) {
+ this.addChapter(tocEntryObject['title'], tocEntryObject['pagenum'], pageIndex);
+ }
+ $('.chapter').each(function(){
+ $(this).hover(function(){
+ $(this).addClass('front');
+ },function(){
+ $(this).removeClass('front');
+ });
+ });
+ $('.search').each(function(){
+ $(this).hover(function(){
+ $(this).addClass('front');
+ },function(){
+ $(this).removeClass('front');
+ });
+ });
+ $('.searchChap').each(function(){
+ $(this).hover(function(){
+ $(this).addClass('front');
+ },function(){
+ $(this).removeClass('front');
+ });
+ });
+ $("#BRslider").draggable({axis:'x',containment:'parent'});
+ $("#BRzoombtn").draggable({axis:'y',containment:'parent'});
+ $("#BRslider").hover(
+ function(){
+ $("#pagenum").show();
+ },function(){
+ $("#pagenum").hide();
+ });
+}
+
BookReader.prototype.initToolbar = function(mode, ui) {
// $$$mang should be contained within the BookReader div instead of body
$("body").append("<div id='BRtoolbar'>"
- + "<span id='BRtoolbarbuttons' style='float:right;'>"
- + "<button class='BRicon bookmark modal'></button>"
- + "<button class='BRicon link modal'></button>"
- + "<button class='BRicon embed modal'></button>"
+ + "<span id='BRtoolbarbuttons'>"
+ /* XXXmang integrate search */
+ + "<form method='get' id='booksearch'><input type='search' id='textSrch' name='textSrch' val='' placeholder='Search inside'/><button type='submit' id='btnSrch' name='btnSrch'>GO</button></form>"
+ // XXXmang icons incorrect or handlers wrong
+ + "<button class='BRicon info' onclick='br.switchMode(3); return false;'></button>"
+ + "<button class='BRicon share' onclick='br.switchMode(2); return false;'></button>"
+ "<button class='BRicon read modal'></button>"
+ "<button class='BRicon full'></button>"
-// + "<div class='BRtoolbarmode2' style='display: none'><button class='BRicon book_leftmost'></button><button class='BRicon book_left'></button><button class='BRicon book_right'></button><button class='BRicon book_rightmost'></button></div>"
-// + "<div class='BRtoolbarmode1' style='display: none'><button class='BRicon book_top'></button><button class='BRicon book_up'></button> <button class='BRicon book_down'></button><button class='BRicon book_bottom'></button></div>"
-// + "<div class='BRtoolbarmode3' style='display: none'><button class='BRicon book_top'></button><button class='BRicon book_up'></button> <button class='BRicon book_down'></button><button class='BRicon book_bottom'></button></div>"
-// + "<button class='BRicon play'></button><button class='BRicon pause' style='display: none'></button>"
+ "</span>"
+ "<span>"
+ "<a class='logo' href='" + this.logoURL + "'></a>"
- + "<button class='BRicon glass'></button>"
- /* XXXmang integrate search */
- + "<form method='get' id='booksearch'><input type='search' id='textSrch' name='textSrch' val='' placeholder='Search'/><button type='submit' id='btnSrch' name='btnSrch'>GO</button></form>"
- + "<button class='BRicon fit'></button>"
- + "<button class='BRicon thumb' onclick='br.switchMode(3); return false;'></button>"
- + "<button class='BRicon twopg' onclick='br.switchMode(2); return false;'></button>"
+ // XXXmang update
+ + "<div id='BRreturn'><span>Back to</span><a href='BOOK URL'>Book Title</a></div>"
+ "</span>"
+ + "</div>"
+ + "<div id='BRzoomer'>"
+ + "<div id='BRzoompos'>"
+ + "<button class='BRicon zoom_out'></button>"
+ + "<div id='BRzoomcontrol'>"
+ + "<div id='BRzoomstrip'></div>"
+ + "<div id='BRzoombtn'></div>"
+ + "</div>"
+ + "<button class='BRicon zoom_in'></button>"
+ + "</div>"
+ "</div>");
this.updateToolbarZoom(this.reduce); // Pretty format
// $$$ don't hardcode height
$('#BRtoolbar').animate({top:-60});
$('#BRnav').animate({bottom:-60});
+ $('#BRzoomer').animate({right:-26});
}
}
if (!this.navigationIsVisible()) {
$('#BRtoolbar').animate({top:0});
$('#BRnav').animate({bottom:0});
+ $('#BRzoomer').animate({right:0});
}
}
return this.getPageURI(index, reduce, rotate);
}
-
-/////// Functions that can/should be overriden by third-parties
-
-// If your book has a record on Open Library you get some nice things for free
-BookReader.prototype.getOpenLibraryJSON = function(callback) {
- return null;
+/*
+ * Update based on received record from Open Library.
+ */
+BookReader.prototype.gotOpenLibraryRecord = function(self, olObject) {
+ // $$$ could refactor this so that 'this' is available
+ if (olObject) {
+ if (olObject['table_of_contents']) {
+ self.updateTOC(olObject['table_of_contents']);
+ }
+ }
}
-
// Library functions
BookReader.util = {
disableSelect: function(jObject) {
projects / bookreader.git / blobdiff