disable zoom plugin while in overview mode
This commit is contained in:
		| @@ -1,29 +1,34 @@ | |||||||
| // Custom reveal.js integration | // Custom reveal.js integration | ||||||
| (function(){ | (function(){ | ||||||
| 	document.querySelector( '.reveal' ).addEventListener( 'click', function( event ) { | 	var isEnabled = true; | ||||||
| 		if( event.altKey ) { |  | ||||||
|  | 	document.querySelector( '.reveal' ).addEventListener( 'mousedown', function( event ) { | ||||||
|  | 		if( event.altKey && isEnabled ) { | ||||||
| 			event.preventDefault(); | 			event.preventDefault(); | ||||||
| 			zoom.to({ element: event.target, pan: false }); | 			zoom.to({ element: event.target, pan: false }); | ||||||
| 		} | 		} | ||||||
| 	} ); | 	} ); | ||||||
|  |  | ||||||
|  | 	Reveal.addEventListener( 'overviewshown', function() { isEnabled = false; } ); | ||||||
|  | 	Reveal.addEventListener( 'overviewhidden', function() { isEnabled = true; } ); | ||||||
| })(); | })(); | ||||||
|  |  | ||||||
| /*! | /*! | ||||||
|  * zoom.js 0.2 (modified version for use with reveal.js) |  * zoom.js 0.2 (modified version for use with reveal.js) | ||||||
|  * http://lab.hakim.se/zoom-js |  * http://lab.hakim.se/zoom-js | ||||||
|  * MIT licensed |  * MIT licensed | ||||||
|  *  |  * | ||||||
|  * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se |  * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se | ||||||
|  */ |  */ | ||||||
| var zoom = (function(){ | var zoom = (function(){ | ||||||
|  |  | ||||||
| 	// The current zoom level (scale) | 	// The current zoom level (scale) | ||||||
| 	var level = 1; | 	var level = 1; | ||||||
| 	 |  | ||||||
| 	// The current mouse position, used for panning | 	// The current mouse position, used for panning | ||||||
| 	var mouseX = 0, | 	var mouseX = 0, | ||||||
| 		mouseY = 0; | 		mouseY = 0; | ||||||
| 	 |  | ||||||
| 	// Timeout before pan is activated | 	// Timeout before pan is activated | ||||||
| 	var panEngageTimeout = -1, | 	var panEngageTimeout = -1, | ||||||
| 		panUpdateInterval = -1; | 		panUpdateInterval = -1; | ||||||
| @@ -36,7 +41,7 @@ var zoom = (function(){ | |||||||
| 								'msTransform' in document.body.style || | 								'msTransform' in document.body.style || | ||||||
| 								'OTransform' in document.body.style || | 								'OTransform' in document.body.style || | ||||||
| 								'transform' in document.body.style; | 								'transform' in document.body.style; | ||||||
|      |  | ||||||
| 	if( supportsTransforms ) { | 	if( supportsTransforms ) { | ||||||
| 		// The easing that will be applied when we zoom in/out | 		// The easing that will be applied when we zoom in/out | ||||||
| 		document.body.style.transition = 'transform 0.8s ease'; | 		document.body.style.transition = 'transform 0.8s ease'; | ||||||
| @@ -45,7 +50,7 @@ var zoom = (function(){ | |||||||
| 		document.body.style.MozTransition = '-moz-transform 0.8s ease'; | 		document.body.style.MozTransition = '-moz-transform 0.8s ease'; | ||||||
| 		document.body.style.WebkitTransition = '-webkit-transform 0.8s ease'; | 		document.body.style.WebkitTransition = '-webkit-transform 0.8s ease'; | ||||||
| 	} | 	} | ||||||
| 	 |  | ||||||
| 	// Zoom out if the user hits escape | 	// Zoom out if the user hits escape | ||||||
| 	document.addEventListener( 'keyup', function( event ) { | 	document.addEventListener( 'keyup', function( event ) { | ||||||
| 		if( level !== 1 && event.keyCode === 27 ) { | 		if( level !== 1 && event.keyCode === 27 ) { | ||||||
| @@ -62,21 +67,21 @@ var zoom = (function(){ | |||||||
| 	}, false ); | 	}, false ); | ||||||
|  |  | ||||||
| 	/** | 	/** | ||||||
| 	 * Applies the CSS required to zoom in, prioritizes use of CSS3  | 	 * Applies the CSS required to zoom in, prioritizes use of CSS3 | ||||||
| 	 * transforms but falls back on zoom for IE. | 	 * transforms but falls back on zoom for IE. | ||||||
| 	 *  | 	 * | ||||||
| 	 * @param {Number} pageOffsetX  | 	 * @param {Number} pageOffsetX | ||||||
| 	 * @param {Number} pageOffsetY  | 	 * @param {Number} pageOffsetY | ||||||
| 	 * @param {Number} elementOffsetX  | 	 * @param {Number} elementOffsetX | ||||||
| 	 * @param {Number} elementOffsetY  | 	 * @param {Number} elementOffsetY | ||||||
| 	 * @param {Number} scale  | 	 * @param {Number} scale | ||||||
| 	 */ | 	 */ | ||||||
| 	function magnify( pageOffsetX, pageOffsetY, elementOffsetX, elementOffsetY, scale ) { | 	function magnify( pageOffsetX, pageOffsetY, elementOffsetX, elementOffsetY, scale ) { | ||||||
|  |  | ||||||
| 		if( supportsTransforms ) { | 		if( supportsTransforms ) { | ||||||
| 			var origin = pageOffsetX +'px '+ pageOffsetY +'px', | 			var origin = pageOffsetX +'px '+ pageOffsetY +'px', | ||||||
| 				transform = 'translate('+ -elementOffsetX +'px,'+ -elementOffsetY +'px) scale('+ scale +')'; | 				transform = 'translate('+ -elementOffsetX +'px,'+ -elementOffsetY +'px) scale('+ scale +')'; | ||||||
| 			 |  | ||||||
| 			document.body.style.transformOrigin = origin; | 			document.body.style.transformOrigin = origin; | ||||||
| 			document.body.style.OTransformOrigin = origin; | 			document.body.style.OTransformOrigin = origin; | ||||||
| 			document.body.style.msTransformOrigin = origin; | 			document.body.style.msTransformOrigin = origin; | ||||||
| @@ -121,7 +126,7 @@ var zoom = (function(){ | |||||||
| 	} | 	} | ||||||
|  |  | ||||||
| 	/** | 	/** | ||||||
| 	 * Pan the document when the mosue cursor approaches the edges  | 	 * Pan the document when the mosue cursor approaches the edges | ||||||
| 	 * of the window. | 	 * of the window. | ||||||
| 	 */ | 	 */ | ||||||
| 	function pan() { | 	function pan() { | ||||||
| @@ -129,7 +134,7 @@ var zoom = (function(){ | |||||||
| 			rangeX = window.innerWidth * range, | 			rangeX = window.innerWidth * range, | ||||||
| 			rangeY = window.innerHeight * range, | 			rangeY = window.innerHeight * range, | ||||||
| 			scrollOffset = getScrollOffset(); | 			scrollOffset = getScrollOffset(); | ||||||
| 		 |  | ||||||
| 		// Up | 		// Up | ||||||
| 		if( mouseY < rangeY ) { | 		if( mouseY < rangeY ) { | ||||||
| 			window.scroll( scrollOffset.x, scrollOffset.y - ( 1 - ( mouseY / rangeY ) ) * ( 14 / level ) ); | 			window.scroll( scrollOffset.x, scrollOffset.y - ( 1 - ( mouseY / rangeY ) ) * ( 14 / level ) ); | ||||||
| @@ -159,7 +164,7 @@ var zoom = (function(){ | |||||||
| 	return { | 	return { | ||||||
| 		/** | 		/** | ||||||
| 		 * Zooms in on either a rectangle or HTML element. | 		 * Zooms in on either a rectangle or HTML element. | ||||||
| 		 *  | 		 * | ||||||
| 		 * @param {Object} options | 		 * @param {Object} options | ||||||
| 		 *   - element: HTML element to zoom in on | 		 *   - element: HTML element to zoom in on | ||||||
| 		 *   OR | 		 *   OR | ||||||
| @@ -232,7 +237,7 @@ var zoom = (function(){ | |||||||
| 			if( currentOptions && currentOptions.element ) { | 			if( currentOptions && currentOptions.element ) { | ||||||
| 				scrollOffset.x -= ( window.innerWidth - ( currentOptions.width * currentOptions.scale ) ) / 2; | 				scrollOffset.x -= ( window.innerWidth - ( currentOptions.width * currentOptions.scale ) ) / 2; | ||||||
| 			} | 			} | ||||||
| 			 |  | ||||||
| 			magnify( scrollOffset.x, scrollOffset.y, 0, 0, 1 ); | 			magnify( scrollOffset.x, scrollOffset.y, 0, 0, 1 ); | ||||||
|  |  | ||||||
| 			level = 1; | 			level = 1; | ||||||
| @@ -241,11 +246,11 @@ var zoom = (function(){ | |||||||
| 		// Alias | 		// Alias | ||||||
| 		magnify: function( options ) { this.to( options ) }, | 		magnify: function( options ) { this.to( options ) }, | ||||||
| 		reset: function() { this.out() }, | 		reset: function() { this.out() }, | ||||||
| 		 |  | ||||||
| 		zoomLevel: function() { | 		zoomLevel: function() { | ||||||
| 			return level; | 			return level; | ||||||
| 		} | 		} | ||||||
| 	} | 	} | ||||||
| 	 |  | ||||||
| })(); | })(); | ||||||
|  |  | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user