added basic paging, still not aligning as we should, still untested with scaling...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-02-14 05:47:25 +04:00
parent 71d323fe3a
commit 6af37f65c1
2 changed files with 14 additions and 6 deletions

View File

@ -4,6 +4,7 @@
<head>
<title>PortableMag</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="magazine.css">
<link rel="stylesheet" href="magazine-themes.css">
@ -133,10 +134,14 @@ $(document).ready(function(){
snap: '.page',
momentum: false,
hScrollbar: false,
/*onScrollEnd: function () {
document.querySelector('#indicator > li.active').className = '';
document.querySelector('#indicator > li:nth-child(' + (this.currPageX+1) + ')').className = 'active';
}*/
onScrollEnd: function () {
var n = getPageNumber()
var page = $($('.page')[n])
$('.current.page').removeClass('current')
page.addClass('current')
// XXX need to calc the propper offset...
myScroll.scrollToElement(page.offset(), 40)
}
})

View File

@ -91,15 +91,18 @@ function getPageNumber(page){
// get the closest page to view...
} else {
// XXX this gets crazy when magazine is scaled...
var s = $('.viewer').scrollLeft()
//var s = $('.viewer').scrollLeft()
var o = -$($('.magazine')[0]).offset().left - $('.viewer').offset().left
var W = $('.viewer').width()
var scale = getMagazineScale()
var cur = -1
var res = $('.page').map(function(i, e){
e = $(e)
var l = e.position().left
//var l = e.offset().left
var w = e.width()*scale
return Math.abs((l+(w/2)) - (s+(W/2)))
//return Math.abs((l+(w/2)) - (s+(W/2)))
return Math.abs((l+(w/2)) - (o+(W/2)))
})
cur = res.index(Math.min.apply(Math, res))
return cur