Mercurial > altnet-hispano

changeset 224:de6d206bd5c3

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Actualizando subpanels
author nelopauselli
date Sun, 25 Sep 2011 01:40:18 -0300
parents 6f2213e949e4
children f23ee59ef1bd
files Agendas/trunk/src/Agendas.Web/Content/subpanels-0.9.css Agendas/trunk/src/Agendas.Web/Scripts/subpanels-0.9.js Agendas/trunk/src/Agendas.Web/Views/Shared/EditorTemplates/Ponente.cshtml
diffstat 3 files changed, 85 insertions(+), 81 deletions(-) [+]
line wrap: on
line diff
--- a/Agendas/trunk/src/Agendas.Web/Content/subpanels-0.9.css	Mon Sep 19 18:19:04 2011 -0300
+++ b/Agendas/trunk/src/Agendas.Web/Content/subpanels-0.9.css	Sun Sep 25 01:40:18 2011 -0300
@@ -1,8 +1,3 @@
-.sp-header {
-	padding: 5px 10px 5px;
-	font-size: 1.2em;
-}
-
 .sp-buttons {
 	padding: 5px 5px 5px 5px;
 	text-align: right;
@@ -14,5 +9,6 @@
 
 .ajax-button {
 	display: inline-block;
+	padding: 2px 2px 2px 2px;
 }
 
--- a/Agendas/trunk/src/Agendas.Web/Scripts/subpanels-0.9.js	Mon Sep 19 18:19:04 2011 -0300
+++ b/Agendas/trunk/src/Agendas.Web/Scripts/subpanels-0.9.js	Sun Sep 25 01:40:18 2011 -0300
@@ -1,5 +1,6 @@
 jQuery.fn.subpanel = function () {
 	var panel = $(this[0]);
+
 	var settings = arguments[0] || {};
 
 	var closeLink = null;
@@ -9,29 +10,32 @@
 
 	this.create = function () {
 		// botón para abrir el panel
-		openLink = $('<a></a>').addClass('ajax-button ui-widget ui-state-default ui-corner-all').click(this.open).appendTo(panel);
-		var openSpan = $('<span></span>').addClass('ui-icon ui-icon-plusthick').appendTo(openLink);
+		openLink = $('<a></a>').addClass('ajax-button ui-state-default ui-corner-all').click(this.open).appendTo(panel);
+
+		var openSpan = $('<span></span>').addClass('ui-icon ui-icon-plusthick').html('open').appendTo(openLink);
 
-		closeLink = $('<a></a>').addClass('ajax-button ui-widget ui-state-default ui-corner-all').css('display', 'none').click(this.close).appendTo(panel);
-		var closeSpan = $('<span></span>').addClass('ui-icon ui-icon-minusthick').appendTo(closeLink);
+		//boton para cerrar el panel
+		closeLink = $('<a></a>')
+			.addClass('ajax-button ui-state-default ui-corner-tr ui-corner-tl')
+			.css('display', 'none')
+			.click(this.close).appendTo(panel);
+		var closeSpan = $('<span></span>').addClass('ui-icon ui-icon-minusthick').html('close').appendTo(closeLink);
 
 		var body = $('body');
 
 		// panel principal
 		main = $('<div></div>')
-			.addClass('ui-widget')
-			.addClass('ui-widget-content')
-			.addClass('ui-corner-all')
-			.addClass('sp-main')
+//			.addClass('ui-accordion')
+			.addClass('sp-main ui-widget-content ui-corner-bottom')
 			.width(settings.width || '400px')
 			.css('display', 'none')
+			.css('padding', '5px 5px 5px 5px')
 			.appendTo(body);
 
-		var o = openLink.offset();
-		var top = o.top + openLink.height() * 1.2;
-		var left = o.left;
+		panel.show();
 
-		main.offset({ top: top, left: left });
+		if (settings.created != undefined)
+			settings.created();
 	};
 
 	this.close = function () {
@@ -44,34 +48,37 @@
 		openLink.show();
 		main.hide();
 		main.html('');
+
+		if (settings.closed != undefined)
+			settings.closed();
+
 	};
 
 	this.open = function () {
+		var o = openLink.offset();
+		var top = o.top + openLink.outerHeight();
+		var left = o.left;
+
+		//main.offset({ top: top, left: left });
+		main.css('top', top);
+		main.css('left', left);
+
 		$(this).hide();
 		closeLink.show();
 		main.show();
 
-		// si hay título, creamos el header
-		if (settings.title !== undefined) {
-			var header = $('<div></div>')
-				.addClass('sp-header').addClass('ui-widget-header')
-				.appendTo(main);
-
-			var title = $('<span><span>')
-				.html(settings.title)
-				.appendTo(header);
-		}
-
 		// div que contendrá el html del panel
 		var content = $('<div></div>')
 			.appendTo(main);
 
 		var imgdiv = $('<div></div>').css('text-align', 'center').css('padding-top', '10px').appendTo(content);
-		var img = $('<img />').attr('src', '/Content/loader.gif').attr('alt', 'loading...').appendTo(imgdiv);
+		if (settings.imageLoding !== undefined) {
+			var img = $('<img />').attr('src', settings.imageLoding).attr('alt', 'loading...').appendTo(imgdiv);
+		}
 
 		// se invoca la acción con un GET para obtener el contenido del panel
 		loading = $.ajax({
-			url: settings.action,
+			url: settings.url,
 			cache: false,
 			success: function (data) {
 				loading = null;
@@ -79,44 +86,36 @@
 				// cuando se recibe el contenido del panel, lo agregamos al div contenedor
 				content.html(data);
 
-				// form dentro del cual se ejecutará el panel, y del que luego se hará el POST
+				// buscamos el form que contiene el panel
 				var form = $('form', content);
 
-				form.submit(function (event) {
-					// prevenimos que se ejecute el submit ya que lo haremos manualmente.
-					event.preventDefault();
-
-					var self = $(this);
-
-					/* preguntamos si el formulario es validable y válido, con esto tenemos un problema 
-					ya que no se están generando los validadores por un problema entre jquery.validate 
-					y ajax */
-					var valid = self.valid();
-					if (valid === undefined || valid) {
-
-						// tomamos la acción y serializamos el form
-						var action = self.attr("action");
-						var data = self.serialize();
-
-						// ejecutamos el POST
-						$.post(action, data, function (data) {
-							// cuando termina de ejecutarse el POST, ejecutamos la acción configurada
-							var r = settings.successful(data);
-
-							// si esta acción no devuelve false, cerramos el panel
-							if (r === undefined || r)
-								closeLink.click();
-						});
-					}
+/*
+				if ($('h3', content).length == 0)
+					form.before('<h3><h3>');
+				$('h3', content).each(function() {
+					$(this).addClass('ui-accordion-header ui-helper-reset ui-state-active');
 				});
 
-				$.validator.unobtrusive.parse(form);
+				// Agregamos un div que va a contener el form
+				var body = $('<div></div>');
+				body.addClass('ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active');
+				form.wrap(body);
+*/
 
-				$('input:submit', form).each(function () { $(this).button(); });
+				// modificamos el evento submit
+				form.submit(dopost);
+
+				if ($.validator != undefined)
+					$.validator.unobtrusive.parse(form);
+
+				$(':submit', form).each(function () { $(this).button(); });
 
 				// y seteamos el foco en el primer input
 				var nextInput = $("input:visible:first", form);
 				nextInput.focus();
+
+				if (settings.loaded != undefined)
+					settings.loaded();
 			},
 			error: function (xhr, text) {
 				loading = null;
@@ -130,29 +129,38 @@
 				}
 			}
 		});
+	};
+	
+	function dopost(event) {
+		// prevenimos que se ejecute el submit ya que lo haremos manualmente.
+		event.preventDefault();
 
-		/*
-		var buttons = $('<div></div>')
-		.addClass('sp-buttons')
-		.appendTo(form);
+		var self = $(this);
 
-		var confirm = $('<input/>')
-		.attr('type', 'submit')
-		.attr('value', settings.confirmButton || 'Save')
-		.button()
-		.appendTo(buttons);
+		// preguntamos si el formulario es validable y válido
+		var valid = true;
+		if (self.valid !== undefined)
+			valid = self.valid();
+
+		if (valid === undefined || valid) {
+			// tomamos la acción y serializamos el form
+			var action = self.attr("action");
+			var data = self.serialize();
 
-		var x = $('<a></a>')
-		.html(settings.cancelButton || 'Cancel')
-		.button()
-		.click(function (e) {
-		e.preventDefault();
-		closeLink.click();
-		settings.cancel();
-		})
-		.appendTo(buttons);
-		*/
-	};
+			console.log(data);
+
+			// ejecutamos el POST
+			$.post(action, data, function (data) {
+				// cuando termina de ejecutarse el POST, ejecutamos la acción configurada
+				var r = true;
+				if (settings.success != undefined)
+					settings.success(data);
 
+				// si esta acción no devuelve false, cerramos el panel
+				if (r === undefined || r)
+					closeLink.click();
+			});
+		}
+	}
 	this.create();
-}		
\ No newline at end of file
+}
--- a/Agendas/trunk/src/Agendas.Web/Views/Shared/EditorTemplates/Ponente.cshtml	Mon Sep 19 18:19:04 2011 -0300
+++ b/Agendas/trunk/src/Agendas.Web/Views/Shared/EditorTemplates/Ponente.cshtml	Sun Sep 25 01:40:18 2011 -0300
@@ -1,7 +1,7 @@
 @model Guid
 <script type="text/javascript">
 	$(document).ready(function () {
-		$("#agregarPonente").subpanel({ successful: recargar, confirmButton: "Agregar", action: '/PersonaApi/Nueva' });
+		$("#agregarPonente").subpanel({ success: recargar, url: '/PersonaApi/Nueva' });
 	});
 
 	function recargar(data) {