Diffstat (limited to 'frontend/beta/js/YUI-extensions/widgets/MessageBox.js') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/beta/js/YUI-extensions/widgets/MessageBox.js | 230 |
1 files changed, 230 insertions, 0 deletions
diff --git a/frontend/beta/js/YUI-extensions/widgets/MessageBox.js b/frontend/beta/js/YUI-extensions/widgets/MessageBox.js new file mode 100644 index 0000000..01b168d --- a/dev/null +++ b/frontend/beta/js/YUI-extensions/widgets/MessageBox.js | |||
@@ -0,0 +1,230 @@ | |||
1 | YAHOO.ext.MessageBox = function(){ | ||
2 | var dlg, opt, mask; | ||
3 | var bodyEl, msgEl, textboxEl, textareaEl, progressEl, pp; | ||
4 | var buttons, activeTextEl, bwidth; | ||
5 | |||
6 | var handleButton = function(button){ | ||
7 | if(typeof opt.fn == 'function'){ | ||
8 | if(opt.fn.call(opt.scope||window, button, activeTextEl.dom.value) !== false){ | ||
9 | dlg.hide(); | ||
10 | } | ||
11 | }else{ | ||
12 | dlg.hide(); | ||
13 | } | ||
14 | }; | ||
15 | var updateButtons = function(b){ | ||
16 | var width = 0; | ||
17 | if(!b){ | ||
18 | buttons['ok'].hide(); | ||
19 | buttons['cancel'].hide(); | ||
20 | buttons['yes'].hide(); | ||
21 | buttons['no'].hide(); | ||
22 | return width; | ||
23 | } | ||
24 | for(var k in buttons){ | ||
25 | if(typeof buttons[k] != 'function'){ | ||
26 | if(b[k]){ | ||
27 | buttons[k].show(); | ||
28 | buttons[k].setText(typeof b[k] == 'string' ? b[k] : YAHOO.ext.MessageBox.buttonText[k]); | ||
29 | width += buttons[k].el.getWidth()+15; | ||
30 | }else{ | ||
31 | buttons[k].hide(); | ||
32 | } | ||
33 | } | ||
34 | } | ||
35 | return width; | ||
36 | }; | ||
37 | |||
38 | return { | ||
39 | getDialog : function(){ | ||
40 | if(!dlg){ | ||
41 | dlg = new YAHOO.ext.BasicDialog('mb-dlg', { | ||
42 | autoCreate : true, | ||
43 | shadow: true, | ||
44 | draggable: true, | ||
45 | resizable:false, | ||
46 | constraintoviewport:true, | ||
47 | fixedcenter:true, | ||
48 | shim:true, | ||
49 | modal: true, | ||
50 | width:400, height:100, | ||
51 | buttonAlign:'center', | ||
52 | closeClick : function(){ | ||
53 | if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){ | ||
54 | handleButton('no'); | ||
55 | }else{ | ||
56 | handleButton('cancel'); | ||
57 | } | ||
58 | } | ||
59 | }); | ||
60 | dlg.closeClick = function(){ | ||
61 | alert('wtf'); | ||
62 | }; | ||
63 | mask = dlg.mask; | ||
64 | dlg.addKeyListener(27, dlg.hide, dlg); | ||
65 | buttons = {}; | ||
66 | buttons['ok'] = dlg.addButton(this.buttonText['ok'], handleButton.createCallback('ok')); | ||
67 | buttons['yes'] = dlg.addButton(this.buttonText['yes'], handleButton.createCallback('yes')); | ||
68 | buttons['no'] = dlg.addButton(this.buttonText['no'], handleButton.createCallback('no')); | ||
69 | buttons['cancel'] = dlg.addButton(this.buttonText['cancel'], handleButton.createCallback('cancel')); | ||
70 | bodyEl = dlg.body.createChild({ | ||
71 | tag:'div', | ||
72 | html:'<span class="ext-mb-text"></span><br /><input type="text" class="ext-mb-input"><textarea class="ext-mb-textarea"></textarea><div class="ext-mb-progress-wrap"><div class="ext-mb-progress"><div class="ext-mb-progress-bar"> </div></div></div>' | ||
73 | }); | ||
74 | msgEl = bodyEl.dom.firstChild; | ||
75 | textboxEl = getEl(bodyEl.dom.childNodes[2]); | ||
76 | textboxEl.enableDisplayMode(); | ||
77 | textboxEl.addKeyListener([10,13], function(){ | ||
78 | if(dlg.isVisible() && opt && opt.buttons){ | ||
79 | if(opt.buttons.ok){ | ||
80 | handleButton('ok'); | ||
81 | }else if(opt.buttons.yes){ | ||
82 | handleButton('yes'); | ||
83 | } | ||
84 | } | ||
85 | }); | ||
86 | textareaEl = getEl(bodyEl.dom.childNodes[3]); | ||
87 | textareaEl.enableDisplayMode(); | ||
88 | progressEl = getEl(bodyEl.dom.childNodes[4]); | ||
89 | progressEl.enableDisplayMode(); | ||
90 | pp = getEl(progressEl.dom.firstChild.firstChild); | ||
91 | } | ||
92 | return dlg; | ||
93 | }, | ||
94 | |||
95 | updateText : function(text){ | ||
96 | if(!dlg.isVisible() && !opt.width){ | ||
97 | dlg.resizeTo(this.maxWidth, 100); // resize first so content is never clipped from previous shows | ||
98 | } | ||
99 | msgEl.innerHTML = text; | ||
100 | var w = Math.max(Math.min(opt.width || msgEl.offsetWidth, this.maxWidth), | ||
101 | Math.max(opt.minWidth || this.minWidth, bwidth)); | ||
102 | if(opt.prompt){ | ||
103 | activeTextEl.setWidth(w); | ||
104 | } | ||
105 | dlg.setContentSize(w, bodyEl.getHeight()); | ||
106 | }, | ||
107 | |||
108 | updateProgress : function(value, text){ | ||
109 | if(text){ | ||
110 | this.updateText(text); | ||
111 | } | ||
112 | pp.setWidth(value*progressEl.dom.firstChild.offsetWidth); | ||
113 | }, | ||
114 | |||
115 | isVisible : function(){ | ||
116 | return dlg && dlg.isVisible(); | ||
117 | }, | ||
118 | |||
119 | hide : function(){ | ||
120 | if(this.isVisible()){ | ||
121 | dlg.hide(); | ||
122 | } | ||
123 | }, | ||
124 | |||
125 | show : function(options){ | ||
126 | var d = this.getDialog(); | ||
127 | opt = options; | ||
128 | d.setTitle(opt.title || ' '); | ||
129 | d.close.setDisplayed(opt.closable !== false); | ||
130 | activeTextEl = textboxEl; | ||
131 | opt.prompt = opt.prompt || (opt.multiline ? true : false) | ||
132 | if(opt.prompt){ | ||
133 | if(opt.multiline){ | ||
134 | textboxEl.hide(); | ||
135 | textareaEl.show(); | ||
136 | textareaEl.setHeight(typeof opt.multiline == 'number' ? | ||
137 | opt.multiline : this.defaultTextHeight); | ||
138 | activeTextEl = textareaEl; | ||
139 | }else{ | ||
140 | textboxEl.show(); | ||
141 | textareaEl.hide(); | ||
142 | } | ||
143 | }else{ | ||
144 | textboxEl.hide(); | ||
145 | textareaEl.hide(); | ||
146 | } | ||
147 | progressEl.setDisplayed(opt.progress === true); | ||
148 | this.updateProgress(0); | ||
149 | activeTextEl.dom.value = opt.value || ''; | ||
150 | if(opt.prompt){ | ||
151 | dlg.setDefaultButton(activeTextEl); | ||
152 | }else{ | ||
153 | var bs = opt.buttons; | ||
154 | var db = null; | ||
155 | if(bs && bs.ok){ | ||
156 | db = buttons['ok']; | ||
157 | }else if(bs && bs.yes){ | ||
158 | db = buttons['yes']; | ||
159 | } | ||
160 | dlg.setDefaultButton(db); | ||
161 | } | ||
162 | bwidth = updateButtons(opt.buttons); | ||
163 | this.updateText(opt.msg); | ||
164 | d.modal = opt.modal !== false; | ||
165 | d.mask = opt.modal !== false ? mask : false; | ||
166 | d.animateTarget = null; | ||
167 | d.show(options.animEl); | ||
168 | }, | ||
169 | |||
170 | progress : function(title, msg){ | ||
171 | this.show({ | ||
172 | title : title, | ||
173 | msg : msg, | ||
174 | buttons: false, | ||
175 | progress:true, | ||
176 | closable:false | ||
177 | }); | ||
178 | }, | ||
179 | |||
180 | alert : function(title, msg, fn, scope){ | ||
181 | this.show({ | ||
182 | title : title, | ||
183 | msg : msg, | ||
184 | buttons: this.OK, | ||
185 | fn: fn, | ||
186 | scope : scope | ||
187 | }); | ||
188 | }, | ||
189 | |||
190 | confirm : function(title, msg, fn, scope){ | ||
191 | this.show({ | ||
192 | title : title, | ||
193 | msg : msg, | ||
194 | buttons: this.YESNO, | ||
195 | fn: fn, | ||
196 | scope : scope | ||
197 | }); | ||
198 | }, | ||
199 | |||
200 | prompt : function(title, msg, fn, scope, multiline){ | ||
201 | this.show({ | ||
202 | title : title, | ||
203 | msg : msg, | ||
204 | buttons: this.OKCANCEL, | ||
205 | fn: fn, | ||
206 | minWidth:250, | ||
207 | scope : scope, | ||
208 | prompt:true, | ||
209 | multiline: multiline | ||
210 | }); | ||
211 | }, | ||
212 | |||
213 | OK : {ok:true}, | ||
214 | YESNO : {yes:true, no:true}, | ||
215 | OKCANCEL : {ok:true, cancel:true}, | ||
216 | YESNOCANCEL : {yes:true, no:true, cancel:true}, | ||
217 | |||
218 | defaultTextHeight:75, | ||
219 | maxWidth : 500, | ||
220 | minWidth : 100, | ||
221 | buttonText : { | ||
222 | ok : 'OK', | ||
223 | cancel : 'Cancel', | ||
224 | yes : 'Yes', | ||
225 | no : 'No' | ||
226 | } | ||
227 | }; | ||
228 | }(); | ||
229 | |||
230 | YAHOO.ext.Msg = YAHOO.ext.MessageBox; | ||