Skip to content
Permalink
Browse files

Initial commit

  • Loading branch information...
blaine committed Feb 6, 2010
0 parents commit 4ea097efa86d88d4e0e3f9f3db16aaa460873c67
Showing with 3,726 additions and 0 deletions.
  1. +19 −0 LICENSE
  2. +240 −0 book.css
  3. +135 −0 epub.html
  4. +1,534 −0 js/Hyphenator.js
  5. +185 −0 js/base64.js
  6. +133 −0 js/epub.js
  7. +753 −0 js/inflate.js
  8. +228 −0 js/pageHandler.js
  9. +198 −0 js/paginator.js
  10. +40 −0 js/sax.js
  11. +261 −0 js/zip.js
19 LICENSE
@@ -0,0 +1,19 @@
rePublish - JavaScript+HTML ePub reader.

Copyright (C) 2010 Blaine Cook (romeda@gmail.com)

Project and Source hosted at http://github.com/blaine/republish/

This JavaScript code is free software: you can redistribute
it and/or modify it under the terms of the GNU Lesser
General Public License (GNU LGPL) as published by the Free Software
Foundation, either version 3 of the License, or (at your option)
any later version. The code is distributed WITHOUT ANY WARRANTY;
without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.

As additional permission under GNU GPL version 3 section 7, you
may distribute non-source (e.g., minimized or compacted) forms of
that code without the copy of the GNU GPL normally required by
section 4, provided you include this license notice and a URL
through which recipients can access the Corresponding Source.
240 book.css
@@ -0,0 +1,240 @@
body {
padding: 0;
margin: 0;
}

div#container {
/*
width: 790px; // (page.width * 2) + 40
height: 610px; // page.height + 82 */
width: 880px;
height: 650px;
margin: 0 auto;
padding: 0;
display: none;
}

div.page {
border: 1px solid black;
margin: 15px 0 10px;
/*
width: 375px;
height: 528px; */
width: 420px;
height: 630px;
background-color: #f7f6f4;
}

div.content {
height: 530px;
}

div#leftpage {
float: left;
margin-left: 15px;
}
div#rightpage {
float: right;
margin-right: 15px;
}
div#pagenav {
clear: both;
margin: 0 15px;
height: 40px;
}
div#pagenav * {
float: left;
height: 100%;
vertical-align: middle;
}
div#pagenav_left {
width: 15px;
}
div#pagenav_content {
width: 730px;
text-align: center;
}
div#pagenav_right {
width: 15px;
text-align: right;
}

div.content {
padding: 0.5em;
overflow: hidden;
font-family: Georgia, Serif;
text-align: justify;
text-justify: newspaper;
}

div.content pre {
line-height: 100%;
}

div.content * {
line-height: 150%;
font-size: 12px;
}
/*div.content * {
margin: 0 0 1em 0;
padding: 0;
font-size: 12px;
font-family: Serif, Georgia;
line-height: 150%;
}*/

div.content img {
max-width: 100%
}

div.header {
font-size: 80%;
vertical-align: middle;
position: relative;
margin-top: 1em;
}
div.header h1 {
font-size: 120%;
font-weight: normal;
font-style: italic;
font-variant: small-caps;
text-transform: lowercase;
display: inline;
}
div.header span.pagenum {
display: inline;
}
div.header span.discoverable a {
text-decoration: none;
color: #aaaaaa;
}
div.header span.discoverable {
display: none;
}

div.right.header {
text-align: right;
right: 0;
}

div.right.header span.pagenum {
margin-right: 0.75em;
}

div.left.header span.pagenum {
margin-left: 0.75em;
}

div.page:hover span.discoverable,
div.page:hover span.discoverable a {
display: block;
position: absolute;
font-size: 400%;
top: 100px;
background-color: rgba(0,0,0,0.5);
line-height: 75%;
padding-top: 50px;
border-radius: 20px;
-webkit-border-radius: 20px;
}

div.page:hover div.left span.discoverable,
div.page:hover div.left span.discoverable a {
left: 28px;
}

div.page:hover div.right span.discoverable,
div.page:hover div.right span.discoverable a {
right: 31px;
}
div.page:hover span.discoverable a:hover {
color: #000000;
}
span.discoverable {
float: right;
}

div.footer {
display: none;
}

div.footer {
font-size: 80%;
vertical-align: middle;
position: relative;
bottom: 0;
}
div.footer h1 {
font-size: 120%;
font-weight: normal;
display: inline;
font-variant: small-caps;
text-transform: lowercase;
}

div.left {
margin-right: 1em;
margin-left: 1.5em;
padding: 0.5em;
}
div.left.content {
padding-top: 0.5em;
}
div.left.footer {
text-align: left;
left: 0;
}

div.right {
margin-left: 1em;
margin-right: 1.5em;
padding: 0.5em;
}
div.right.content {
padding-top: 0.5em;
}
div.right.footer {
text-align: right;
right: 0px;
}

div#selector {
background-color: rgba(55, 46, 74, 0.8);
position: absolute;
top: 20px;
height: 600px;
width: 800px;
left: 50%;
margin-left: -400px;
border-radius: 50px;
-webkit-border-radius: 50px;
}

div#selector #selectorContainer {
width: 100%;
height: 520px;
width: 740px;
margin: 40px;
}

div#selector .selection {
margin-right: 40px;
margin-bottom: 40px;
border-radius: 20px;
-webkit-border-radius: 20px;
float: left;
width: 145px;
height: 145px;
background-color: rgba(240, 230, 255, 0.3);
text-align: center;
font-size: 90%;
}

