flynx/PortableMag
1
0
Fork 0
mirror of https://github.com/flynx/PortableMag.git synced 2025-11-03 05:20:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

added page number indicator to the toolbar...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-01-30 01:00:58 +04:00
parent 6dd41d7a1f
commit e054c42381
4 changed files with 36 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
TODO.otl
View File

@ -1,12 +1,12 @@
[_] 34% Priority work
[_] 33% Priority work
[_] 0% TouchSwipe issues...
[_] BUG: swipe-back does not cancel a swipe... (TouchSwipe)
| ...unless the finger is return to within the threshold of the
| touchdown point.
[_] BUG: no drag threshold on excludedElements (TouchSwipe)
| stalled...
[_] 79% general todo
BUG: initial load on android does not center on the correct page...
[_] 76% general todo
[_] BUG: initial load on android does not center on the correct page...
[_] magazine loader and data format...
| this is simple, just use a restyled magazine viewer...
[_] 0% populate an example issue
@ -21,6 +21,7 @@
| something like a page reset that will restore the default state,
| rather than the current "hideLayers"
[_] make corners clickable for bookmarking...
[X] add page numbers...
[X] SVG icons and logo...
[X] 100% bookmarks
[X] add next/prev bookmark actions

4
index.html
View File

@ -2,7 +2,7 @@
<!--DOCTYPE html-->
<html>
<head>
<title>Magazine</title>
<title>PortableMag</title>
<link rel="stylesheet" href="magazine.css">
<link rel="stylesheet" href="magazine-custom.css">
@ -41,6 +41,7 @@ $(document).ready(function(){
$('.viewer')
// setup internal events...
.on('pageChanged bookmarkAdded bookmarkRemoved bookmarksCleared', saveState)
.on('pageChanged', updatePageNumberIndicator)
.on('bookmarksCleared', clearBookmarkIndicators)
.on('bookmarkAdded', function(_, n){makeBookmarkIndicator(n)})
.on('bookmarkRemoved', function(_, n){removeBookmarkIndicator(n)})
@ -195,6 +196,7 @@ $(document).ready(function(){
<div class="indicator"></div>
</div>
</div>
<div class="page-number">0/0</div>
</div>
<div class="scaler">

32
magazine.css
View File

@ -254,10 +254,21 @@ body {
font-size: 14px;
color: silver;
}
.top-toolbar {
top: 0px;
width: 100%;
}
.bottom-toolbar {
bottom: 0px;
width: 100%;
}
/* title */
.top-toolbar .title,
.bottom-toolbar .title {
font-size: 40px;
}
/* toolbar element sets */
.top-toolbar .left-set,
.bottom-toolbar .left-set {
float: left;
@ -268,22 +279,16 @@ body {
float: right;
text-align: right;
}
/* toolbar links */
.top-toolbar a, .bottom-toolbar a {
color: silver;
text-decoration: none;
}
/* toolbar controls */
.top-toolbar .controls, .bottom-toolbar .controls {
margin-top: 10px;
}
.top-toolbar {
top: 0px;
width: 100%;
}
.bottom-toolbar {
bottom: 0px;
width: 100%;
}
/* toolbar buttons */
.button {
display: inline-block;
font-size: 25px;
@ -298,11 +303,20 @@ body {
margin-left: 20px;
margin-right: 20px;
}
/* page view mode */
.page-view-mode .top-toolbar,
.page-view-mode .bottom-toolbar {
height: 0px;
}
/* page indicator */
.bottom-toolbar .page-number {
position: absolute;
right: 10px;
top: 10px;
color: gray;
}
/* navigator... */

6
magazine.js
View File

@ -774,6 +774,12 @@ function removeBookmarkIndicator(n){
}
// NOTE: this is 1 based page number, the rest of the system is 0 based.
function updatePageNumberIndicator(){
$('.page-number').text((getPageNumber()+1)+'/'+$('.page').length)
}
/********************************************************** editor ***/