miércoles, 16 de septiembre de 2015

como validar una entrada de texto con keypress y expresiones regulares sin morir en el intento.

    Percentage: {
        clazz: 'accepted-keys-percentage',
        event: 'keypress',
        regex: /^\d{1,2}(?:\.\d+)?$/,
        init: function () {
            var inputs = document.querySelectorAll('.' + AcceptedKeys.Percentage.clazz);
            for (var i = 0; i < inputs.length; i++) {
                var inp = inputs[i];
                inp.addEventListener(AcceptedKeys.Percentage.event, function (e) {
                    var k = e.charCode || e.keyCode || 0;
                    var futureValue = this.value + String.fromCharCode(k);
               
                    var accepts = false;
                    if(futureValue.match(AcceptedKeys.Percentage.regex)){
                        accepts = true;
                     }else if(AcceptedKeys.hasDot(futureValue)){
                        accepts = true;  
                     }else{
                         accepts = false;
                     }
                    if(!accepts){                      
                        e.returnValue = false;
                        e.preventDefault();
                    }
                }, false);
            }
        }
    },

jueves, 25 de septiembre de 2014

Como configurar resaltador de sintaxis en blogger

  1. En primer lugar, tener una copia de seguridad de su plantilla Blogger
  2. Después de que abra su plantilla de blogger (En el modo de Edición  HTML)  copiar todo el css dado en este enlace antes de la etiqueta </ b: skin> 
  3. Pegar el siguiente código antes de la etiqueta  </ head>.  Recuerda omitir los lenguajes de programación que no necesites.
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
    <script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>
  4. Pegar el siguiente código antes de la etiqueta </ body>.
    <script language='javascript'>
    dp.SyntaxHighlighter.BloggerMode();
    dp.SyntaxHighlighter.HighlightAll('code');
    </script>
  5. Guardar la plantilla del blogger
  6. Ahora el resaltado de sintaxis está listo para usarse con la etiqueta <pre> </ pre> 
    <pre name="code">
    ...Your html-escaped code goes here...
    </pre>
    
    <pre name="code" class="java">
    public class Person { 
        private String firstName, lastName, job, gender;
        private int salary, age;
    }
    </pre>
  7. Puedes escapar tu código aqui
  8. Acá esta la lista de los lenguajes soportados por el atributo <class>

Tabla con Cabecera estática, Cuerpo con Scroll Vertical y Responsive

Estaba trabajando con Richfaces en un proyecto, cuando uno de los clientes pido un requerimiento especial para mostrar datos en un tabla y a su vez poder desplegar de cada fila una nueva tabla con los detalles de esta, y al vez tenia que ser Responsive ya que la aplicación puede ser accedida desde cualquier dispositivo. Vaya sorpresa cuando me di cuenta que Richfaces no tenia soporte para este componente, así que me puse en la tarea de desarrollarlo, en fin... uno de los problemas que me toco solucionar, fue hacer la cabecera de la tabla estática, y poder hacer scroll con el body y a la ves que la tabla fuera responsive , bueno vamos al código.

Primero tenemos nuestro html

<table>
    <thead>
        <tr>
            <th>Item #</th>
            <th>Description</th>
            <th>Quantity</th>
            <th>Price Unit</th>
            <th>Price Total</th>
        </tr>
    </thead>
    <tbody>
        <!--!important -->
        <tr >
            <td colspan="5"></td>
        </tr>
        <tr>
            <td>1</td>
            <td>Prod A1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Prod B1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Prod C1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>4</td>
            <td>Prod D1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>5</td>
            <td>Prod A1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>6</td>
            <td>Prod B1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>7</td>
            <td>Prod C1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
        <tr>
            <td>8</td>
            <td>Prod D1</td>
            <td>5</td>
            <td>USD 3.00</td>
            <td>USD 15.00</td>
        </tr>
    </tbody>
</table>

El css


table{
    border-spacing: 0;
    display: flex;/*Se ajuste dinamicamente al tamano del dispositivo**/
    max-height: 40vh; /*El alto que necesitemos**/
    overflow-y: auto; /**El scroll verticalmente cuando sea necesario*/
    overflow-x: hidden;/*Sin scroll horizontal*/
    table-layout: fixed;/**Forzamos a que las filas tenga el mismo ancho**/
    width: 98vw; /*El ancho que necesitemos*/
    border:1px solid gray;
}

thead{
    background-color: #f1eee9;
    position: fixed !important;/*el thead va ser siempre estatico**/
}

th{
    border-bottom: 1px solid #c4c0c9;
    border-right: 1px solid #c4c0c9;
}