div#selector .selection:hover {
background-color: rgba(240, 230, 255, 0.6);
}

div#selector .selection img {
height: 80px;
margin: 20px auto 0;
}
135 epub.html
@@ -0,0 +1,135 @@
<html>
<head>

<link rel="stylesheet" type="text/css" media="screen" href="book.css" />
<script type="text/javascript" src="js/inflate.js"></script>
<script type="text/javascript" src="js/sax.js"></script>
<script type="text/javascript" src="js/zip.js"></script>
<script type="text/javascript" src="js/epub.js"></script>
<script type="text/javascript" src="js/base64.js"></script>
<script type="text/javascript" src="js/paginator.js"></script>
<script type="text/javascript" src="js/pageHandler.js"></script>

<!-- Hyphenation is currently [not] disabled. It shall return! -->
<script src="js/Hyphenator.js" type="text/javascript"></script>
<script src="js/patterns/en.js" type="text/javascript"></script>
<!-- -->

<script type="text/javascript">
var loadBook = function (epub) {
selector.style.display = 'none';
container.style.display = 'block';
ePub.open("epubs/" + epub, function (book) {
var te = document.getElementById('book_title');
te.textContent = book.title;
var ae = document.getElementById('author_heading');
ae.textContent = book.author;
var lc = document.getElementById('leftcontent'),
rc = document.getElementById('rightcontent'),
ln = document.getElementsByClassName('left pagenum')[0],
rn = document.getElementsByClassName('right pagenum')[0];
pageHandler = new PageHandler(book, [lc, rc], [ln, rn]);
pageHandler.display();
function handleArrowKeys(evt) {
evt = (evt) ? evt : ((window.event) ? event : null);
if (evt) {
switch (evt.keyCode) {
case 37:
pageHandler.prevPage();
break;
case 39:
pageHandler.nextPage();
break;
}
}
}
document.onkeyup = handleArrowKeys;
});
}
</script>
</head>

<body>
<div id="selector">
<div id="selectorContainer">
<div class="selection" onclick="loadBook('piedpiper.epub');">
<img src="covers/Pied_piper.jpg" alt="The Pied Piper of Hamelin"/>
<br/>The Pied Piper of Hamelin</div>
<div class="selection" onclick="loadBook('warofworlds.epub');">
<img src="covers/WarOfWorlds.jpg" alt="The War of the Worlds" />
<br/>The War of the Worlds</div>
<div class="selection" onclick="loadBook('flatland.epub');">
<img src="covers/flatland.jpg" alt="Flatland"/>
<br/>Flatland</div>
<div class="selection" onclick="loadBook('gulliverstravels.epub');">
<img src="covers/gulliver.jpg" alt="Gulliver's Travels"/>
<br/>Gulliver's Travels</div>
<div class="selection" onclick="loadBook('portraitoftheartist.epub');">
<img src="covers/Joyce.jpg" alt="Portrait of the Artist as a Young Man"/>
<br/>Portrait of the Artist<br/> as a Young Man</div>
<div class="selection" onclick="loadBook('wizardofoz.epub');">
<img src="covers/wizardofoz.jpg" alt="The Wonderful Wizard of Oz"/>
<br/>The Wonderful Wizard of Oz</div>
<div class="selection" onclick="loadBook('shelleypoetry.epub');">
<img src="covers/shelley.jpg" alt="Shelley's Poetry"/>
<br/>Shelley's Poetry</div>
<div class="selection" onclick="loadBook('fanniefarmer.epub');">
<img src="covers/Fannie.jpg" alt="The Fannie Farmer Cookbook" />
<br/>The Fannie Farmer Cookbook</div>
<div class="selection" onclick="loadBook('warandpeace.epub');">
<img src="covers/warandpeace.jpg" alt="War and Peace" />
<br/>War and Peace</div>
<div class="selection" onclick="loadBook('dracula.epub');">
<img src="covers/Dracula.jpg" alt="Dracula" />
<br/>Dracula</div>
<div class="selection" onclick="loadBook('faunaboreali.epub');">
<img src="covers/Fauna.jpg" alt="Fauna Boreali" />
<br/>Fauna Boreali</div>
<div class="selection" onclick="loadBook('huckleberry.epub');">
<img src="covers/Huck.jpg" alt="Huckleberry Finn" />
<br/>The Adventures of Huckleberry Finn</div>
</div>
</div>

<div id="container">
<div id="leftpage" class="page">
<div class="left header">
<span class="left pagenum"></span> &#183;
<h1 id="book_title"></h1>
<span class="discoverable">
<a href="javascript:pageHandler.prevPage()" title="Previous Page">&#8617;</a>
</span>
</div>
<div id="leftcontent" class="left content"></div>
<div class="left footer">
<span class="left pagenum"></span> &#183;
<h1 id="chapter_heading"></h1>
</div>
</div>

<div id="rightpage" class="page">
<div class="right header">
<span class="discoverable">
<a href="javascript:pageHandler.nextPage()" title="Next Page">&#8618;</a>
</span>
<h1 id="author_heading"></h1> &#183;
<span class="right pagenum"></span>
</div>
<div id="rightcontent" class="right content"></div>
<div class="right footer">
<h1></h1>&#183;
<span class="right pagenum"></span>
</div>
</div>
</div>
</body>
</html>

0 comments on commit 4ea097e

Please sign in to comment.
You can’t perform that action at this time.