Mercurial > hg > orthanc

comparison PalanthirExplorer/libs/jquery.mobile.simpledialog2.js @ 45:33d67e1ab173

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
r
author Sebastien Jodogne <s.jodogne@gmail.com>
date Wed, 05 Sep 2012 13:24:59 +0200
parents PalantirExplorer/libs/jquery.mobile.simpledialog2.js@3959d33612cc
children
comparison
equal deleted inserted replaced
43:9be852ad33d2 45:33d67e1ab173
1 /*
2 * jQuery Mobile Framework : plugin to provide a dialogs Widget. ver2
3 * Copyright (c) JTSage
4 * CC 3.0 Attribution. May be relicensed without permission/notifcation.
5 * https://github.com/jtsage/jquery-mobile-simpledialog
6 *
7 * Modifications by Sebastien Jodogne
8 */
9
10 (function($, undefined ) {
11 $.widget( "mobile.simpledialog2", $.mobile.widget, {
12 options: {
13 version: '1.0.1-2012061300', // jQueryMobile-YrMoDaySerial
14 mode: 'blank', // or 'button'
15 themeDialog: 'b',
16 themeInput: false,
17 themeButtonDefault: false,
18 themeHeader: 'a',
19
20 fullScreen: false,
21 fullScreenForce: false,
22 dialogAllow: false,
23 dialogForce: false,
24
25 headerText: false,
26 headerClose: false,
27 buttonPrompt: false,
28 buttonInput: false,
29 buttonInputDefault: false,
30 buttonPassword: false,
31 blankContent: false,
32 blankContentAdopt: false,
33
34 resizeListener: true,
35 safeNuke: true,
36 forceInput: true,
37 showModal: true,
38 animate: true,
39 transition: 'pop',
40 clickEvent: 'click',
41 zindex: '500',
42 width: '280px',
43 left: false,
44 top: false,
45
46 callbackOpen: false,
47 callbackOpenArgs: [],
48 callbackClose: false,
49 callbackCloseArgs: []
50 },
51 _eventHandler: function(e,p) {
52 // Handle the triggers
53 var self = e.data.widget,
54 o = e.data.widget.options;
55
56 if ( ! e.isPropagationStopped() ) {
57 switch (p.method) {
58 case 'close':
59 self.close();
60 break;
61 case 'html':
62 self.updateBlank(p.source);
63 break;
64 }
65 }
66 },
67 _create: function () {
68 var self = this,
69 o = $.extend(this.options, this.element.jqmData('options')),
70 initDate = new Date(),
71 content = $("<div class='ui-simpledialog-container ui-overlay-shadow ui-corner-all ui-simpledialog-hidden " +
72 ((o.animate === true) ? o.transition : '') + " ui-body-" + o.themeDialog + "'></div>");
73
74 if ( o.themeButtonDefault === false ) { o.themeButtonDefault = o.themeDialog; }
75 if ( o.themeInput === false ) { o.themeInput = o.themeDialog; }
76 $.mobile.sdCurrentDialog = self;
77 if ( typeof $.mobile.sdLastInput !== 'undefined' ) { delete $.mobile.sdLastInput; }
78 self.internalID = initDate.getTime();
79 self.displayAnchor = $.mobile.activePage.children('.ui-content').first();
80 if ( self.displayAnchor.length === 0 ) { self.displayAnchor = $.mobile.activePage; }
81
82 self.dialogPage = $("<div data-role='dialog' data-theme='" + o.themeDialog + "'><div data-role='header'></div><div data-role='content'></div></div>");
83 self.sdAllContent = self.dialogPage.find('[data-role=content]');
84
85 content.appendTo(self.sdAllContent);
86
87 self.sdIntContent = self.sdAllContent.find('.ui-simpledialog-container');
88 self.sdIntContent.css('width', o.width);
89
90 if ( o.headerText !== false || o.headerClose !== false ) {
91 self.sdHeader = $('<div style="margin-bottom: 4px;" class="ui-header ui-bar-'+o.themeHeader+'"></div>');
92 if ( o.headerClose === true ) {
93 $("<a class='ui-btn-left' rel='close' href='#'>Close</a>").appendTo(self.sdHeader).buttonMarkup({ theme : o.themeHeader, icon : 'delete', iconpos: 'notext', corners: true, shadow : true });
94 }
95 $('<h1 class="ui-title">'+((o.headerText !== false)?o.headerText:'')+'</h1>').appendTo(self.sdHeader);
96 self.sdHeader.appendTo(self.sdIntContent);
97 }
98
99 if ( o.mode === 'blank' ) {
100 if ( o.blankContent === true ) {
101 if ( o.blankContentAdopt === true ) {
102 o.blankContent = self.element.children();
103 } else {
104 o.blankContent = self.element.html();
105 }
106 }
107 $(o.blankContent).appendTo(self.sdIntContent);
108 } else if ( o.mode === 'button' ) {
109 self._makeButtons().appendTo(self.sdIntContent);
110 }
111
112 self.sdIntContent.appendTo(self.displayAnchor.parent());
113
114 self.dialogPage.appendTo( $.mobile.pageContainer )
115 .page().css('minHeight', '0px').css('zIndex', o.zindex);
116
117 if ( o.animate === true ) { self.dialogPage.addClass(o.transition); }
118
119 self.screen = $("<div>", {'class':'ui-simpledialog-screen ui-simpledialog-hidden'})
120 .css('z-index', (o.zindex-1))
121 .appendTo(self.displayAnchor.parent())
122 .bind(o.clickEvent, function(event){
123 if ( !o.forceInput ) {
124 self.close();
125 }
126 event.preventDefault();
127 });
128
129 if ( o.showModal ) { self.screen.addClass('ui-simpledialog-screen-modal'); }
130
131 $(document).bind('simpledialog.'+self.internalID, {widget:self}, function(e,p) { self._eventHandler(e,p); });
132 },
133 _makeButtons: function () {
134 var self = this,
135 o = self.options,
136 buttonHTML = $('<div></div>'),
137 pickerInput = $("<div class='ui-simpledialog-controls'><input class='ui-simpledialog-input ui-input-text ui-shadow-inset ui-corner-all ui-body-"+o.themeInput+"' type='"+((o.buttonPassword===true)?"password":"text")+"' value='"+((o.buttonInputDefault!==false)?o.buttonInputDefault.replace( '"', "&#34;" ).replace( "'", "&#39;" ):"")+"' name='pickin' /></div>"),
138 pickerChoice = $("<div>", { "class":'ui-simpledialog-controls' });
139
140
141 if ( o.buttonPrompt !== false ) {
142 self.buttonPromptText = $("<p class='ui-simpledialog-subtitle'>"+o.buttonPrompt+"</p>").appendTo(buttonHTML);
143 }
144
145 if ( o.buttonInput !== false ) {
146 $.mobile.sdLastInput = "";
147 pickerInput.appendTo(buttonHTML);
148 pickerInput.find('input').bind('change', function () {
149 $.mobile.sdLastInput = pickerInput.find('input').first().val();
150 self.thisInput = pickerInput.find('input').first().val();
151 });
152 }
153
154 pickerChoice.appendTo(buttonHTML);
155
156 self.butObj = [];
157
158 $.each(o.buttons, function(name, props) {
159 props = $.isFunction( props ) ? { click: props } : props;
160 props = $.extend({
161 text : name,
162 id : name + self.internalID,
163 theme : o.themeButtonDefault,
164 icon : 'check',
165 iconpos: 'left',
166 corners: 'true',
167 shadow : 'true',
168 args : [],
169 close : true
170 }, props);
171
172 self.butObj.push($("<a href='#'>"+name+"</a>")
173 .appendTo(pickerChoice)
174 .attr('id', props.id)
175 .buttonMarkup({
176 theme : props.theme,
177 icon : props.icon,
178 iconpos: props.iconpos,
179 corners: props.corners,
180 shadow : props.shadow
181 }).unbind("vclick click")
182 .bind(o.clickEvent, function() {
183 if ( o.buttonInput ) { self.sdIntContent.find('input [name=pickin]').trigger('change'); }
184 var returnValue = props.click.apply(self, $.merge(arguments, props.args));
185 if ( returnValue !== false && props.close === true ) {
186 self.close();
187 }
188 })
189 );
190 });
191
192 return buttonHTML;
193 },
194 _getCoords: function(widget) {
195 var self = widget,
196 docWinWidth = $.mobile.activePage.width(),
197 docWinHighOff = $(window).scrollTop(),
198 docWinHigh = $(window).height(),
199 diaWinWidth = widget.sdIntContent.innerWidth(),
200 diaWinHigh = widget.sdIntContent.outerHeight(),
201
202 coords = {
203 'high' : $(window).height(),
204 'width' : $.mobile.activePage.width(),
205 'fullTop' : $(window).scrollTop(),
206 'fullLeft': $(window).scrollLeft(),
207 'winTop' : docWinHighOff + ((widget.options.top !== false) ? widget.options.top : (( docWinHigh / 2 ) - ( diaWinHigh / 2 ) )),
208 'winLeft' : ((widget.options.left !== false) ? widget.options.left : (( docWinWidth / 2 ) - ( diaWinWidth / 2 ) ))
209 };
210
211 if ( coords.winTop < 45 ) { coords.winTop = 45; }
212
213 return coords;
214 },
215 _orientChange: function(e) {
216 var self = e.data.widget,
217 o = e.data.widget.options,
218 coords = e.data.widget._getCoords(e.data.widget);
219
220 e.stopPropagation();
221
222 if ( self.isDialog === true ) {
223 return true;
224 } else {
225 if ( o.fullScreen === true && ( coords.width < 400 || o.fullScreenForce === true ) ) {
226 self.sdIntContent.css({'border': 'none', 'position': 'absolute', 'top': coords.fullTop, 'left': coords.fullLeft, 'height': coords.high, 'width': coords.width, 'maxWidth': coords.width }).removeClass('ui-simpledialog-hidden');
227 } else {
228 self.sdIntContent.css({'position': 'absolute', 'top': coords.winTop, 'left': coords.winLeft}).removeClass('ui-simpledialog-hidden');
229 }
230 }
231 },
232 repos: function() {
233 var bsEvent = { data: {widget:this}, stopPropagation: function () { return true; }};
234 this._orientChange(bsEvent);
235 },
236 open: function() {
237 var self = this,
238 o = this.options,
239 coords = this._getCoords(this);
240
241 self.sdAllContent.find('.ui-btn-active').removeClass('ui-btn-active');
242 self.sdIntContent.delegate('[rel=close]', o.clickEvent, function (e) { e.preventDefault(); self.close(); });
243
244 if ( ( o.dialogAllow === true && coords.width < 400 ) || o.dialogForce ) {
245 self.isDialog = true;
246
247 if ( o.mode === 'blank' ) { // Custom selects do not play well with dialog mode - so, we turn them off.
248 self.sdIntContent.find('select').each(function () {
249 $(this).jqmData('nativeMenu', true);
250 });
251 }
252
253 self.displayAnchor.parent().unbind("pagehide.remove");
254 self.sdAllContent.append(self.sdIntContent);
255 self.sdAllContent.trigger('create');
256 if ( o.headerText !== false ) {
257 self.sdHeader.find('h1').appendTo(self.dialogPage.find('[data-role=header]'));
258 self.sdIntContent.find('.ui-header').empty().removeClass();
259 }
260 if ( o.headerClose === true ) {
261 self.dialogPage.find('.ui-header a').bind('click', function () {
262 setTimeout("$.mobile.sdCurrentDialog.destroy();", 1000);
263 });
264 } else {
265 self.dialogPage.find('.ui-header a').remove();
266 }
267
268 self.sdIntContent.removeClass().css({'top': 'auto', 'width': 'auto', 'left': 'auto', 'marginLeft': 'auto', 'marginRight': 'auto', 'zIndex': o.zindex});
269 $.mobile.changePage(self.dialogPage, {'transition': (o.animate === true) ? o.transition : 'none'});
270 } else {
271 self.isDialog = false;
272 self.selects = [];
273
274 if ( o.fullScreen === false ) {
275 if ( o.showModal === true && o.animate === true ) { self.screen.fadeIn('slow'); }
276 else { self.screen.removeClass('ui-simpledialog-hidden'); }
277 }
278
279 self.sdIntContent.addClass('ui-overlay-shadow in').css('zIndex', o.zindex).trigger('create');
280
281 if ( o.fullScreen === true && ( coords.width < 400 || o.fullScreenForce === true ) ) {
282 self.sdIntContent.removeClass('ui-simpledialog-container').css({'border': 'none', 'position': 'absolute', 'top': coords.fullTop, 'left': coords.fullLeft, 'height': coords.high, 'width': coords.width, 'maxWidth': coords.width }).removeClass('ui-simpledialog-hidden');
283 } else {
284 self.sdIntContent.css({'position': 'absolute', 'top': coords.winTop, 'left': coords.winLeft}).removeClass('ui-simpledialog-hidden');
285 }
286
287 $(document).bind('orientationchange.simpledialog', {widget:self}, function(e) { self._orientChange(e); });
288 if ( o.resizeListener === true ) {
289 $(window).bind('resize.simpledialog', {widget:self}, function (e) { self._orientChange(e); });
290 }
291 }
292 if ( $.isFunction(o.callbackOpen) ) {
293 o.callbackOpen.apply(self, o.callbackOpenArgs);
294 }
295 },
296 close: function() {
297 var self = this, o = this.options, retty;
298
299 if ( $.isFunction(self.options.callbackClose) ) {
300 retty = self.options.callbackClose.apply(self, self.options.callbackCloseArgs);
301 if ( retty === false ) { return false; }
302 }
303
304 if ( self.isDialog ) {
305 $(self.dialogPage).dialog('close');
306 self.sdIntContent.addClass('ui-simpledialog-hidden');
307 self.sdIntContent.appendTo(self.displayAnchor.parent());
308 if ( $.mobile.activePage.jqmData("page").options.domCache != true && $.mobile.activePage.is(":jqmData(external-page='true')") ) {
309 $.mobile.activePage.bind("pagehide.remove", function () {
310 $(this).remove();
311 });
312 }
313 } else {
314 if ( self.options.showModal === true && self.options.animate === true ) {
315 self.screen.fadeOut('slow');
316 } else {
317 self.screen.addClass('ui-simpledialog-hidden');
318 }
319 self.sdIntContent.addClass('ui-simpledialog-hidden').removeClass('in');
320 $(document).unbind('orientationchange.simpledialog');
321 if ( self.options.resizeListener === true ) { $(window).unbind('resize.simpledialog'); }
322 }
323
324 if ( o.mode === 'blank' && o.blankContent !== false && o.blankContentAdopt === true ) {
325 self.element.append(o.blankContent);
326 o.blankContent = true;
327 }
328
329 if ( self.isDialog === true || self.options.animate === true ) {
330 setTimeout(function(that) { return function () { that.destroy(); };}(self), 1000);
331 } else {
332 self.destroy();
333 }
334 },
335 destroy: function() {
336 var self = this,
337 ele = self.element;
338
339 if ( self.options.mode === 'blank' ) {
340 $.mobile.sdCurrentDialog.sdIntContent.find('select').each(function() {
341 if ( $(this).data('nativeMenu') == false ) {
342 $(this).data('selectmenu').menuPage.remove();
343 $(this).data('selectmenu').screen.remove();
344 $(this).data('selectmenu').listbox.remove();
345 }
346 });
347 }
348
349 $(self.sdIntContent).remove();
350 $(self.dialogPage).remove();
351 $(self.screen).remove();
352 $(document).unbind('simpledialog.'+self.internalID);
353 delete $.mobile.sdCurrentDialog;
354 $.Widget.prototype.destroy.call(self);
355 if ( self.options.safeNuke === true && $(ele).parents().length === 0 && $(ele).contents().length === 0 ) {
356 ele.remove();
357 }
358 },
359 updateBlank: function (newHTML) {
360 var self = this,
361 o = this.options;
362
363 self.sdIntContent.empty();
364
365 if ( o.headerText !== false || o.headerClose !== false ) {
366 self.sdHeader = $('<div class="ui-header ui-bar-'+o.themeHeader+'"></div>');
367 if ( o.headerClose === true ) {
368 $("<a class='ui-btn-left' rel='close' href='#'>Close</a>").appendTo(self.sdHeader).buttonMarkup({ theme : o.themeHeader, icon : 'delete', iconpos: 'notext', corners: true, shadow : true });
369 }
370 $('<h1 class="ui-title">'+((o.headerText !== false)?o.headerText:'')+'</h1>').appendTo(self.sdHeader);
371 self.sdHeader.appendTo(self.sdIntContent);
372 }
373
374 $(newHTML).appendTo(self.sdIntContent);
375 self.sdIntContent.trigger('create');
376 $(document).trigger('orientationchange.simpledialog');
377 },
378 _init: function() {
379 this.open();
380 }
381 });
382 })( jQuery );