th,td{
    font-weight: normal;
    margin: 0;
    max-width: 18.5vw; /**Ancho por celda*/
    min-width: 18.5vw;/**Ancho por celda*/
    word-wrap: break-word;/*Si el contenido supera el tamano, adiciona a una nueve linea**/
    font-size: 11px;
    height: 3.5vh !important;/*El mismo alto para todas las celdas**/
    padding: 4px;
    border-right: 1px solid #c4c0c9;
}
tr:nth-child(2n) {
    background: none repeat scroll 0 0 #edebeb;
}   

Como podemos ver es un código muy sencillo, el truco esta en:
  1. Hacer la etiqueta <thead> con position fixed, para que el contenido siempre este estático
  2. Al poner el <thead> fixed, sobrepone la primera fila dentro de la etiqueta <tbody>, es decir el primer tr, entonces para no perder el primer registro usamos la primera fila (<tr>) vacia con un colspan igual al total de columnas, con el fin de que la hacer el head fixed, se sobreponga sobre la fila vacía y no perdamos ningún registro importante.
  3. Aseguramos de que todas las celdas tenga el mismo alto.
  4. Asegurarnos que las columnas tenga el mismo ancho.
  5. En este caso he usado las medidas viewport en lugar de porcentajes, también he usado la tabla con un alto máximo.
  6. Puedes ver el demo aquí.
Espero que les sirva, recuerden comentar, y si tienen preguntas, también.

martes, 3 de junio de 2014

Crear instalador con Visual Studio 2013 Y C#

Como crear un instalador para nuestros proyectos con Visual Studio 2013 y C#

Descarga el proyecto completo desde github:
InstaladorVs

lunes, 26 de mayo de 2014

Un algoritmo aumenta el número de retuits en un 600%

La fórmula es capaz de detectar a los usuarios más predispuestos a reproducir estos micro-mensajes.
Si envías un tuit a un extraño y le pides que lo retuitee, probablemente no te sorprenderá que te ignore por completo. Pero si envías muchos tuits de ese tipo, algunos podrían acabar siendo reenviados.

¿Por qué? ¿Qué hace que alguien retuitee la información de un extraño? Esa es la pregunta que se plantean Kyumin Lee desde la Universidad Estatal de Utah en Logan y varios colegas del centro de investigación Almaden de IBM en San José (todos, en EEUU).

El equipo asegura que mediante el estudio de las características de los usuarios de Twitter, es posible identificar a extraños con más probabilidades de transmitir tus mensajes a otros usuarios. Y gracias a ello, los investigadores señalan haber sido capaces de mejorar la tasa de retuiteo de mensajes enviados por extraños hasta en un 680%.

¿Cómo lo han hecho? La nueva técnica se basa en la idea de que algunas personas son más propensas a tuitear que otras, sobre todo con ciertos temas y en determinados momentos del día. Así que el truco es encontrar a estos individuos y dirigirse a ellos en el momento en que probablemente sean más eficaces.

El método fue bastante sencillo. La idea era estudiar a individuos en Twitter, examinar sus perfiles y su comportamiento pasado en cuanto al envío de tuits y buscar pistas que indicasen que son más propensos a retuitear ciertos tipos de información. Una vez que encuentras a estas personas, les envías tus tuits.

Esa es la teoría. En la práctica, es un poco más complicado. Lee y su equipo quisieron probar la respuesta de la gente a dos tipos de información: noticias locales (en San Francisco) y tuits sobre la gripe aviar, que era un problema importante cuando estaban llevando a cabo la investigación. Crearon varias cuentas de Twitter con unos cuantos seguidores, específicamente para transmitir este tipo de información.

A continuación, seleccionaron a las personas que recibirían sus tuits. Para los envíos de noticias locales, buscaron a usuarios de Twitter geolocalizados en el área de la Bahía: encontraron más de 34.000 y eligieron a 1.900 de forma aleatoria.

A continuación, enviaron el mismo mensaje a cada usuario del formato:

"@SFtargetuser "Un hombre murió y otros tres resultaron heridos en un tiroteo ... http://bit.ly/KOl2sC" Pfv RT esta noticia sobre seguridad"

El tuit incluía el nombre del usuario, un titular corto, un enlace a la historia y una solicitud de retuiteo.

De estas 1.900 personas, 52 retuitearon el mensaje recibido. Eso supone una tasa del 2,8%.

