Changesets can be listed by changeset number.
The Git repository is here.
- Revision:
- 390
- Log:
Initial import of Canvass, a donations-based poll application.
- Author:
- rool
- Date:
- Mon Mar 21 14:58:04 +0000 2011
- Size:
- 65706 Bytes
- Properties:
- Property svn:executable is set to *
1 | // lightwindow.js v2.0 |
2 | // |
3 | // Copyright (c) 2007 stickmanlabs |
4 | // Author: Kevin P Miller | http://www.stickmanlabs.com |
5 | // |
6 | // LightWindow is freely distributable under the terms of an MIT-style license. |
7 | // |
8 | // I don't care what you think about the file size... |
9 | // Be a pro: |
10 | // http://www.thinkvitamin.com/features/webapps/serving-javascript-fast |
11 | // http://rakaz.nl/item/make_your_pages_load_faster_by_combining_and_compressing_javascript_and_css_files |
12 | // |
13 | |
14 | // 2009-05-07 (ADH): A few minor Artisan customisations included herein. |
15 | // 2009-10-22 (ADH): Strip off query strings when determining page type - |
16 | // regular expressions used in the _fileType function get |
17 | // confused if a query string is present. |
18 | // 2009-12-11 (ADH): Support addition of a base URI for static assets. |
19 | // 2010-01-07 (ADH): Solve the "strange lag after clicking on an image" problem |
20 | // - the UI now responds immediately. |
21 | |
22 | /*-----------------------------------------------------------------------------------------------*/ |
23 | |
24 | if(typeof Effect == 'undefined') |
25 | throw("lightwindow.js requires including script.aculo.us' effects.js library!"); |
26 | |
27 | // This will stop image flickering in IE6 when elements with images are moved |
28 | try { |
29 | document.execCommand("BackgroundImageCache", false, true); |
30 | } catch(e) {} |
31 | |
32 | var lightwindow = Class.create(); |
33 | lightwindow.prototype = { |
34 | // |
35 | // Setup Variables |
36 | // |
37 | element : null, |
38 | contentToFetch : null, |
39 | windowActive : false, |
40 | dataEffects : [], |
41 | dimensions : { |
42 | cruft : null, |
43 | container : null, |
44 | viewport : { |
45 | height : null, |
46 | width : null, |
47 | offsetTop : null, |
48 | offsetLeft : null |
49 | } |
50 | }, |
51 | pagePosition : { |
52 | x : 0, |
53 | y : 0 |
54 | }, |
55 | pageDimensions : { |
56 | width : null, |
57 | height : null |
58 | }, |
59 | preloadImage : [], |
60 | preloadedImage : [], |
61 | noLoadingAnimation: true, /* 2009-05-07 (ADH): Modification for Artisan; always disable; "param" is not a valid XHTML attribute on <a> */ |
62 | galleries : [], |
63 | resizeTo : { |
64 | height : null, |
65 | heightPercent : null, |
66 | width : null, |
67 | widthPercent : null, |
68 | fixedTop : null, |
69 | fixedLeft : null |
70 | }, |
71 | scrollbarOffset : 18, |
72 | navigationObservers : { |
73 | previous : null, |
74 | next : null |
75 | }, |
76 | containerChange : { |
77 | height : 0, |
78 | width : 0 |
79 | }, |
80 | activeGallery : false, |
81 | galleryLocation : { |
82 | current : 0, |
83 | total : 0 |
84 | }, |
85 | // |
86 | // Initialize the lightwindow. |
87 | // |
88 | initialize : function(options) { |
89 | this.options = Object.extend({ |
90 | resizeSpeed : 9, |
91 | contentOffset : { |
92 | height : 20, |
93 | width : 20 |
94 | }, |
95 | dimensions : { |
96 | image : {height : 250, width : 250}, |
97 | page : {height : 250, width : 250}, |
98 | inline : {height : 250, width : 250}, |
99 | media : {height : 250, width : 250}, |
100 | external : {height : 250, width : 250}, |
101 | titleHeight : 25 |
102 | }, |
103 | classNames : { |
104 | standard : 'lightwindow', |
105 | action : 'lightwindow_action' |
106 | }, |
107 | fileTypes : { |
108 | page : ['asp', 'aspx', 'cgi', 'cfm', 'htm', 'html', 'pl', 'php4', 'php3', 'php', 'php5', 'phtml', 'rhtml', 'shtml', 'txt', 'vbs', 'rb'], |
109 | media : ['aif', 'aiff', 'asf', 'avi', 'divx', 'm1v', 'm2a', 'm2v', 'm3u', 'mid', 'midi', 'mov', 'moov', 'movie', 'mp2', 'mp3', 'mpa', 'mpa', 'mpe', 'mpeg', 'mpg', 'mpg', 'mpga', 'pps', 'qt', 'rm', 'ram', 'swf', 'viv', 'vivo', 'wav'], |
110 | image : ['bmp', 'gif', 'jpg', 'jpeg', 'png', 'tif', 'tiff'] // 2010-08-06 (ADH): Added ".jpeg" and ".tif" which, surprisingly, were missing. |
111 | }, |
112 | mimeTypes : { |
113 | avi : 'video/avi', |
114 | aif : 'audio/aiff', |
115 | aiff : 'audio/aiff', |
116 | gif : 'image/gif', |
117 | bmp : 'image/bmp', |
118 | jpeg : 'image/jpeg', |
119 | m1v : 'video/mpeg', |
120 | m2a : 'audio/mpeg', |
121 | m2v : 'video/mpeg', |
122 | m3u : 'audio/x-mpequrl', |
123 | mid : 'audio/x-midi', |
124 | midi : 'audio/x-midi', |
125 | mjpg : 'video/x-motion-jpeg', |
126 | moov : 'video/quicktime', |
127 | mov : 'video/quicktime', |
128 | movie : 'video/x-sgi-movie', |
129 | mp2 : 'audio/mpeg', |
130 | mp3 : 'audio/mpeg3', |
131 | mpa : 'audio/mpeg', |
132 | mpa : 'video/mpeg', |
133 | mpe : 'video/mpeg', |
134 | mpeg : 'video/mpeg', |
135 | mpg : 'audio/mpeg', |
136 | mpg : 'video/mpeg', |
137 | mpga : 'audio/mpeg', |
138 | pdf : 'application/pdf', |
139 | png : 'image/png', |
140 | pps : 'application/mspowerpoint', |
141 | qt : 'video/quicktime', |
142 | ram : 'audio/x-pn-realaudio-plugin', |
143 | rm : 'application/vnd.rn-realmedia', |
144 | swf : 'application/x-shockwave-flash', |
145 | tiff : 'image/tiff', |
146 | viv : 'video/vivo', |
147 | vivo : 'video/vivo', |
148 | wav : 'audio/wav', |
149 | wmv : 'application/x-mplayer2' |
150 | }, |
151 | classids : { |
152 | mov : 'clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B', |
153 | swf : 'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000', |
154 | wmv : 'clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6' |
155 | }, |
156 | codebases : { |
157 | mov : 'http://www.apple.com/qtactivex/qtplugin.cab#version=6,0,2,0', |
158 | swf : 'http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0', |
159 | wmv : 'http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,715' |
160 | }, |
161 | viewportPadding : 10, |
162 | EOLASFix : 'swf,wmv,fla,flv', |
163 | overlay : { |
164 | opacity : 0.8, |
165 | image : '/images/lightwindow/black.png', |
166 | presetImage : '/images/lightwindow/black-80.png' |
167 | }, |
168 | skin : { |
169 | main : '<div id="lightwindow_container" >'+ |
170 | '<div id="lightwindow_title_bar" >'+ |
171 | '<div id="lightwindow_title_bar_inner" >'+ |
172 | '<span id="lightwindow_title_bar_title"></span>'+ |
173 | '<a id="lightwindow_title_bar_close_link" >'+lightwindow_i18n.close+'</a>'+ // 2009-05-07 (ADH): Modification for quite_lightwindow Rails plugin |
174 | '</div>'+ |
175 | '</div>'+ |
176 | '<div id="lightwindow_stage" >'+ |
177 | '<div id="lightwindow_contents" >'+ |
178 | '</div>'+ |
179 | '<div id="lightwindow_navigation" >'+ |
180 | '<a href="#" id="lightwindow_previous" >'+ |
181 | '<span id="lightwindow_previous_title"></span>'+ |
182 | '</a>'+ |
183 | '<a href="#" id="lightwindow_next" >'+ |
184 | '<span id="lightwindow_next_title"></span>'+ |
185 | '</a>'+ |
186 | // 2009-05-07 (ADH): Add support for 'download' hover target |
187 | '<a href="#" id="lightwindow_download" >'+ |
188 | '</a>'+ |
189 | '<iframe name="lightwindow_navigation_shim" id="lightwindow_navigation_shim" src="javascript:false;" frameBorder="0" scrolling="no"></iframe>'+ |
190 | '</div>'+ |
191 | '<div id="lightwindow_galleries">'+ |
192 | '<div id="lightwindow_galleries_tab_container" >'+ |
193 | '<a href="#" id="lightwindow_galleries_tab" >'+ |
194 | '<span id="lightwindow_galleries_tab_span" class="up" >Galleries</span>'+ |
195 | '</a>'+ |
196 | '</div>'+ |
197 | '<div id="lightwindow_galleries_list" >'+ |
198 | '</div>'+ |
199 | '</div>'+ |
200 | '</div>'+ |
201 | '<div id="lightwindow_data_slide" >'+ |
202 | '<div id="lightwindow_data_slide_inner" >'+ |
203 | '<div id="lightwindow_data_details" >'+ |
204 | '<table cellspacing="0" cellpadding="0" border="0" width="100%"><tr><td rowspan="2">'+ |
205 | '<div id="lightwindow_data_caption" >'+ |
206 | '</div>'+ |
207 | '</td><td>'+ |
208 | '<div id="lightwindow_data_gallery_container" >'+ |
209 | '(<span id="lightwindow_data_gallery_current"></span>'+ |
210 | ' of '+ |
211 | '<span id="lightwindow_data_gallery_total"></span>)'+ |
212 | '</div>'+ |
213 | '</td></tr><tr><td>'+ |
214 | '<div id="lightwindow_data_author_container" >'+ |
215 | 'by <span id="lightwindow_data_author"></span>'+ |
216 | '</div>'+ |
217 | '</td></tr></table>'+ |
218 | '</div>'+ |
219 | '</div>'+ |
220 | '</div>'+ |
221 | '</div>', |
222 | loading : '<div id="lightwindow_loading" >'+ |
223 | '<img src="/images/lightwindow/ajax-loading.gif" alt="loading" />'+ |
224 | '<span>'+lightwindow_i18n.loading_or+' <a href="javascript: myLightWindow.deactivate();">'+lightwindow_i18n.cancel+'</a></span>'+ // 2009-05-07 (ADH): Modification for quite_lightwindow Rails plugin |
225 | '<iframe name="lightwindow_loading_shim" id="lightwindow_loading_shim" src="javascript:false;" frameBorder="0" scrolling="no"></iframe>'+ |
226 | '</div>', |
227 | iframe : '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'+ |
228 | '<html xmlns="http://www.w3.org/1999/xhtml">'+ |
229 | '<body>'+ |
230 | '{body_replace}'+ |
231 | '</body>'+ |
232 | '</html>', |
233 | gallery : { |
234 | top : '<div class="lightwindow_galleries_list">'+ |
235 | '<h1>{gallery_title_replace}</h1>'+ |
236 | '<ul>', |
237 | middle : '<li>'+ |
238 | '{gallery_link_replace}'+ |
239 | '</li>', |
240 | bottom : '</ul>'+ |
241 | '</div>' |
242 | } |
243 | }, |
244 | formMethod : 'get', |
245 | hideFlash : false, |
246 | hideGalleryTab : true, |
247 | showTitleBar : true, |
248 | animationHandler : false, |
249 | navigationHandler : false, |
250 | transitionHandler : false, |
251 | finalAnimationHandler : false, |
252 | formHandler : false, |
253 | galleryAnimationHandler : false, |
254 | showGalleryCount : true |
255 | }, options || {}); |
256 | this.duration = ((11-this.options.resizeSpeed)*0.15); |
257 | this._setupLinks(); |
258 | this._getScroll(); |
259 | this._getPageDimensions(); |
260 | this._browserDimensions(); |
261 | this._addLightWindowMarkup(false); |
262 | this._setupDimensions(); |
263 | this.buildGalleryList(); |
264 | }, |
265 | // |
266 | // Activate the lightwindow. |
267 | // |
268 | activate : function(e, link){ |
269 | // Clear out the window Contents |
270 | this._clearWindowContents(true); |
271 | |
272 | // Add back in out loading panel |
273 | this._addLoadingWindowMarkup(); |
274 | |
275 | // Setup the element properties |
276 | this._setupWindowElements(link); |
277 | |
278 | // Setup everything |
279 | this._getScroll(); |
280 | this._browserDimensions(); |
281 | this._setupDimensions(); |
282 | this._toggleTroubleElements('hidden', false); |
283 | this._displayLightWindow('block', 'hidden'); |
284 | this._setStatus(true); |
285 | this._monitorKeyboard(true); |
286 | this._prepareIE(true); |
287 | this._loadWindow(); |
288 | }, |
289 | // |
290 | // Turn off the window |
291 | // |
292 | deactivate : function(){ |
293 | // The window is not active |
294 | this.windowActive = false; |
295 | |
296 | // There is no longer a gallery active |
297 | this.activeGallery = false; |
298 | if (!this.options.hideGalleryTab) { |
299 | this._handleGalleryAnimation(false); |
300 | } |
301 | |
302 | // Kill the animation |
303 | this.animating = false; |
304 | |
305 | // Clear our element |
306 | this.element = null; |
307 | |
308 | // hide the window. |
309 | this._displayLightWindow('none', 'visible'); |
310 | |
311 | // Clear out the window Contents |
312 | this._clearWindowContents(false); |
313 | |
314 | // Stop all animation |
315 | var queue = Effect.Queues.get('lightwindowAnimation').each(function(e){e.cancel();}); |
316 | |
317 | // Undo the setup |
318 | this._prepareIE(false); |
319 | this._setupDimensions(); |
320 | this._toggleTroubleElements('visible', false); |
321 | this._monitorKeyboard(false); |
322 | }, |
323 | // |
324 | // Initialize specific window |
325 | // |
326 | createWindow : function(element, attributes) { |
327 | this._processLink($(element)); |
328 | }, |
329 | // |
330 | // Open a Window from a hash of attributes |
331 | // |
332 | activateWindow : function(options) { |
333 | this.element = Object.extend({ |
334 | href : null, |
335 | title : null, |
336 | author : null, |
337 | caption : null, |
338 | rel : null, |
339 | top : null, |
340 | left : null, |
341 | type : null, |
342 | showImages : null, |
343 | height : null, |
344 | width : null, |
345 | loadingAnimation : null, |
346 | iframeEmbed : null, |
347 | form : null |
348 | }, options || {}); |
349 | |
350 | // Set the window type |
351 | this.contentToFetch = this.element.href; |
352 | this.windowType = this.element.type ? this.element.type : this._fileType(this.element.href); |
353 | |
354 | // Clear out the window Contents |
355 | this._clearWindowContents(true); |
356 | |
357 | // Add back in out loading panel |
358 | this._addLoadingWindowMarkup(); |
359 | |
360 | // Setup everything |
361 | this._getScroll(); |
362 | this._browserDimensions(); |
363 | this._setupDimensions(); |
364 | this._toggleTroubleElements('hidden', false); |
365 | this._displayLightWindow('block', 'hidden'); |
366 | this._setStatus(true); |
367 | this._monitorKeyboard(true); |
368 | this._prepareIE(true); |
369 | this._loadWindow(); |
370 | }, |
371 | // |
372 | // Fire off our Form handler |
373 | // |
374 | submitForm : function(e) { |
375 | if (this.options.formHandler) { |
376 | this.options.formHandler(e); |
377 | } else { |
378 | this._defaultFormHandler(e); |
379 | } |
380 | }, |
381 | // |
382 | // Reload the window with another location |
383 | // |
384 | openWindow : function(element) { |
385 | var element = $(element); |
386 | |
387 | // The window is active |
388 | this.windowActive = true; |
389 | |
390 | // Clear out the window Contents |
391 | this._clearWindowContents(true); |
392 | |
393 | // Add back in out loading panel |
394 | this._addLoadingWindowMarkup(); |
395 | |
396 | // Setup the element properties |
397 | this._setupWindowElements(element); |
398 | |
399 | this._setStatus(true); |
400 | this._handleTransition(); |
401 | }, |
402 | // |
403 | // Navigate the window |
404 | // |
405 | navigateWindow : function(direction) { |
406 | this._handleNavigation(false); |
407 | if (direction == 'previous') { |
408 | this.openWindow(this.navigationObservers.previous); |
409 | } else if (direction == 'next') { |
410 | this.openWindow(this.navigationObservers.next); |
411 | } else if (direction == 'download') { // 2009-05-07 (ADH): Add support for 'download' hover target |
412 | var downloadUrl = this._getParameter('lightwindow_download_url'); |
413 | window.location.href = downloadUrl || this.contentToFetch; |
414 | } |
415 | }, |
416 | // |
417 | // Build the Gallery List and Load it |
418 | // |
419 | buildGalleryList : function() { |
420 | var output = ''; |
421 | var galleryLink; |
422 | for (i in this.galleries) { |
423 | if (typeof this.galleries[i] == 'object') { |
424 | output += (this.options.skin.gallery.top).replace('{gallery_title_replace}', unescape(i)); |
425 | for (j in this.galleries[i]) { |
426 | if (typeof this.galleries[i][j] == 'object') { |
427 | galleryLink = '<a href="#" id="lightwindow_gallery_'+i+'_'+j+'" >'+unescape(j)+'</a>'; |
428 | output += (this.options.skin.gallery.middle).replace('{gallery_link_replace}', galleryLink); |
429 | } |
430 | } |
431 | output += this.options.skin.gallery.bottom; |
432 | } |
433 | } |
434 | new Insertion.Top('lightwindow_galleries_list', output); |
435 | |
436 | // Attach Events |
437 | for (i in this.galleries) { |
438 | if (typeof this.galleries[i] == 'object') { |
439 | for (j in this.galleries[i]) { |
440 | if (typeof this.galleries[i][j] == 'object') { |
441 | Event.observe($('lightwindow_gallery_'+i+'_'+j), 'click', this.openWindow.bind(this, this.galleries[i][j][0]), false); |
442 | $('lightwindow_gallery_'+i+'_'+j).onclick = function() {return false;}; |
443 | } |
444 | } |
445 | } |
446 | } |
447 | }, |
448 | // |
449 | // Set Links Up |
450 | // |
451 | _setupLinks : function() { |
452 | var links = $$('.'+this.options.classNames.standard); |
453 | links.each(function(link) { |
454 | this._processLink(link); |
455 | }.bind(this)); |
456 | }, |
457 | // |
458 | // Process a Link |
459 | // |
460 | _processLink : function(link) { |
461 | if ((this._fileType(link.getAttribute('href')) == 'image' || this._fileType(link.getAttribute('href')) == 'media')) { |
462 | if (gallery = this._getGalleryInfo(link.rel)) { |
463 | if (!this.galleries[gallery[0]]) { |
464 | this.galleries[gallery[0]] = new Array(); |
465 | } |
466 | if (!this.galleries[gallery[0]][gallery[1]]) { |
467 | this.galleries[gallery[0]][gallery[1]] = new Array(); |
468 | } |
469 | this.galleries[gallery[0]][gallery[1]].push(link); |
470 | } |
471 | } |
472 | |
473 | // Take care of our inline content |
474 | var url = link.getAttribute('href'); |
475 | if (url.indexOf('?') > -1) { |
476 | url = url.substring(0, url.indexOf('?')); |
477 | } |
478 | |
479 | var container = url.substring(url.indexOf('#')+1); |
480 | if($(container)) { |
481 | $(container).setStyle({ |
482 | display : 'none' |
483 | }); |
484 | } |
485 | |
486 | Event.observe(link, 'click', this.activate.bindAsEventListener(this, link), false); |
487 | link.onclick = function() {return false;}; |
488 | }, |
489 | // |
490 | // Setup our actions |
491 | // |
492 | _setupActions : function() { |
493 | var links = $$('#lightwindow_container .'+this.options.classNames.action); |
494 | links.each(function(link) { |
495 | Event.observe(link, 'click', this[link.getAttribute('rel')].bindAsEventListener(this, link), false); |
496 | link.onclick = function() {return false;}; |
497 | }.bind(this)); |
498 | }, |
499 | // |
500 | // Add the markup to the page. |
501 | // |
502 | _addLightWindowMarkup : function(rebuild) { |
503 | var overlay = Element.extend(document.createElement('div')); |
504 | overlay.setAttribute('id', 'lightwindow_overlay'); |
505 | // FF Mac has a problem with putting Flash above a layer without a 100% opacity background, so we need to use a pre-made |
506 | if (Prototype.Browser.Gecko) { |
507 | overlay.setStyle({ |
508 | backgroundImage: 'url('+this.options.overlay.presetImage+')', |
509 | backgroundRepeat: 'repeat', |
510 | height: this.pageDimensions.height+'px' |
511 | }); |
512 | } else { |
513 | overlay.setStyle({ |
514 | opacity: this.options.overlay.opacity, |
515 | backgroundImage: 'url('+this.options.overlay.image+')', |
516 | backgroundRepeat: 'repeat', |
517 | height: this.pageDimensions.height+'px' |
518 | }); |
519 | } |
520 | |
521 | var lw = document.createElement('div'); |
522 | lw.setAttribute('id', 'lightwindow'); |
523 | lw.innerHTML = this.options.skin.main; |
524 | |
525 | var body = document.getElementsByTagName('body')[0]; |
526 | body.appendChild(overlay); |
527 | body.appendChild(lw); |
528 | |
529 | if ($('lightwindow_title_bar_close_link')) { |
530 | Event.observe('lightwindow_title_bar_close_link', 'click', this.deactivate.bindAsEventListener(this)); |
531 | $('lightwindow_title_bar_close_link').onclick = function() {return false;}; |
532 | } |
533 | |
534 | Event.observe($('lightwindow_previous'), 'click', this.navigateWindow.bind(this, 'previous'), false); |
535 | $('lightwindow_previous').onclick = function() {return false;}; |
536 | Event.observe($('lightwindow_next'), 'click', this.navigateWindow.bind(this, 'next'), false); |
537 | $('lightwindow_next').onclick = function() {return false;}; |
538 | // 2009-05-07 (ADH): Add support for 'download' hover target |
539 | Event.observe($('lightwindow_download'), 'click', this.navigateWindow.bind(this, 'download'), false); |
540 | $('lightwindow_download').onclick = function() {return false;}; |
541 | |
542 | if (!this.options.hideGalleryTab) { |
543 | Event.observe($('lightwindow_galleries_tab'), 'click', this._handleGalleryAnimation.bind(this, true), false); |
544 | $('lightwindow_galleries_tab').onclick = function() {return false;}; |
545 | } |
546 | |
547 | // Because we use position absolute, kill the scroll Wheel on animations |
548 | if (Prototype.Browser.IE) { |
549 | Event.observe(document, 'mousewheel', this._stopScrolling.bindAsEventListener(this), false); |
550 | } else { |
551 | Event.observe(window, 'DOMMouseScroll', this._stopScrolling.bindAsEventListener(this), false); |
552 | } |
553 | |
554 | Event.observe(overlay, 'click', this.deactivate.bindAsEventListener(this), false); |
555 | overlay.onclick = function() {return false;}; |
556 | }, |
557 | // |
558 | // Add loading window markup |
559 | // |
560 | _addLoadingWindowMarkup : function() { |
561 | $('lightwindow_contents').innerHTML += this.options.skin.loading; |
562 | }, |
563 | // |
564 | // Setup the window elements |
565 | // |
566 | _setupWindowElements : function(link) { |
567 | this.element = link; |
568 | this.element.title = null ? '' : link.getAttribute('title'); |
569 | this.element.author = null ? '' : link.getAttribute('author'); |
570 | this.element.caption = null ? '' : link.getAttribute('caption'); |
571 | this.element.rel = null ? '' : link.getAttribute('rel'); |
572 | this.element.params = null ? '' : link.getAttribute('params'); |
573 | |
574 | // Set the window type |
575 | this.contentToFetch = this.element.href; |
576 | this.windowType = this._getParameter('lightwindow_type') ? this._getParameter('lightwindow_type') : this._fileType(this.contentToFetch); |
577 | }, |
578 | // |
579 | // Clear the window contents out |
580 | // |
581 | _clearWindowContents : function(contents) { |
582 | // If there is an iframe, its got to go |
583 | if ($('lightwindow_iframe')) { |
584 | Element.remove($('lightwindow_iframe')); |
585 | } |
586 | |
587 | // Stop playing an object if its still around |
588 | if ($('lightwindow_media_primary')) { |
589 | try { |
590 | $('lightwindow_media_primary').Stop(); |
591 | } catch(e) {} |
592 | Element.remove($('lightwindow_media_primary')); |
593 | } |
594 | |
595 | // Stop playing an object if its still around |
596 | if ($('lightwindow_media_secondary')) { |
597 | try { |
598 | $('lightwindow_media_secondary').Stop(); |
599 | } catch(e) {} |
600 | Element.remove($('lightwindow_media_secondary')); |
601 | } |
602 | |
603 | this.activeGallery = false; |
604 | this._handleNavigation(this.activeGallery); |
605 | |
606 | if (contents) { |
607 | // Empty the contents |
608 | $('lightwindow_contents').innerHTML = ''; |
609 | |
610 | // Reset the scroll bars |
611 | $('lightwindow_contents').setStyle({ |
612 | overflow: 'hidden' |
613 | }); |
614 | |
615 | if (!this.windowActive) { |
616 | $('lightwindow_data_slide_inner').setStyle({ |
617 | display: 'none' |
618 | }); |
619 | |
620 | $('lightwindow_title_bar_title').innerHTML = ''; |
621 | } |
622 | |
623 | // Because of browser differences and to maintain flexible captions we need to reset this height at close |
624 | $('lightwindow_data_slide').setStyle({ |
625 | height: 'auto' |
626 | }); |
627 | } |
628 | |
629 | this.resizeTo.height = null; |
630 | this.resizeTo.width = null; |
631 | }, |
632 | // |
633 | // Set the status of our animation to keep things from getting clunky |
634 | // |
635 | _setStatus : function(status) { |
636 | this.animating = status; |
637 | if (status) { |
638 | Element.show('lightwindow_loading'); |
639 | } |
640 | if (!(/MSIE 6./i.test(navigator.userAgent))) { |
641 | this._fixedWindow(status); |
642 | } |
643 | }, |
644 | // |
645 | // Make this window Fixed |
646 | // |
647 | _fixedWindow : function(status) { |
648 | if (status) { |
649 | if (this.windowActive) { |
650 | this._getScroll(); |
651 | $('lightwindow').setStyle({ |
652 | position: 'absolute', |
653 | top: parseFloat($('lightwindow').getStyle('top'))+this.pagePosition.y+'px', |
654 | left: parseFloat($('lightwindow').getStyle('left'))+this.pagePosition.x+'px' |
655 | }); |
656 | } else { |
657 | $('lightwindow').setStyle({ |
658 | position: 'absolute' |
659 | }); |
660 | } |
661 | } else { |
662 | if (this.windowActive) { |
663 | this._getScroll(); |
664 | $('lightwindow').setStyle({ |
665 | position: 'fixed', |
666 | top: parseFloat($('lightwindow').getStyle('top'))-this.pagePosition.y+'px', |
667 | left: parseFloat($('lightwindow').getStyle('left'))-this.pagePosition.x+'px' |
668 | }); |
669 | } else { |
670 | if ($('lightwindow_iframe')) { |
671 | // Ideally here we would set a 50% value for top and left, but Safari rears it ugly head again and we need to do it by pixels |
672 | this._browserDimensions(); |
673 | } |
674 | $('lightwindow').setStyle({ |
675 | position: 'fixed', |
676 | top: (parseFloat(this._getParameter('lightwindow_top')) ? parseFloat(this._getParameter('lightwindow_top'))+'px' : this.dimensions.viewport.height/2+'px'), |
677 | left: (parseFloat(this._getParameter('lightwindow_left')) ? parseFloat(this._getParameter('lightwindow_left'))+'px' : this.dimensions.viewport.width/2+'px') |
678 | }); |
679 | } |
680 | } |
681 | }, |
682 | // |
683 | // Prepare the window for IE. |
684 | // |
685 | _prepareIE : function(setup) { |
686 | if (Prototype.Browser.IE) { |
687 | var height, overflowX, overflowY; |
688 | if (setup) { |
689 | var height = '100%'; |
690 | } else { |
691 | var height = 'auto'; |
692 | } |
693 | var body = document.getElementsByTagName('body')[0]; |
694 | var html = document.getElementsByTagName('html')[0]; |
695 | html.style.height = body.style.height = height; |
696 | } |
697 | }, |
698 | _stopScrolling : function(e) { |
699 | if (this.animating) { |
700 | if (e.preventDefault) { |
701 | e.preventDefault(); |
702 | } |
703 | e.returnValue = false; |
704 | } |
705 | }, |
706 | // |
707 | // Get the scroll for the page. |
708 | // |
709 | _getScroll : function(){ |
710 | if(typeof(window.pageYOffset) == 'number') { |
711 | this.pagePosition.x = window.pageXOffset; |
712 | this.pagePosition.y = window.pageYOffset; |
713 | } else if(document.body && (document.body.scrollLeft || document.body.scrollTop)) { |
714 | this.pagePosition.x = document.body.scrollLeft; |
715 | this.pagePosition.y = document.body.scrollTop; |
716 | } else if(document.documentElement) { |
717 | this.pagePosition.x = document.documentElement.scrollLeft; |
718 | this.pagePosition.y = document.documentElement.scrollTop; |
719 | } |
720 | }, |
721 | // |
722 | // Reset the scroll. |
723 | // |
724 | _setScroll : function(x, y) { |
725 | document.documentElement.scrollLeft = x; |
726 | document.documentElement.scrollTop = y; |
727 | }, |
728 | // |
729 | // Hide Selects from the page because of IE. |
730 | // We could use iframe shims instead here but why add all the extra markup for one browser when this is much easier and cleaner |
731 | // |
732 | _toggleTroubleElements : function(visibility, content){ |
733 | |
734 | if (content) { |
735 | var selects = $('lightwindow_contents').getElementsByTagName('select'); |
736 | } else { |
737 | var selects = document.getElementsByTagName('select'); |
738 | } |
739 | |
740 | for(var i = 0; i < selects.length; i++) { |
741 | selects[i].style.visibility = visibility; |
742 | } |
743 | |
744 | if (!content) { |
745 | if (this.options.hideFlash){ |
746 | var objects = document.getElementsByTagName('object'); |
747 | for (i = 0; i != objects.length; i++) { |
748 | objects[i].style.visibility = visibility; |
749 | } |
750 | var embeds = document.getElementsByTagName('embed'); |
751 | for (i = 0; i != embeds.length; i++) { |
752 | embeds[i].style.visibility = visibility; |
753 | } |
754 | } |
755 | var iframes = document.getElementsByTagName('iframe'); |
756 | for (i = 0; i != iframes.length; i++) { |
757 | iframes[i].style.visibility = visibility; |
758 | } |
759 | } |
760 | }, |
761 | // |
762 | // Get the actual page size |
763 | // |
764 | _getPageDimensions : function() { |
765 | var xScroll, yScroll; |
766 | if (window.innerHeight && window.scrollMaxY) { |
767 | xScroll = document.body.scrollWidth; |
768 | yScroll = window.innerHeight + window.scrollMaxY; |
769 | } else if (document.body.scrollHeight > document.body.offsetHeight){ |
770 | xScroll = document.body.scrollWidth; |
771 | yScroll = document.body.scrollHeight; |
772 | } else { |
773 | xScroll = document.body.offsetWidth; |
774 | yScroll = document.body.offsetHeight; |
775 | } |
776 | |
777 | var windowWidth, windowHeight; |
778 | if (self.innerHeight) { |
779 | windowWidth = self.innerWidth; |
780 | windowHeight = self.innerHeight; |
781 | } else if (document.documentElement && document.documentElement.clientHeight) { |
782 | windowWidth = document.documentElement.clientWidth; |
783 | windowHeight = document.documentElement.clientHeight; |
784 | } else if (document.body) { |
785 | windowWidth = document.body.clientWidth; |
786 | windowHeight = document.body.clientHeight; |
787 | } |
788 | |
789 | if(yScroll < windowHeight){ |
790 | this.pageDimensions.height = windowHeight; |
791 | } else { |
792 | this.pageDimensions.height = yScroll; |
793 | } |
794 | |
795 | if(xScroll < windowWidth){ |
796 | this.pageDimensions.width = windowWidth; |
797 | } else { |
798 | this.pageDimensions.width = xScroll; |
799 | } |
800 | }, |
801 | // |
802 | // Display the lightWindow. |
803 | // |
804 | _displayLightWindow : function(display, visibility) { |
805 | $('lightwindow_overlay').style.display = $('lightwindow').style.display = $('lightwindow_container').style.display = display; |
806 | $('lightwindow_overlay').style.visibility = $('lightwindow').style.visibility = $('lightwindow_container').style.visibility = visibility; |
807 | }, |
808 | // |
809 | // Setup Dimensions of lightwindow. |
810 | |
811 | // |
812 | _setupDimensions : function() { |
813 | |
814 | var originalHeight, originalWidth; |
815 | switch (this.windowType) { |
816 | case 'page' : |
817 | originalHeight = this.options.dimensions.page.height; |
818 | originalWidth = this.options.dimensions.page.width; |
819 | break; |
820 | |
821 | case 'image' : |
822 | originalHeight = this.options.dimensions.image.height; |
823 | originalWidth = this.options.dimensions.image.width; |
824 | break; |
825 | |
826 | case 'media' : |
827 | originalHeight = this.options.dimensions.media.height; |
828 | originalWidth = this.options.dimensions.media.width; |
829 | break; |
830 | |
831 | case 'external' : |
832 | originalHeight = this.options.dimensions.external.height; |
833 | originalWidth = this.options.dimensions.external.width; |
834 | break; |
835 | |
836 | case 'inline' : |
837 | originalHeight = this.options.dimensions.inline.height; |
838 | originalWidth = this.options.dimensions.inline.width; |
839 | break; |
840 | |
841 | default : |
842 | originalHeight = this.options.dimensions.page.height; |
843 | originalWidth = this.options.dimensions.page.width; |
844 | break; |
845 | |
846 | } |
847 | |
848 | var offsetHeight = this._getParameter('lightwindow_top') ? parseFloat(this._getParameter('lightwindow_top'))+this.pagePosition.y : this.dimensions.viewport.height/2+this.pagePosition.y; |
849 | var offsetWidth = this._getParameter('lightwindow_left') ? parseFloat(this._getParameter('lightwindow_left'))+this.pagePosition.x : this.dimensions.viewport.width/2+this.pagePosition.x; |
850 | |
851 | // So if a theme has say shadowed edges, they should be consistant and take care of in the contentOffset |
852 | $('lightwindow').setStyle({ |
853 | top: offsetHeight+'px', |
854 | left: offsetWidth+'px' |
855 | }); |
856 | |
857 | $('lightwindow_container').setStyle({ |
858 | height: originalHeight+'px', |
859 | width: originalWidth+'px', |
860 | left: -(originalWidth/2)+'px', |
861 | top: -(originalHeight/2)+'px' |
862 | }); |
863 | |
864 | $('lightwindow_contents').setStyle({ |
865 | height: originalHeight+'px', |
866 | width: originalWidth+'px' |
867 | }); |
868 | }, |
869 | // |
870 | // Get the type of file. |
871 | // |
872 | _fileType : function(url) { |
873 | // 2009-10-22 (ADH): Strip off query strings, else function gets confused. |
874 | if (url.indexOf('?') > -1) { |
875 | url = url.substring(0, url.indexOf('?')); |
876 | } |
877 | var image = new RegExp("[^\.]\.("+this.options.fileTypes.image.join('|')+")\s*$", "i"); |
878 | if (image.test(url)) return 'image'; |
879 | if (url.indexOf('#') > -1 && (document.domain == this._getDomain(url))) return 'inline'; |
880 | if (url.indexOf('?') > -1) url = url.substring(0, url.indexOf('?')); |
881 | var type = 'unknown'; |
882 | var page = new RegExp("[^\.]\.("+this.options.fileTypes.page.join('|')+")\s*$", "i"); |
883 | var media = new RegExp("[^\.]\.("+this.options.fileTypes.media.join('|')+")\s*$", "i"); |
884 | if (document.domain != this._getDomain(url)) type = 'external'; |
885 | if (media.test(url)) type = 'media'; |
886 | if (type == 'external' || type == 'media') return type; |
887 | if (page.test(url) || url.substr((url.length-1), url.length) == '/') type = 'page'; |
888 | return type; |
889 | }, |
890 | // |
891 | // Get file Extension |
892 | // |
893 | _fileExtension : function(url) { |
894 | if (url.indexOf('?') > -1) { |
895 | url = url.substring(0, url.indexOf('?')); |
896 | } |
897 | var extension = ''; |
898 | for (var x = (url.length-1); x > -1; x--) { |
899 | if (url.charAt(x) == '.') { |
900 | return extension; |
901 | } |
902 | extension = url.charAt(x)+extension; |
903 | } |
904 | }, |
905 | // |
906 | // Monitor the keyboard while this lightwindow is up |
907 | // |
908 | _monitorKeyboard : function(status) { |
909 | if (status) document.onkeydown = this._eventKeypress.bind(this); |
910 | else document.onkeydown = ''; |
911 | }, |
912 | // |
913 | // Perform keyboard actions |
914 | // |
915 | _eventKeypress : function(e) { |
916 | if (e == null) { |
917 | var keycode = event.keyCode; |
918 | } else { |
919 | var keycode = e.which; |
920 | } |
921 | |
922 | switch (keycode) { |
923 | case 27: |
924 | this.deactivate(); |
925 | break; |
926 | |
927 | case 13: |
928 | return; |
929 | |
930 | default: |
931 | break; |
932 | } |
933 | |
934 | // Gotta stop those quick fingers |
935 | if (this.animating) { |
936 | return false; |
937 | } |
938 | |
939 | switch (String.fromCharCode(keycode).toLowerCase()) { |
940 | case 'p': |
941 | if (this.navigationObservers.previous) { |
942 | this.navigateWindow('previous'); |
943 | } |
944 | break; |
945 | |
946 | case 'n': |
947 | if (this.navigationObservers.next) { |
948 | this.navigateWindow('next'); |
949 | } |
950 | break; |
951 | |
952 | default: |
953 | break; |
954 | } |
955 | }, |
956 | // |
957 | // Get Gallery Information |
958 | // |
959 | _getGalleryInfo : function(rel) { |
960 | if (!rel) return false; |
961 | if (rel.indexOf('[') > -1) { |
962 | return new Array(escape(rel.substring(0, rel.indexOf('['))), escape(rel.substring(rel.indexOf('[')+1, rel.indexOf(']')))); |
963 | } else { |
964 | return false; |
965 | } |
966 | }, |
967 | // |
968 | // Get the domain from a string. |
969 | // |
970 | _getDomain : function(url) { |
971 | var leadSlashes = url.indexOf('//'); |
972 | var domainStart = leadSlashes+2; |
973 | var withoutResource = url.substring(domainStart, url.length); |
974 | var nextSlash = withoutResource.indexOf('/'); |
975 | var domain = withoutResource.substring(0, nextSlash); |
976 | if (domain.indexOf(':') > -1){ |
977 | var portColon = domain.indexOf(':'); |
978 | domain = domain.substring(0, portColon); |
979 | } |
980 | return domain; |
981 | }, |
982 | // |
983 | // Get the value from the params attribute string. |
984 | // |
985 | _getParameter : function(parameter, parameters) { |
986 | if (!this.element) return false; |
987 | if (parameter == 'lightwindow_top' && this.element.top) { |
988 | return unescape(this.element.top); |
989 | } else if (parameter == 'lightwindow_left' && this.element.left) { |
990 | return unescape(this.element.left); |
991 | } else if (parameter == 'lightwindow_type' && this.element.type) { |
992 | return unescape(this.element.type); |
993 | } else if (parameter == 'lightwindow_show_images' && this.element.showImages) { |
994 | return unescape(this.element.showImages); |
995 | } else if (parameter == 'lightwindow_height' && this.element.height) { |
996 | return unescape(this.element.height); |
997 | } else if (parameter == 'lightwindow_width' && this.element.width) { |
998 | return unescape(this.element.width); |
999 | } else if (parameter == 'lightwindow_loading_animation' && this.element.loadingAnimation) { |
1000 | return unescape(this.element.loadingAnimation); |
1001 | } else if (parameter == 'lightwindow_iframe_embed' && this.element.iframeEmbed) { |
1002 | return unescape(this.element.iframeEmbed); |
1003 | } else if (parameter == 'lightwindow_form' && this.element.form) { |
1004 | return unescape(this.element.form); |
1005 | } else { |
1006 | if (!parameters) { |
1007 | if (this.element.params) parameters = this.element.params; |
1008 | else return; |
1009 | } |
1010 | var value; |
1011 | var parameterArray = parameters.split(','); |
1012 | var compareString = parameter+'='; |
1013 | var compareLength = compareString.length; |
1014 | for (var i = 0; i < parameterArray.length; i++) { |
1015 | if (parameterArray[i].substr(0, compareLength) == compareString) { |
1016 | var currentParameter = parameterArray[i].split('='); |
1017 | value = currentParameter[1]; |
1018 | break; |
1019 | } |
1020 | } |
1021 | if (!value) return false; |
1022 | else return unescape(value); |
1023 | } |
1024 | }, |
1025 | // |
1026 | // Get the Browser Viewport Dimensions |
1027 | // |
1028 | _browserDimensions : function() { |
1029 | if (Prototype.Browser.IE) { |
1030 | this.dimensions.viewport.height = document.documentElement.clientHeight; |
1031 | this.dimensions.viewport.width = document.documentElement.clientWidth; |
1032 | } else { |
1033 | this.dimensions.viewport.height = window.innerHeight; |
1034 | this.dimensions.viewport.width = document.width || document.body.offsetWidth; |
1035 | } |
1036 | }, |
1037 | // |
1038 | // Get the scrollbar offset, I don't like this method but there is really no other way I can find. |
1039 | // |
1040 | _getScrollerWidth : function() { |
1041 | var scrollDiv = Element.extend(document.createElement('div')); |
1042 | scrollDiv.setAttribute('id', 'lightwindow_scroll_div'); |
1043 | scrollDiv.setStyle({ |
1044 | position: 'absolute', |
1045 | top: '-10000px', |
1046 | left: '-10000px', |
1047 | width: '100px', |
1048 | height: '100px', |
1049 | overflow: 'hidden' |
1050 | }); |
1051 | |
1052 | |
1053 | |
1054 | var contentDiv = Element.extend(document.createElement('div')); |
1055 | contentDiv.setAttribute('id', 'lightwindow_content_scroll_div'); |
1056 | contentDiv.setStyle({ |
1057 | width: '100%', |
1058 | height: '200px' |
1059 | }); |
1060 | |
1061 | scrollDiv.appendChild(contentDiv); |
1062 | |
1063 | var body = document.getElementsByTagName('body')[0]; |
1064 | body.appendChild(scrollDiv); |
1065 | |
1066 | var noScroll = $('lightwindow_content_scroll_div').offsetWidth; |
1067 | scrollDiv.style.overflow = 'auto'; |
1068 | var withScroll = $('lightwindow_content_scroll_div').offsetWidth; |
1069 | |
1070 | Element.remove($('lightwindow_scroll_div')); |
1071 | |
1072 | this.scrollbarOffset = noScroll-withScroll; |
1073 | }, |
1074 | |
1075 | |
1076 | // |
1077 | // Add a param to an object dynamically created |
1078 | // |
1079 | _addParamToObject : function(name, value, object, id) { |
1080 | var param = document.createElement('param'); |
1081 | param.setAttribute('value', value); |
1082 | param.setAttribute('name', name); |
1083 | if (id) { |
1084 | param.setAttribute('id', id); |
1085 | } |
1086 | object.appendChild(param); |
1087 | return object; |
1088 | }, |
1089 | // |
1090 | // Get the outer HTML of an object CROSS BROWSER |
1091 | // |
1092 | _outerHTML : function(object) { |
1093 | if (Prototype.Browser.IE) { |
1094 | return object.outerHTML; |
1095 | } else { |
1096 | var clone = object.cloneNode(true); |
1097 | var cloneDiv = document.createElement('div'); |
1098 | cloneDiv.appendChild(clone); |
1099 | return cloneDiv.innerHTML; |
1100 | } |
1101 | }, |
1102 | // |
1103 | // Convert an object to markup |
1104 | // |
1105 | _convertToMarkup : function(object, closeTag) { |
1106 | var markup = this._outerHTML(object).replace('</'+closeTag+'>', ''); |
1107 | if (Prototype.Browser.IE) { |
1108 | for (var i = 0; i < object.childNodes.length; i++){ |
1109 | markup += this._outerHTML(object.childNodes[i]); |
1110 | } |
1111 | markup += '</'+closeTag+'>'; |
1112 | } |
1113 | return markup; |
1114 | }, |
1115 | // |
1116 | // Depending what type of browser it is we have to append the object differently... DAMN YOU IE!! |
1117 | // |
1118 | _appendObject : function(object, closeTag, appendTo) { |
1119 | if (Prototype.Browser.IE) { |
1120 | appendTo.innerHTML += this._convertToMarkup(object, closeTag); |
1121 | |
1122 | // Fix the Eolas activate thing but only for specified media, for example doing this to a quicktime film breaks it. |
1123 | if (this.options.EOLASFix.indexOf(this._fileType(this.element.href)) > -1) { |
1124 | var objectElements = document.getElementsByTagName('object'); |
1125 | for (var i = 0; i < objectElements.length; i++) { |
1126 | if (objectElements[i].getAttribute("data")) objectElements[i].removeAttribute('data'); |
1127 | objectElements[i].outerHTML = objectElements[i].outerHTML; |
1128 | objectElements[i].style.visibility = "visible"; |
1129 | } |
1130 | } |
1131 | } else { |
1132 | appendTo.appendChild(object); |
1133 | } |
1134 | }, |
1135 | // |
1136 | // Add in iframe |
1137 | // |
1138 | _appendIframe : function(scroll) { |
1139 | var iframe = document.createElement('iframe'); |
1140 | iframe.setAttribute('id', 'lightwindow_iframe'); |
1141 | iframe.setAttribute('name', 'lightwindow_iframe'); |
1142 | iframe.setAttribute('src', 'about:blank'); |
1143 | iframe.setAttribute('height', '100%'); |
1144 | iframe.setAttribute('width', '100%'); |
1145 | iframe.setAttribute('frameborder', '0'); |
1146 | iframe.setAttribute('marginwidth', '0'); |
1147 | iframe.setAttribute('marginheight', '0'); |
1148 | iframe.setAttribute('scrolling', scroll); |
1149 | |
1150 | this._appendObject(iframe, 'iframe', $('lightwindow_contents')); |
1151 | }, |
1152 | // |
1153 | // Write Content to the iframe using the skin |
1154 | // |
1155 | _writeToIframe : function(content) { |
1156 | var template = this.options.skin.iframe; |
1157 | template = template.replace('{body_replace}', content); |
1158 | if ($('lightwindow_iframe').contentWindow){ |
1159 | $('lightwindow_iframe').contentWindow.document.open(); |
1160 | $('lightwindow_iframe').contentWindow.document.write(template); |
1161 | $('lightwindow_iframe').contentWindow.document.close(); |
1162 | } else { |
1163 | $('lightwindow_iframe').contentDocument.open(); |
1164 | $('lightwindow_iframe').contentDocument.write(template); |
1165 | $('lightwindow_iframe').contentDocument.close(); |
1166 | } |
1167 | }, |
1168 | // |
1169 | // Load the window Information |
1170 | // |
1171 | _loadWindow : function() { |
1172 | switch (this.windowType) { |
1173 | case 'image' : |
1174 | |
1175 | var current = 0; |
1176 | var images = []; |
1177 | this.checkImage = []; |
1178 | this.resizeTo.height = this.resizeTo.width = 0; |
1179 | this.imageCount = this._getParameter('lightwindow_show_images') ? parseInt(this._getParameter('lightwindow_show_images')) : 1; |
1180 | |
1181 | // If there is a gallery get it |
1182 | if (gallery = this._getGalleryInfo(this.element.rel)) { |
1183 | for (current = 0; current < this.galleries[gallery[0]][gallery[1]].length; current++) { |
1184 | if (this.contentToFetch.indexOf(this.galleries[gallery[0]][gallery[1]][current].href) > -1) { |
1185 | break; |
1186 | } |
1187 | } |
1188 | if (this.galleries[gallery[0]][gallery[1]][current-this.imageCount]) { |
1189 | this.navigationObservers.previous = this.galleries[gallery[0]][gallery[1]][current-this.imageCount]; |
1190 | } else { |
1191 | this.navigationObservers.previous = false; |
1192 | } |
1193 | if (this.galleries[gallery[0]][gallery[1]][current+this.imageCount]) { |
1194 | this.navigationObservers.next = this.galleries[gallery[0]][gallery[1]][current+this.imageCount]; |
1195 | } else { |
1196 | this.navigationObservers.next = false; |
1197 | } |
1198 | |
1199 | this.activeGallery = true; |
1200 | } else { |
1201 | this.navigationObservers.previous = false; |
1202 | this.navigationObservers.next = false; |
1203 | |
1204 | this.activeGallery = false; |
1205 | } |
1206 | |
1207 | for (var i = current; i < (current+this.imageCount); i++) { |
1208 | |
1209 | if (gallery && this.galleries[gallery[0]][gallery[1]][i]) { |
1210 | this.contentToFetch = this.galleries[gallery[0]][gallery[1]][i].href; |
1211 | |
1212 | this.galleryLocation = {current: (i+1)/this.imageCount, total: (this.galleries[gallery[0]][gallery[1]].length)/this.imageCount}; |
1213 | |
1214 | if (!this.galleries[gallery[0]][gallery[1]][i+this.imageCount]) { |
1215 | $('lightwindow_next').setStyle({ |
1216 | display: 'none' |
1217 | }); |
1218 | } else { |
1219 | $('lightwindow_next').setStyle({ |
1220 | display: 'block' |
1221 | }); |
1222 | $('lightwindow_next_title').innerHTML = this.galleries[gallery[0]][gallery[1]][i+this.imageCount].title; |
1223 | } |
1224 | |
1225 | if (!this.galleries[gallery[0]][gallery[1]][i-this.imageCount]) { |
1226 | $('lightwindow_previous').setStyle({ |
1227 | display: 'none' |
1228 | }); |
1229 | } else { |
1230 | $('lightwindow_previous').setStyle({ |
1231 | display: 'block' |
1232 | }); |
1233 | $('lightwindow_previous_title').innerHTML = this.galleries[gallery[0]][gallery[1]][i-this.imageCount].title; |
1234 | } |
1235 | } |
1236 | |
1237 | images[i] = document.createElement('img'); |
1238 | images[i].setAttribute('id', 'lightwindow_image_'+i); |
1239 | images[i].setAttribute('border', '0'); |
1240 | images[i].setAttribute('src', this.contentToFetch); |
1241 | $('lightwindow_contents').appendChild(images[i]); |
1242 | |
1243 | // 2010-01-07 (ADH): Immediately show the "dim the page" overlay so |
1244 | // that the user gets instant feedback. |
1245 | $('lightwindow_overlay').style.display = 'block'; |
1246 | $('lightwindow_overlay').style.visibility = 'visible'; |
1247 | |
1248 | // We have to do this instead of .onload |
1249 | this.checkImage[i] = new PeriodicalExecuter(function(i) { |
1250 | if (!(typeof $('lightwindow_image_'+i).naturalWidth != "undefined" && $('lightwindow_image_'+i).naturalWidth == 0)) { |
1251 | |
1252 | this.checkImage[i].stop(); |
1253 | |
1254 | var imageHeight = $('lightwindow_image_'+i).getHeight(); |
1255 | if (imageHeight > this.resizeTo.height) { |
1256 | this.resizeTo.height = imageHeight; |
1257 | } |
1258 | this.resizeTo.width += $('lightwindow_image_'+i).getWidth(); |
1259 | this.imageCount--; |
1260 | |
1261 | $('lightwindow_image_'+i).setStyle({ |
1262 | height: '100%' |
1263 | }); |
1264 | |
1265 | if (this.imageCount == 0) { |
1266 | this._processWindow(); |
1267 | } |
1268 | } |
1269 | |
1270 | }.bind(this, i), 0.2); // 2010-01-07 (ADH): Decrease from 1s to 0.2s to make the animation start up more quickly (but not too quickly, else MSIE screws up) |
1271 | } |
1272 | |
1273 | |
1274 | break; |
1275 | |
1276 | case 'media' : |
1277 | |
1278 | var current = 0; |
1279 | this.resizeTo.height = this.resizeTo.width = 0; |
1280 | |
1281 | // If there is a gallery get it |
1282 | if (gallery = this._getGalleryInfo(this.element.rel)) { |
1283 | for (current = 0; current < this.galleries[gallery[0]][gallery[1]].length; current++) { |
1284 | if (this.contentToFetch.indexOf(this.galleries[gallery[0]][gallery[1]][current].href) > -1) { |
1285 | break; |
1286 | } |
1287 | } |
1288 | |
1289 | if (this.galleries[gallery[0]][gallery[1]][current-1]) { |
1290 | this.navigationObservers.previous = this.galleries[gallery[0]][gallery[1]][current-1]; |
1291 | } else { |
1292 | this.navigationObservers.previous = false; |
1293 | } |
1294 | if (this.galleries[gallery[0]][gallery[1]][current+1]) { |
1295 | this.navigationObservers.next = this.galleries[gallery[0]][gallery[1]][current+1]; |
1296 | } else { |
1297 | this.navigationObservers.next = false; |
1298 | } |
1299 | |
1300 | this.activeGallery = true; |
1301 | } else { |
1302 | this.navigationObservers.previous = false; |
1303 | this.navigationObservers.next = false; |
1304 | |
1305 | this.activeGallery = false; |
1306 | } |
1307 | |
1308 | |
1309 | if (gallery && this.galleries[gallery[0]][gallery[1]][current]) { |
1310 | this.contentToFetch = this.galleries[gallery[0]][gallery[1]][current].href; |
1311 | |
1312 | this.galleryLocation = {current: current+1, total: this.galleries[gallery[0]][gallery[1]].length}; |
1313 | |
1314 | if (!this.galleries[gallery[0]][gallery[1]][current+1]) { |
1315 | $('lightwindow_next').setStyle({ |
1316 | display: 'none' |
1317 | }); |
1318 | } else { |
1319 | $('lightwindow_next').setStyle({ |
1320 | display: 'block' |
1321 | }); |
1322 | $('lightwindow_next_title').innerHTML = this.galleries[gallery[0]][gallery[1]][current+1].title; |
1323 | } |
1324 | |
1325 | if (!this.galleries[gallery[0]][gallery[1]][current-1]) { |
1326 | $('lightwindow_previous').setStyle({ |
1327 | display: 'none' |
1328 | }); |
1329 | } else { |
1330 | $('lightwindow_previous').setStyle({ |
1331 | display: 'block' |
1332 | }); |
1333 | $('lightwindow_previous_title').innerHTML = this.galleries[gallery[0]][gallery[1]][current-1].title; |
1334 | } |
1335 | } |
1336 | |
1337 | if (this._getParameter('lightwindow_iframe_embed')) { |
1338 | this.resizeTo.height = this.dimensions.viewport.height; |
1339 | this.resizeTo.width = this.dimensions.viewport.width; |
1340 | } else { |
1341 | this.resizeTo.height = this._getParameter('lightwindow_height'); |
1342 | this.resizeTo.width = this._getParameter('lightwindow_width'); |
1343 | } |
1344 | |
1345 | this._processWindow(); |
1346 | |
1347 | break; |
1348 | |
1349 | case 'external' : |
1350 | |
1351 | this._appendIframe('auto'); |
1352 | |
1353 | this.resizeTo.height = this.dimensions.viewport.height; |
1354 | this.resizeTo.width = this.dimensions.viewport.width; |
1355 | |
1356 | this._processWindow(); |
1357 | |
1358 | break; |
1359 | |
1360 | case 'page' : |
1361 | |
1362 | var newAJAX = new Ajax.Request( |
1363 | this.contentToFetch, { |
1364 | method: 'get', |
1365 | parameters: '', |
1366 | onComplete: function(response) { |
1367 | $('lightwindow_contents').innerHTML += response.responseText; |
1368 | this.resizeTo.height = $('lightwindow_contents').scrollHeight+(this.options.contentOffset.height); |
1369 | this.resizeTo.width = $('lightwindow_contents').scrollWidth+(this.options.contentOffset.width); |
1370 | this._processWindow(); |
1371 | }.bind(this) |
1372 | } |
1373 | ); |
1374 | |
1375 | break; |
1376 | |
1377 | case 'inline' : |
1378 | |
1379 | var content = this.contentToFetch; |
1380 | if (content.indexOf('?') > -1) { |
1381 | content = content.substring(0, content.indexOf('?')); |
1382 | } |
1383 | content = content.substring(content.indexOf('#')+1); |
1384 | |
1385 | new Insertion.Top($('lightwindow_contents'), $(content).innerHTML); |
1386 | |
1387 | this.resizeTo.height = $('lightwindow_contents').scrollHeight+(this.options.contentOffset.height); |
1388 | this.resizeTo.width = $('lightwindow_contents').scrollWidth+(this.options.contentOffset.width); |
1389 | |
1390 | this._toggleTroubleElements('hidden', true); |
1391 | this._processWindow(); |
1392 | |
1393 | break; |
1394 | |
1395 | default : |
1396 | throw("Page Type could not be determined, please amend this lightwindow URL "+this.contentToFetch); |
1397 | break; |
1398 | } |
1399 | }, |
1400 | // |
1401 | // Resize the Window to fit the viewport if necessary |
1402 | // |
1403 | _resizeWindowToFit : function() { |
1404 | if (this.resizeTo.height+this.dimensions.cruft.height > this.dimensions.viewport.height) { |
1405 | var heightRatio = this.resizeTo.height/this.resizeTo.width; |
1406 | this.resizeTo.height = this.dimensions.viewport.height-this.dimensions.cruft.height-(2*this.options.viewportPadding); |
1407 | // We only care about ratio's with this window type |
1408 | if (this.windowType == 'image' || (this.windowType == 'media' && !this._getParameter('lightwindow_iframe_embed'))) { |
1409 | this.resizeTo.width = this.resizeTo.height/heightRatio; |
1410 | $('lightwindow_data_slide_inner').setStyle({ |
1411 | width: this.resizeTo.width+'px' |
1412 | }); |
1413 | } |
1414 | } |
1415 | if (this.resizeTo.width+this.dimensions.cruft.width > this.dimensions.viewport.width) { |
1416 | var widthRatio = this.resizeTo.width/this.resizeTo.height; |
1417 | this.resizeTo.width = this.dimensions.viewport.width-2*this.dimensions.cruft.width-(2*this.options.viewportPadding); |
1418 | // We only care about ratio's with this window type |
1419 | if (this.windowType == 'image' || (this.windowType == 'media' && !this._getParameter('lightwindow_iframe_embed'))) { |
1420 | this.resizeTo.height = this.resizeTo.width/widthRatio; |
1421 | $('lightwindow_data_slide_inner').setStyle({ |
1422 | height: this.resizeTo.height+'px' |
1423 | }); |
1424 | } |
1425 | } |
1426 | |
1427 | }, |
1428 | // |
1429 | // Set the Window to a preset size |
1430 | // |
1431 | _presetWindowSize : function() { |
1432 | if (this._getParameter('lightwindow_height')) { |
1433 | this.resizeTo.height = parseFloat(this._getParameter('lightwindow_height')); |
1434 | } |
1435 | if (this._getParameter('lightwindow_width')) { |
1436 | this.resizeTo.width = parseFloat(this._getParameter('lightwindow_width')); |
1437 | } |
1438 | }, |
1439 | // |
1440 | // Process the Window |
1441 | // |
1442 | _processWindow : function() { |
1443 | // Clean out our effects |
1444 | this.dimensions.dataEffects = []; |
1445 | |
1446 | // Set up the data-slide if we have caption information |
1447 | if (this.element.caption || this.element.author || (this.activeGallery && this.options.showGalleryCount)) { |
1448 | if (this.element.caption) { |
1449 | $('lightwindow_data_caption').innerHTML = this.element.caption; |
1450 | $('lightwindow_data_caption').setStyle({ |
1451 | display: 'block' |
1452 | }); |
1453 | } else { |
1454 | $('lightwindow_data_caption').setStyle({ |
1455 | display: 'none' |
1456 | }); |
1457 | } |
1458 | if (this.element.author) { |
1459 | $('lightwindow_data_author').innerHTML = this.element.author; |
1460 | $('lightwindow_data_author_container').setStyle({ |
1461 | display: 'block' |
1462 | }); |
1463 | } else { |
1464 | $('lightwindow_data_author_container').setStyle({ |
1465 | display: 'none' |
1466 | }); |
1467 | } |
1468 | if (this.activeGallery && this.options.showGalleryCount) { |
1469 | $('lightwindow_data_gallery_current').innerHTML = this.galleryLocation.current; |
1470 | $('lightwindow_data_gallery_total').innerHTML = this.galleryLocation.total; |
1471 | $('lightwindow_data_gallery_container').setStyle({ |
1472 | display: 'block' |
1473 | }); |
1474 | } else { |
1475 | $('lightwindow_data_gallery_container').setStyle({ |
1476 | display: 'none' |
1477 | }); |
1478 | } |
1479 | |
1480 | $('lightwindow_data_slide_inner').setStyle({ |
1481 | width: this.resizeTo.width+'px', |
1482 | height: 'auto', |
1483 | visibility: 'visible', |
1484 | display: 'block' |
1485 | }); |
1486 | $('lightwindow_data_slide').setStyle({ |
1487 | height: $('lightwindow_data_slide').getHeight()+'px', |
1488 | width: '1px', |
1489 | overflow: 'hidden', |
1490 | display: 'block' |
1491 | }); |
1492 | } else { |
1493 | $('lightwindow_data_slide').setStyle({ |
1494 | display: 'none', |
1495 | width: 'auto' |
1496 | }); |
1497 | $('lightwindow_data_slide_inner').setStyle({ |
1498 | display: 'none', |
1499 | visibility: 'hidden', |
1500 | width: this.resizeTo.width+'px', |
1501 | height: '0px' |
1502 | }); |
1503 | } |
1504 | |
1505 | if (this.element.title != 'null') { |
1506 | $('lightwindow_title_bar_title').innerHTML = this.element.title; |
1507 | } else { |
1508 | $('lightwindow_title_bar_title').innerHTML = ''; |
1509 | } |
1510 | |
1511 | var originalContainerDimensions = {height: $('lightwindow_container').getHeight(), width: $('lightwindow_container').getWidth()}; |
1512 | // Position the window |
1513 | $('lightwindow_container').setStyle({ |
1514 | height: 'auto', |
1515 | // We need to set the width to a px not auto as opera has problems with it |
1516 | width: $('lightwindow_container').getWidth()+this.options.contentOffset.width-(this.windowActive ? this.options.contentOffset.width : 0)+'px' |
1517 | }); |
1518 | var newContainerDimensions = {height: $('lightwindow_container').getHeight(), width: $('lightwindow_container').getWidth()}; |
1519 | |
1520 | // We need to record the container dimension changes |
1521 | this.containerChange = {height: originalContainerDimensions.height-newContainerDimensions.height, width: originalContainerDimensions.width-newContainerDimensions.width}; |
1522 | |
1523 | // Get out general dimensions |
1524 | this.dimensions.container = {height: $('lightwindow_container').getHeight(), width: $('lightwindow_container').getWidth()}; |
1525 | this.dimensions.cruft = {height: this.dimensions.container.height-$('lightwindow_contents').getHeight()+this.options.contentOffset.height, width: this.dimensions.container.width-$('lightwindow_contents').getWidth()+this.options.contentOffset.width}; |
1526 | |
1527 | // Set Sizes if we need too |
1528 | this._presetWindowSize(); |
1529 | this._resizeWindowToFit(); // Even if the window is preset we still don't want it to go outside of the viewport |
1530 | |
1531 | if (!this.windowActive) { |
1532 | // Position the window |
1533 | $('lightwindow_container').setStyle({ |
1534 | left: -(this.dimensions.container.width/2)+'px', |
1535 | top: -(this.dimensions.container.height/2)+'px' |
1536 | }); |
1537 | } |
1538 | $('lightwindow_container').setStyle({ |
1539 | height: this.dimensions.container.height+'px', |
1540 | width: this.dimensions.container.width+'px' |
1541 | }); |
1542 | |
1543 | // We are ready, lets show this puppy off! |
1544 | this._displayLightWindow('block', 'visible'); |
1545 | this._animateLightWindow(); |
1546 | }, |
1547 | // |
1548 | // Fire off our animation handler |
1549 | // |
1550 | _animateLightWindow : function() { |
1551 | if (this.options.animationHandler) { |
1552 | this.options.animationHandler().bind(this); |
1553 | } else { |
1554 | this._defaultAnimationHandler(); |
1555 | } |
1556 | }, |
1557 | // |
1558 | // Fire off our transition handler |
1559 | // |
1560 | _handleNavigation : function(display) { |
1561 | if (this.options.navigationHandler) { |
1562 | this.options.navigationHandler().bind(this, display); |
1563 | } else { |
1564 | this._defaultDisplayNavigation(display); |
1565 | } |
1566 | }, |
1567 | // |
1568 | // Fire off our transition handler |
1569 | // |
1570 | _handleTransition : function() { |
1571 | if (this.options.transitionHandler) { |
1572 | this.options.transitionHandler().bind(this); |
1573 | } else { |
1574 | this._defaultTransitionHandler(); |
1575 | } |
1576 | }, |
1577 | // |
1578 | // Handle the finish of the window animation |
1579 | // |
1580 | _handleFinalWindowAnimation : function(delay) { |
1581 | if (this.options.finalAnimationHandler) { |
1582 | this.options.finalAnimationHandler().bind(this, delay); |
1583 | } else { |
1584 | this._defaultfinalWindowAnimationHandler(delay); |
1585 | } |
1586 | }, |
1587 | // |
1588 | // Handle the gallery Animation |
1589 | // |
1590 | _handleGalleryAnimation : function(list) { |
1591 | if (this.options.galleryAnimationHandler) { |
1592 | this.options.galleryAnimationHandler().bind(this, list); |
1593 | } else { |
1594 | this._defaultGalleryAnimationHandler(list); |
1595 | } |
1596 | }, |
1597 | // |
1598 | // Display the navigation |
1599 | // |
1600 | _defaultDisplayNavigation : function(display) { |
1601 | if (display) { |
1602 | $('lightwindow_navigation').setStyle({ |
1603 | display: 'block', |
1604 | height: $('lightwindow_contents').getHeight()+'px', |
1605 | width: '100%', |
1606 | marginTop: this.options.dimensions.titleHeight+'px' |
1607 | }); |
1608 | } else { |
1609 | $('lightwindow_navigation').setStyle({ |
1610 | display: 'none', |
1611 | height: 'auto', |
1612 | width: 'auto' |
1613 | }); |
1614 | } |
1615 | }, |
1616 | // |
1617 | // This is the default animation handler for LightWindow |
1618 | // |
1619 | _defaultAnimationHandler : function() { |
1620 | // Now that we have figures out the cruft lets make the caption go away and add its effects |
1621 | if (this.element.caption || this.element.author || (this.activeGallery && this.options.showGalleryCount)) { |
1622 | $('lightwindow_data_slide').setStyle({ |
1623 | display: 'none', |
1624 | width: 'auto' |
1625 | }); |
1626 | this.dimensions.dataEffects.push( |
1627 | new Effect.SlideDown('lightwindow_data_slide', {sync: true}), |
1628 | new Effect.Appear('lightwindow_data_slide', {sync: true, from: 0.0, to: 1.0}) |
1629 | ); |
1630 | } |
1631 | |
1632 | // Set up the Title if we have one |
1633 | $('lightwindow_title_bar_inner').setStyle({ |
1634 | height: '0px', |
1635 | marginTop: this.options.dimensions.titleHeight+'px' |
1636 | }); |
1637 | |
1638 | // We always want the title bar as well |
1639 | this.dimensions.dataEffects.push( |
1640 | new Effect.Morph('lightwindow_title_bar_inner', {sync: true, style: {height: this.options.dimensions.titleHeight+'px', marginTop: '0px'}}), |
1641 | new Effect.Appear('lightwindow_title_bar_inner', {sync: true, from: 0.0, to: 1.0}) |
1642 | ); |
1643 | |
1644 | if (!this.options.hideGalleryTab) { |
1645 | this._handleGalleryAnimation(false); |
1646 | if ($('lightwindow_galleries_tab_container').getHeight() == 0) { |
1647 | this.dimensions.dataEffects.push( |
1648 | new Effect.Morph('lightwindow_galleries_tab_container', {sync: true, style: {height: '20px', marginTop: '0px'}}) |
1649 | ); |
1650 | $('lightwindow_galleries').setStyle({ |
1651 | width: '0px' |
1652 | }); |
1653 | } |
1654 | } |
1655 | |
1656 | var resized = false; |
1657 | var ratio = this.dimensions.container.width-$('lightwindow_contents').getWidth()+this.resizeTo.width+this.options.contentOffset.width; |
1658 | if (ratio != $('lightwindow_container').getWidth()) { |
1659 | new Effect.Parallel([ |
1660 | new Effect.Scale('lightwindow_contents', 100*(this.resizeTo.width/$('lightwindow_contents').getWidth()), {scaleFrom: 100*($('lightwindow_contents').getWidth()/($('lightwindow_contents').getWidth()+(this.options.contentOffset.width))), sync: true, scaleY: false, scaleContent: false}), |
1661 | new Effect.Scale('lightwindow_container', 100*(ratio/(this.dimensions.container.width)), {sync: true, scaleY: false, scaleFromCenter: true, scaleContent: false}) |
1662 | ], { |
1663 | duration: this.duration, |
1664 | delay: 0.25, |
1665 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1666 | } |
1667 | ); |
1668 | } |
1669 | |
1670 | ratio = this.dimensions.container.height-$('lightwindow_contents').getHeight()+this.resizeTo.height+this.options.contentOffset.height; |
1671 | if (ratio != $('lightwindow_container').getHeight()) { |
1672 | new Effect.Parallel([ |
1673 | new Effect.Scale('lightwindow_contents', 100*(this.resizeTo.height/$('lightwindow_contents').getHeight()), {scaleFrom: 100*($('lightwindow_contents').getHeight()/($('lightwindow_contents').getHeight()+(this.options.contentOffset.height))), sync: true, scaleX: false, scaleContent: false}), |
1674 | new Effect.Scale('lightwindow_container', 100*(ratio/(this.dimensions.container.height)), {sync: true, scaleX: false, scaleFromCenter: true, scaleContent: false}) |
1675 | ], { |
1676 | duration: this.duration, |
1677 | afterFinish: function() { |
1678 | if (this.dimensions.dataEffects.length > 0) { |
1679 | if (!this.options.hideGalleryTab) { |
1680 | $('lightwindow_galleries').setStyle({ |
1681 | width: this.resizeTo.width+'px' |
1682 | }); |
1683 | } |
1684 | new Effect.Parallel(this.dimensions.dataEffects, { |
1685 | duration: this.duration, |
1686 | afterFinish: function() { |
1687 | this._finishWindow(); |
1688 | }.bind(this), |
1689 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1690 | } |
1691 | ); |
1692 | } |
1693 | }.bind(this), |
1694 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1695 | } |
1696 | ); |
1697 | resized = true; |
1698 | } |
1699 | |
1700 | // We need to do our data effect since there was no resizing |
1701 | if (!resized && this.dimensions.dataEffects.length > 0) { |
1702 | new Effect.Parallel(this.dimensions.dataEffects, { |
1703 | duration: this.duration, |
1704 | beforeStart: function() { |
1705 | if (!this.options.hideGalleryTab) { |
1706 | $('lightwindow_galleries').setStyle({ |
1707 | width: this.resizeTo.width+'px' |
1708 | }); |
1709 | } |
1710 | if (this.containerChange.height != 0 || this.containerChange.width != 0) { |
1711 | new Effect.MoveBy('lightwindow_container', this.containerChange.height, this.containerChange.width, {transition: Effect.Transitions.sinoidal}); |
1712 | } |
1713 | }.bind(this), |
1714 | afterFinish: function() { |
1715 | this._finishWindow(); |
1716 | }.bind(this), |
1717 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1718 | } |
1719 | ); |
1720 | } |
1721 | |
1722 | }, |
1723 | // |
1724 | // Finish up Window Animation |
1725 | // |
1726 | _defaultfinalWindowAnimationHandler : function(delay) { |
1727 | /* 2009-05-07 (ADH): Support "noLoadingAnimation" property */ |
1728 | if (this.windowType == 'media' || this._getParameter('lightwindow_loading_animation') || this.noLoadingAnimation) { |
1729 | // Because of major flickering with the overlay we just hide it in this case |
1730 | Element.hide('lightwindow_loading'); |
1731 | this._handleNavigation(this.activeGallery); |
1732 | this._setStatus(false); |
1733 | } else { |
1734 | Effect.Fade('lightwindow_loading', { |
1735 | duration: 0.75, |
1736 | delay: 1.0, |
1737 | afterFinish: function() { |
1738 | // Just in case we need some scroll goodness (this also avoids the swiss cheese effect) |
1739 | if (this.windowType != 'image' && this.windowType != 'media' && this.windowType != 'external') { |
1740 | $('lightwindow_contents').setStyle({ |
1741 | overflow: 'auto' |
1742 | }); |
1743 | } |
1744 | this._handleNavigation(this.activeGallery); |
1745 | this._defaultGalleryAnimationHandler(); |
1746 | this._setStatus(false); |
1747 | }.bind(this), |
1748 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1749 | }); |
1750 | } |
1751 | }, |
1752 | // |
1753 | // Handle the gallery Animation |
1754 | // |
1755 | _defaultGalleryAnimationHandler : function(list) { |
1756 | if (this.activeGallery) { |
1757 | $('lightwindow_galleries').setStyle({ |
1758 | display: 'block', |
1759 | marginBottom: $('lightwindow_data_slide').getHeight()+this.options.contentOffset.height/2+'px' |
1760 | }); |
1761 | $('lightwindow_navigation').setStyle({ |
1762 | height: $('lightwindow_contents').getHeight()-20+'px' |
1763 | }); |
1764 | } else { |
1765 | $('lightwindow_galleries').setStyle({ |
1766 | display: 'none' |
1767 | }); |
1768 | $('lightwindow_galleries_tab_container').setStyle({ |
1769 | height: '0px', |
1770 | marginTop: '20px' |
1771 | }); |
1772 | $('lightwindow_galleries_list').setStyle({ |
1773 | height: '0px' |
1774 | }); |
1775 | return false; |
1776 | } |
1777 | |
1778 | if (list) { |
1779 | if ($('lightwindow_galleries_list').getHeight() == 0) { |
1780 | var height = $('lightwindow_contents').getHeight()*0.80; |
1781 | $('lightwindow_galleries_tab_span').className = 'down'; |
1782 | } else { |
1783 | var height = 0; |
1784 | $('lightwindow_galleries_tab_span').className = 'up'; |
1785 | } |
1786 | |
1787 | new Effect.Morph('lightwindow_galleries_list', { |
1788 | duration: this.duration, |
1789 | transition: Effect.Transitions.sinoidal, |
1790 | style: {height: height+'px'}, |
1791 | beforeStart: function() { |
1792 | $('lightwindow_galleries_list').setStyle({ |
1793 | overflow: 'hidden' |
1794 | }); |
1795 | }, |
1796 | afterFinish: function() { |
1797 | $('lightwindow_galleries_list').setStyle({ |
1798 | overflow: 'auto' |
1799 | }); |
1800 | }, |
1801 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1802 | }); |
1803 | } |
1804 | |
1805 | |
1806 | }, |
1807 | // |
1808 | // Default Transition Handler |
1809 | // |
1810 | _defaultTransitionHandler : function() { |
1811 | // Clean out our effects |
1812 | this.dimensions.dataEffects = []; |
1813 | |
1814 | // Now that we have figures out the cruft lets make the caption go away and add its effects |
1815 | if ($('lightwindow_data_slide').getStyle('display') != 'none') { |
1816 | this.dimensions.dataEffects.push( |
1817 | new Effect.SlideUp('lightwindow_data_slide', {sync: true}), |
1818 | new Effect.Fade('lightwindow_data_slide', {sync: true, from: 1.0, to: 0.0}) |
1819 | ); |
1820 | } |
1821 | |
1822 | if (!this.options.hideGalleryTab) { |
1823 | if ($('lightwindow_galleries').getHeight() != 0 && !this.options.hideGalleryTab) { |
1824 | this.dimensions.dataEffects.push( |
1825 | new Effect.Morph('lightwindow_galleries_tab_container', {sync: true, style: {height: '0px', marginTop: '20px'}}) |
1826 | ); |
1827 | } |
1828 | |
1829 | if ($('lightwindow_galleries_list').getHeight() != 0) { |
1830 | $('lightwindow_galleries_tab_span').className = 'up'; |
1831 | this.dimensions.dataEffects.push( |
1832 | new Effect.Morph('lightwindow_galleries_list', { |
1833 | sync: true, |
1834 | style: {height: '0px'}, |
1835 | transition: Effect.Transitions.sinoidal, |
1836 | beforeStart: function() { |
1837 | $('lightwindow_galleries_list').setStyle({ |
1838 | overflow: 'hidden' |
1839 | }); |
1840 | }, |
1841 | afterFinish: function() { |
1842 | $('lightwindow_galleries_list').setStyle({ |
1843 | overflow: 'auto' |
1844 | }); |
1845 | } |
1846 | }) |
1847 | ); |
1848 | } |
1849 | } |
1850 | |
1851 | // We always want the title bar as well |
1852 | this.dimensions.dataEffects.push( |
1853 | new Effect.Morph('lightwindow_title_bar_inner', {sync: true, style: {height: '0px', marginTop: this.options.dimensions.titleHeight+'px'}}), |
1854 | new Effect.Fade('lightwindow_title_bar_inner', {sync: true, from: 1.0, to: 0.0}) |
1855 | ); |
1856 | |
1857 | new Effect.Parallel(this.dimensions.dataEffects, { |
1858 | duration: this.duration, |
1859 | afterFinish: function() { |
1860 | this._loadWindow(); |
1861 | }.bind(this), |
1862 | queue: {position: 'end', scope: 'lightwindowAnimation'} |
1863 | } |
1864 | ); |
1865 | }, |
1866 | // |
1867 | // Default Form handler for LightWindow |
1868 | // |
1869 | _defaultFormHandler : function(e) { |
1870 | var element = Event.element(e).parentNode; |
1871 | var parameterString = Form.serialize(this._getParameter('lightwindow_form', element.getAttribute('params'))); |
1872 | if (this.options.formMethod == 'post') { |
1873 | var newAJAX = new Ajax.Request(element.href, { |
1874 | method: 'post', |
1875 | postBody: parameterString, |
1876 | onComplete: this.openWindow.bind(this, element) |
1877 | }); |
1878 | } else if (this.options.formMethod == 'get') { |
1879 | var newAJAX = new Ajax.Request(element.href, { |
1880 | method: 'get', |
1881 | parameters: parameterString, |
1882 | onComplete: this.openWindow.bind(this, element) |
1883 | }); |
1884 | } |
1885 | }, |
1886 | // |
1887 | // Wrap everything up |
1888 | // |
1889 | _finishWindow : function() { |
1890 | if (this.windowType == 'external') { |
1891 | // We set the externals source here because it allows for a much smoother animation |
1892 | $('lightwindow_iframe').setAttribute('src', this.element.href); |
1893 | this._handleFinalWindowAnimation(1); |
1894 | } else if (this.windowType == 'media') { |
1895 | |
1896 | var outerObject = document.createElement('object'); |
1897 | outerObject.setAttribute('classid', this.options.classids[this._fileExtension(this.contentToFetch)]); |
1898 | outerObject.setAttribute('codebase', this.options.codebases[this._fileExtension(this.contentToFetch)]); |
1899 | outerObject.setAttribute('id', 'lightwindow_media_primary'); |
1900 | outerObject.setAttribute('name', 'lightwindow_media_primary'); |
1901 | outerObject.setAttribute('width', this.resizeTo.width); |
1902 | outerObject.setAttribute('height', this.resizeTo.height); |
1903 | outerObject = this._addParamToObject('movie', this.contentToFetch, outerObject); |
1904 | outerObject = this._addParamToObject('src', this.contentToFetch, outerObject); |
1905 | outerObject = this._addParamToObject('controller', 'true', outerObject); |
1906 | outerObject = this._addParamToObject('wmode', 'transparent', outerObject); |
1907 | outerObject = this._addParamToObject('cache', 'false', outerObject); |
1908 | outerObject = this._addParamToObject('quality', 'high', outerObject); |
1909 | |
1910 | if (!Prototype.Browser.IE) { |
1911 | var innerObject = document.createElement('object'); |
1912 | innerObject.setAttribute('type', this.options.mimeTypes[this._fileExtension(this.contentToFetch)]); |
1913 | innerObject.setAttribute('data', this.contentToFetch); |
1914 | innerObject.setAttribute('id', 'lightwindow_media_secondary'); |
1915 | innerObject.setAttribute('name', 'lightwindow_media_secondary'); |
1916 | innerObject.setAttribute('width', this.resizeTo.width); |
1917 | innerObject.setAttribute('height', this.resizeTo.height); |
1918 | innerObject = this._addParamToObject('controller', 'true', innerObject); |
1919 | innerObject = this._addParamToObject('wmode', 'transparent', innerObject); |
1920 | innerObject = this._addParamToObject('cache', 'false', innerObject); |
1921 | innerObject = this._addParamToObject('quality', 'high', innerObject); |
1922 | |
1923 | outerObject.appendChild(innerObject); |
1924 | } |
1925 | |
1926 | if (this._getParameter('lightwindow_iframe_embed')) { |
1927 | this._appendIframe('no'); |
1928 | this._writeToIframe(this._convertToMarkup(outerObject, 'object')); |
1929 | } else { |
1930 | this._appendObject(outerObject, 'object', $('lightwindow_contents')); |
1931 | } |
1932 | |
1933 | this._handleFinalWindowAnimation(0); |
1934 | } else { |
1935 | this._handleFinalWindowAnimation(0); |
1936 | } |
1937 | |
1938 | // Initialize any actions |
1939 | this._setupActions(); |
1940 | } |
1941 | } |
1942 | |
1943 | /*-----------------------------------------------------------------------------------------------*/ |
1944 | |
1945 | Event.observe(window, 'load', lightwindowInit, false); |
1946 | |
1947 | // |
1948 | // Set up all of our links |
1949 | // |
1950 | var myLightWindow = null; |
1951 | function lightwindowInit() { |
1952 | myLightWindow = new lightwindow(); |
1953 | } |