Archive for the ‘How to’ Category

Java: cómo ordenar un Map

Thursday, August 12th, 2010

El siguiente código muestra los pasos más sencillos para un ordenar un mapa (java.util.Map) en Java:

public class SortMapExample{

   public static void main(String[] args) {

	System.out.println("Unsort Map......");
	Map<String,String> unsortMap = new HashMap<String,String>();
	unsortMap.put("1", "1");
	unsortMap.put("2", "A");
	unsortMap.put("3", "2");
	unsortMap.put("4", "B");
	unsortMap.put("5", "C");
	unsortMap.put("6", "c");
	unsortMap.put("7", "b");
	unsortMap.put("8", "a");

	Iterator iterator=unsortMap.entrySet().iterator();

        for (Map.Entry entry : unsortMap.entrySet()) {
        	System.out.println("Key : " + entry.getKey()
       			+ " Value : " + entry.getValue());
        }

        System.out.println("Sorted Map......");
        Map<String,String> sortedMap =  sortByComparator(unsortMap);

        for (Map.Entry entry : sortedMap.entrySet()) {
        	System.out.println("Key : " + entry.getKey()
       			+ " Value : " + entry.getValue());
        }
   }

   private static Map sortByComparator(Map unsortMap) {

        List list = new LinkedList(unsortMap.entrySet());

        //sort list based on comparator
        Collections.sort(list, new Comparator() {
             public int compare(Object o1, Object o2) {
	           return ((Comparable) ((Map.Entry) (o1)).getValue())
	           .compareTo(((Map.Entry) (o2)).getValue());
             }
	});

        //put sorted list into map again
	Map sortedMap = new LinkedHashMap();
	for (Iterator it = list.iterator(); it.hasNext();) {
	     Map.Entry entry = (Map.Entry)it.next();
	     sortedMap.put(entry.getKey(), entry.getValue());
	}
	return sortedMap;
   }
}

El algoritmo implica las siguientes transformaciones:

Map –> List –> Order List –> Map

A priori, no parece que sea un algoritmo muy optimizado. ¿Alguna sugerencia para mejorar el rendimiento?

Vía | http://www.mkyong.com


CSS: resetear los estilos de navegador por defecto

Wednesday, July 7th, 2010

La siguiente hoja CSS permite resetear los estilos por defecto del navegador que estés usando. Con esto podemos evitar las inconsistencias en la presentación del sitio web en distintos navegadores.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}

Vía | http://www.webspeaks.in


Crear elementos DOM – HTML dinámicamente usando jQuery

Monday, May 10th, 2010

Echando un vistazo a este artículo sobre cómo añadir un objeto iframe dinámicamente, veo que la técnica es válida para cualquier objeto HTML que queramos añadir al DOM.

El código para crear un elemento iframe sería:


$('<iframe />');

También podemos crearlo con atributos:


$('<iframe id="myFrame" name="myFrame">');

Para terminar, podemos insertarlo en el DOM:


$('<iframe id="myFrame" name="myFrame">')
   .appendTo('body');

El contenido del iframe se fija a través de su atributo “source”:

$('<iframe />')
   .attr('src', 'http://www.google.com');

En los comentarios del mismo artículo, alguien sugiere, además, esta otra manera de hacerlo:


$('<iframe />', {
   name: 'myFrame',
   id:   'myFrame',
   ...
}).appendTo('body');

Personalmente, prefiero la segunda…

Vía | http://www.itrickz.co.cc


Usar jQuery para comprobar si existe un elemento

Friday, May 7th, 2010

Tal como dice la especificación, la propiedad “length” en  jQuery devuelve la cantidad de objetos que responden al selector utilizado.

De manera que podemos utilizar el código:

$("#id").length

para determinar si existe algún elemento con el identificador “id” en el DOM.

Ejemplo de código:

if ($("#id").length) {
   $("#id").text("Hello!");
}

Vía | http://eisabainyo.net


Cómo realizar una petición AJAX usando jQuery

Thursday, May 6th, 2010

Podemos utilizar jQuery para realizar peticiones AJAX a un servidor y actualizar el contenido web dinámicamente.

Este es el código que necesitamos para hacer un GET:

$.get("profile.php", { username: "rob" },
   function(response){
      // put the HTML content of profile.php into a div with id = "profile_page"
      $("#profile_page").html(response);
   }
);

Este código realiza una petición de tipo “GET” al mismo servidor en que se encuentra la página cargada, con un único parámetro “uername”, y utiliza el HTML devuelto para construir el contenido de un elemento cuyo identificador es “profile_page”.

De la misma manera podemos hacer una petición “POST”:

$.post("login.php", { username: "rob", password: "secret" },
   function(response){
      if (response == "good"){
         alert("You have logged in successfully.");
      }else{
         alert("Invalid username/password");
      }
   }
);

En este caso, la respuesta será “good” si el login se ejecutó correctamente.

Vía | http://lovehateubuntu.blogspot.com


AJAX + jQuery: elementos HTML dinámicos

Tuesday, April 6th, 2010

Existe un plugin para jQuery que permite manejar eventos que se producen sobre elementos HTML añadidos dinámicamente (por ejemplo, después de una petición AJAX).

El plugin se llama “live query“. Veamos un ejemplo sencillo.

Supongamos que partimos del siguiente código:

$(document).ready(function() {
   $(".content").hover(
      function() {
         $(this).stop().animate({paddingLeft: '+100px'}, 1000);
      }
     ,function() {
         $(this).stop().animate({paddingLeft: '10px'}, 1000);
      });
   });

