Mercurial > judyates

comparison e2gallerypro/e2upload/Source/Additions.js @ 3:3f6b44aa6b35 judyates

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[svn r4] added ability to buy stuff, from a Prints page, but it doesn't work well with the css, and it also has not been fitted into the perl make system.
author rlm
date Mon, 22 Feb 2010 08:02:39 -0500
parents
children
comparison
equal deleted inserted replaced
2:670229c4eb4b 3:3f6b44aa6b35
1 /*
2 Script: Additions.js
3 MooTools Additions - Various Helpers, Overlay-Class, Dialog-Class
4
5 License:
6 MIT-style license.
7
8 Copyright:
9 Copyright (c) 2009 [Christoph Pojer](http://og5.net/christoph).
10
11 Dependencies:
12 - MooTools Core 1.2.2
13 - MooTools More 1.2.2.1 or newer: Tips.js
14
15 Contains:
16 - FileManager.Tips: Augmented version of Tips for use within the FileManager
17 - FileManager.Request: Simple extension to request to always use the loader-icon specified by the FileManager instance
18 - Element.appearOn: Can be used to show an element when another is hovered: $(myElement).appearOn(myWrapper)
19 - Element.center: Centers an element
20 - Dialog, Overlay: Nice Classes used by the FileManager
21 */
22
23 if(!window.FileManager) var FileManager = {};
24
25 FileManager.Tips = new Class({
26
27 Extends: Tips,
28
29 options: {
30 offsets: {x: 15, y: 0},
31 text: null,
32 onShow: function(tip, el){
33 if(tip.get('opacity')==0.8 && tip.getStyle('visibility')=='visible') return;
34
35 tip.get('tween').pause();
36 tip.set({
37 opacity: 0,
38 tween: {
39 duration: 200,
40 link: 'cancel'
41 }
42 }).fade(0.8);
43 },
44
45 onHide: function(tip, el){
46 tip.get('tween').pause().start('opacity', 0).chain(function(){
47 tip.setStyle('left', 0);
48 });
49 }
50 },
51
52 initialize: function(el, options){
53 this.parent(el, options);
54 this.tip.addClass('tip-filebrowser');
55 }
56
57 });
58
59 FileManager.Request = new Class({
60
61 Extends: Request.JSON,
62
63 initialize: function(options, filebrowser){
64 this.parent(options);
65
66 if(filebrowser) this.addEvents({
67 request: filebrowser.onRequest.bind(filebrowser),
68 complete: filebrowser.onComplete.bind(filebrowser)
69 });
70 }
71
72 });
73
74 Element.implement({
75
76 appearOn: function(el, opacity, options){
77 opacity = $type(opacity) == 'array' ? [opacity[0] || 1, opacity[1] || 0] : [opacity || 1, 0];
78
79 this.set({
80 opacity: opacity[1],
81 tween: options || {duration: 200}
82 });
83
84 $(el).addEvents({
85 mouseenter: this.fade.bind(this, opacity[0]),
86 mouseleave: this.fade.bind(this, opacity[1])
87 });
88
89 return this;
90 },
91
92 center: function(offsets){
93 var scroll = document.getScroll(),
94 offset = document.getSize(),
95 size = this.getSize(),
96 values = {x: 'left', y: 'top'};
97
98 if(!offsets) offsets = {};
99
100 for(var z in values){
101 var style = scroll[z]+(offset[z]-size[z])/2+(offsets[z] || 0);
102 this.setStyle(values[z], style < 10 ? 10 : style);
103 }
104
105 return this;
106 }
107
108 });
109
110 var Dialog = new Class({
111
112 Implements: [Options, Events],
113
114 options: {
115 /*onShow: $empty,
116 onOpen: $empty,
117 onConfirm: $empty,
118 onDecline: $empty,
119 onClose: $empty,*/
120 request: null,
121 buttons: ['confirm', 'decline'],
122 language: {}
123 },
124
125 initialize: function(text, options){
126 this.setOptions(options);
127
128 this.el = new Element('div', {
129 'class': 'dialog dialog-engine-'+Browser.Engine.name+(Browser.Engine.trident ? Browser.Engine.version : ''),
130 opacity: 0,
131 tween: {duration: 250}
132 }).adopt([
133 $type(text)=='string' ? new Element('div', {text: text}) : text
134 ]);
135
136 if(this.options.content) this.el.getElement('div').adopt(this.options.content);
137
138 Array.each(this.options.buttons, function(v){
139 new Element('button', {'class': 'dialog-'+v, text: this.options.language[v]}).addEvent('click', (function(e){
140 if(e) e.stop();
141 this.fireEvent(v).fireEvent('close');
142 this.overlay.hide();
143 this.destroy();
144 }).bind(this)).inject(this.el);
145 }, this);
146
147 this.overlay = new Overlay({
148 'class': 'overlay overlay-dialog',
149 events: {click: this.fireEvent.bind(this, ['close'])},
150 tween: {duration: 250}
151 });
152
153 this.bound = {
154 scroll: (function(){
155 if(!this.el) this.destroy();
156 else this.el.center();
157 }).bind(this),
158 keyesc: (function(e){
159 if(e.key=='esc') this.fireEvent('close').destroy();
160 }).bind(this)
161 };
162
163 this.show();
164 },
165
166 show: function(){
167 this.overlay.show();
168 var self = this.fireEvent('open');
169 this.el.setStyle('display', 'block').inject(document.body).center().fade(1).get('tween').chain(function(){
170 self.fireEvent('show');
171 });
172
173 window.addEvents({
174 scroll: this.bound.scroll,
175 resize: this.bound.scroll,
176 keyup: this.bound.keyesc
177 });
178 },
179
180 destroy: function(){
181 if(this.el) this.el.fade(0).get('tween').chain((function(){
182 this.overlay.destroy();
183 this.el.destroy();
184 }).bind(this));
185
186 window.removeEvent('scroll', this.bound.scroll).removeEvent('resize', this.bound.scroll).removeEvent('keyup', this.bound.keyesc);
187 }
188
189 }),
190 Overlay = new Class({
191
192 initialize: function(options){
193 this.el = new Element('div', $extend({
194 'class': 'overlay'
195 }, options)).inject(document.body);
196 },
197
198 show: function(){
199 this.objects = $$('object, select, embed').filter(function(el){
200 return el.id=='SwiffFileManagerUpload' || el.style.visibility=='hidden' ? false : !!(el.style.visibility = 'hidden');
201 });
202
203 this.resize = (function(){
204 if(!this.el) this.destroy();
205 else this.el.setStyles({
206 width: document.getScrollWidth(),
207 height: document.getScrollHeight()
208 });
209 }).bind(this);
210
211 this.resize();
212
213 this.el.setStyles({
214 opacity: 0,
215 display: 'block'
216 }).get('tween').pause().start('opacity', 0.5);
217
218 window.addEvent('resize', this.resize);
219
220 return this;
221 },
222
223 hide: function(){
224 this.el.fade(0).get('tween').chain((function(){
225 this.revertObjects();
226 this.el.setStyle('display', 'none');
227 }).bind(this));
228
229 window.removeEvent('resize', this.resize);
230
231 return this;
232 },
233
234 destroy: function(){
235 this.revertObjects().el.destroy();
236 },
237
238 revertObjects: function(){
239 if(this.objects && this.objects.length)
240 this.objects.each(function(el){
241 el.style.visibility = 'visible';
242 });
243
244 return this;
245 }
246
247 });