Interesante la manera de explicar de CollegeHumor, lo que son las redes sociales y algunos servicios en internet en base a simples operaciones matemáticas.

via College Humor

Fuente: CollegeHumor

via @ChicoGeek

Es realmente interesante de como se originaron los nombres de las empresas tecnológicas que conocemos hoy en día, tales como Apple, Microsoft, Cisco, Compaq y otros más.

Apple Computers La manzana era la fruta favorita de Steve Jobs - su fundador. Él estaba retrasado 3 meses en el trámite debido al nombre que le pondrían a su empresa, y él amenazó con llamarlo Apple Computers si sus otros colegas no sugerirían un nombre mejor antes de las 5 en punto.
CISCO No es un acrónimo como muchos creen. Es un nombre corto de San Francisco
Compaq El nombre fue compuesto al combinar COMp, de computadoras y PAQ para denotar un objeto integral pequeño.
Corel Derivó del nombre del fundador Dr. Michael Cowpland. Significaría COwpland REsearch Laboratory (Laboratorio de Investigación de Cowpland)
Google El nombre empezó como una broma para jactarse acerca de la cantidad de información que el buscador pudiera ser capaz de realizar. Originalmente llamado “Googol”, una palabra que representaba un número de 1 seguido de 100 ceros. Después de que los fundadores (Estudiantes graduados de Standford, Sergey Brin y Larry Page) presentaran su proyecto a un inversionista, ellos recibieron un cheque dirigido a “Google”.
Hotmail El fundador Jack Smith tuvo la idea de acceder al correo electrónico a través de la web desde una computadora en cualquier lugar del mundo. Cuando Sabeer Bhatia presentó el plan de negocio para el servicio de correo, él buscó una combinación de distintos nombres que terminen en “mail” y finalmente terminó con “Hotmail” debido a que incluía las letras que también componen a “HTML”. Por ello inicialmente lo referían como HoTMaiL haciéndo énfasis en las mayúsculas y minúsculas selectivas.
Hewlett Packard Bill Hewlett y Dave Packard lanzaron una moneda para ver cómo se iba llamar su compañía. O bien Hewlett-Packard ó Packard-Hewlett.
Intel Bob Noyce y Gordon Moore querían llamar a su compañía “Moore Noyce” pero ese nombre ya estaba registrado por una cadena hotelera, por lo cual optaron por un acrónimo de la palabra INTegrated ELectronics.
Lotus (notes) Mitch Kapor dio ese nombre a su compañía de “The Lotus Position” (La posición del Loto) ó “Padmasana” que es una postura  llamada comúnmente Loto en la disciplina yoga. Kapor solía ser un maestro de Yoga.
Microsoft Ideado por Bill Gates, acrónimo de MICROcomputer SOFTware. Originalmente con una raya intermedia “Micro-Soft” que más tarde lo quitarían.
Motorola El fundador Paul Galvin ideó ese nombre debido a que su compañía comenzó a fabricar radios para automóviles. El producto fue llamado “Motorola” una combinación de las palabras “Motor” y “Victrola” (tocadiscos)
ORACLE Larry Ellison y Bob Oats estuvieron trabajando en un proyecto de consultoría para la CIA (La Agencia Central de Inteligencia). El nombre código de ese proyecto era “Oracle” (la CIA la veía como un sistema al que se le ingresaba respuestas a todas sus preguntas o algo así). El proyecto fue diseñado para implementar el novísimo lenguaje SQL desarrollado por la IBM (Donald D. Chamberlin y Raymond F. Boyce). El proyecto fue cancelado, pero Larry y Bob decidieron continuar y terminarlo completamente y mostrarlo al mundo. Mantuvieron el nombre de Oracle para su RDBMS (Relational Data Base Management System). Más tarde mantuvieron el mismo nombre del software para la compañía.
Sony Originada de la palabra latín “Sonus” que significa sonido y también porque “Sonny” en el lenguaje coloquial americano significa “joven brillante”
SUN Fundada por 4 miembros de la Universidad de Stanford, SUN es un acrónimo de Stanford University Network. Andreas Bechtolsheim construyó un microcomputador; Vinod Khosla lo reclutó a él y a Scott McNealy para fabricar computadoras basadas en ella, y a Bill Joy para que desarrollase un Sistema Operativo basado en UNIX para esa computadora.
Yahoo! Palabra inventada por Jonathan Swift y utilizada en su libro “Los Viajes de Gulliver”. Representa a una persona que es repulsiva en apariencia y acciones, y apenas humano. Los fundadores de Yahoo!, Jerry Yang y David Filo eligieron ese nombre porque se consideraban a sí mismos unos “yahoos”

