1 | /** |
---|
2 | * @preserve Galleria Classic Theme 2011-08-01 |
---|
3 | * http://galleria.aino.se |
---|
4 | * |
---|
5 | * Copyright (c) 2011, Aino |
---|
6 | * Licensed under the MIT license. |
---|
7 | */ |
---|
8 | |
---|
9 | /*global jQuery, Galleria */ |
---|
10 | |
---|
11 | Galleria.requires(1.25, 'This version of Classic theme requires Galleria 1.2.5 or later'); |
---|
12 | |
---|
13 | (function($) { |
---|
14 | |
---|
15 | Galleria.addTheme({ |
---|
16 | name: 'classic', |
---|
17 | author: 'Galleria', |
---|
18 | css: 'galleria.classic.css', |
---|
19 | defaults: { |
---|
20 | transition: 'slide', |
---|
21 | thumbCrop: 'height', |
---|
22 | |
---|
23 | // set this to false if you want to show the caption all the time: |
---|
24 | _toggleInfo: true |
---|
25 | }, |
---|
26 | init: function(options) { |
---|
27 | |
---|
28 | // add some elements |
---|
29 | this.addElement('info-link','info-close'); |
---|
30 | this.append({ |
---|
31 | 'info' : ['info-link','info-close'] |
---|
32 | }); |
---|
33 | |
---|
34 | // cache some stuff |
---|
35 | var info = this.$('info-link,info-close,info-text'), |
---|
36 | touch = Galleria.TOUCH, |
---|
37 | click = touch ? 'touchstart' : 'click'; |
---|
38 | |
---|
39 | // show loader & counter with opacity |
---|
40 | this.$('loader,counter').show().css('opacity', 0.4); |
---|
41 | |
---|
42 | // some stuff for non-touch browsers |
---|
43 | if (! touch ) { |
---|
44 | this.addIdleState( this.get('image-nav-left'), { left:-50 }); |
---|
45 | this.addIdleState( this.get('image-nav-right'), { right:-50 }); |
---|
46 | this.addIdleState( this.get('counter'), { opacity:0 }); |
---|
47 | } |
---|
48 | |
---|
49 | // toggle info |
---|
50 | if ( options._toggleInfo === true ) { |
---|
51 | info.bind( click, function() { |
---|
52 | info.toggle(); |
---|
53 | }); |
---|
54 | } else { |
---|
55 | info.show(); |
---|
56 | this.$('info-link, info-close').hide(); |
---|
57 | } |
---|
58 | |
---|
59 | // bind some stuff |
---|
60 | this.bind('thumbnail', function(e) { |
---|
61 | |
---|
62 | if (! touch ) { |
---|
63 | // fade thumbnails |
---|
64 | $(e.thumbTarget).css('opacity', 0.6).parent().hover(function() { |
---|
65 | $(this).not('.active').children().stop().fadeTo(100, 1); |
---|
66 | }, function() { |
---|
67 | $(this).not('.active').children().stop().fadeTo(400, 0.6); |
---|
68 | }); |
---|
69 | |
---|
70 | if ( e.index === this.getIndex() ) { |
---|
71 | $(e.thumbTarget).css('opacity',1); |
---|
72 | } |
---|
73 | } else { |
---|
74 | $(e.thumbTarget).css('opacity', this.getIndex() ? 1 : 0.6); |
---|
75 | } |
---|
76 | }); |
---|
77 | |
---|
78 | this.bind('loadstart', function(e) { |
---|
79 | if (!e.cached) { |
---|
80 | this.$('loader').show().fadeTo(200, 0.4); |
---|
81 | } |
---|
82 | |
---|
83 | this.$('info').toggle( this.hasInfo() ); |
---|
84 | |
---|
85 | $(e.thumbTarget).css('opacity',1).parent().siblings().children().css('opacity', 0.6); |
---|
86 | }); |
---|
87 | |
---|
88 | this.bind('loadfinish', function(e) { |
---|
89 | this.$('loader').fadeOut(200); |
---|
90 | }); |
---|
91 | } |
---|
92 | }); |
---|
93 | |
---|
94 | }(jQuery)); |
---|