{{ page.title }}
8 |{{ page.date | date: '%B %-d, %Y' }}
9 |
10 | {{ content }}
11 |
12 | ' ).appendTo( 'body' );
169 | },
170 | activityIndicatorOff = function()
171 | {
172 | $( '#imagelightbox-loading' ).remove();
173 | },
174 |
175 | overlayOn = function()
176 | {
177 | $( '' ).appendTo( 'body' );
178 | },
179 | overlayOff = function()
180 | {
181 | $( '#imagelightbox-overlay' ).remove();
182 | },
183 |
184 | closeButtonOn = function( instance )
185 | {
186 | $( '' ).appendTo( 'body' ).on( 'click touchend', function(){ $( this ).remove(); instance.quitImageLightbox(); return false; });
187 | },
188 | closeButtonOff = function()
189 | {
190 | $( '#imagelightbox-close' ).remove();
191 | },
192 |
193 | captionOn = function()
194 | {
195 | var description = $( 'a[href="' + $( '#imagelightbox' ).attr( 'src' ) + '"] img' ).attr( 'alt' );
196 | if( description.length > 0 )
197 | $( '
' + description + '
' ).appendTo( 'body' );
198 | },
199 | captionOff = function()
200 | {
201 | $( '#imagelightbox-caption' ).remove();
202 | };
203 |
204 | var instanceA = $( 'a[data-imagelightbox="a"]' ).imageLightbox(
205 | {
206 | onStart: function() { overlayOn(); closeButtonOn( instanceA ); },
207 | onEnd: function() { overlayOff(); captionOff(); closeButtonOff(); activityIndicatorOff(); },
208 | onLoadStart: function() { captionOff(); activityIndicatorOn(); },
209 | onLoadEnd: function() { captionOn(); activityIndicatorOff(); }
210 |
211 | });
212 |
213 | }
214 | else {
215 |
216 | /*----------------------------------------------------*/
217 | /* prettyPhoto for old IE
218 | /*----------------------------------------------------*/
219 | $("#screenshots").find(".item-wrap a").attr("rel","prettyPhoto[pp_gal]");
220 |
221 | $("a[rel^='prettyPhoto']").prettyPhoto( {
222 |
223 | animation_speed: 'fast', /* fast/slow/normal */
224 | slideshow: false, /* false OR interval time in ms */
225 | autoplay_slideshow: false, /* true/false */
226 | opacity: 0.80, /* Value between 0 and 1 */
227 | show_title: true, /* true/false */
228 | allow_resize: true, /* Resize the photos bigger than viewport. true/false */
229 | default_width: 500,
230 | default_height: 344,
231 | counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
232 | theme: 'pp_default', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
233 | hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */
234 | wmode: 'opaque', /* Set the flash wmode attribute */
235 | autoplay: true, /* Automatically start videos: True/False */
236 | modal: false, /* If set to true, only the close button will close the window */
237 | overlay_gallery: false, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
238 | keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
239 | deeplinking: false,
240 | social_tools: false
241 |
242 | });
243 |
244 | }
245 |
246 |
247 | })(jQuery);
248 |
--------------------------------------------------------------------------------
/js/imagelightbox.js:
--------------------------------------------------------------------------------
1 |
2 | /*
3 | By Osvaldas Valutis, www.osvaldas.info
4 | Available for use under the MIT License
5 | */
6 |
7 | ;( function( $, window, document, undefined )
8 | {
9 | 'use strict';
10 |
11 | var cssTransitionSupport = function()
12 | {
13 | var s = document.body || document.documentElement, s = s.style;
14 | if( s.WebkitTransition == '' ) return '-webkit-';
15 | if( s.MozTransition == '' ) return '-moz-';
16 | if( s.OTransition == '' ) return '-o-';
17 | if( s.transition == '' ) return '';
18 | return false;
19 | },
20 |
21 | isCssTransitionSupport = cssTransitionSupport() === false ? false : true,
22 |
23 | cssTransitionTranslateX = function( element, positionX, speed )
24 | {
25 | var options = {}, prefix = cssTransitionSupport();
26 | options[ prefix + 'transform' ] = 'translateX(' + positionX + ')';
27 | options[ prefix + 'transition' ] = prefix + 'transform ' + speed + 's linear';
28 | element.css( options );
29 | },
30 |
31 | hasTouch = ( 'ontouchstart' in window ),
32 | hasPointers = window.navigator.pointerEnabled || window.navigator.msPointerEnabled,
33 | wasTouched = function( event )
34 | {
35 | if( hasTouch )
36 | return true;
37 |
38 | if( !hasPointers || typeof event === 'undefined' || typeof event.pointerType === 'undefined' )
39 | return false;
40 |
41 | if( typeof event.MSPOINTER_TYPE_MOUSE !== 'undefined' )
42 | {
43 | if( event.MSPOINTER_TYPE_MOUSE != event.pointerType )
44 | return true;
45 | }
46 | else
47 | if( event.pointerType != 'mouse' )
48 | return true;
49 |
50 | return false;
51 | };
52 |
53 | $.fn.imageLightbox = function( options )
54 | {
55 | var options = $.extend(
56 | {
57 | selector: 'id="imagelightbox"',
58 | allowedTypes: 'png|jpg|jpeg|gif',
59 | animationSpeed: 250,
60 | preloadNext: true,
61 | enableKeyboard: true,
62 | quitOnEnd: false,
63 | quitOnImgClick: false,
64 | quitOnDocClick: true,
65 | onStart: false,
66 | onEnd: false,
67 | onLoadStart: false,
68 | onLoadEnd: false
69 | },
70 | options ),
71 |
72 | targets = $([]),
73 | target = $(),
74 | image = $(),
75 | imageWidth = 0,
76 | imageHeight = 0,
77 | swipeDiff = 0,
78 | inProgress = false,
79 |
80 | isTargetValid = function( element )
81 | {
82 | return $( element ).prop( 'tagName' ).toLowerCase() == 'a' && ( new RegExp( '\.(' + options.allowedTypes + ')$', 'i' ) ).test( $( element ).attr( 'href' ) );
83 | },
84 |
85 | setImage = function()
86 | {
87 | if( !image.length ) return false;
88 |
89 | var screenWidth = $( window ).width() * 0.8,
90 | screenHeight = $( window ).height() * 0.9,
91 | tmpImage = new Image();
92 |
93 | tmpImage.src = image.attr( 'src' );
94 | tmpImage.onload = function()
95 | {
96 | imageWidth = tmpImage.width;
97 | imageHeight = tmpImage.height;
98 |
99 | if( imageWidth > screenWidth || imageHeight > screenHeight )
100 | {
101 | var ratio = imageWidth / imageHeight > screenWidth / screenHeight ? imageWidth / screenWidth : imageHeight / screenHeight;
102 | imageWidth /= ratio;
103 | imageHeight /= ratio;
104 | }
105 |
106 | image.css(
107 | {
108 | 'width': imageWidth + 'px',
109 | 'height': imageHeight + 'px',
110 | 'top': ( $( window ).height() - imageHeight ) / 2 + 'px',
111 | 'left': ( $( window ).width() - imageWidth ) / 2 + 'px'
112 | });
113 | };
114 | },
115 |
116 | loadImage = function( direction )
117 | {
118 | if( inProgress ) return false;
119 |
120 | direction = typeof direction === 'undefined' ? false : direction == 'left' ? 1 : -1;
121 |
122 | if( image.length )
123 | {
124 | if( direction !== false && ( targets.length < 2 || ( options.quitOnEnd === true && ( ( direction === -1 && targets.index( target ) == 0 ) || ( direction === 1 && targets.index( target ) == targets.length - 1 ) ) ) ) )
125 | {
126 | quitLightbox();
127 | return false;
128 | }
129 | var params = { 'opacity': 0 };
130 | if( isCssTransitionSupport ) cssTransitionTranslateX( image, ( 100 * direction ) - swipeDiff + 'px', options.animationSpeed / 1000 );
131 | else params.left = parseInt( image.css( 'left' ) ) + 100 * direction + 'px';
132 | image.animate( params, options.animationSpeed, function(){ removeImage(); });
133 | swipeDiff = 0;
134 | }
135 |
136 | inProgress = true;
137 | if( options.onLoadStart !== false ) options.onLoadStart();
138 |
139 | setTimeout( function()
140 | {
141 | image = $( '