Las especificaciones HTML5 aún no están terminadas, pero ya hay muchos que están experimentando con ellas gracias a su incorporación en los navegadores.

Para realizar dibujos se utiliza el elemento <canvas> que permite que los navegadores que soporten esta nueva tecnología HTML (Safari, Chrome, Firefox, Opera, entre otros), pueda manipular los colores dinámicamente.

Canvas es un elemento que define una región (ancho x alto) en el documento HTML la misma que puede ser manipulada utilizando Javascript.

Harmony – Procedural Drawing Tool

Harmony – Procedural Drawing Tool es una herramienta para dibujar utilizando el mismo navegador aprovechando de las cualidades de HTML5.

Mr.doob o Ricardo Cabello, es un diseñador/desarrollador que creó esta sencilla pero modular herramienta de dibujo, pues es posible agregar más y más estilos de pinceles.

Durante el proceso de creación, Firefox y Opera no soportaron context.globalCompositeOperation = ‘darker’, aparentemente por falta de soporte en la aceleración de hardware.

Esa operación establece cómo son dibujadas las formas e imágenes sobre la imagen (mapa de bits) existente. La misma que fue removida de las especificaciones de HTML5 más tarde

Según dice Mr.doob, ya que eso hace posible ejecutar un fundido parecido a lo que realiza Photoshop (multiply).

En el vídeo pueden apreciar cómo funciona.

Y es posible guardar el dibujo creado en formato PNG.

Este es un dibujo que hice con esa herramienta, me tomó un rato hacerlo, una vez que le agarras el truco, se vuelve sencillo su uso:

Para probarlo, accedan a su sitio oficial.

Sketchpad 

Sketchpad es otra herramienta más profesional que el anterior, pues ofrece varias características que una aplicación de dibujo lo hace, tales como estilos de pincel (sólido, degradados, patrones), tipos de pincel (lápiz, pincel, caligrafía), texto, rellenado, selección, etc. Además también permite guardar la imagen.

Esta es una demostración de cómo se usa (source: youtube)

Sketchpad ya tiene un grupo en Flickr que muestra los dibujos realizados utilizando esta herramienta web.

SQL está presente en HTML5, el lenguaje de consultas estructuradas más utilizado ha sido incluido en HTML5 por el consorcio W3C, y está disponible en los navegadores basados en WebKit (Chrome, Safari) y  Opera, esperemos que Firefox lo haga pronto.

La implementación está enfocada en el cliente del usuario mas no en el servidor, es decir todo dato que se almacene se hará en el navegador del usuario.

Puede ser utilizada para almacenar correos electrónicos localmente para alguna aplicación webmail o para el carrito de compras en un sitio de ventas en línea. La interacción de la API y la Base de Datos es asíncrona lo cual asegura que la interfaz del usuario no sea afectada con retrasos. Y porque la interacción con las bases de datos pueden darse simultáneamente en múltiples ventanas, la API soporta transacciones.

Para crear un objeto de base de datos se utiliza la llamada a la función (método) openDatabase() en el objeto window. Se pasan cuatro parámetros: El nombre de la base de datos, la versión de la base de datos, un nombre a mostrar, y el tamaño estimado en bytes.

1 var db = openDatabase("notas","","Ejemplo de notas", 1048576);

Ahora, con esa instancia podemos utilizar el método transaction(). Este método toma uno a tres parámetros: un retrollamado (callback :  puntero a una función ) de transacción, otra función para error, y otra para un retrollamado de éxito. La primera función requiere que se le pasen objetos SQL transaction en el que se ha de ejecutar las consultas con executeSQL(). Éste último método toma de uno a cuatro parámetros: Una consulta SQL, parámetros, una función que se hará cargo de la llamada (callback), y otra función si se presenta errores. La función que se hará cargo de la llamada a executeSQL(), necesita de el objeto de transacción y el objeto resultante de la consulta SQL el cual da acceso a las filas, al último ID ingresado, etcétera.

