Aquellos que necesiten que en su aplicación web los usuarios introduzcan contraseñas seguras, podrán añadir este plugin jQuery que comprobará si las contraseñas tienen ciertas carácterísticas que las hacen seguras:
Uso de mayúsculas y minúsculas
Uso de números
Uso de caracteres especiales
Longitud de la contraseña
U opcionalmente similar a un username
El plugin mostrará un mensaje indicando la calidad de la contraseña y un color acorde a ésta.
Empezamos a mostrar contenido, hasta ahora solo mostraba un error 404 cuando se accedía a la URL del servidor.
Ahora vamos a añadir una route simple que muestre un objeto JSON cuando se acceda a la home. Recordad que la parte del servidor solo va a devolver respuestas JSON que tratará el frontend.
Usaremos plugins para tratar todas las rutas que incluiremos en glue. En este ejemplo tan solo añadiremos un route al server que devuelva un mensaje:
En algunas ocasiones es necesario añadir contenido al calendario que te ofrecer el datepicker de jQuery UI, por ejemplo añadir un combo que indice “horario mañanas/tarde”. Para conseguirlo será necesario ‘toquetear’ un poco el objeto jQuery.datepicker.
Tendremos que hacer dos cosas: primero deberemos evitar que cuando se selecciona un día se cierre automáticamente el popup con el calendario y después tendremos que modificar el HTML que devuelve la clase.
Para evitar el auto-cierre tenemos que añadir la opción showButtonPanel ya que nos ofrecerá el botón “Close” que nos permitirá cerrar el popup cuando hayamos indicado todos los campos necesarios. También es necesario modificar la función jQuery.datepicker._selectDate tal y como lo indican en StackOverflow:
// Añadimos datepicker al input que queremos
jQuery('.fecha')
.datepicker({
showButtonPanel: true,
dateFormat: "DD, d MM, yy"
});
// Modificamos la funcion _selectDate
jQuery.datepicker._selectDateOverload = jQuery.datepicker._selectDate;
jQuery.datepicker._selectDate = function(id, dateStr) {
var target = jQuery(id);
var inst = this._getInst(target[0]);
inst.inline = true;
jQuery.datepicker._selectDateOverload(id, dateStr);
inst.inline = false;
this._updateDatepicker(inst);
// Usar el .html() para luego usar el .text() es porque si usas el regional de datepicker, te salen entidades html en vez de letras acentuadas
// Se le añade el valor del nuevo campo select que hemos incluido
target.val(jQuery('').html(dateStr).text()+' @ '+jQuery('#horario').val());
}
Bien, ya tenemos el evento onSelect modificado, ahora nos falta cambiar el HTML que se dibuja, para ello modificaremos la función jQuery.datepicker._generateHTML:
jQuery.datepicker._generateHTMLExtended = jQuery.datepicker._generateHTML;
jQuery.datepicker._generateHTML = function(inst) {
var html = jQuery.datepicker._generateHTMLExtended(inst);
var div = jQuery('').html(html);
div.find('table:first').after('
Horario:
');
return div.html();
}
// Incluimos tambien un evento para que cuando se seleccione el horario, se modifique el campo input
jQuery('#horario').live('change', function() {
var $obj = jQuery('.fecha');
$obj.val($obj.val().replace(/@.*/, '@ '+jQuery(this).val()));
});
Hace tiempo comenté cómo hacer drag & drop directamente sobre el navegador, lo cual nos venía muy bien para subir ficheros (por ejemplo para un correo, galería de fotos, …). Esta vez se trata de descargar ficheros directamente desde el navegador, algo que permite GMail desde Chrome.
El autor de este post lo ha tenido difícil para poder ver cómo lo hace Google, pero al final el código es bastante sencillo:
var file = document.getElementById("dragout");
file.addEventListener("dragstart",function(evt){
evt.dataTransfer.setData("DownloadURL",fileDetails);
},false);
UIzard es un entorno de trabajo open source vía web que utiliza Ajax, y que funciona en varios navegadores Firefox y Safari (la versión para IE está siendo optimizada).
Se trata de un GUI muy completo en el que se pueden realizar páginas web, añadiendo elementos, con orígenes de datos, formularios, …
La mayor parte viene en coreano, pero creo que es bastante claro para poder entenderlo facilmente. UIzard
Vía / @knight
Interesante script de jQuery que integrándolo en nuestra página, carga el script de Google Analytics y le añade características extra que normalmente no tenemos en cuenta:
Enlaces salientes
E-Mails (mailto)
Descarga de ficheros, configurable indicando el tipo de fichero que se quiere monitorizar