Para aplicarlo a elementos añadidos dinámicamente tendríamos que ejecutar el código:

function callWheneverTheElementsAreLoaded() {
   $(".content").livequery(function() {
      $(this).hover(
         function() {
            $(this).stop().animate({paddingLeft: '+100px'}, 1000);
         }
        ,function() {
            $(this).stop().animate({paddingLeft: '10px'}, 1000);
         });
      },
      function() {
         // unbind the mouseover and mouseout events
         $(this)
            .unbind('mouseover')
            .unbind('mouseout');
      });
}

tras la adición de los mismos al HTML.

Nótese que la llamada a livequery admite dos parámetros:

  1. función callback que queremos añadir a los elementos nuevos
  2. función callback a ejecutar cuando los elementos sean eliminados

Nota: por supuesto, es necesario añadir la librería live query al html después de la librería jQuery:

<!doctype html>
<html>
<head>
<script type="text/javascript" src="scripts/jquery-1.4.2.min.js">
</script>
<script type="text/javascript" src="scripts/jquery.livequery-1.1.1/jquery.livequery.min.js">
</script>
etc...

personalizando para cada caso los paths y/o nombres de ficheros, etc.

$(document).ready(function() {
$(”.content”).hover(
function() {
$(this).stop().animate({paddingLeft: ‘+100px’}, 1000);
}
,function() {
$(this).stop().animate({paddingLeft: ‘10px’}, 1000);
});
})

AJAX: Convertir HTML a objeto DOM

Tuesday, March 30th, 2010

Podemos convertir una respuesta en HTML (text/html) a un objeto DOM XML (text/xml) usando el siguiente código JavaScript:

<!doctype html>
<html>
   <head>
   </head>
   <body onload="init();">
      <script language="JavaScript">

/**
 * ilikeblues.com (C)
 */

var req = new XMLHttpRequest();

function loaded() {
      var text = req.responseText;

      var domObject = (new DOMParser()).parseFromString(text, "text/xml");
      /* do with DOM object whatever you want... */
      domObject.getElementsByTagName("loquesea");
      ...
}

function init() {
   var url = "http://loquesea.com";

   req.open("GET", url, true);

   req.onload = loaded;
   req.send(null);
}

      </script>
   </body>
</html>

Aplicación Offline para iPhone

Monday, March 29th, 2010

Ya son varios los artículos que he leído acerca del tema de creación de aplicaciones Web Offline para iPhone  (aquí el último) y, generalmente, dejan de lado un tema importante, obviándolo o dándolo por supuesto, que suele dar quebraderos de cabeza (al menos a mí me los ha dado).

El tema es que, es imprescindible configurar correctamente el servidor en que está colgada la aplicación para que, al cargarla en el iPhone, éste la “cachee” adecuadamente.

El “quid”: el fichero declarado como manifest debe ser interpretado por el servidor con el MIME type “text/cache-manifest”. En otro caso, por ejemplo “text/plain”, al intentar abrir la aplicación en ausencia de conexión, obtendremos un error.

Si el servidor es Apache (no conozco ninguno más, al fin y al cabo, soy desarrollador, no administrador) es relativamente sencillo. Necesitamos un fichero .htaccess en la misma carpeta en que se encuentre la aplicación, con el sigueinte contenido:

AddType text/cache-manifest .manifest

Por supuesto el fichero manifest deberá tener la extensión “.manifest”, en otro caso la directiva no sirve para nada.

Además, el servidor Apache debe estar correctamente configurado para que interprete nuestro fichero .htaccess.


Conexión a Base de Datos Safari-JavaScript

Monday, October 19th, 2009

Para realizar la conexión a una base de datos  mediante Javascript, podemos utilizar el siguiente código:

try {
   if (!window.openDatabase) {
      alert('not supported');
   } else {
      var shortName = 'mydatabase';
      var version = '1.0';
      var displayName = 'My Important Database';
      var maxSize = 65536; // in bytes
      var mydb = openDatabase(shortName, version, displayName, maxSize);

      // You should have a database instance in mydb.
   }
} catch(e) {
   // Error handling code goes here.
   if (e == 2) {
      // Version number mismatch.
      alert("Invalid database version.");
   } else {
      alert("Unknown error "+e+".");
   }
   return;
}

alert("Database is: "+mydb);

Con esto, sin más que implementar las transacciones necesarias, podemos hacer persistente la información cargada durante la sesión para su uso posterior.

Estas bases de datos se pueden utilizar para la implementación de aplicaciones Offline mediante Safari.

Para eliminar estas bases de datos creadas por aplicaciones web, basta con ir a la sección “Safari” de los ajustes del iPhone.

Vía: Safari Client-Side Storage and Offline Applications Programming Guide


iPhone SDK: Registrar una clase como observador de un evento

Monday, July 6th, 2009
[[NSNotificationCenter defaultCenter]
      addObserver:self
      selector:@selector(onDataChangeEvent:)
      name:@"dataChangeEvent"
      object:nil];

La clase que contiene este código:

  1. Recibirá notificaciones de disparo del evento “dataChangeEvent”.
  2. Debe implementar el método “onDataChagneEvent”.

Cuando algún otro objeto dispare el evento, las instancias de esta clase recibirán la notificación y ejecutarán el método especificado.


Get Adobe Flash playerPlugin by wpburn.com wordpress themes