CSS: Añadir un estilo a tu plantilla Blogger

Como todo buen informático me gusta hacer las cosas una vez y en un único sitio, y no que para un cambio que quiera hacer tenga que ir recorriendo todo el trabajo hecho hasta la fecha...

Aquí voy a deciros como crear un estilo de clase para que podáis dar formato a una parte repetitiva de vuestras entradas. Es lo que yo uso cuando pongo código:

Esto es un ejemplo de una capa con texto usando la clase "codigo"; cuando escribo la entrada lo escribo normal y lo único que hago es asignarle la clase CSS "codigo" a la etiqueta div que lo contiene.

Para poder hacer esto primero tenéis que saber un poco de CSS para:

• Crear el código del estilo que queréis conseguir.
• Rebuscar entre el código fuente de una web en la que habéis visto algo que os gusta y ver su estilo para sacarlo (siempre que no este protegida su autoría, lo cual me parecería muy extraño pero cosas mas raras se han visto... como que no se puedan vender teléfonos con los bordes redondeados y una gran pantalla según las patentes de Apple... lamentable).
• Utilizar estilos CSS disponibles en Internet. En muchas páginas de diseño hay variedad de estilos gratuitos para elegir.

Una vez tengáis el código de vuestro estilo debéis ir a "Plantilla" y donde se ve la miniatura de vuestro blog actual le dais a "Personalizar".
Elegimos la opción "Avanzado" y vamos al final de la lista de todos los elementos hasta "Añadir CSS". Esta opción nos permite añadir código CSS propio a vuestra plantilla. En mi caso para el estilo que uso para el código utilizo lo siguiente:

.codigo {align: center; background-color: purple; border-color: #660066; border-style: solid; color: white; font-family: Courier; line-height: 24px; margin-left: 2%; padding: 5px 15px 5px 15px; width: 90%;}

Así ya podéis llamar al estilo de clase "codigo" para que os formatee el elemento que queráis. La forma más fácil es incluir vuestro texto en una capa "div" y otorgar a su atributo "class" el valor del nombre de vuestro nuevo estilo.

Por otra parte podéis modificar el código CSS de otras partes de vuestra plantilla. En mi caso utilizo actualmente estas:

.content {margin-top:-50px;}
.post-body h2 {text-transform: uppercase; font-size: 140%; color: #0d009c; text-align: left;}
.post-body img {box-shadow: 0 0 1em 0.3em #999999;}
.post-body {text-align: justify;}

• La primera ajusta el blog para que al desactivar la barra de navegación de blogger no se me quede el hueco en blanco arriba.
• La segunda hace que los encabezados que están dentro de cada entrada estén en mayúsculas, con una fuente mayor y de otro color al resto y alineados a la izquierda (en vez de justificados).
• La tercera produce una sombra gris centrada en las imágenes que están dentro de la entrada (podéis aprender más sobre sombras en esta entrada que hice sobre ellas).
• La cuarta realiza una alineación justificada en el cuerpo de la entrada.

Recomiendo usar esta opción (la de "Añadir CSS" en personalización de "Plantilla") en vez de modificar directamente el código HTML de la plantilla, ya que es más fácil de localizar y usar por blogeros menos expertos en CSS. Y recordar que la notación para un estilo de clase es poner un [punto - '.'] delante de su nombre como veis en los ejemplos que os he puesto.

En otro blog que colaboro con su diseño también exporte rápidamente muchos de estos estilos sin tener que buscarlos dentro del código HTML de la plantilla. Estos son los ejemplos en Cool Mommies:

.content {margin-top:-60px;}
.post-body h2 {text-transform: uppercase; text-decoration: underline;}
.post-body img {box-shadow: 0 0 1em 0.3em #ea9999;}
.post-title {color: #ea9999;}
.Header .description {color: white;}

Aquí añadí dos líneas, una para cambiar el color del título de las entradas (pues en la plantilla predeterminada se usa el mismo color que el de los enlaces) y otra para cambiar el color de la descripción en la cabecera del blog (igualmente en la plantilla predeterminada no se puede elegir otro color con la interfaz de personalización).

Espero que os sea de utilidad y hayáis observado lo fácil que es cambiar el diseño de todas nuestras entradas en una única parte del código en vez de tener que cambiar todas las entradas si vais formateando cada una de ellas con el editor WYSIWYG que hay para redactarlas.

Un saludo.

BAT MAN

Volviendo a uno de los temas de este blog y teniendo en cuenta que hace meses que no traigo nada "nuevo",  dedicaré esta entrada a un juego que seguro que al menos os sonará. Es famoso por su modelo de juego (consistente en la recolección de objetos para poder acabarlo) y su protagonista, que aumento la popularidad del juego y tenia un aspecto muy gracioso con unos sprites de BatMan que recuerdan a los actores vestidos con leotardos y turbopackets de las series "gore" de la antigua televisión. Esta fue la primera aparición del murciélago más famoso en los videojuegos.

También es famoso por su perspectiva isométrica, si bien no fue el primero, sí que está en medio de dos de los grandes de esta perspectiva:

1. Knight Lore: su gran inspiración, creado por Ultimate Play The Game, que luego será conocida como Rare, y que tendría otros éxitos en Nintendo con Donkey Kong Country o GoldenEye 007 hasta que fue absorbida por Microsoft. Desde mi punto de vista éste fue el comienzo del fin del estudio de desarrollo que ha traído grandes ideas a los videojuegos.
2. Head Over Heels: de los mismos creadores de BatMan utilizando un motor de juego modificado de éste para que pudieran jugar dos jugadores y que sin duda todos debéis conocer.

Fue creado por Jon Ritman y Bernie Drummond para Ocean Software y publicado en 1986.

La finalidad es reconstruir nuestra nave (dividida en nueve fragmentos) y rescatar a nuestro amigo Robin que ha sido raptado por el Joker. Para ello tendremos que encontrar las bat-botas, el bat-cinturón, la bat-bolsa y el bat-impulsor, que mejorarán nuestros movimientos y nos permitirán terminar nuestra misión. Por el camino nos encontraremos con todo tipo de peligros en un laberinto de más de 150 habitaciones.

Aquí dejo el juego rescatado desde World of Spectrum en su versión de 128K:

Your browser doesn't support Java or you turned it off
Please upgrade to Netscape v4.0+ or Internet Explorer v4.0+

También hay un remake para Windows en RetroSpec que os podéis descargar aquí.

Se que es difícil pasarse el juego pero, antes de cortaros las venas, podéis echar un vistazo a este fantástico vídeo de un tío pasándose el juego en poco mas de media hora. ¡Un autentico máquina!



Espero que disfrutéis del juego, una joya del software retro, que puede atraparos peligrosamente y terminar jugando un rato más largo de lo que habíais pensado inicialmente cuando sólo queríais echarle un vistazo rápido.

Un saludo.

VLC: Grabar vídeo de una ventana

Una vez mas me reconozco amante del software libre, especialmente de algunos proyectos realmente buenos como Apache, OpenOffice, PostgreSQL, Git, WordPress, GIMP, Audacity/Ardour, etc... y hoy hablaré sobre uno de estos: VLC Media Player.

VLC es conocido por ser gratis, ligero y reproducir prácticamente todo lo que le echen sin tener que descargar ningún códec. Pero lo mejor es que tiene tantas sorpresas esperándonos que lo hacen aún mejor.

Hoy voy a deciros como podéis grabar en vídeo una ventana de vuestro escritorio y codificarlo a un formato que podáis distribuir o subir a YouTube. Es algo que necesitaba para no tener que comprarme una capturadora y quería que fuese con una solución de código abierto para saber qué estoy descargándome realmente.

He de decir que probé otras soluciones gratuitas y no gratuitas. Algunas me daban unos resultados pobres, y otras no me daban mejores resultados que lo que conseguí finalmente con mi amigo VLC.

Todo esto está hecho sobre Windows 7 que es donde necesitaba hacer la captura en ese momento.

Empecemos. VLC tiene una opción que es "Abrir volcado de red...". Se puede usar para recibir o para emitir. De hecho, para mí es el mejor método para guardar en un archivo un vídeo de YouTube:

1. Elegís abrir volcado de red (podéis usar el atajo de teclado Ctrl + N).
   
   
   
2. Ponéis la dirección de Internet (URL) del vídeo.
3. Donde pone reproducir le dais a la flecha y elegís "Convertir"
   
   
   
4. Indicáis el destino del archivo con el vídeo grabado y la codificación que queréis (si sólo deseáis el audio podéis elegir un fichero .ogg por ejemplo, escogiendo la codificación "Audio - Vorbis (OGG)")
   
   
   
5. Si queréis ver el vídeo mientras se graba podéis marcar la casilla que pone "Mostrar Salida". Yo no lo recomiendo ya que, si no os muestra la salida en tiempo real, puede crear el archivo mas rápido. Sólo lo veo útil en caso de querer cortar la grabación antes de que termine, así podremos elegir el momento de darle a stop y dejar de grabar.

Pues bien, si ponéis en volcado de red la URL "screen://" conseguiréis acceder al vídeo de vuestro escritorio (también se consigue escogiendo el "Modo de Captura" "Escritorio" desde la opción de "Abrir dispositivo de captura..."). Siguiendo los mismo pasos anteriores podéis convertir el vídeo a vuestro formato favorito (no así el audio, ya que es una señal únicamente de vídeo).

Hasta aquí nada que no podáis encontrar en muchos otros blog. Lo que me resulto realmente útil es capturar una parte de ese escritorio (la ventana donde estaba sucediendo lo que quería guardar). La forma de hacerlo es la siguiente:

1. Vais a "Herramientas/Preferencias".
2. Tenéis que abrir las opciones avanzadas y depende de la versión que tengáis. Yo tengo la 2.0, donde tendréis que buscar "Mostrar ajustes" y seleccionar "Todo".
3. Entre todas esas opciones vamos a "Entrada-Códecs/Módulos de Acceso/Pantalla".
4. En esta ficha podremos indicar:
1. Posición en pixels de la esquina superior izquierda de la región de pantalla que vamos a capturar.
2. Tamaño en pixels de la región a capturar.
3. Si queremos capturar el ratón también.
4. Tasa frames por segundo a capturar.

De esta forma podréis capturar en vídeo una parte de vuestro escritorio y codificarla directamente en un archivo de vídeo de la misma forma que haríais con un vídeo de You Tube o vuestra WebCam.

Por otra parte dependiendo de qué estemos grabando puede que estéis tirando mucho de vuestra CPU, y si es un gameplay o algo así puede que no tengáis los resultados esperados. En ese caso es mejor que en vez de elegir la opción "Convertir" dejéis "Reproducir" y abráis la vista de controles avanzados en "Ver/Controles Avanzados". Ahora podréis ver el botón rojo de grabar. Desde ese momento podéis pulsar grabar para comenzar la captura y volverle a dar para pararla. Vais a la carpeta donde tengáis configurado el volcado de archivos y ahí estará el vídeo en bruto. Ahora podéis abrirlo y convertirlo en un formato comprimido que pese menos.

Espero que haya sido de vuestro interés.

PD: Esto es lo que usé para hacer los tutoriales de Skyrim Xtreme XD.

Skyrim: Custom Extreme, crea tu máquina de matar | make your killing machine

Estas vacaciones tenía ganas de darle caña al ordenador con algún juego, concretamente con The Elder Scrolls V: Skyrim. Hace poco sus desarrolladores han sacado la primera expansión: Dawnguard donde le dan mas protagonismo a los vampiros, etc... pero no vengo a hablaros de eso.

Como quería poner en orden un poco todos mis personajes y no me acordaba cómo los había dejado después de navidades, me puse a ver algunas guías o trucos para hacerme la vida más fácil. Yo tengo el juego en PC y prefería usar la consola antes que aprovecharme de fallos del juego para ahorrarme tiempo en conseguir el personaje como quiero (porque estoy harto de farmear ingredientes y enseñar lo mismo a todos los personajes una y otra vez mientras hago muchas misiones repetidas)

Consola

Usando la guía de comandos de consola que aparece en una de las wikis sobre el juego (yo use esta), me puse a hacer unos cuantos experimentos, y descubrí que configurando el personaje con unos perks/ventajas y poderes determinados podía hacerlo más poderoso y flexible de lo que viene con el juego. Utilizando el comando "bat", que permite ejecutar scripts por lotes contenidos en ficheros de texto, decidí ir haciendo unos que consigan lo siguiente:

1. Subir todas las habilidades a 100
2. Colocar los perks estratégicamente (ver apartado alternar perks)
3. Hacer olvidar los perks que "estorban" (ver apartado alternar perks)
4. Enseñar los hechizos más útiles o poderosos (desde mi punto de vista es mejor que tenerlos todos y buscar los buenos entre la morralla)
5. Conseguir los gritos de dragón más atractivos con sus tres palabras
6. Otorgar los poderes más útiles independientemente de la raza del personaje, incluyendo los de misiones o los propios del vampirismo o la licantropía
7. Obtener los objetos necesarios para crear un equipo de fabricación/crafteo cojonudo y poder utilizar las armas y armaduras que más me gustan (y no las que me obliga a usar el juego si quiero las mejores estadísticas). Esto implica:
1. Equipo para desencantar y aprender esos encantamientos
2. Materiales para encantar, hacer pociones y mejorar armas y armaduras
3. Las armas y armaduras que más me gustan
4. Para redondear la jugada ¿qué tal 10.000 en oro, diez pociones de recuperar la salud completa y una ganzúa?

Todo esto al final son una serie de archivos de texto donde guardo todos los scripts. Están divididos para que se pueda llamar un script en particular sin que tenga que llamarlos a todos (por ejemplo sólo colocarme los perks o sólo darme el equipo de acero). Os lo dejo en este enlace. Los debéis copiar a la carpeta donde esta el ejecutable de Skyrim (en Windows 7 normalmente C:\Program Files (x86)\The Elder Scrolls V Skyrim). Todos los scripts que queráis llamar desde la consola tienen que estar en esa carpeta.

Están preparados para hacer lo que yo prefiero y lo que muestro en la guía en vídeo que he subido. Si queréis modificarlos lo más cómodo es abrir el fichero paso1.txt y "comentar o no" las lineas de llamada a otros script. Como ejemplo, si queréis tener la armadura de escamas de dragón en vez de la armadura de acero, comentáis la linea "bat armaduraacero" poniendo un ';' delante, y lo quitáis de la línea "bat armaduraescamasdragon".

Aplicando todo a un personaje

Con los scripts copiados en la carpeta del juego, cogéis el personaje que prefiráis y hacéis lo siguiente (la consola de juego se abre pulsando la tecla 'º', la que está a la izquierda del '1'):

1. Deshaceros de todas vuestras pertenencias. Se hace con el comando "player.removeallitems" (esto no eliminará los objetos de misiones)
2. Ir a una estancia especial preparada para todas las operaciones que debemos hacer (disponiendo de armarios con todos los objetos del juego y de fragua, banco de trabajo, mesa de alquimia, encantador arcano, etc...). Esto se consigue con el comando "coc qasmoke"
3. Una vez allí ejecutar el primer script con "bat paso1". Si las líneas anteriores las queréis hacer, también podéis añadirlas al script paso1.txt.
4. Subir los niveles que haya podido ganar. Recomiendo pasar de magia, poner unos 300 puntos de aguante y el resto a salud
5. NO MODIFICAR LAS VENTAJAS. Esto lo pongo en mayúsculas por si alguno siente la tentación de aumentarse perks que vea con un solo punto. Esto es parte del truco. Luego lo explico en el apartado de alternar perks.
6. Crear el equipo de alquimia hasta poder conseguir una mejora del +81% en cada pieza que permita el encantamiento de reforzar alquimia.
7. Hacer el equipo de mejora de herrería y alquimia. (cuello, dedo y manos con +81% en alquimia y herrería, cuerpo con +81% de herrería y dos cabezas de +81% de alquimia que se puedan vestir juntas: existen tres objetos de cabeza en el juego que pueden vestirse a la vez que un Anillo/Circlet o una Máscara de Sacerdote Dragón, son el Yelmo Falmer, el Penitus Oculatus y La Corona Dentada)
8. Hacer las pociones definitivas de +145% en encantamiento y +582% de herrería.
9. Mejorar las armas y armaduras que más me gusten
10. Encantar el resto del equipo a su gusto. Yo recomiendo hacer un anillo y un collar que en total lleven refuerzo de alteración, conjuración, destrucción e ilusión. Ayudaros del script "bat paso2". Así tendríamos los hechizos de esas escuelas de magia gratis (siempre que encantemos con al menos una reducción del 100% en los hechizos). Podéis seguir encantando con mejoras de daño en arquería, armas, etc... pero sólo si queréis matar dragones de un sólo golpe como en estos vídeos
1. con arco 
2. con espada
11. No recomiendo ningún otro encantamiento (ya tenemos el cap de armadura, casi el cap de resistencia a la magia [ver nota], somos prácticamente invisibles a los enemigos, podemos llevar 600 de peso, no gastamos magia, tenemos pociones de vida gratis [basta con llamar a "bat pociones"], todo el dinero que queramos [basta con llamar a "bat oro"], las ganzúas no se nos rompen,... ). No nos hacen falta.
12. Ir a la "Piedra del corcel". Me parece la más útil, así tendremos una capacidad de carga 100 puntos mayor. Podéis hacerlo usando el comando "coc doomstonenorthernpineforest01".
13. Si tenéis un seguidor os recomiendo que lo despidáis (por el sigilo)

Y ya sólo os queda disfrutar del juego a vuestro antojo, lo espectacular de su motor, sus personajes, su historia, etc...

Pero ¿Cómo hemos conseguidos esas estadísticas? Alternando los perks.

Alternar perks

Esto es la base de todo. Lo descubrí al observar que si activaba por consola sólo el rango uno y el tres de "Resistencia mágica", en la rama de "Alteración", en los efectos activos me aparecían dos bonificaciones distintas de +10 y +30 a la resistencia a la magia, y si activaba después el rango dos por consola o a mano, sólo conservaba la bonificación de +30.

Haciendo más pruebas con otros perks, observé que si otorgaba ventajas no contiguas, las bonificaciones se acumulaban, mientras que si añadía los "huecos" de en medio, se perdían y sólo se conservaba la mayor.

Con esto, decidí que mis script tuvieran los rangos 1, 3 y 5 y olvidaran los rangos 2 y 4 de los siguientes perks:

1. Armadura Pesada. Perk: Fuerza arrolladora. Ventaja total: 180% en vez de 100%.
2. Armadura Ligera. Perk: Defensor ágil. Ventaja total: 180% en vez de 100%.
3. Armas a una mano. Perk: Hombre de armas. Ventaja total: 180% en vez de 100%.
4. Armas a dos manos. Perk: Bárbaro. Ventaja total: 180% en vez de 100%.
5. Especializaciones en armas (espadas, hachas y mazas) 30% crítico en vez de 20%.
6. Arquería. Perk: Máxima tensión. Ventaja total: 180% en vez de 100%.
7. Arquería. Perk: Disparos críticos. Ventaja total: 30% en vez de 20%.
8. Bloqueo. Perk: Muro de escudos. Ventaja total: 90% en vez de 40%.
9. Discreción. Perk: Sigilo. Ventaja total: 90% en vez de 40%
10. Robo. Perk: Dedos largos. Ventaja total: 180% en vez de 100%.
11. Elocuencia. Perk: Regateo. Ventaja total: 60% en vez de 30%
12. Encantamiento. Perk: Encantador. Ventaja total: 180% en vez de 100%.
13. Alquimia. Perk: Alquimista. Ventaja total: 180% en vez de 100%.

Además:

1. Alteración. Perk: Resistencia mágica. Ventaja total: 40% en vez de 30%. Rango 1 y 3. Elimino el 2.
2. Elimino "Atronarch" de "Alteración" para evitar que se pueda absorber el efecto de sigilo del último perk "Guerrero sombrío".

Así que NO ACTIVÉIS VENTAJAS A MENOS QUE NO QUERÁIS IR TAN MAZADOS. Lo cual es una opción pues si no vais repartiendo demasiada estopa incluso en "Muy Difícil".

Como ejemplo pongo unos pantallazos con los números que podéis conseguir sin pociones, sólo con equipo encantado. Como resumen:

• Armadura Pesada (daédrica):  26.298 
• Armadura Ligera (escamas de dragón):  25.843
• Daño de arco daédrico: 15.173
• Daño de martillo de guerra daédrico: 12.797
• Daño de espada daédrica: 12.225
• Máximo nivel de poción encantamiento: 145%
• Máximo nivel de poción herrería: 582%
• Máximo nivel de mejora de herrería y alquimia: 81%

Haz click en las imágenes para ampliarlas:

Armadura y habilidades	Daño de Arco
Daño de martillo a dos manos	Daño de espada a una mano
Poción de encantamiento	Poción de herrería

Conclusiones

Visto los resultados, yo recomiendo usar esta guía para:

1. Vestir el equipo que nos guste más estéticamente (armas y armaduras) o vaya mas a juego con nuestro rol sin tener que renunciar a las mejores estadísticas.
2. Tener un único personaje que pueda llevar a cabo todas las mecánicas del juego (guerrero, mago y ladrón por así decirlo)
3. Montaros una partida para hace el animal y desahogaros un poco XD
4. Vengaros del juego por haber cogido un perk inútil y que tengáis que volver a empezar de nuevo con un personaje porque no os salgan las cuentas respecto a donde debéis poner cada perk (sobretodo si os tangaron como a mí con el perk "Golpe de desarme" de "Bloqueo", ya sabéis, ese que se supone que alguna vez debería desarmar a alguien al darle un embate con escudo... yo nunca lo he visto aún)

Para terminar, deciros que el comando "COC" que he usado antes, es para moveros al centro de la celda que le digáis. Es algo muy útil sobretodo si es la primera vez que vais a un sitio. Por ejemplo, en la guía vamos a la celda de pruebas, a la piedra del corcel y al próstilo de Boethiah. Hay una web que podéis usar para descubrir nuevas ubicaciones de vuestro interés. El enlace es: Skyrimsearch. Recomiendo guardar la partida la primera vez que probéis cada una, ya que en algunas podéis morir nada mas aterrizar.

En fin empecé diciendo que quería darle caña al juego en mis vacaciones, pero al final con todo esto mas bien he dedicado dos semanas a investigar y a hacer vídeos para que podáis ver los resultados.

Si tenéis algún problema, duda o queréis algo de ayuda con la consola o los scripts, podéis dejarme un comentario.

¡¡Un saludo jugones!!

CSS: Botones redondeados con brillo

Sabiendo lo que os expliqué ligeramente en la primera entrada de CSS, hoy voy a dedicarme a las propiedades CSS border-radius, box-shadow y linear-gradient. Con su apoyo, al final haré un botón que parezca azul cristalino y que se ilumine cuando pongamos el cursor encima,  todo ello sin utilizar ninguna imagen y con sólo un estilo.

Pero antes: ¿qué nos ofrece cada una de estas propiedades?

• border-radius: Redondeo de las esquinas de un elemento (incluido imágenes)
• box-shadow: Aplicar un efecto de sombra a un elemento
• linear-gradient: Aplicar un degradado de colores de fondo

En los enlaces de la W3C que pongo arriba se explica todo en más detalle. Aquí voy a poner lo que veo más útil y unas demostraciones de lo que se puede conseguir con cada una de ellas. En cada muestra podréis ver los efectos que produce el código que esta dentro del elemento estilizado.

Debemos tener en cuenta que todavía no son un estándar y que cada navegador puede tener una implementación distinta hasta que se asiente cada una de las propiedades (yo compruebo los efectos en Chrome y Firefox que son los que más me visitan XD).

border-radius:

El valor de esta propiedad viene dada por dos valores, el primero marca el radio horizontal de la esquina y el segundo el radio vertical, ya que podemos hacer que sean distintos. De esta forma tenemos:

Elemento con las cuatro esquinas iguales y redondas. Sólo hace falta un valor:

border-width: 2; border-radius: 1em;

NOTA: si os fijáis el tamaño del radio esta medido en 'em', esta es una medida relativa al tipo de letra que se esta usando y que puede asemejarse a una 'm' minúscula. De esta forma el radio guardará una proporción acorde al contenido.

Elemento con esquinas distintas dos a dos. Hacen falta dos valores:

border-width: 2; border-radius: 1em 0.5em;

Elemento con las cuatro esquinas distintas. Un par valor por esquina (además añadí distintos grosores):

border-width: 2px 6px;
border-top-left-radius: 1em 0.5em;
border-top-right-radius: 0.2em 0.2em;
border-bottom-right-radius: 2em 2em;

Con todo esto es posible darle vueltas a la imaginación para que quede todo mas curioso.

box-shadow:

El valor de esta propiedad es una lista de sombras separadas por comas, cada una especificada por 2-4 valores, un color opcional y una clave "interior":

1. Desplazamiento horizontal de la sombra respecto al elemento.
2. Desplazamiento vertical de la sombra respecto al elemento.
3. Difuminado de la sombra.
4. Extensión de la sombra (cuánto más grande/pequeña es respecto el elemento).
5. Color de la sombra. Opcional (si no se indica nada se hereda la propiedad color del elemento).
6. Indica si la sombra es interior. Opcional. Se pondría la palabra clave 'inset'.

Con esto ya podemos empezar a ver que obtenemos:

Sombra exterior del mismo tamaño que el elemento desplazada 10px a la derecha y abajo:

box-shadow: 10px 10px rgba(0,0,0,0.4);

Sombra interior del mismo tamaño que el elemento desplazada la mitad:

box-shadow: 5px 5px rgba(0,0,0,0.4) inset;

Sombra interior y exterior, de distintos colores, con distintos desplazamientos y con la sombra exterior 3px mayor que el elemento:

box-shadow: 8px 4px 0 3px rgba(0,0,200,0.4), 4px 8px rgba(200,0,0,0.4) inset;

Sombra centrada en el elemento 3px más grande y con 4px de difuminado:

box-shadow: 0 0 4px 3px rgba(0,0,0,0.4);

Bien ya nos vamos acercando a lo que queremos.

linear-gradient:

Esta propiedad necesita que se le indiquen los colores que vamos a usar, el ángulo de pintado, dónde obtenemos cada color, el punto de partida... es bastante complejo de hacer a mano para algunos efectos más complicados.
Gracias a Dios, tenemos un enlace con una aplicación web que nos proporciona una interfaz parecida a la de Adobe Photoshop para crear los gradientes y nos genera el código preparado para ser compatible con todos los navegadores.
Aquí dejo el enlace a esta aplicación: Ultimate CSS Gradient Generator.

Así podemos conseguir fácilmente efectos como estos:

background: -moz-linear-gradient(-45deg, rgba(30,87,153,0) 0%, rgba(30,87,153,0.8) 15%, rgba(30,87,153,1) 19%, rgba(30,87,153,1) 20%, rgba(41,137,216,1) 50%, rgba(30,87,153,1) 80%, rgba(30,87,153,1) 81%, rgba(30,87,153,0.8) 85%, rgba(30,87,153,0) 100%); background: -ms-linear-gradient(-45deg, rgba(30,87,153,0) 0%,rgba(30,87,153,0.8) 15%,rgba(30,87,153,1) 19%,rgba(30,87,153,1) 20%,rgba(41,137,216,1) 50%,rgba(30,87,153,1) 80%,rgba(30,87,153,1) 81%,rgba(30,87,153,0.8) 85%,rgba(30,87,153,0) 100%); background: -o-linear-gradient(-45deg, rgba(30,87,153,0) 0%,rgba(30,87,153,0.8) 15%,rgba(30,87,153,1) 19%,rgba(30,87,153,1) 20%,rgba(41,137,216,1) 50%,rgba(30,87,153,1) 80%,rgba(30,87,153,1) 81%,rgba(30,87,153,0.8) 85%,rgba(30,87,153,0) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(30,87,153,0)), color-stop(15%,rgba(30,87,153,0.8)), color-stop(19%,rgba(30,87,153,1)), color-stop(20%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(80%,rgba(30,87,153,1)), color-stop(81%,rgba(30,87,153,1)), color-stop(85%,rgba(30,87,153,0.8)), color-stop(100%,rgba(30,87,153,0))); background: -webkit-linear-gradient(-45deg, rgba(30,87,153,0) 0%,rgba(30,87,153,0.8) 15%,rgba(30,87,153,1) 19%,rgba(30,87,153,1) 20%,rgba(41,137,216,1) 50%,rgba(30,87,153,1) 80%,rgba(30,87,153,1) 81%,rgba(30,87,153,0.8) 85%,rgba(30,87,153,0) 100%); background: linear-gradient(135deg, rgba(30,87,153,0) 0%,rgba(30,87,153,0.8) 15%,rgba(30,87,153,1) 19%,rgba(30,87,153,1) 20%,rgba(41,137,216,1) 50%,rgba(30,87,153,1) 80%,rgba(30,87,153,1) 81%,rgba(30,87,153,0.8) 85%,rgba(30,87,153,0) 100%); color: white; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001e5799', endColorstr='#001e5799',GradientType=1 ); text-align: center;

Todo el texto interior no es que me haya vuelto loco, es todo el código que hace falta para que funcione... así que yo prefiero que me lo haga una aplicación.

Muy bien... ¿y dónde está el botoncito?

Para terminar voy a sacarle partido a todo lo que hemos visto y a crear sólo con CSS un botón con esquinas redondeadas y textura cristal que se ilumine cuando estemos encima de él sin usar ninguna imagen. Para ello haré lo siguiente:

1. Creare un estilo de clase "botonRapido" con:
• Bordes redondeados
• Un gradiente que me dé la textura cristal apagado
• Una sombra centrada en el botón
• Un color para la fuente del texto que no sea blanco puro
2. Modificaré el estilo anterior cuando suceda el evento "hover" (pasar el ratón por encima) para que:
• El gradiente sea más luminoso
• La sombra más clara
• El color de la fuente blanco puro.

Implementando todo eso ya tenemos nuestro botón. Probarlo.

Si queréis saber como lo hice exactamente, os dejo el enlace a los archivos que he creado para que podáis verlo tranquilamente y hacer pruebas en local con vuestro navegador.

Si tenéis algún problema podéis comentármelo. Un saludo.

Robots Blandos

Traigo una noticia de un proyecto desarrollado en la Universidad de Harvard acerca de "robots blandos". Inspirándose en las propiedades de especias animales como los calamares o las medusas, estos robots estarían hechos de una silicona con microconductos que se usarían tanto para su movimiento y cambio de forma mediante la conducción de aire a presión, como para albergar fluidos tintados que les permitirían cambiar sus propiedades de visualización tanto en el espectro visible como el infrarrojo (cambiando la temperatura de esos fluidos).

Estas modificaciones podrían servir tanto para camuflarse como para destacar sobre su entorno.
Las aplicaciones actuales que se espera de ellos son sobretodo para intervenciones médicas y para el rescate de personas utilizándose de marcadores.

Os dejo un vídeo donde podéis ver mejor de que hablo exactamente. Es un vídeo de la revista Science:

Como habréis visto, el prototipo actual tiene una serie de conductos para poder controlarlo y en la actualidad están investigando modelos mas grandes con su propia fuente de energía, bomba, fluidos y electrónica para ser autónomos.

En otros sitios se les llama robots de camuflaje y se les presupone una aplicación militar.

Mi opinión en contra de la de estos últimos, es que si bien puede utilizarse esta tecnología para enmascarar equipos recubriéndolos de este tipo de material y dar flexibilidad y rapidez a ese enmascaramiento, no lo veo viable como herramienta autónoma. Estamos hablando de silicona cuya capacidad de carga será limitada cuanto más flexible sea el robot. Por otra parte y más importante es que, si bien puede estarse enmascarado a la vista en varios espectros, el aire a presión no suele ser muy discreto (algo que no se puede apreciar en el vídeo) y un enmascaramiento eficaz debe ser completo, incluido el acústico y olfativo.

La aplicación mas acertada desde mi punto de vista sera en labores de búsqueda y rescate. Imaginad introducir robots, mas grandes que el prototipo, que puedan acercarse hasta una persona en peligro, hincharse para retirar un obstáculo y llenarse de líquidos fluorescentes con un olor característico para ayudar a los perros y personal de rescate.

Lo que tengo claro es que el ser humano no dejara de sorprenderme con su capacidad de absorber funciones de animales que no están en nuestra cadena evolutiva. ¡Felicidades a la Universidad de Harvard y  al jefe del equipo Stephen Morin!

¿Qué opináis vosotros del tema?

Access: Leyenda en Gráfico

Muchas veces una imagen vale más que mil palabras, y para algunas personas incluso valen más... la verdad que a veces un gráfico es muy útil para hacer resaltar datos numéricos que una tabla haría que tus oyentes se cortaran las venas, que desconectaran o que simplemente no se vayan con la idea que querías mostrarles.

Y cuando triunfas en una presentación cada vez quieren más y más gráficos... pero es un autentico coñazo actualizarlos a mano y por otra parte innecesario desde que las computadoras y el software llegaron a nuestra vida.

Mejor tener una base de datos actualizada e ir pidiéndole informes pre-establecidos.

Así pues, si usáis MS Access y os habéis encontrado con la puñeta de no saber como modificar los rótulos en la leyenda de sus gráficos, aquí tenéis la solución:

1. Abrimos el elemento deseado en vista de diseño
2. Seleccionamos el gráfico en cuestión y abrimos sus "Propiedades"
3. Seleccionamos la ficha "Datos"
4. Seleccionamos el campo "Origen de la fila" que es el que vamos a modificar
1. Podemos cambiar la instrucción SQL directamente en dicho campo o...
2. Pinchar en los puntos suspensivos, para abrir la consulta y cambiar a Vista SQL, con el fin de modificarla mejor viéndola completa
5. Tendremos una expresión con una consulta SQL parecida a la siguiente:

"SELECT... Sum([Datos]) AS [SumOfDatos] ó [Suma de Datos] ..."

Pues bien, lo que aparece después de AS es el título para el rótulo de la leyenda del gráfico. Modificando ese texto podremos establecer el valor que deseemos, siempre que no pongamos el valor de algún atributo del resto de la consulta claro. En este último caso nos saltaría un error impidiéndonos cambiarlo, así que elegirlo bien o cambiar el nombre del atributo que os molesta.

Un saludo.

Access: Problema con Hoja de Propiedades

Estoy haciendo una pequeña aplicación con Access y me he topado con un problema: de alguna forma ha dejado de mostrarse la Hoja de Propiedades. No se puede abrir por ninguno de los accesos de los menús y me pasa con todas las BD,s.

He buscado un poco para solucionar el problema y de alguna forma ha debido de deshabilitarse algunas barras de comandos.

A mi se me ha arreglado con los siguientes pasos:

• Abrir "Visual Basic" en "Herramientas de bases de datos"
• En la ventana de proyecto "Insertar Módulo"
• Pegamos esta función:

Public Function EnableCommandBars()
    Dim cmdBar As Object

    For Each cmdBar In Application.CommandBars
        cmdBar.Enabled = True
    Next

End Function

• Abrimos la "Ventana Inmediato" del menú "Ver" o pulsamos Ctrl+G que es lo mismo
• Llamamos a la función escribiendo en la Ventana Inmediato (abajo del todo): EnableCommandBars (+ intro) 

Aunque parezca que no ha pasado nada, ahora se puede probar a ver si funciona la Hoja de Propiedades y funciona.
Luego podeis borrar el Módulo creado o incluso hacerlo con una BD sólo para arreglarlo por si no os fiais.

Eso es todo. Espero que os ayude.

VirtualBox: Copiando Discos

Buenas a todos:

Después de un largo paréntesis en mis entradas por motivos varios, traigo una solución a un problema que seguro que os habéis encontrado trasteando con VirtualBox.

Yo empecé con la virtualización de equipos usando VirtualPC (Microsoft). Es sencillo y para el que quiera poco más que tener una máquina con la que trastear usando software nuevo o emular alguna antigua por ejemplo, pues sirve. Si tienes un poco más de conocimientos y quieres hacer algo más avanzado (además de usar una solución abierta) seguramente ya te hayas pasado a VirtualBox.

Cualquier máquina con VirtualPC puedes pasarla a VirtualBox. Yo lo que suelo hacer es crear una nueva máquina en VirtualBox y enchufarle el disco duro de la antigua. Haciendo esto corres el riesgo de que en varias máquinas "clonadas manualmente" por uno mismo, al querer registrar los distintos dispositivos virtuales de almacenamiento, se presente un error que diga que el UUID (Identificador Universal Único) del disco que quieres añadir ya existe.

Esto es porque al copiar los discos duros como archivos en el sistema de archivos del huésped se copian con su UUID. Por tanto en vez de copiarlos hay que clonarlos o, en caso de que no puedas hacer esto, cambiarles el UUID.

Eso podemos hacerlo usando la línea de comandos con VBoxManage. Con GNU/Linux no deberíais tener problemas con ejecutarlo en la terminal directamente. Con Windows lo primero es encontrar dónde está ese ejecutable porque lo normal es que no esté en nuestra variable $PATH. En Windows 7 deberíais encontrarlo en C:/Program Files/Oracle/VirtualBox. Si es así los comandos para las dos opciones serían:


Sólo para Windows (ponernos en el directorio de trabajo apropiado):

cd "C:/Program Files/Oracle/VirtualBox"

NOTA: Las comillas son importantes para que el comando incluya los espacios de la ruta.

Para Clonar HDD Virtual:

VBoxManage clonehd <path del HDD a clonar> <path del destino del HDD clonado>

Para Cambiar UUID del medio:

VBoxManage internalcommands sethduuid <path del HDD para cambiar su UUID>

Con cualquiera de las dos opciones vuestro HDD virtual tendrá un nuevo UUID y podrá ser registrado correctamente por VirtualBox.

Aquí he comentado dos aplicaciones de virtualización, pero hay más. Una de las más conocidas es VMWare pero es de pago (y bastante cara) y creo que sólo compensa para virtualización de servidores. Como entiendo que con los tiempos que corren el ahorro es importante, recomiendo VirtualBox. Además las máquinas de VMWare también se pueden traer a VirtualBox.

Espero os haya servido.

Gauntlet

¿Algún aficionado a los juegos retro no conoce Gauntlet? En verdad la respuesta debe ser NO; pero por si todavía existe algún despistado (o fan de medio pelo), intentaré explicar qué significa para mi este juego. Realmente creó un antes y un después. Es el primer multijugador de veras que conozco y con la cantidad de versiones que se han hecho para ¿todas las plataformas? es realmente complicado que alguien que lleve jugando desde el 85 no se haya tropezado con él.

Se trata de un arcade al más puro estilo con vista cenital donde, depende de la versión, pueden jugar hasta cuatro jugadores a elegir entre cuatro héroes diferentes en un entorno de fantasía medieval. Los diferentes monstruos están bastante bien diferenciados y tienen distintos movimientos. La mayoría salían de generadores que debían destruirse para que la pantalla no se inundara de ellos. Eso sin contar que según pasaba el tiempo la vida iba mermando, así que uno no podía dedicarse a mirar el paisaje. Por otra parte lo bueno es que si jugabas con un amigo, siempre podías resucitar mientras tu compañero siguiera vivo el ratito necesario para hacerlo, así que, mejor coordinarse un poquito.

Máquina Arcade

Para mí lo tiene todo. Es realmente entretenido, largo, tenías que ir gestionando la vida, las llaves, las mejoras que ibas obteniendo, etc... Además estaba dividido en pantallas o niveles, habiendo en cada una de ellas al menos una puerta que te llevaba a otro nivel, puede ser el siguiente o, cuando ibas conociendo el mundo, buscar alguna otra que te hiciera saltar varios (20 de golpe por ejemplo). Había versiones con 99 niveles y otras con 118, así que no es un número fijo.

Aqui os dejo el juego cogido de World of Spectrum:

Your browser doesn't support Java or you turned it off
Please upgrade to Netscape v4.0+ or Internet Explorer v4.0+

No había jefes finales, pero recuerdo la sensación cuando veías a un monstruo llamado "La Muerte", realmente te daban ganas de correr y buscar algún sitio donde pudieras pegarle sin que te diera él. Si te pillaba te empezaba a bajar la vida de una forma nada recomendable e incompatible con el instinto de supervivencia.

Además otra de las cosas que le hizo famoso era una voz sintetizada que iba dándote avisos del tipo "El Mago necesita comida", "El Elfo esta apunto de morir" o alentando a los jugadores con "A ver como vas a salir de aquí".

Resumiendo, un juego digno de recordar, de versionar, como ha demostrado la historia, y por supuesto capaz de inspirar... desde que Atari lo creó ¿Qué juegos han tomado algo de Gauntlet?... Muchos sin duda.

La Escala del Universo

Buenas a todos después de una temporadilla sin publicar nada. Voy a aprovechar para enseñar un objeto que recibí por correo, que me entretuvo bastante y me enseño algunas curiosidades que no quiero dejar de compartir. Se trataba de un excel con un objeto Shockwave Flash incrustado (para que cualquier profano pudiera verlo sin problemas si tiene MS Office claro) donde se puede ver una escala del Universo comparándolo con otros objetos desde las particular teóricas más minúsculas hasta el Universo entero.

Está claro que lo dejo como mero entretenimiento, aunque me parece demasiado curioso como para evitar compartirlo con nuestros conocidos, y reconozco que es una forma bastante amena de relacionar distintos tamaños para los estudiosos de Física :)

Un saludo.

Fuente: http://htwins.net/

Two Steps From Hell

En el día de la madre voy a dedicarle esta entrada a mi madre y a mi mujer, la madre de mis hijos. Y para no desviarme del objetivo de este blog lo que voy a compartir es un descubrimiento reciente, pero que es uno de esos con los que sientes que has tenido realmente suerte de cruzarte (el cruce más afortunado es haber coincidido con mi mujer milagrosamente, supongo que por el destino, de una forma digna de guión de película, pero no seguiré por aquí que es muy largo de contar XD).

El descubrimiento en cuestión es una productora musical llamada Two Steps From Hell fundada en 2006 por Thomas Bergersen y Nick Phoenix. Como muestra os quiero enseñar la pieza "United We Stand - Divided We Fall" de su último álbum "Archangel".

Con lo difícil que es decidirse entre todas sus creaciones, he hecho un esfuerzo titánico y he elegido esta canción que creo representa bastante bien el estilo que tienen. Las clasificaría como música clásica-épica con tintes modernos. Su trabajo va orientado a trailers de películas y videojuegos, aunque tienen algunas colecciones para difundir su trabajo y un par de albums editados para la venta (Invincible y Archangel). Con ellos han conseguido el Nº1 en la sección de música clásica de iTunes y mantenerse durante semanas.

Lo descubrí en el vídeo de "KIN Raiders Vs Spine of Death Wing World First Kill (25man Heroic)" gracias a la aplicación de reconocimiento musical "Shazam" que llevo en el móvil. En el vídeo podéis oír por este orden las canciones "Jump!", "Norwegian Pirate" y "United We Stand - Divided We Fall". Todas de Two Steps From Hell aunque de distintas recopilaciones.

Os recomiendo descargar una colección de sus temas desde este torrent al que sólo le falta su último álbum, Archangel, e Illusions que es el publicado individualmente por Thomas Bergersen. Creo que no incumple ningún derecho de autor. Si fuera así rogaría que me lo comunicárais y retiraré el enlace. Sólo pretendo que más personas puedan disfrutarles y apoyarles.

Eso sí, después de haberlos escuchado, se merecen que compréis al menos las canciones que decidáis tener, que seguro que son muchas. Están a menos de 1$ en Amazon en formato mp3 y si quieres todo el sonido, podéis comprar el CD en CDBABY por menos de 18$.

Por ahora no conozco a nadie que no me haya agradecido compartir esta clase de música, por eso le dedico esta entrada de hoy a mi madre, porque sé que es uno de los mejores regalos que le he hecho.

¡Felicidades mamá!

Target Renegade

Después de tantos consejos y trucos voy a traer otro de los juegos de Spectrum a los que mas jugué. Este artículo se lo dedico a mi tío, que de vez en cuando vuelve a sacar recuerdos de cuando jugábamos a Target Renegade.

Se trata de un arcade de lucha con scroll horizontal (aunque sea un poco a saltos), dividido en cinco niveles, con limite de tiempo, creado por Imagine en 1988 y en el que pueden participar hasta dos jugadores. Recuerdo la diferencia de cuando pasé de tener el Spectrum 48K al ZX +2. En el primero tenias que ir cargando cada fase porque no le daba la memoria para más, mientras que en el segundo, aunque tuvieras que esperar 15 minutos de carga, te olvidabas para toda la tarde de tener que volver a hacerlo.

El juego iba de ir partiéndote la cara con todos los pandilleros que te encontrabas por el camino hasta llegar a Mr. Big que es el jefe final. Cada personaje podía sorprenderte con algún movimiento nuevo como esquivar alguno de tus ataques o tener ellos alguno especialmente mortífero (como cuando los gorilas del bar te machacan a cabezazos). Además puedes utilizar las armas que sueltan los enemigos cuando los derribas y que van cambiando en cada fase. Se puede decir que es el origen del famoso Double Dragon que todos los de mas o menos mi edad conoceréis.

Traigo este vídeo que es el que me ha parecido mas representativo por la forma de jugar (ya que no va todo el rato dando patadas voladoras).

Llega hasta el tercer nivel y se pueden ver algunos enemigos característicos como, con perdón, las putas o los punkies. Eran los nombres que usábamos en mi casa jaja.

Queda ver el resto de juego currándoselo echando una partidilla. Te invito a jugar desde aquí y si es acompañado mejor, que es mas divertido.

Para empezar define las teclas y pulsa F11 para poner/quitar el sonido. Emulado con Qaop.

Si llegáis hasta Mr. Big os recomiendo ir con un palo de billar y que no os toque u os tendréis que despedir de la vida entera. Si os lo cargáis ¡Felicidades! o Congratulations! como rezaban entonces los juegos. Recuerdo comentarlo con mis primos y diciéndolo con todas las letras: "Pimo al final pone CON-GRA-TU-LA-TIONS" mientras nos encojíamos de hombros con la cara de ingenuidad de chicos de 10 años que no tenían ni pajolera idea de que significaba. Entonces no había ni logros, ni vídeos tipo Hollywood, ni nada mas emocionante que sentir que te habías pasado el juego de una vez y contárselo a tus amigos.

En fin, espero que disfrutéis de ello, sobretodo si os trae los recuerdos que me trajo a mí.

Hasta la próxima.

CSS: Hacer zoom

Para los que no conozcan lo que es CSS (Cascading Style Sheets) se traduce en "Hoja de Estilos en Cascada". Es una definición bastante acertada de lo que nos proporciona y una de las grandes cosas que ha dado la web. Permite cambiar la "forma de ver" una misma página con sólo hacer unos pequeños cambios en un archivo de este tipo (.css), que llevará todos los estilos de los elementos de nuestra página.

Su autodefinición "en cascada" se refiere a que la descripción de estilos también se ve afectada con la relación de un elemento con el resto de la página (por ejemplo si definimos un estilo con el fondo gris y fuente arial con color azul, todos los elementos que marquemos con con ese estilo tendrán el mismo, así como lo que haya dentro de sus etiquetas HTML aunque no se especifique literalmente, y sólo lo tendremos que haber definido una vez). En caso de conflicto importa más el estilo definido más específicamente (si definimos que uno de los elementos internos a nuestro ejemplo anterior debe tener la fuente negra, tendrá este color en vez del azul marcado para su contenedor).
Si queréis saber la sintaxis de CSS podéis visitar el sitio web del World Wide Web Consortium que son los encargados de marcarla a nivel mundial, aunque también he de decir que dependiendo del navegador que usemos, y su versión, los resultados pueden variar mucho.

Si bien lo básico trata de elegir tipo, tamaño o color de letra, color de fondo, posición, tipo de bordes, etc... lo más interesante es que con la versión 3 hay una serie de transiciones y transformaciones que se pueden definir al activarse por ejemplo los siguientes eventos:

• hover: pasar el ratón por encima
• active: pulsar sobre el elemento
• focus: elegir como elemento actual

Suelen conseguirse unos efectos bastante espectaculares y profesionales sin intervenir por medio ningún lenguaje de programación.

Sirva esta entrada de somera introducción a lo que es CSS y pasemos al truco que os quería mostrar hoy: hacer zoom sobre un elemento de una página con CSS. El resultado es como el de abajo.

Todo lo que este en la capa hace zoom, incluido texto, etc... a menos que uses de navegador IE.

Esta preparado para que:

• al pasar el ratón sobre la capa de la imagen aumente su tamaño al triple.
• al mantener pulsado el botón de ratón sobre ellos, se reduzca a la mitad.

Aquí dejo un enlace a un paquete donde tengo tres archivos para la demostración:

• pruebaZoom.htm: página con la demostración que os quiero mostrar.
• zoom.css: archivo CSS con la definición de estilo para los elementos.
• image.jpg: imagen utilizada en el ejemplo.

Lo descargáis y abrís pruebaZoom.htm para ver el resultado en local. Lo mejor es que molifiquéis el código para ver las diferencias. En este ejemplo añadí dos controles tipo "input" donde podéis distinguir los efectos de antes más otro que ocurre cuando el cursor está dentro del input (hacerle focus) y hace que doble su tamaño.

En el fichero CSS veréis que parece repetirse una y otra vez lo mismo. Esto tiene su explicación y tiene que ver con la dependencia que tiene CSS con el navegador que se usa. Por ejemplo, en la definición del estilo de clase .claseZoom cada línea que veis terminada con transform y que sólo cambia el prefijo es una línea para cada navegador (moz=mozilla, web-kit=chrome, o=opera y ms=IE). Para vuestras pruebas os sugiero cambiar sólo la línea de vuestro navegador si sólo vais a usar uno. Por otra parte podéis eliminar las dos últimas lineas ya que IE aún no lo soporta y la que no tiene prefijo es la sintaxis estándar que no es soportada por ningún navegador ;-)

Seguro que se os pasa por la cabeza lo poca elegancia que tiene el input haciéndose grande tal cual viene en el ejemplo. Tranquilos, mas adelante emplearé otra transformación que le dará un aspecto realmente impresionante a vuestros formularios.

Hasta la próxima.

Tetra-Shed = Oficina móvil

He visto lo que sin duda en los tiempos modernos es una opción fabulosa para los que tienen complejo de caracol. Se trata de llevar tu oficina a cuestas o montarte una rapidita en tu jardín si eres tan afortunado como para poder hacerle un sitio.

Se llama TETRA-SHED® y es un curioso espacio de trabajo que aún no está en venta. Incluso esta pendiente de patentar según ponen en su página web.

Su diseño permite que puedan montarse varias configuraciones para que no sólo sea una oficina, sino un aula, una sala de reuniones, de conferencias, etc.... He visto ejemplos de hasta de 56 módulos de este tipo unidos. Tiene varios acabados tanto exteriores como interiores y cuando hayamos acabado la jornada se cierra el chiringuito completamente.

En mi opinión ya sólo su diseño puede atraer a los curiosos a nuestro negocio proporcionándonos pasivamente un magnetismo publico que sin duda será de ayuda. Al menos mientras nos respeten los grafiteros.

Un saludo a todos.

Motion - Web Cam Server

Hoy traigo una aplicación muy chula a la par que útil si tenéis que hacer algo dedicado con la vigilancia. Se trata de Motion y un Front-End para ella llamado Kmotion.

Motion es una aplicación por linea de comandos que crea un servidor web con flujo de vídeo en streaming cogiendo la señal tanto de una cámara local, de USB por ejemplo, como de una cámara de red. Incluso se puede controlar la cámara de red si tiene esta opción (zoom, movimiento, etc...) y esta dentro del catalogo de drivers con los que trabaja la aplicación.

Todas las opciones como calidad de capturas, fps, detección de movimiento (eventos), lanzamiento de scripts al inicio y final de los eventos, velocidad de capturas en función de si se detecta movimiento o no, etc... se configuran mediante archivos de configuración.

Kmotion en acción 

Estar editando varios archivos de configuración siempre es más incómodo que tener una buena GUI que nos facilite las cosas. El proyecto Kmotion ofrece un front-end para Motion que le da mucha mas eficacia y espectacularidad. Con él tenemos opción de configurar más cómodamente "casi todo" y corre sobre un servidor apache. Además crea una base de datos de eventos grabados teniendo acceso a ellos para ir directamente a ver lo que más nos interesa. En la página web de Kmotion vienen unos vídeos explicando muchas de sus funcionalidades como por ejemplo la mascara de captura para evitar zonas que nos darían falsos eventos (por ejemplo las ramas de un árbol que se mueven con el viento).

Descubrí esta aplicación en el numero 69 de la revista Linux Magazine. La considero muy interesante e instructiva. Os dejo el enlace al articulo donde trata sobre Motion y Kmotion.

Una de las cosas buenas de esta revista es que todos los artículos de esta revista los podéis descargar gratis 6 meses después de salir en el kiosco. Yo la compro todos los meses porque hay que ayudar a las cosas que valen la pena, pero que se pueda descargar gratis da buena cuenta del compromiso que tiene esta revista por llevar Linux a los usuarios y una facilidad enorme de compartir artículos como este con el resto de la comunidad, así como tenerlos intactos cuando la revista se vaya estropeando (si es que el del kiosco o el cartero no te la da ya hecha cachos jeje) o vaya pasando el tiempo y este mas escondida entre el resto de revistas que tengamos y nos de pereza buscarla.

Todo viene muy bien explicado en el articulo. Por mi parte sólo os voy a contar las dos pegas con las que me topé y que no vienen en la revista. Cuando hice la prueba utilicé Ubuntu 10.04.

1. Después de instalar Kmotion al intentar acceder nos pide un usuario y contraseña que no hemos configurado. Hay un script en la carpeta de kmotion para cambiar usuario y contraseña. Os recomiendo que lo ejecutéis desde la terminal por si estáis cometiendo algún error, como no cumplir con los requisitos mínimos de contraseña, y no sabéis porque no podéis acceder después de ejecutar el script. 
2. En mi caso utilice 3 cámaras web para mi prueba. Una de ellas era bastante antigua y no era capaz de capturar con ella debido a que no encontraba una paleta compatible con ella. Este fallo lo arreglé
   precargando una librería de Video4Linux ejecutando el arranque de Kmotion con el comando:
   
   
   LD_PRELOAD=/usr/lib/libv4l/v4l2convert.so kmotion start
   NOTA: Si en vez de Kmotion estáis usando Motion sustituir lo ultimo.

Los resultados son muy buenos y la única pega que encontré fue que la parte derecha de kmotion donde trae todos los botones no es muy flexible y si lo utilizáis desde una pantalla muy pequeña se os pueden quedar ocultos algunos botones importantes y unos encima de otros. Lo bueno es que al ser Open-Source podéis cambiar lo que queráis a vuestro antojo y editar el código para que quede lo que os interesa o añadir cosas nuevas.

Os dejo el enlace de descarga de un guiaburros que me hice para que no se me olvidara nada.

Espero que os haya sido de interés como a mi, y si tenéis alguna duda ya sabéis, ponerme un comentario.

Green Beret

No podía tardar más en traer el primer juego al que jugué. Yo recibí un Spectrum 48K para mi primera comunión; no digáis que no es tierno. El juego con el que venía con el ordenador era el Green Beret y de ahí que fuera el primero de mi vida. Incluso pude estrenarlo en la tele grande y a color del cuarto de estar. Luego sería relegado durante un tiempo a mi cuarto con una tele en blanco y negro ;-(

Es un juego con mucha acción arcade en 2D con scroll horizontal creado en 1986 por Imagine Software y basado en la reacreativa de Konami. Tenías que ir jugando con el scroll y los distintos niveles de plataformas para ir dosificando los enemigos, sus ataques y evitar zonas peligrosas como los campos de minas.

Para quitarte a los enemigos de encima los pasabas a machete, que es gratis, aunque podías ir consiguiendo otras armas como lanzallamas, RPG o granadas de mano, pero con una munición muy limitada. Eso si, barrían zonas que no veas (mejor para matar varios pájaros de un tiro jeje).

Lo más entretenido era la cantidad de enemigos que se podían juntar alrededor tuya. No eran muy listos ya que si os dais cuenta algunos con saltárselos pasan de largo como si no existieras, pero tenían muchos ataques, karatekas con patadas voladoras, los morteros disparando lo suyo, paracaidistas disparando, en fin de todo. Cada una de las cuatro fases del juego terminaba con "un jefe final" (camiones de enemigos, perros acosándote, helicópteros o un pirómano con lanzallamas) y hay un límite de tiempo para que nos caiga un bombazo que nos mande al otro barrio. Cuando se consigue pasar las cuatro fases se empieza en un nivel de dificultad mas alto.

Lo que me parecía más gracioso de matar eran los esqueletos que aparecían estilo electrocución, sobretodo esos esqueletitos de los perros jaja.

Os dejo un vídeo de la versión Spectrum con el recorrido entero hecho en unos minutos muy bien jugados. Entonces los juegos no eran tan largos como ahora. No se podían guardar partidas, no había memoria y no me imagino las cintas que hubieran hecho falta jaja.

Para poder pasar a la acción que es lo realmente divertido, aquí podéis jugar con un emulador desde World of Spectrum:

Your browser doesn't support Java or you turned it off
Please upgrade to Netscape v4.0+ or Internet Explorer v4.0+

Como dato curioso decir que en EEUU (en plena guerra fría) salió con el nombre de Rush'n Attack (pronunciado como "Russian Attack"). Os dejo el enlace donde podéis cotillear un poco más del asunto.

Un saludo.

Linux por Terminal Server

Actualmente en mi casa tengo un equipo pepino, uno muy antiguo (carca) y un netbook (para cuando estoy tirado en el sillón o los viajes). Con el pepino va todo muy bien, corres varias máquinas virtuales haciendo experimentos distintos y va como la seda. Con el carca ya es otro cantar. A veces te dan pequeños ataques de ira esperando a que haga lo que quieres, incluso teniendo Ubuntu puesto (estoy pensando en darle una oportunidad a Macpup, derivado de Puppy Linux con escritorio Enlightenment E17 un tamaño de 164 Mb y que corre entero en RAM, ya os contaré).

Un día pensé que podía tirar de escritorio remoto sobre una máquina virtual en mi equipo pepino desde uno de los otros dos para aprovechar mejor la capacidad de computación (el PC antiguo por si esta ocupado el grande y el netbook por si no quiero levantarme del sillón)

No son las máquinas reales que tengo XD 

Quería que esa máquina virtual fuera Linux. Probé compartir el escritorio que era lo que más a mano se veía, pero rápidamente fue descartado por tener que logearte primero, la imagen no iba bien y cargaba más la red. Nada elegante.

En mi trabajo se usa Windows. Estoy acostumbrado a usar Terminal Server que usa el protocolo RDP y estaba interesado en incluirlo en la solución, por si acaso. Además buscaba que no tuviera que instalar nada en los equipos que utilizaran este servicio.

Después de probar y buscar varias cosas elegí instalar en Linux la aplicación xrdp combinado con TightVNC.

La instalación es sencilla si se respeta instalar primero TightVNC y luego xrdp. En Ubuntu sería lo siguiente

sudo apt-get install tightvncserver
sudo apt-get install xrdp
sudo reboot

Sólo hay dos problemas:

1. Con el escritorio Gnome habrá que usar el editor gconf-editor para poner false en la variable /apps/gnome_settings_daemon/plugins/keyboard o tendremos problemas con funciones del teclado (Nota: para Ubuntu 12.04 parece que no hay este problema). 
2. No hay soporte para teclado español en xrdp así que habrá que usar una configuración inglesa. 

Una vez esto hecho sólo debemos abrir nuestra aplicación de "Conexión a Escritorio Remoto" con la dirección IP del equipo en el que instalamos Tightvnc y xrdp.

Conexión a Escritorio remoto de Windows 

Nos saldrá un login para xrdp donde pondremos en Module sesman-Xvnc y el usuario y contraseña un usuario del sistema host (donde instalamos el xrdp).

Login para xrdp 

Después de esto ya podéis disfrutar de la velocidad del pepino en el sillón o tu viejo PC. Yo estoy muy contento con ello. Espero comentarios.

Gracias a Javier Andrés Alonso y su blog (enlace a entrada) por enseñarme esta vía que es la mejor de todas las gratuitas que he probado.

Un saludo a todos.