El ejemplo de aplicación “notas” es como sigue:

 1 var html5 = {};
 2 html5.db = null;
 3 
 4 html5.open = function(){
 5     var dbsize = 1024 * 1024; //1MB
 6     html5.db = openDatabase("notas", "1.0", "Mis notas", dbsize);
 7 }
 8 html5.onError = function(tx, error){
 9     alert('Error :'+error.message);
10 }
11 html5.onSuccess = function(tx, rs){
12     // mostramos los datos nuevamente
13     html5.mostrarNotas(tx, rs);
14 }
15 html5.createTable = function(){
16     html5.db.transaction(function(tx){
17         tx.executeSql("CREATE TABLE IF NOT EXISTS notas(ID INTEGER PRIMARY KEY, titulo TEXT, cuerpo TEXT)", []);
18     });
19 }
20 html5.addNote = function(titulo, nota){
21     html5.db.transaction(function(tx){
22         tx.executeSql("INSERT INTO notas(titulo, cuerpo) VALUES(?,?)",[titulo, nota],html5.onSuccess,html5.onError);
23     });
24 }
25 html5.mostrarNotas = function(renderFunc){
26     html5.db.transaction(function(tx){
27         tx.executeSql("SELECT * FROM notas ORDER BY ID DESC",[],renderFunc, html5.onError);
28     });
29 }
30 function mostrarNotas(tx, rs){
31     var salida = "";
32     for(var i = 0; i < rs.rows.length; i++){
33         salida += mostrar(rs.rows.item(i));
34     }
35     var notas = document.getElementById('notas');
36     notas.innerHTML = salida;
37 }
38 function mostrar(fila){
39     return "<li>"+fila.titulo + " <a title='borrar nota' style='cursor:pointer;' onclick='html5.borrarNota("+fila.ID+");'>&#x2612;</a><p>"+fila.cuerpo+"</p></li>";
40 }
41 html5.borrarNota = function(id){
42     if(!confirm('Eliminar esta nota?'))return false;
43     html5.db.transaction(function(tx){
44         tx.executeSql("DELETE FROM notas WHERE ID=?",[id],mostrarNotas,html5.onError);
45     });
46     html5.mostrarNotas(mostrarNotas);    
47 }
48 function init(){
49     html5.open();
50     html5.createTable();
51     html5.mostrarNotas(mostrarNotas);    
52 }
53 function agregarNota(){
54     var titulo = document.getElementById('titulo');
55     var cuerpo= document.getElementById('cuerpo');
56     html5.addNote(titulo.value, cuerpo.value);
57     titulo.value = "";
58     cuerpo.value = "";
59     html5.mostrarNotas(mostrarNotas);    
60 }

Veamos qué hace cada una de ellas:

Creamos una ámbito al cual llamaremos html5 para utilizarla más cómodamente.

1 var html5 = {};
2 html5.db = null;

Luego le agregamos una función open() que nos permita abrir la base de datos.

1 html5.open = function(){
2     var dbsize = 1024 * 1024; //1MB
3     html5.db = openDatabase("notas", "1.0", "Mis notas", dbsize);
4 }

Esta función onError() mostrará en una caja de alerta el error que se presente:

1 html5.onError = function(tx, error){
2     alert('Error :'+error.message);
3 }

onSuccess será invocado cada vez que termine una consulta, siempre en cuando sea satisfactoria:

1 html5.onSuccess = function(tx, rs){
2     // mostramos los datos nuevamente
3     html5.mostrarNotas(tx, rs);
4 }

createTable nos permitirá crear la tabla si ésta aún no exista  :

1 html5.createTable = function(){
2     html5.db.transaction(function(tx){
3         tx.executeSql("CREATE TABLE IF NOT EXISTS notas(ID INTEGER PRIMARY KEY, titulo TEXT, cuerpo TEXT)", []);
4     });
5 }

addNote servirá para ingresar las notas, vea que se utiliza ? la misma que ha de ser reemplazada por los datos referidos entre corchetes “[]“:

1 html5.addNote = function(titulo, nota){
2     html5.db.transaction(function(tx){
3         tx.executeSql("INSERT INTO notas(titulo, cuerpo) VALUES(?,?)",[titulo, nota],html5.onSuccess,html5.onError);
4     });
5 }

mostrarNotas realiza la consulta que obtendrá los datos de la tabla notas:

1 html5.mostrarNotas = function(renderFunc){
2     html5.db.transaction(function(tx){
3         tx.executeSql("SELECT * FROM notas ORDER BY ID DESC",[],renderFunc, html5.onError);
4     });
5 }

