Autocomplete usando Angularjs

Recientemente, por parte de requerimientos funcionales en un proyecto web en el cual me encuentro trabajando, se solicitó que se aplicara la funcionalidad de autocompletado para obtener información relevante como ciudades, oficinas bancarias y afines, de una forma que no fuera tan a la de listas desplegables, debido a la cantidad de información.

Echando un poco de lectura, encontré la librería Mass-Autocomplete, la cual permite programar un campo de texto con la posibilidad de mostrar un listado para precisamente autocompletar la información.

El enlace al final del presente post, contiene mayor información, así como ejemplos y formas de uso, específicamente, explico a continuación mi experiencia:

1. Marcado html en el formulario:
La librería mencionada funciona con etiquetas de entrada de texto, para usarlo, se aplicó lo siguiente para la preparación del campo de texto.

<div mass-autocomplete="{debounce_blur:700}">
 <input autocomplete-item="autocomplete_remote" type="text" />
</div>

2. Preparación lógica de consulta para autocompletado mediante ingreso de texto:
En javascript, específicamente en un controlador, se construyen las funciones que describen los llamados a consulta y los eventos asociados a la selección de información mediante el autocompletado.

Lo siguiente es un ejemplo de configuración:

 ... dentro de un controlador ...
var vm = this;
...
vm.autocomplete_remote = {
    suggest : function (texto){},
    on_error : console.log
    on_select : function(selected){}
};

En (1), se puede observar en el html una directiva (autocomplete-item), el cual hace referencia a la configuración de los llamados a consultas de tipo autocompletado, éste último,  cuentas con tres métodos:

- suggest: función que recibe el texto ingresado y ejecuta la consulta para autocompletar, dicha consulta puede controlar el número de caracteres ingresados.
- on_error: función que se encarga de guardar en log o de realizar operaciones relacionadas con el manejo de errores en la consulta.
- on_select: función de tipo callback que recibe el objeto seleccionado de la lista desplegable con los resultados de la consulta.

El resultado de haber aplicado la librería como dependencia al módulo angular de la aplicación web, y seguido las notas tanto en términos de html como de javascript, queda como se muestra en la siguiente imagen.


Demostración autompletado listado empresas

Aquí concluye la experiencia construyendo componentes de autocompletado usando angularjs, se comparte para efectos de proporcionar conocimiento y prácticas sobre el uso de librerías y herramientas afines que proveen respuesta a funcionalidades que ya han sido creadas, promover notas como DIY y dar a conocer experiencias relacionadas.


Hasta una próxima. 

---

Enlace Mass-Autocomplete : http://hakib.github.io/MassAutocomplete/

Obtain minor date differences between two dates using joda time

Good day,

I recently stumbled contents of blogs and articles on the internet, which shows an interesting fact about a simple metadata: the date and time of the publication of content / article / blog post.

Specifically, in an application that i'm developing, I've encountered the displaying the date difference between that content and the current date, as examples, the following:

"18 minutes ago"
"1 hour ago"
"3 weeks ago"
"5 months ago"

To find a way to make the time difference, I researched a few tutorials, but just gave me the difference in milliseconds to hours .. in my case, I needed to get the difference in number of weeks, days and years, and calculate them more clearly.

For exercise, I used the opensource joda-time library, which contains utilities to calculate difference in dates / times for each of the details that I need (hours, days, weeks, etc).

Additionally, the solution to develop, did not show for dates applied, all calculations using these differences found, I had to compare and find the smallest difference calculated, and the term (detail) of time applied to this data , could make the simplest representation of how much time has passed since the publication of content and friendlier.

The operation in detail is in github, and shared in case any of you ever need ideas.

There's a sample code that applies utility method (using java); and for mi exercise, the label mentioned in above examples, its updated using the calculations made for this utility.

Regards and good coding

Check the gist

Generate a hash using java with few lines of code (complete)

In my previous post, I shared a method for converting a text using hash algorithms such as MD5 and SHA-1 .. well, now, I share a utility in java that allows conversions using various algorithms.

see code

You hope you find it useful

Generate a hash using java with few lines of code

Below I share an snippet of code in Java language, which can generate with just 3 lines of code, a text using cryptographic hash functions SHA1 (Secure Hash Algorithm, Secure Hash Algorithm version 2)

public static String generate (String input) throws Exception {
  MessageDigest md = MessageDigest.getInstance ("SHA1");
  byte [] = md.digest digested (input.getBytes ());
  return new BigInteger (1, digested) .toString (16);
}


To use MD5, just change the string "SHA1" with "MD5"

more info:
SHA, Wikipedia
Standard Algorithm Name Documentation

hello-world

public static void main(String[] args) {
   System.out.println("Hello World!");
}