annotate Agendas/trunk/src/Agendas.Web/Scripts/subpanels-0.9.js @ 224:de6d206bd5c3

Actualizando subpanels
author nelopauselli
date Sun, 25 Sep 2011 01:40:18 -0300
parents 42a1068e73c8
children c8f378272407
rev   line source
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
1 jQuery.fn.subpanel = function () {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
2 var panel = $(this[0]);
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
3
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
4 var settings = arguments[0] || {};
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
5
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
6 var closeLink = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
7 var openLink = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
8 var main = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
9 var loading = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
10
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
11 this.create = function () {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
12 // botón para abrir el panel
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
13 openLink = $('<a></a>').addClass('ajax-button ui-state-default ui-corner-all').click(this.open).appendTo(panel);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
14
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
15 var openSpan = $('<span></span>').addClass('ui-icon ui-icon-plusthick').html('open').appendTo(openLink);
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
16
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
17 //boton para cerrar el panel
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
18 closeLink = $('<a></a>')
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
19 .addClass('ajax-button ui-state-default ui-corner-tr ui-corner-tl')
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
20 .css('display', 'none')
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
21 .click(this.close).appendTo(panel);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
22 var closeSpan = $('<span></span>').addClass('ui-icon ui-icon-minusthick').html('close').appendTo(closeLink);
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
23
220
42a1068e73c8 corrección en subpanels para respetar (un poco mas) html según la w3c
nelopauselli
parents: 219
diff changeset
24 var body = $('body');
42a1068e73c8 corrección en subpanels para respetar (un poco mas) html según la w3c
nelopauselli
parents: 219
diff changeset
25
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
26 // panel principal
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
27 main = $('<div></div>')
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
28 // .addClass('ui-accordion')
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
29 .addClass('sp-main ui-widget-content ui-corner-bottom')
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
30 .width(settings.width || '400px')
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
31 .css('display', 'none')
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
32 .css('padding', '5px 5px 5px 5px')
220
42a1068e73c8 corrección en subpanels para respetar (un poco mas) html según la w3c
nelopauselli
parents: 219
diff changeset
33 .appendTo(body);
42a1068e73c8 corrección en subpanels para respetar (un poco mas) html según la w3c
nelopauselli
parents: 219
diff changeset
34
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
35 panel.show();
220
42a1068e73c8 corrección en subpanels para respetar (un poco mas) html según la w3c
nelopauselli
parents: 219
diff changeset
36
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
37 if (settings.created != undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
38 settings.created();
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
39 };
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
40
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
41 this.close = function () {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
42 if (loading !== undefined && loading !== null) {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
43 loading.abort();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
44 settings.aborting();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
45 }
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
46
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
47 $(this).hide();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
48 openLink.show();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
49 main.hide();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
50 main.html('');
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
51
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
52 if (settings.closed != undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
53 settings.closed();
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
54
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
55 };
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
56
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
57 this.open = function () {
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
58 var o = openLink.offset();
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
59 var top = o.top + openLink.outerHeight();
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
60 var left = o.left;
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
61
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
62 //main.offset({ top: top, left: left });
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
63 main.css('top', top);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
64 main.css('left', left);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
65
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
66 $(this).hide();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
67 closeLink.show();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
68 main.show();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
69
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
70 // div que contendrá el html del panel
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
71 var content = $('<div></div>')
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
72 .appendTo(main);
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
73
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
74 var imgdiv = $('<div></div>').css('text-align', 'center').css('padding-top', '10px').appendTo(content);
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
75 if (settings.imageLoding !== undefined) {
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
76 var img = $('<img />').attr('src', settings.imageLoding).attr('alt', 'loading...').appendTo(imgdiv);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
77 }
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
78
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
79 // se invoca la acción con un GET para obtener el contenido del panel
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
80 loading = $.ajax({
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
81 url: settings.url,
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
82 cache: false,
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
83 success: function (data) {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
84 loading = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
85
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
86 // cuando se recibe el contenido del panel, lo agregamos al div contenedor
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
87 content.html(data);
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
88
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
89 // buscamos el form que contiene el panel
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
90 var form = $('form', content);
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
91
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
92 /*
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
93 if ($('h3', content).length == 0)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
94 form.before('<h3><h3>');
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
95 $('h3', content).each(function() {
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
96 $(this).addClass('ui-accordion-header ui-helper-reset ui-state-active');
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
97 });
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
98
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
99 // Agregamos un div que va a contener el form
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
100 var body = $('<div></div>');
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
101 body.addClass('ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active');
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
102 form.wrap(body);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
103 */
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
104
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
105 // modificamos el evento submit
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
106 form.submit(dopost);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
107
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
108 if ($.validator != undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
109 $.validator.unobtrusive.parse(form);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
110
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
111 $(':submit', form).each(function () { $(this).button(); });
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
112
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
113 // y seteamos el foco en el primer input
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
114 var nextInput = $("input:visible:first", form);
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
115 nextInput.focus();
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
116
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
117 if (settings.loaded != undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
118 settings.loaded();
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
119 },
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
120 error: function (xhr, text) {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
121 loading = null;
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
122
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
123 if (xhr.status !== 0) {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
124 content.html(xhr.responseText)
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
125 .addClass('ui-state-error');
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
126 }
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
127 else {
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
128 closeLink.click();
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
129 }
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
130 }
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
131 });
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
132 };
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
133
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
134 function dopost(event) {
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
135 // prevenimos que se ejecute el submit ya que lo haremos manualmente.
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
136 event.preventDefault();
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
137
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
138 var self = $(this);
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
139
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
140 // preguntamos si el formulario es validable y válido
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
141 var valid = true;
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
142 if (self.valid !== undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
143 valid = self.valid();
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
144
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
145 if (valid === undefined || valid) {
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
146 // tomamos la acción y serializamos el form
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
147 var action = self.attr("action");
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
148 var data = self.serialize();
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
149
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
150 console.log(data);
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
151
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
152 // ejecutamos el POST
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
153 $.post(action, data, function (data) {
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
154 // cuando termina de ejecutarse el POST, ejecutamos la acción configurada
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
155 var r = true;
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
156 if (settings.success != undefined)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
157 settings.success(data);
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
158
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
159 // si esta acción no devuelve false, cerramos el panel
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
160 if (r === undefined || r)
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
161 closeLink.click();
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
162 });
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
163 }
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
164 }
219
b9850b647a4e Agregando alta de ponente durante la carga del evento
nelopauselli
parents:
diff changeset
165 this.create();
224
de6d206bd5c3 Actualizando subpanels
nelopauselli
parents: 220
diff changeset
166 }