Estas funciones “solas” que no pertenecen a var html5, procesa cada fila para poder generar una salida con formato, la misma que se muestra en el elemento div cuyo id es “notas”:

 1 function mostrarNotas(tx, rs){
 2     var salida = "";
 3     for(var i = 0; i < rs.rows.length; i++){
 4         salida += mostrar(rs.rows.item(i));
 5     }
 6     var notas = document.getElementById('notas');
 7     notas.innerHTML = salida;
 8 }
 9 function mostrar(fila){
10     return "<li>"+fila.titulo + " <a title='borrar nota' style='cursor:pointer;' onclick='html5.borrarNota("+fila.ID+");'>&#x2612;</a><p>"+fila.cuerpo+"</p></li>";
11 }

borrarNota se encargará de eliminar una nota en base al ID que corresponda:

1 html5.borrarNota = function(id){
2     if(!confirm('Eliminar esta nota?'))return false;
3     html5.db.transaction(function(tx){
4         tx.executeSql("DELETE FROM notas WHERE ID=?",[id],mostrarNotas,html5.onError);
5     });
6     html5.mostrarNotas(mostrarNotas);    
7 }

init() servirá para inicializar todo lo anterior, vemos que utilizando el ámbito var html5 el código es mucho más ordenado, init puede ser invocado al cargar el documento HTML (BODY) en respuesta al evento ONLOAD :

1 function init(){
2     html5.open();
3     html5.createTable();
4     html5.mostrarNotas(mostrarNotas);    
5 }

agregarNota() es una función que permite ingresar los valores de titulo y cuerpo en la tabla notas con addNote, pero es necesario notar que utiliza elementos cuyos IDs son titulo y cuerpo respectivamente, basta crear un botón cuyo evento ONCLICK llame a esta función:

1 function agregarNota(){
2     var titulo = document.getElementById('titulo');
3     var cuerpo= document.getElementById('cuerpo');
4     html5.addNote(titulo.value, cuerpo.value);
5     titulo.value = "";
6     cuerpo.value = "";
7     html5.mostrarNotas(mostrarNotas);    
8 }

Esta es una aplicación para Windows que permite visualizar y descargar mangas a tu PC.

Requerimientos: Conexión a internet directa (sin proxies por ahora)

El único inconveniente, LOS MANGAS ESTÁN EN INGLÉS.

Aquí las instrucciones para los que se pierden con mucha facilidad.

Primero: descargar el programa OneMangaReader y extraerlo en una carpeta vacía.

Luego hacer doble clic para ejecutar el programita.

A continuación les aparecerá una ventana como la de abajo. Como han de notar, no hay nada más que listas desplegables que no contienen nada.

El funcionamiento que lo hice, no pensando en ustedes sino en mí (disculpen), es el siguiente.

Primero hacen clic en Fetch de Manga list para obtener la lista de mangas disponibles desde el sitio del cual se sirve.

Verán la lista de los mangas disponibles y eligen un manga.

Luego como en el anterior paso se sigue de manera ordenada:

Hacen clic para Chapters y obtendrán la lista de capítulos publicados, eligen el capítulo a visualizar o descargar.

Y después la lista de páginas disponibles en tal capítulo.

Con el botón View se puede ver la página elegida  y también los botones [<] y [>] permiten ver la anterior o siguiente página respectivamente.

Y por último el botón Download, permite descargar todas esas páginas dentro de la carpeta desde donde se ha iniciado el programa.

Dentro de esa carpeta con el nombre del manga y ordenado por capítulos podrás leer el manga más cómodamente.

Me olvidaba, el botón GetAll permite descargar varios capítulos en lote, para ello primero se ubica desde qué capítulo iniciar (de abajo hacia arriba en la lista desplegable de Chapters).

NOTA: Siempre es bueno revisar dos veces como mínimo las descargas, ya que suele ocurrir que algunas páginas no son descargadas, eso depende de la velocidad de conexión. No se preocupe, si vuelve a descargar un capítulo ya descargado, solamente las páginas que no pudieron ser descargadas se obtendrán desde internet.

Espero les sirva, lo hice para mi uso personal, pero es mejor compartirlo.

Cualquier duda o queja, escríbanlas a Santa Claus.

Recomiendo usar el visor Viewer2 si cuentas con una tarjeta de vídeo decente.