vcs.maemo.org Git - scribo/blob - www/themes/fullscreen/galleria.fullscreen.js

   1 /*!
   2  * Galleria Fullscreen Theme
   3  * http://galleria.aino.se
   4  *
   5  * Copyright (c) 2010, Aino
   6  * Licensed under the MIT license.
   7  */
   8
   9 (function($) {
  10
  11 Galleria.addTheme({
  12     name: 'fullscreen',
  13     author: 'Galleria',
  14     version: '2.0',
  15     css: 'galleria.fullscreen.css',
  16     defaults: {
  17         transition: 'none',
  18         image_crop: true,
  19         thumb_crop: 'height'
  20     },
  21     init: function(options) {
  22
  23         this.addElement('thumbnails-tab');
  24         this.appendChild('thumbnails-container','thumbnails-tab');
  25
  26         var tab = this.$('thumbnails-tab');
  27         var loader = this.$('loader');
  28         var thumbs = this.$('thumbnails-container');
  29         var list = this.$('thumbnails-list');
  30         var infotext = this.$('info-text');
  31         var info = this.$('info');
  32
  33         var OPEN = false;
  34         var POS = 0;
  35
  36         if (Galleria.IE) {
  37             this.addElement('iefix');
  38             this.appendChild('container','iefix');
  39             this.setStyle(this.get('iefix'), {
  40                 zIndex:3,
  41                 position:'absolute',
  42                 backgroundColor: '#000',
  43                 opacity:.4
  44             })
  45         }
  46
  47         if (options.thumbnails === false) {
  48             thumbs.hide();
  49         }
  50
  51         var fixCaption = this.proxy(function(img) {
  52             if (!(img || img.width)) {
  53                 return;
  54             }
  55             var w = Math.min(img.width, $(window).width());
  56             infotext.width(w-40);
  57             if (Galleria.IE && this.options.show_caption) {
  58                 this.$('iefix').width(info.outerWidth()).height(info.outerHeight());
  59             }
  60         });
  61
  62         this.bind(Galleria.RESCALE, function() {
  63             POS = this.stageHeight - tab.height()-2;
  64             thumbs.css('top', OPEN ? POS - list.outerHeight() + 2 : POS);
  65             var img = this.getActiveImage();
  66             if (img) {
  67                 fixCaption(img);
  68             }
  69         });
  70
  71         this.bind(Galleria.LOADSTART, function(e) {
  72             if (!e.cached) {
  73                 loader.show().fadeTo(100, 1);
  74             }
  75             $(e.thumbTarget).css('opacity',1).parent().siblings('.active').children().css('opacity',.5);
  76         });
  77
  78         this.bind(Galleria.LOADFINISH, function(e) {
  79             loader.fadeOut(300);
  80             this.$('info,iefix').toggle(this.hasInfo());
  81         });
  82
  83         this.bind(Galleria.IMAGE, function(e) {
  84             fixCaption(e.imageTarget);
  85         });
  86
  87         this.bind(Galleria.THUMBNAIL, function(e) {
  88             $(e.thumbTarget).click(function() {
  89                 if (OPEN) {
  90                     tab.click();
  91                 }
  92             });
  93         });
  94
  95         this.trigger(Galleria.RESCALE);
  96
  97         this.addIdleState(thumbs, { opacity:0 });
  98         this.addIdleState(this.get('info'), { opacity:0 });
  99
 100         if (Galleria.IE) {
 101             this.addIdleState(this.get('iefix'), { opacity:0 });
 102         }
 103
 104         this.attachKeyboard({
 105             up: function(e) {
 106                 if (!OPEN) {
 107                     tab.click();
 108                 }
 109                 e.preventDefault();
 110             },
 111             down: function(e) {
 112                 if (OPEN) {
 113                     tab.click();
 114                 }
 115                 e.preventDefault();
 116             }
 117         });
 118
 119         this.$('image-nav-left, image-nav-right').css('opacity',0.01).hover(function() {
 120             $(this).animate({opacity:1},100);
 121         }, function() {
 122             $(this).animate({opacity:0});
 123         }).show();
 124
 125         tab.click(this.proxy(function() {
 126             tab.toggleClass('open', !OPEN);
 127             if (!OPEN) {
 128                 thumbs.animate({
 129                     top: POS - list.outerHeight() + 2
 130                 },400,'galleria');
 131             } else {
 132                 thumbs.animate({
 133                     top: POS
 134                 },400,'galleria');
 135             }
 136             OPEN = !OPEN;
 137         }));
 138
 139         this.$('thumbnails').children().hover(function() {
 140             $(this).not('.active').children().css('opacity', 1);
 141         }, function() {
 142             $(this).not('.active').children().fadeTo(200, .5);
 143         }).children().css('opacity',.5)
 144
 145         this.enterFullscreen();
 146     }
 147 });
 148
 149 })(jQuery);