1window.requestAnimFrame = (function(){ 2 return window.requestAnimationFrame || 3 window.webkitRequestAnimationFrame || 4 window.mozRequestAnimationFrame || 5 function( callback ){ 6 window.setTimeout(callback, 1000 / 60); 7 }; 8})(); 9 10window.cancelRequestAnimFrame = ( function() { 11 return window.cancelAnimationFrame || 12 window.webkitCancelRequestAnimationFrame || 13 window.mozCancelRequestAnimationFrame || 14 window.oCancelRequestAnimationFrame || 15 window.msCancelRequestAnimationFrame || 16 clearTimeout; 17} )(); 18 19var Intense = (function() { 20 21 'use strict'; 22 23 var KEYCODE_ESC = 27; 24 25 // Track both the current and destination mouse coordinates 26 // Destination coordinates are non-eased actual mouse coordinates 27 var mouse = { xCurr:0, yCurr:0, xDest: 0, yDest: 0 }; 28 29 var horizontalOrientation = true; 30 var invertInteractionDirection = false; 31 32 // Holds the animation frame id. 33 var looper; 34 35 // Current position of scrolly element 36 var lastPosition, currentPosition = 0; 37 38 var sourceDimensions, target; 39 var targetDimensions = { w: 0, h: 0 }; 40 41 var container; 42 var containerDimensions = { w: 0, h:0 }; 43 var overflowArea = { x: 0, y: 0 }; 44 45 // Overflow variable before screen is locked. 46 var overflowValue; 47 48 var active = false; 49 50 /* ------------------------- 51 /* UTILS 52 /* -------------------------*/ 53 54 // Soft object augmentation 55 function extend( target, source ) { 56 57 for ( var key in source ) 58 59 if ( !( key in target ) ) 60 61 target[ key ] = source[ key ]; 62 63 return target; 64 } 65 66 // Applys a dict of css properties to an element 67 function applyProperties( target, properties ) { 68 69 for( var key in properties ) { 70 target.style[ key ] = properties[ key ]; 71 } 72 } 73 74 // Returns whether target a vertical or horizontal fit in the page. 75 // As well as the right fitting width/height of the image. 76 function getFit( source ) { 77 78 var heightRatio = window.innerHeight / source.h; 79 80 if( (source.w * heightRatio) > window.innerWidth ) { 81 return { w: source.w * heightRatio, h: source.h * heightRatio, fit: true }; 82 } else { 83 var widthRatio = window.innerWidth / source.w; 84 return { w: source.w * widthRatio, h: source.h * widthRatio, fit: false }; 85 } 86 } 87 88 /* ------------------------- 89 /* APP 90 /* -------------------------*/ 91 92 function startTracking( passedElements ) { 93 94 var i; 95 96 // If passed an array of elements, assign tracking to all. 97 if ( passedElements.length ) { 98 99 // Loop and assign 100 for( i = 0; i < passedElements.length; i++ ) { 101 track( passedElements[ i ] ); 102 } 103 104 } else { 105 track( passedElements ); 106 } 107 } 108 109 function track( element ) { 110 111 // Element needs a src at minumun. 112 if( element.getAttribute( 'data-image') || element.src || element.href ) { 113 if (!active) { 114 init(element); 115 } 116 } 117 } 118 119 function start() { 120 loop(); 121 } 122 123 function stop() { 124 cancelRequestAnimFrame( looper ); 125 } 126 127 function loop() { 128 looper = requestAnimFrame(loop); 129 positionTarget(); 130 } 131 132 // Lock scroll on the document body. 133 function lockBody() { 134 135 overflowValue = document.body.style.overflow; 136 document.body.style.overflow = 'hidden'; 137 } 138 139 // Unlock scroll on the document body. 140 function unlockBody() { 141 document.body.style.overflow = overflowValue; 142 } 143 144 function setState (element, newClassName) { 145 if (element) { 146 element.className = element.className.replace('intense--loading', ''); 147 element.className = element.className.replace('intense--viewing', ''); 148 element.className += " " + newClassName; 149 } else { 150 // Remove element with class .view 151 var elems = document.querySelectorAll('.intense--viewing'); 152 [].forEach.call(elems, function(el) { 153 el.className = el.className.replace('intense--viewing', '').trim(); 154 }); 155 } 156 } 157 158 function createViewer( title, caption ) { 159 160 /*
161 * Container 162 */ 163 var containerProperties = { 164 'backgroundColor': 'rgba(0,0,0,0.8)', 165 'width': '100%', 166 'height': '100%', 167 'position': 'fixed', 168 'top': '0px', 169 'left': '0px', 170 'overflow': 'hidden', 171 'zIndex': '999999', 172 'margin': '0px', 173 'webkitTransition': 'opacity 150ms cubic-bezier( 0, 0, .26, 1 )', 174 'MozTransition': 'opacity 150ms cubic-bezier( 0, 0, .26, 1 )', 175 'transition': 'opacity 150ms cubic-bezier( 0, 0, .26, 1 )', 176 'webkitBackfaceVisibility': 'hidden', 177 'opacity': '0' 178 }; 179 container = document.createElement( 'figure' ); 180 container.appendChild( target ); 181 applyProperties( container, containerProperties ); 182 183 var imageProperties = { 184 'cursor': 'url( "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo3Q0IyNDI3M0FFMkYxMUUzOEQzQUQ5NTMxMDAwQjJGRCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo3Q0IyNDI3NEFFMkYxMUUzOEQzQUQ5NTMxMDAwQjJGRCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjdDQjI0MjcxQUUyRjExRTM4RDNBRDk1MzEwMDBCMkZEIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjdDQjI0MjcyQUUyRjExRTM4RDNBRDk1MzEwMDBCMkZEIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+soZ1WgAABp5JREFUeNrcWn9M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" ) 25 25, no-drop' 185 }; 186 applyProperties( target, imageProperties ); 187 188 /* 189 * Caption Container 190 */ 191 var captionContainerProperties = { 192 'fontFamily': 'Georgia, Times, "Times New Roman", serif', 193 'position': 'fixed', 194 'bottom': '0px', 195 'left': '0px', 196 'padding': '20px', 197 'color': '#fff', 198 'wordSpacing': '0.2px', 199 'webkitFontSmoothing': 'antialiased', 200 'textShadow': '-1px 0px 1px rgba(0,0,0,0.4)' 201 }; 202 var captionContainer = document.createElement( 'figcaption' ); 203 applyProperties( captionContainer, captionContainerProperties ); 204 205 /* 206 * Caption Title 207 */ 208 if ( title ) { 209 var captionTitleProperties = { 210 'margin': '0px', 211 'padding': '0px', 212 'fontWeight': 'normal', 213 'fontSize': '40px', 214 'letterSpacing': '0.5px', 215 'lineHeight': '35px', 216 'textAlign': 'left' 217 }; 218 var captionTitle = document.createElement( 'h1' ); 219 applyProperties( captionTitle, captionTitleProperties ); 220 captionTitle.innerHTML = title; 221 captionContainer.appendChild( captionTitle ); 222 } 223 224 if ( caption ) { 225 var captionTextProperties = { 226 'margin': '0px', 227 'padding': '0px', 228 'fontWeight': 'normal', 229 'fontSize': '20px', 230 'letterSpacing': '0.1px', 231 'maxWidth': '500px', 232 'textAlign': 'left', 233 'background': 'none', 234 'marginTop': '5px' 235 }; 236 var captionText = document.createElement( 'h2' ); 237 applyProperties( captionText, captionTextProperties ); 238 captionText.innerHTML = caption; 239 captionContainer.appendChild( captionText ); 240 } 241 242 container.appendChild( captionContainer ); 243 244 setDimensions(); 245 246 mouse.xCurr = mouse.xDest = window.innerWidth / 2; 247 mouse.yCurr = mouse.yDest = window.innerHeight / 2; 248 249 document.body.appendChild( container ); 250 setTimeout( function() { 251 container.style[ 'opacity' ] = '1'; 252 }, 10); 253 } 254 255 function removeViewer() { 256 257 unlockBody(); 258 unbindEvents(); 259 stop(); 260 document.body.removeChild( container ); 261 active = false; 262 setState(false); 263 } 264 265 function setDimensions() { 266 267 // Manually set height to stop bug where 268 var imageDimensions = getFit( sourceDimensions ); 269 target.width = imageDimensions.w; 270 target.height = imageDimensions.h; 271 horizontalOrientation = imageDimensions.fit; 272 273 targetDimensions = { w: target.width, h: target.height }; 274 containerDimensions = { w: window.innerWidth, h: window.innerHeight }; 275 overflowArea = {x: containerDimensions.w - targetDimensions.w, y: containerDimensions.h - targetDimensions.h}; 276 } 277 278 function init( element ) { 279 280 setState(element, 'intense--loading'); 281 var imageSource = element.getAttribute( 'data-image') || element.src || element.href; 282 var title = element.getAttribute( 'data-title') || element.title; 283 var caption = element.getAttribute( 'data-caption'); 284 285 var img = new Image(); 286 img.onload = function() { 287 288 sourceDimensions = { w: img.width, h: img.height }; // Save original dimensions for later. 289 target = this; 290 createViewer( title, caption ); 291 lockBody(); 292 bindEvents(); 293 loop(); 294 295 setState(element, 'intense--viewing'); 296 } 297 298 img.src = imageSource; 299 } 300 301 function bindEvents() { 302 303 container.addEventListener( 'mousemove', onMouseMove, false ); 304 container.addEventListener( 'touchmove', onTouchMove, false ); 305 window.addEventListener( 'resize', setDimensions, false ); 306 window.addEventListener( 'keyup', onKeyUp, false ); 307 target.addEventListener( 'click', removeViewer, false ); 308 } 309 310 function unbindEvents() { 311 312 container.removeEventListener( 'mousemove', onMouseMove, false ); 313 container.removeEventListener( 'touchmove', onTouchMove, false); 314 window.removeEventListener( 'resize', setDimensions, false ); 315 window.removeEventListener( 'keyup', onKeyUp, false ); 316 target.removeEventListener( 'click', removeViewer, false ); 317 } 318 319 function onMouseMove( event ) { 320 321 mouse.xDest = event.clientX; 322 mouse.yDest = event.clientY; 323 } 324 325 function onTouchMove( event ) { 326 327 event.preventDefault(); // Needed to keep this event firing. 328 mouse.xDest = event.touches[0].clientX; 329 mouse.yDest = event.touches[0].clientY; 330 } 331 332 // Exit on excape key pressed; 333 function onKeyUp( event ) { 334 335 event.preventDefault(); 336 if ( event.keyCode === KEYCODE_ESC ) { 337 removeViewer(); 338 } 339 } 340 341 function positionTarget() { 342 343 mouse.xCurr += ( mouse.xDest - mouse.xCurr ) * 0.05; 344 mouse.yCurr += ( mouse.yDest - mouse.yCurr ) * 0.05; 345 346 if ( horizontalOrientation === true ) { 347 348 // HORIZONTAL SCANNING 349 currentPosition += ( mouse.xCurr - currentPosition ); 350 if( mouse.xCurr !== lastPosition ) { 351 var position = parseFloat( calcPosition(currentPosition, containerDimensions.w) ); 352 position = overflowArea.x * position; 353 target.style[ 'webkitTransform' ] = 'translate(' + position + 'px, 0px)'; 354 target.style[ 'MozTransform' ] = 'translate(' + position + 'px, 0px)'; 355 target.style[ 'msTransform' ] = 'translate(' + position + 'px, 0px)'; 356 lastPosition = mouse.xCurr; 357 } 358 } else if ( horizontalOrientation === false ) { 359 360 // VERTICAL SCANNING 361 currentPosition += ( mouse.yCurr - currentPosition ); 362 if( mouse.yCurr !== lastPosition ) { 363 var position = parseFloat( calcPosition(currentPosition, containerDimensions.h) ); 364 position = overflowArea.y * position; 365 target.style[ 'webkitTransform' ] = 'translate( 0px, ' + position + 'px)'; 366 target.style[ 'MozTransform' ] = 'translate( 0px, ' + position + 'px)'; 367 target.style[ 'msTransform' ] = 'translate( 0px, ' + position + 'px)'; 368 lastPosition = mouse.yCurr; 369 } 370 } 371 372 function calcPosition(current, total){ 373 return invertInteractionDirection ? (total - current) / total : current / total; 374 } 375 376 } 377 378 function config(options){ 379 if ('invertInteractionDirection' in options) invertInteractionDirection = options.invertInteractionDirection; 380 } 381 382 function main( element, configOptions ) { 383 384 // Parse arguments 385 if ( !element ) { 386 throw 'You need to pass an element!'; 387 } 388 389 // If they have a config, use it! 390 if( configOptions ) { 391 config(configOptions); 392 } 393 394 startTracking( element ); 395 } 396 397 return extend( main, { 398 resize: setDimensions, 399 start: start, 400 stop: stop, 401 config: config 402 }); 403})(); 404 405if (typeof module !== 'undefined' && module.exports){ 406 module.exports = Intense; 407}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.