mirror of
				https://github.com/flynx/PortableMag.git
				synced 2025-10-31 03:50:16 +00:00 
			
		
		
		
	added basic persistent bookmarks ...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									1110c1d195
								
							
						
					
					
						commit
						a022c11743
					
				
							
								
								
									
										18
									
								
								magazine.css
									
									
									
									
									
								
							
							
						
						
									
										18
									
								
								magazine.css
									
									
									
									
									
								
							| @ -271,8 +271,8 @@ body { | |||||||
| .navigator .bar .indicator { | .navigator .bar .indicator { | ||||||
| 	position: absolute; | 	position: absolute; | ||||||
| 	/* set this to the percentage of a page from magazine length */ | 	/* set this to the percentage of a page from magazine length */ | ||||||
| 	width: 1%; |  | ||||||
| 	min-width: 10px; | 	min-width: 10px; | ||||||
|  | 	width: 1%; | ||||||
| 	height: 100%; | 	height: 100%; | ||||||
| } | } | ||||||
| .navigator .bar .article { | .navigator .bar .article { | ||||||
| @ -301,6 +301,22 @@ body { | |||||||
| 	-ms-transition: none;	 | 	-ms-transition: none;	 | ||||||
| 	transition: none; | 	transition: none; | ||||||
| } | } | ||||||
|  | .navigator .bar .bookmark { | ||||||
|  | 	position: absolute; | ||||||
|  | 	font-size: 0px; | ||||||
|  | 	width: 5px; | ||||||
|  | 	height: 5px; | ||||||
|  | 
 | ||||||
|  | 	top: -250%; | ||||||
|  | 
 | ||||||
|  | 	background: red; | ||||||
|  | 
 | ||||||
|  | 	-webkit-transform: rotate(45deg); | ||||||
|  | 	-moz-transform: rotate(45deg); | ||||||
|  | 	-o-transform: rotate(45deg); | ||||||
|  | 	-ms-transform: rotate(45deg); | ||||||
|  | 	transform: rotate(45deg); | ||||||
|  | } | ||||||
| 
 | 
 | ||||||
| /* splash screen. used to hide loading and aligning elements */ | /* splash screen. used to hide loading and aligning elements */ | ||||||
| .splash { | .splash { | ||||||
|  | |||||||
							
								
								
									
										67
									
								
								magazine.js
									
									
									
									
									
								
							
							
						
						
									
										67
									
								
								magazine.js
									
									
									
									
									
								
							| @ -78,6 +78,9 @@ function getPageNumber(page){ | |||||||
| 	return $('.page').index(page)  | 	return $('.page').index(page)  | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | function getPageAt(n){ | ||||||
|  | 	return $($('.page')[n]) | ||||||
|  | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| /************************************************** event handlers ***/ | /************************************************** event handlers ***/ | ||||||
| @ -315,7 +318,7 @@ function setCurrentPage(n, offset, width){ | |||||||
| 		var cur = $('.current.page') | 		var cur = $('.current.page') | ||||||
| 		n = $('.page').index(cur)  | 		n = $('.page').index(cur)  | ||||||
| 	} else if(typeof(n) == typeof(1)) { | 	} else if(typeof(n) == typeof(1)) { | ||||||
| 		var cur = $($('.page')[n]) | 		var cur = getPageAt(n) | ||||||
| 	} else { | 	} else { | ||||||
| 		var cur = $(n) | 		var cur = $(n) | ||||||
| 		n = $('.page').index(cur)  | 		n = $('.page').index(cur)  | ||||||
| @ -504,10 +507,14 @@ function saveURLState(){ | |||||||
| 
 | 
 | ||||||
| // local storage state managers...
 | // local storage state managers...
 | ||||||
| function loadStorageState(){ | function loadStorageState(){ | ||||||
| 	return parseInt($.jStorage.get('current_page', 0)) | 	return { | ||||||
|  | 		current_page: parseInt($.jStorage.get('current_page', 0)), | ||||||
|  | 		bookmarks: $.jStorage.get('bookmarks', []) | ||||||
|  | 	} | ||||||
| } | } | ||||||
| function saveStorageState(){ | function saveStorageState(){ | ||||||
| 	$.jStorage.set('current_page', getPageNumber()) | 	$.jStorage.set('current_page', getPageNumber()) | ||||||
|  | 	$.jStorage.set('bookmarks', getBookmarkList()) | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| @ -526,11 +533,13 @@ function dumpJSONState(){ | |||||||
| // generic state managers...
 | // generic state managers...
 | ||||||
| function loadState(){ | function loadState(){ | ||||||
| 	var n = loadURLState() | 	var n = loadURLState() | ||||||
|  | 	var state = loadStorageState()  | ||||||
| 	if(n != null){ | 	if(n != null){ | ||||||
| 		setCurrentPage(n) | 		setCurrentPage(n) | ||||||
| 	} else { | 	} else { | ||||||
| 		setCurrentPage(loadStorageState()) | 		setCurrentPage(state.current_page) | ||||||
| 	} | 	} | ||||||
|  | 	loadBookmarks(state.bookmarks) | ||||||
| } | } | ||||||
| function saveState(){ | function saveState(){ | ||||||
| 	saveURLState() | 	saveURLState() | ||||||
| @ -562,7 +571,7 @@ function _makeArticleIndicator(i, article, width){ | |||||||
| function setupArticleIndicators(W){ | function setupArticleIndicators(W){ | ||||||
| 	var articles = $('.magazine .article') | 	var articles = $('.magazine .article') | ||||||
| 	// cleanup...
 | 	// cleanup...
 | ||||||
| 	$('.indicator .bar .article').remove() | 	$('.navigator .bar .article').remove() | ||||||
| 	// set article indicator positions...
 | 	// set article indicator positions...
 | ||||||
| 	articles.each(function(i, e){ | 	articles.each(function(i, e){ | ||||||
| 		return _makeArticleIndicator(i, e, W) | 		return _makeArticleIndicator(i, e, W) | ||||||
| @ -626,6 +635,56 @@ function updateNavigator(n){ | |||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | // XXX store bookmarks in a seporate place...
 | ||||||
|  | // NOTE: this depends on the indicator bar...
 | ||||||
|  | function makeBookmarkIndicator(n){ | ||||||
|  | 	if(n == null){ | ||||||
|  | 		n = getPageNumber() | ||||||
|  | 	} else if(typeof(n) != typeof(1)){ | ||||||
|  | 		n = getPageNumber(n) | ||||||
|  | 	} | ||||||
|  | 	var bar = $('.navigator .bar') | ||||||
|  | 	var pages = $('.page').length | ||||||
|  | 	var width = bar.width()/pages | ||||||
|  | 	var res = $('<div/>') | ||||||
|  | 		.prependTo($('.navigator .bar')) | ||||||
|  | 		.addClass('bookmark') | ||||||
|  | 		.css({ | ||||||
|  | 			left: width*n | ||||||
|  | 		}) | ||||||
|  | 		.attr({ | ||||||
|  | 			page: n | ||||||
|  | 		}) | ||||||
|  | 		.click(function(){ | ||||||
|  | 			setCurrentPage(n) | ||||||
|  | 		}) | ||||||
|  | 
 | ||||||
|  | 	// XXX should this be here???
 | ||||||
|  | 	saveState() | ||||||
|  | 
 | ||||||
|  | 	return res | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | function loadBookmarks(lst){ | ||||||
|  | 	$(lst).each(function(i, e){makeBookmarkIndicator(e)}) | ||||||
|  | } | ||||||
|  | function getBookmarkList(){ | ||||||
|  | 	var res = [] | ||||||
|  | 	$('.navigator .bar .bookmark').each(function(_, e){res.push(parseInt($(e).attr('page')))}) | ||||||
|  | 	return res | ||||||
|  | } | ||||||
|  | function clearBookmarkIndicators(){ | ||||||
|  | 	$('.navigator .bar .bookmark').remove() | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // XXX move this to actions...
 | ||||||
|  | function nextBookmark(){ | ||||||
|  | 	// XXX
 | ||||||
|  | } | ||||||
|  | function prevBookmark(){ | ||||||
|  | 	// XXX
 | ||||||
|  | } | ||||||
|  | 
 | ||||||
| 
 | 
 | ||||||
| /********************************************************** editor ***/ | /********************************************************** editor ***/ | ||||||
| 
 | 
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user