jCryption: encriptación mediante javascript

ByLuis

jCryption es una librería javascript que utiliza jQuery y que nos permite encriptar los datos de un formulario sin necesidad de utilizar SSL. Para ello utiliza la encriptación del algoritmo de clave pública de RSA.
Muy útil para aquellos que no puedan disponer de conexión SSL.
jCryption
Vía / DZone

Similar Posts

Documentación oficial de prototype: por fin!

ByLuis

prototype_logo.pngPrototype ya dispone de documentación oficial. Aprovechando el lanzamiento de la versión 1.5 de la famosa librería han publicado la documentación de la API, un blog y una sección de tutoriales.
La documentación está realmente bien. Bien organizada y bajo un diseño limpio y claro. Pero se echan de menos dos cosas: la posibilidad de que la gente envíe comentarios y ejemplos como ocurre con la documentación de PHP y un buscador. Respecto al buscador, proporcionan un bookmarklet que cumple esa función pero parece una solución forzada.
La sección de tutoriales y consejos está todavía muy vacía pero es una buena idea el que la hayan implementado. Actualmente ofrecen dos documentos: Introducción a AJAX y Cómo Prototype extiende DOM.
Y el blog, genial. Todavía esta vacío pero es lógico… lo acaban de publicar! Desde luego yo ya me he suscrito a las RSS
Vía / Anieto2k

Tutorial básico de HTML storage

ByLuis

Una de las características más interesantes de HTML5 es el browser storage, el cual nos permite almacenar datos en el navegador del cliente.

A parte de su uso básico:

localStorage.setItem('name', 'arman');  
var value = localStorage.getItem('name');  
localStorage.removeItem('name');

Me gustaría destacar dos puntos importantes: detectar si el navegador lo soporta y añadir eventos:

var webStorageSupported = ('localStorage' in window) && window['localStorage'] !== null; 
if (window.addEventListener) {  
  window.addEventListener("storage", handleStorageChange, false);  
} else {  
  window.attachEvent("onstorage", handleStorageChange);  
}  

function handleStorageChange(event) {  
  alert("Algo esta cambiando en el almacenamiento");  
}

El resto del tutorial explica todo paso a paso

Browser Storage for HTML5 Apps

Modernizr: librería Javascript para detectar HTML5, CSS3 y más

ByLuis

Modernizr es una librería que permite detectar las nuevas características de HTML5, CSS3, Canvas, … que admite el navegador. Tan sólo habrá que acceder a propiedades para saber si admite o no una característica en particular:

if (Modernizr.geolocation) {
  // Admite geolocalización
}
if (Modernizr.csstransitions) {
  // Transacciones CSS
}
if (Modernizr.rgba) {
  // RGBA
}

Las características que detecta son:

  • @font-face
  • Canvas
  • Canvas Text
  • HTML5 Audio
  • HTML5 Audio formats
  • HTML5 Video
  • HTML5 Video formats
  • rgba()
  • hsla()
  • border-image
  • border-radius
  • box-shadow
  • Multiple backgrounds
  • opacity
  • CSS Animations
  • CSS Columns
  • CSS Gradients
  • CSS Reflections
  • CSS 2D Transforms
  • CSS 3D Transforms
  • CSS Transitions
  • Geolocation API
  • Input Types
  • Input Attributes
  • localStorage
  • sessionStorage
  • Web Workers
  • applicationCache
  • SVG
  • SVG Clip paths
  • SMIL
  • Web SQL Database
  • IndexedDB
  • Web Sockets
  • hashchange Event
  • History Management
  • Drag and Drop
  • Cross-window Messaging

Modernizr

| | |

AJAX paso a paso: autocompletado en cajas de texto

ByLuis

Hace ya tiempo escribí en display: NONE cómo hacer que el texto se autocompletara en una caja de texto según se fuera escribiendo en ella. En esa entrada comentaba que la obtención de los datos, que era mediante Javascript, se podía realizar mediante AJAX. Hoy vamos a explicar cómo se haría esa llamada mediante AJAX.
ajax-autocompletado.png

Read More “AJAX paso a paso: autocompletado en cajas de texto”

Hacer drag & drop de ficheros fuera del navegador con Chrome

ByLuis

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);

Sólo disponible en Chrome

Drag out files like Gmail

Javascript Color Picker: selección de color estilo PhotoShop

ByLuis

Javascript Color Picker es un string que nos permite añadir un selector de color estilo Photoshop. Esta herramienta nos puede ser útil cuando queremos que el usuario seleccione un color, claro, que las ocasiones en las que lo podemos necesitar son bastante escasas.
colorpicker.png
A parte de las componentes HSV, también se puede utilizar las componentes RGB. Ha sido comprobado en IE5.5, IE6, IE7, FF2, Opera 9 y Safari 2.
Javascript Color Picker
Vía / dzone