mirror of
				https://github.com/flynx/PortableMag.git
				synced 2025-10-31 20:10:13 +00:00 
			
		
		
		
	reverted to page morphing, needs more assessment...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									66460d13d0
								
							
						
					
					
						commit
						5f3f7caba5
					
				
							
								
								
									
										10
									
								
								TODO.otl
									
									
									
									
									
								
							
							
						
						
									
										10
									
								
								TODO.otl
									
									
									
									
									
								
							| @ -1,10 +1,12 @@ | ||||
| [_] 12% Priority work | ||||
| 	[_] 0% general todo | ||||
| 		[_] use modes (CSS) for thumbnail/page views... | ||||
| [_] 25% Priority work | ||||
| 	[_] 50% general todo | ||||
| 		[X] use modes (CSS) for thumbnail/page views... | ||||
| 		[_] vanquish opacity effects | ||||
| 		| they slow everything down considerably! | ||||
| 	[_] 50% stage 1 - basic features | ||||
| 		[X] real magazine structure | ||||
| 		[_] issue browser structure | ||||
| 		[_] global navigation bar | ||||
| 		[X] real magazine structure | ||||
| 		[X] 100% basic article navigation | ||||
| 			[X] next page | ||||
| 			[X] prev page | ||||
|  | ||||
							
								
								
									
										24
									
								
								index.html
									
									
									
									
									
								
							
							
						
						
									
										24
									
								
								index.html
									
									
									
									
									
								
							| @ -26,9 +26,12 @@ $(document).ready(function(){ | ||||
| 			swipeDown: function(){ | ||||
| 				togglePageView('on') | ||||
| 			}, | ||||
| 			// XXX for some reason this deos not bubble up the nested elements... | ||||
| 			click: function(evt, elem){ | ||||
| 				if($(elem).hasClass('page')){ | ||||
| 					setCurrentPage(elem) | ||||
| 				} else if($(elem).hasClass('content')){ | ||||
| 					setCurrentPage($(elem).parents('.page').first()) | ||||
| 				} | ||||
| 				return true | ||||
| 			} | ||||
| @ -174,6 +177,8 @@ togglePageDragging = createCSSClassToggler( | ||||
| 	'dragging') | ||||
| 
 | ||||
| 
 | ||||
| var FIT_PAGE_TO_VIEW = true | ||||
| 
 | ||||
| togglePageView = createCSSClassToggler( | ||||
| 	'.viewer',  | ||||
| 	'page-view-mode', | ||||
| @ -182,19 +187,25 @@ togglePageView = createCSSClassToggler( | ||||
| 	function(){ | ||||
| 		if(togglePageView('?') == 'on'){ | ||||
| 			PAGES_VISIBLE = 1 | ||||
| 			//fitPagesToViewer(PAGES_VISIBLE) | ||||
| 			if(FIT_PAGE_TO_VIEW){ | ||||
| 				fitPagesToViewer(PAGES_VISIBLE) | ||||
| 			} else { | ||||
| 				fitNPages(PAGES_VISIBLE) | ||||
| 				// to prevent drag while zooming to affect | ||||
| 				// the resulting position set it to current  | ||||
| 				// page... | ||||
| 				// XXX now this is done by fitNPages | ||||
| 				setCurrentPage() | ||||
| 			} | ||||
| 		} else { | ||||
| 			PAGES_VISIBLE = PAGES_IN_RIBBON | ||||
| 			if(FIT_PAGE_TO_VIEW){ | ||||
| 				// XXX this needs to be done before transitions... | ||||
| 			//fitPagesToContent(PAGES_VISIBLE) | ||||
| 				fitPagesToContent(PAGES_VISIBLE) | ||||
| 			} else { | ||||
| 				fitNPages(PAGES_VISIBLE) | ||||
| 			} | ||||
| 		} | ||||
| 	}) | ||||
| 
 | ||||
| function getPageScale(){ | ||||
| @ -221,12 +232,11 @@ function fitNPages(n){ | ||||
| 
 | ||||
| 	setElementScale($('.scaler'), scale) | ||||
| 
 | ||||
| 	/* | ||||
| 	/* XXX | ||||
| 	fitPagesTo(null, n) | ||||
| 	*/ | ||||
| } | ||||
| 
 | ||||
| /* | ||||
| // NOTE: this is a single big function because we need to thread data  | ||||
| //		through to avoid sampling while animating... | ||||
| // XXX try and do the fitting with pure CSS... | ||||
| @ -294,7 +304,6 @@ function fitPagesTo(elem, n){ | ||||
| 	// update position using the new width... | ||||
| 	setCurrentPage(null, rW) | ||||
| } | ||||
| */ | ||||
| 
 | ||||
| 
 | ||||
| function fitPagesToViewer(n){ | ||||
| @ -441,6 +450,9 @@ function createPage(article, template){ | ||||
| <body> | ||||
| 
 | ||||
| <div class="viewer"> | ||||
| 
 | ||||
| 	<!-- XXX add toolbars here... --> | ||||
| 
 | ||||
| <div class="scaler"> | ||||
| <div class="aligner"> | ||||
| 	<div class="magazine"> | ||||
| @ -463,7 +475,7 @@ function createPage(article, template){ | ||||
| 			<!-- XXX do we need an Article Credits page??? --> | ||||
| 
 | ||||
| 			<div class="page"> | ||||
| 				<div class="content"> | ||||
| 				<div class="content" style="border:solid red 1px"> | ||||
| 					Page | ||||
| 				</div> | ||||
| 			</div> | ||||
|  | ||||
| @ -136,22 +136,24 @@ body { | ||||
| .page-view-mode.viewer { | ||||
| 	background: white; | ||||
| } | ||||
| 
 | ||||
| .page-view-mode .page .content { | ||||
| 	opacity: 0; | ||||
| } | ||||
| .page-view-mode .current.page .content { | ||||
| 	opacity: 1; | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| .page-view-mode.viewer.dragging { | ||||
| 	/* | ||||
| 	background: silver; | ||||
| 	*/ | ||||
| } | ||||
| .page-view-mode.dragging .page .content { | ||||
| 	opacity: 1; | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /* keep this at the end... */ | ||||
| .unanimated { | ||||
| 	-webkit-transition: none; | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user