Posts etiquetados ‘JavaScript’

Boomerang es una pieza de código JavaScript, que puedes añadir a un sitio Web, que le permitirá medir el rendimiento del sitio desde el punto de vista del usuario final. Boomerang envía los datos de vuelta al servidor para un posterior análisis. Gracias a este script podrás conocer exactamente que tan rápido piensan tus visitantes que es tu sitio Web.

Boomerang nos permite medir la demora de carga de un contenido dinámicamente, el ancho de banda, latencia HTTP y DNS, entre otros parámetros.

Otra observación a tener en cuenta es que Boomerang es opensource.

Muchas veces nos centramos en la optimizacíon del lado del servidor, pero nos olvidamos de otros aspectos que son más directos en el lado del cliente, así que sin lugar a duda este script te ayudará en la optimización de ambas partes.

Enlace: Boomerang

Enlace: Measures Performance of Websites From End User’s View (Vía WebAppers)

Descarga: zip o Tarball, código fuente

Galactic Plunder es un juego que ha sido escrito en Javascript, utilizando la funcionalidad Canvas y Audio en HTML5.

No es necesario Flash ni plugins de Java para jugar Galactic Plunder y es compatible con navegadores como Firefox, Chrome y Opera.

Por el momento, solo se encuentra el primer nivel completo, y el segundo está en desarrollo. Todo el código fuentes está bajo licencia abierta, se puede reutilizar libremente para cualquier fin y no te olvides de dar los créditos a su autor DougX.Net.

De acuerdo al autor, este juego sólo es una prueba para demostrar que un juego de disparos, puede ser hecho sin el uso de Flash.

Para ir al juego puedes dar click aquí.

Vía: Slashdot

Si Google por un lado trabaja en la integración de Flash a su navegador, por otro lado se empeña en llevar la experiencia de los juegos al iPad, con la ayuda de HTML5.

Para tener los juegos en linea es necesario la ayuda de ciertos plugins como Flash o Java, pero los ingenieros del equipo de Google Web Toolkit (GWT), demostraron el potencial de HTML5, llevando el clásico juego Quake II al navegador con la ayuda de  Google Web Toolkit para hacer una compilación en JavaScript.

En el vídeo más arriba podrán ver un juego de 30fps sin usar ningún plugin.

Sin lugar a duda se abre otro episodio en la batalla Flash vs HTML5.

Enlace: Demo

El vídeo de arriba muestra un escena simple desarrollada en Blender y exportado a GLGE, para ser usado en un navegador con capacidades WebGL.

GLGE es una librería JavaScript que facilita el uso de WebGL, es básicamente una API creada en JavaScript, que permite acceso directo a  openGL ES2, permitiendo el uso de aplicaciones de hardware con aceleradoras gráficas 2D/3D, sin necesidad de instalar plugins adicionales.

El objetivo de GLGE es permitir a los desarrolladores Web usar WebGL de forma fácil y rápida.

Enlace: GLGE (Vía Ajaxian)

En este vídeo veremos el trabajo con imágenes y textos gráficos, como hacer que el contenido se muestre de la forma adecuada a los usuarios, y que al mismo tiempo el contenido sea rastreado por los buscadores.

Veremos diferentes técnicas para lograrlo, como el uso de Flash, JavaScript y PHP, y veremos un ejemplo con el uso de Flash y sIFR, que sin duda es una solución muy adecuada.

Todo se ve en poco más de 13 minutos y en el siguiente vídeo empezaremos con HTML amigable a los buscadores.

Descargar ejemplo

jQuery Tools es una librería UI, que reune una colección de las más comunes interfases para usuario usadas en los desarrollos de los sitios Web actuales.

jQuery Tools como su nombre lo indica utiliza la librería jQuery como núcleo central de su funcionamiento, jQuery Tools se centra fundamentalmente en cuatro aspectos que son:

• Las partes esenciales que debe llevar una aplicación Web 2.0, haciendo énfasis principalmente en su diferenciación de las aplicaciones de escritorio.
• El tamaño y desempeño, ya que la librería pesa tan solo 5.8 KB hace énfasis en la Red de Entrega de Contenidos “Content Delivery Network (CDN)”.
• Facilidad de uso ya que no requieres de ser un programador para usar esta librería, y sacarle gran provecho.
• La posibilidad de ampliación, ya que se puede modificar el funcionamiento de la librería para lograr otros comportamientos más a medida. Separa el CSS del código lo que lo hace bastante fácil de aplicar sin conocimientos avanzados.

