Skip to content
Browse files

Navigation buttons

Navigation buttons for now (swipe and gestures coming soon!)
  • Loading branch information...
1 parent 5323408 commit 5bc4a0e6f36b92f7811db23de73396bdfeb8a29d @Dovyski committed
Showing with 72 additions and 22 deletions.
  1. +3 −2 index.html
  2. +44 −1 waker/css/structure.css
  3. +25 −19 waker/js/waker.js
View
5 index.html
@@ -38,8 +38,10 @@
chromium.org/developers/how-tos/chrome-frame-getting-started -->
<!--[if lt IE 7]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]-->
<header>
- <a href="javascript:void(0);" onclick="Waker.openToc();">[PLACEHOLDER]Open toc</a>
<div id="loading" style="display:none;">loading...</div>
+ <div id="toc-button"><span>i</span></div>
+ <div id="prev-button"><span>&lt;</span></div>
+ <div id="next-button"><span>&gt;</span></div>
</header>
<div id="wrapper" role="main">
@@ -48,7 +50,6 @@
</div>
<footer>
- footer
</footer>
<!-- JavaScript at the bottom for fast page loading -->
View
45 waker/css/structure.css
@@ -94,7 +94,50 @@
text-align: right;
z-index: 999;
}
-
+#prev-button, #next-button, #toc-button {
+ position: fixed;
+ top: 50%;
+ width: 15px;
+ background: #000;
+ height: 40px;
+ z-index: 9999;
+ cursor: default;
+}
+#prev-button {
+ left: 0;
+
+ /*TODO: vendor prefixes?*/
+ webkit-border-top-right-radius: 10px 30px;
+ webkit-border-bottom-right-radius: 10px 30px;
+ border-top-right-radius: 10px 10px;
+ border-bottom-right-radius: 10px 10px;
+}
+#next-button {
+ right: 0;
+
+ /*TODO: vendor prefixes?*/
+ webkit-border-top-left-radius: 10px 30px;
+ webkit-border-bottom-left-radius: 10px 30px;
+ border-top-left-radius: 10px 10px;
+ border-bottom-left-radius: 10px 10px;
+}
+#toc-button {
+ left: 0; top: 40%;
+
+ /*TODO: vendor prefixes?*/
+ webkit-border-top-right-radius: 10px 30px;
+ webkit-border-bottom-right-radius: 10px 30px;
+ border-top-right-radius: 10px 10px;
+ border-bottom-right-radius: 10px 10px;
+}
+#prev-button span, #next-button span, #toc-button span {
+ position: absolute;
+ top: 5px;
+ color: #fff;
+ font-weight: bold;
+ font-size: 20px;
+ padding: 2px;
+}
footer {
width: 100%;
clear: both;
View
44 waker/js/waker.js
@@ -56,19 +56,19 @@ var Waker = new function() {
//$('.logo-small').hide();
if(mCurrentPage == mPages.length - 1) {
- $('#nav-next').fadeOut();
+ $('#next-button').fadeOut();
} else {
- $('#nav-next').fadeIn();
+ $('#next-button').fadeIn();
}
-
+
if(mCurrentPage == 0) {
- $('#nav-prev').fadeOut();
- $('#nav-cover').fadeOut();
- $('#dossier-number').fadeOut();
+ $('#prev-button').fadeOut();
+ //$('#toc-button').fadeOut();
+ //$('#dossier-number').fadeOut();
} else {
- $('#nav-prev').fadeIn();
- $('#nav-cover').fadeIn();
- $('#dossier-number').html("<p>"+mCurrentPage+"</p>").fadeIn();
+ $('#prev-button').fadeIn();
+ //$('#toc-button').fadeIn();
+ //$('#dossier-number').html("<p>"+mCurrentPage+"</p>").fadeIn();
}
};
@@ -101,22 +101,13 @@ var Waker = new function() {
* @param theData the content of the page successfully loaded
*/
var pageLoaded = function(theData) {
- console.log(theData);
$('#content').html(theData);
$('#content').fadeIn("fast");
showLoading(false, Waker.closeToc);
- //updateNavBar();
+ updateNavBar();
document.title = mPages[mCurrentPage].title;
-
- //updateHeadlineImage();
- /*
- if(mCurrentPage == 0) {
- $('#headline').hide();
- } else {
- $('#headline').show();
- }*/
};
/**
@@ -273,10 +264,25 @@ var Waker = new function() {
$.pageslide.close();
};
+ var createNavBar = function() {
+ $('#next-button').on('click', function() {
+ Waker.nextPage();
+ });
+
+ $('#prev-button').on('click', function() {
+ Waker.prevPage();
+ });
+
+ $('#toc-button').on('click', function() {
+ Waker.openToc();
+ });
+ };
+
/**
* Starts Waker, loading the pages meta data and displaying the cover page.
*/
this.init = function() {
+ createNavBar();
updateNavBar();
// TODO: remove this debug lines!

0 comments on commit 5bc4a0e

Please sign in to comment.
Something went wrong with that request. Please try again.