Para la información de la gripe aviar, los investigadores buscaron personas que ya hubieran tuiteado sobre la gripe. Encontraron 13.000 y eligieron a 1.900 al azar. De ellas, 155 retuitearon el mensaje recibido, lo que supone una tasa de retuiteo del 8,4 %.

Pero Lee y compañía encontraron una forma de mejorar significativamente estos porcentajes. Volvieron a las listas originales de usuarios de Twitter y recogieron información pública disponible sobre cada uno de ellos, como su perfil personal, el número de seguidores, la gente a la que siguen, sus 200 tuits más recientes y si retuitearon o no el mensaje que habían recibido.

A continuación, el equipo utilizó un algoritmo de aprendizaje automático para buscar correlaciones en esos datos que pudieran predecir si alguien tenía más probabilidades de retuitear. Por ejemplo, se analizó si las personas con cuentas más antiguas eran más propensas a retuitear, o cómo la proporción entre amigos y seguidores influía en la probabilidad de retuiteo, o incluso si había algún vínculo relacionado con los tipos de palabras negativas o positivas utilizadas en tuits anteriores. También analizaron en momento del día en que la gente tuiteaba de forma más activa.

El resultado fue un algoritmo de aprendizaje de máquina capaz de captar usuarios con más probabilidades de retuitear un tema en particular.

Y los resultados muestran que es sorprendentemente eficaz. Cuando el equipo envió tuits de información local a las personas identificadas por el algoritmo, el 13,3% la retuiteó, en comparación con sólo el 2,6% de las personas escogidas al azar.

Y consiguieron incluso mejores resultados cuando enviaron la solicitud en los momentos del día en los que la gente había mostrado ser más activa en el pasado. En ese caso, la tasa de retuiteo se elevó al 19,3%. Eso supone una mejora de más del 600%.

Del mismo modo, la tasa relacionada con la información sobre la gripe aviar se elevó del 8,3% con usuarios elegidos al azar a un 19,7% con usuarios elegidos por el algoritmo.

Este es un resultado significativo que despertará la envidia de responsables de marketing, políticos y organizaciones de noticias.

Una cuestión interesante es cómo hacer que esta técnica pueda aplicarse de forma más general. Plantea la posibilidad de una aplicación que permita a cualquier persona introducir un tema de interés y crear una lista de usuarios con más probabilidades de retuitear ese tema durante las próximas horas.

Lee y su equipo no han comentando ningún plan al respecto. Pero si no le sacan partido, seguramente habrá otros que sí lo hagan.

Adjunto articulo completo:

domingo, 25 de mayo de 2014

Tema windows para informáticos y electrónicos.

Si estas cansado de los mismos temas de fondo de escritorio para Windows, te comparto dos interesantes temas.
Tema para informáticos y electrónicos:
Tema del universo con fotos en HD tomadas por la nasa:

Ubuntu en la supercomputadora más rápida del mundo

Así como Forbes nos da una lista de los más millonarios de los millonarios, en el mundo del cómputo hay listas de las supercomputadoras más rápidas del planeta. Hoy por hoy la Tianhe-2, de la República Popular China, es la máquina más veloz sobre el planeta, que se encuentra en el Centro Nacional de Supercomputación de Guangzho y para sorpresa de quizás alguno, utiliza una versión especial de Ubuntu.
Todos sabemos que los sistemas operativos con sabor a Unix son los preferidos en estas máquinas pero evidentemente muchos son escritos por el fabricante. Sin embargo, en este caso Canonical (los creadores de la versión Linux Ubuntu), en colaboración con la Universidad Nacional de Defensa de China, buscan construir la nube más rápida del planeta, con Ubuntu Server, OpenStack y Juju.
La máquina Tianhe-2 tiene un rendimiento de 33.86 petaflops (33,86 x 10^13 operaciones de punto flotante por seg.), y en teoría podría llegar a un pico de 54.9 petaFLOPS. Esta cifra la hace la máquina más rápida del mundo. Tiene 16 mil nodos, cada uno con dos procesadores Intel Xeon IvyBridge E5-2692 (12 núcleos, a 2.2 GHz) y tres procesadores Intel Xeon Phi 31S1P (57 núcleos, a 1.1 GHz), lo cual da un total de 3,120,000 núcleos de computación.
Su capacidad de almacenamiento no parece quedarse atrás. Puede almacenar 12,4 PB, con una memoria para el sistema  1,375 TiB (1.34 PiB) y usa el sistema operativo Kylin Linux, el cual es estrictamente el Ubuntu chino. Está en un cuarto que ocupa  720 m² y se calcula que ha costado entre 200 y 300 millones de dólares.