La librería es constantemente soportada por lo que se actualiza con frecuencia, además cuenta con gran número de Demos de su uso lo que muestra su potencial, así como tiene una muy buena documentación.

Desde el área de descarga puedes bajar herramientas por separado o todo el conjunto similar a jQueryUI, cuenta con herramientas para el trabajo con Tabs, Tooltips, Expose, Overlay, Scroll, FlashEmbed y jQuery toosl y Flowplayer.

Leer el resto de la entrada »

Placemaker es un Webservice creado por Yahoo, que lo que hace es analizar un texto definido en HTML o en una URL y regresa toda la localización geográfica, suena bastante bien, pero la API solo acepta valores POST y cuenta con datos como XML y RSS. Tendrás que usar un servicio proxy que no es tan difícil de lograr mediante cURL y PHP como se explica aquí pero igual puede causar dificultades.

JS-Placemaker es un corto código creado en JavaScript que facilita enormemente el trabajo con la API de Placemarker, solo debes pedir ID para Placemaker y así crea su aplicación que puede ser hospedada por usted mismo.

Aquí puedes ver el demo y su uso.

Como usar:

Pedir ID para Placemaker

Incluir JSPlacemaker.js en el documento y sobreescribir con sus datos de la appID

Placemaker.config.appID = YOUR_APP_ID;
Placemaker.getPlaces(text,callback,locale);

text: Texto para analizar.

callback: Función que se llama cuando la localización ha sido encontrada.

locale (optiona): Localización ej. es_ES

Ejemplo una llamada a JS-Placemarker responde un objeto.

Placemaker.getPlaces('Hi I am Chris, I live in London.
Originally I am from Germany',
function(o){
  console.log(o);
},
'en-uk');

Si la respuesta cuenta con varias opciones se vería así:

Si usted define la localización, puede usar otros idiomas

Placemaker.getPlaces('Hallo ich bin der Christian und komme aus
Schweinfurt in Deutschland. Leben tu ich allerdings in England',
function(o){
  console.log(o);
},
'de-de');

Enlace: JS-Placemarker

Enlace: JSPlacemaker.js (Descargar script)

Enlace: JSPlacemarker – Geo data extraction in pure JavaScript (Vía ajaxian)

jquery Fancy Gestures es un plugin jQuery, que permite habilitar el uso de gestos complejos del ratón como letras, alfabetos y sus gestos personalizados en cualquier sitio Web.

Por medio de este plugin se puede recibir entradas en sus sitios Web como si de un smartphone se tratase, y de esta forma podemos dar muchos usos a nuestras aplicaciones como captchas, firmas, dibujos, etc. todo dependerá de nuestra imaginación.

Características:

1. Crear sus gestos personalizados.
2. Crear múltiples entradas donde aceptar gestos.
3. Previsualización.
4. Trabaja con la mayoría de navegadores.

Aquí puedes ver un Demo.

Requerimientos:

1. jQuery
2. Walter Zorn’s VectorGraphics Library

El plugin esta bajo una licencia MIT, lo que nos permite darle un uso libre.

Enlace: Descargar plugin

Enlace: jQuery fancy gestures (Documentación)

Tooltips Flash con jQuery

Navegando la Web me encuentro que Peter Goodman, creo un Plugin para jQuery que permite poner contenido Flash dentro de los tooltips.

Desde aquí puedes bajar el plugin y el ejemplo completo para usarlo, incluye el ActionScript.

jQuery Flash Plugin

Otro plugin bastante bueno, que permite de una forma sencilla pero poderosa, agregar contenido Flash mediante jQuery, permitiendo agregar vídeos de Youtube, reproductores mp3, etc de forma sencilla.

Basta con agregar unas lineas como estas:

$('#hello').flash({
    src: 'hello.swf',
    width: 320,
    height: 240
});

Enlace: jQuery Flash Plugin

Enlace: Flash tooltips using jQuery

Sin lugar a duda se le esta sacando todo el potencial a JavaScript, ahora james Hall esta creando jsPDF es un script en javaScript que genera PDFs, se puede usar como URI, del lado del servidor o como extensión para un navegador. De momento solo soporta simple texto pero su autor dice que esta trabajando para dar soporte a mágenes y embebido de fuentes.

El demo funciona perfectamente con Safari u Opera.

Enlace: Ver Demo (De preferencia usar Safari)

Enlace: jsPDF