Algunos juegos FPS multijugador para Gnu/Linux.

Aunque los sistemas operativos basados GNU/Linux nunca se han destacado por sus juegos, ya que están mas pensados para actividades educacionales o laborales; lo cierto es que últimamente se están poniendo las pilas. No voy a hablaros sobre la incorporación de la plataforma Steam en los repos, sino de algunos FPS que hay disponibles para nuestro SO favorito. Al lío.

OpenArena.

OpenArena es un videojuego en 3D Libre, perteneciente al género de acción en primera persona (o First Person Shooter). OpenArena fue lanzado al mercado como la primera prueba de beta el 19 de agosto de 2005, un día después de que el código fuente del motor gráfico de Quake III fuera liberado bajo Licencia GPL. OpenArena está siendo desarrollado, usando principalmente software de código Libre y abierto. El motor de juego es el Quake III GPL de la compañía id Software, el cual es completamente Libre. El motor de Juego, el código y los datos, todos son de contenido abierto. Esta disponibles para todos los sitemas y lo podéis encontrar en vuestros repositorios habituales. Es posible que la versión que os aparezca sea la 0.8.5, así que podéis descargar la última en su web oficial o en su lugar el parche para actualizar la que os aparece en los repos.

El juego es simple y divertido, sales disparas a todo el mundo, te liquidan; vuelves a salir a dispararle a todo el mundo. No requiere mucha CPU ni una gráfica potente y se pude jugar casi con cualquier PC. La única pega que le he visto es que no hay mucha gente jugando y aunque rellenen las salas con bots, pues la verdad es que no es lo mismo. Eso si entráis un día (o a una hora) que haya mucha gente jugando la diversión está garantizada.

Tiene una varia selección de armamento y 46 mapas, algunos muy laberínticos en los que te podrás perder fácilmente o emboscar a tus rivales (la mayoría de las veces serás tú el emboscado :)

Red Eclipse.

Red Eclipse es un shooter de arena de código abierto, creado a partir del motor Cube2. Ofreciendo un innovador sistema de parkour y armas distintas pero todas potentes, Red Eclipse proporciona un juego de ritmo rápido y accesible. Tienes algunas cosas novedosas, (por lo menos para mi) como la posibilidad de correr por las paredes, movimientos de habilidad e incluso darles patadas voladoras a tus oponentes. Los gráficos están muy bien y los efectos de luz son muy buenos y el juego en general "corre" sin problemas. Además no es necesario instalar nada, solo descargas los archivos del su web oficial y listo.

Peeeero.... Te costará encontrar un server cercano a ti que te de un ping aceptable y que cuente con bastantes jugadores, cuando lo consigas, jugaras con gente que se conoce el juego de memoria y que la paliza que te vas a llevar probablemente te desanime pronto. ¿Darle con un rifle de francotirador a una figura que da volteretas en el aire? Si es difícil en un FPS darle a algo hasta que tengas la suficiente experiencia aquí es imposible x3.

De todas formas, si se te dan bien este tipos de juegos quizás puedas darle una oportunidad; los gráficos, el sonido y el juego en general es bueno, es gratuito y no tiene un peso excesivo. Puedes descargarlo de este enlace (web oficial). 
También puedes visitar su wiki oficial donde tendrás instrucciones para montar tu servidor público o para obtener la versión de desarrollo. 

Urban Terror.

Este es de los que he jugado el que mas me gusta sin duda. Es un clon del Counter Strike con el motor del Quake III, pero para mi gusto este es muchísimo mejor. Los gráficos no tienen nada que ver con los FPS de moda que puedes jugar ahora, pero es divertidísimo y en algunos momentos la acción es trepidante. Hay dos equipos, rojos y azules, que se enfrentan en diferentes modalidades, Bomb (como en el CS), Team DM, Capture The Flag, y otras. Cada una con sus reglas y peculiaridades.

Hay bastante variedad de mapas que irán cambiando según vayan avanzando las partidas, y dependiendo de los servidores la rotación será mas amplia o mas repetitiva. Algunos mapas son auténticos laberintos con muchos rincones y pasadizos; balcones, cornisas, chimeneas, escaleras de emergencia y ventanas que puedes aprovechar en tu beneficio. En algunos mapas podemos abrir y cerrar puertas o accionar palancas (hay un mapa donde puedes operar incluso un teleférico) con lo que el juego tiene un componente de exploración y experimentación que lo hace aun mas entretenido. Además en la decoración de los mapas hay muchos detalles que seguro que te arrancaran como mínimo una sonrisa. 




Al igual que el anterior no es necesario instalar nada te descargar el paquete, los descomprimes e incluso lleva un parche actualizador, con lo que no te tienes que preocupar de nada, además puedes registrar tu nick en su web oficial y se genera una llave pública para que nadie pueda suplantar tu conexión. Os dejo aquí el enlace a su web de donde podéis descargar el juego y si os justan este tipo de juegos y os apasiona el mundo del software abierto os recomiendo que le deis una oportunidad. Disponible para todos los SO.

Practicando Css (3): Selectores.

En este post veremos otro de los fundamentos del Css, los selectores. Los selectores nos permiten asignar estilos para cada sección y elemento de nuestra web; sería muy conveniente que antes de aplicarle estilos a nuestro sitio web, lo tuviéramos todo bien planificado porque como ya comenté en el primer post de esta serie, a veces los estilos Css pueden dar resultados imprevistos, así que repito: es muy conveniente que tengamos la estructura de nuestro sitio bien planificada de antemano (por el bien de vuestra salud mental hehehe).

Selector universal

Se utiliza para seleccionar todos los elementos de la página. El siguiente ejemplo elimina

el margen y el relleno de todos los elementos Html:

* {

margin: 0;

padding: 0;

}

El selector universal se indica mediante un asterisco ( * ). A pesar de su sencillez, no se

utiliza habitualmente, ya que es difícil que un mismo estilo sea aplicable a todos los

elementos de una página.

No obstante, sí que se suele combinar con otros selectores y además, forma parte de

algunos hacks Css muy utilizados.

Selector de tipo o etiqueta

Selecciona todos los elementos de la página cuya etiqueta Html coincide con el valor del selector. El siguiente ejemplo selecciona todos los párrafos de la página:

p {

atributo 1;

atributo 2;

etc;

}

Para utilizar este selector, solamente es necesario indicar el nombre de una etiqueta Html (sin los caracteres < y > ) correspondiente a los elementos que se quieren seleccionar. El siguiente ejemplo aplica diferentes estilos a los titulares y a los párrafos de una página Html:

h1 {

color: red;

}

h2 {

color: blue;

}

p {

color: black;

}

Si se quiere aplicar los mismos estilos a dos etiquetas diferentes, se pueden encadenar los selectores, a si que se permite agrupar todas las reglas individuales en una sola regla con un selector múltiple. Para ello, se incluyen todos los selectores separados por una coma ( , ) de la siguiente manera:

h1, h2, h3 {

                   atributo1;

                   atributo2;

                   atribtuo3;

                   etc;

} 

Para una de estilo compleja, es posible agrupar las propiedades comunes de varios elementos en una única regla Css y posteriormente definir las propiedades específicas de esos mismos elementos. Por ejemplo:

h1, h2, h3 {

                   atributo1;

                   atributo2;

                   atributo3;

} 

h1 { atributo4 }

h2 { atribto5 }

Padres, hijos y hermanos.

Cuando un elemento está contenido entre las etiquetas de otro se dice que su hijo; a su vez este puede tener otros elementos hijos haciendo una estructura de árbol.Todos los hijos directos de un elemento son hermanos. Esto nos permite poder hacer selecciones de elementos en grupo para aplicarles estilo.

Si imaginamos que la etiqueta <html>es el tronco del árbol, sus ramas principales <head>y <body> son sus hijos. Ambas etiquetas son hijos directos de <html>;  <head> y <body> son hermanos. Y asimismo dentro de <head> y sobre todo de <body> irán otros elementos hijos y estos a su vez, podrían tener otros elementos hijos según la complejidad de la web. Este pequeño galimatías y las propiedades de herencia de Css se pueden combinar si usan sabiamente y se puede liar parda si no se usan tan sabiamente; pero eso lo veremos mas en profundidad en próximos post.

Selector descendente.

Selecciona los elementos que se encuentran dentro de otros elementos. Un elemento es

descendiente de otro cuando se encuentra entre las etiquetas de apertura y de cierre del

otro elemento.

El selector del siguiente ejemplo selecciona todos los elementos <span> de la página que

se encuentren dentro de un elemento <p> : 

p span { color: red; }

Si el código Html de la página es el siguiente:

<p>

...

<span>texto1</span>

...

<a href="www.ejemplo.com">...<span>texto2</span></a>

...

</p>

No importa en que punto esté el elemento <span> se le aplicará el color rojo.

Los selectores descendentes son similares a selectores hijos, pero no requieren que la relación entre los elementos coincidentes sea estrictamente entre padres e hijos o dicho de otro modo, no tienen que ser "hijo directo" de otro. La única condición es que un elemento debe estar dentro de otro elemento, sin importar lo profundo que se encuentre.

Selector de clase.

Estos selectores y los de ID son los mas utilizados. Una de las soluciones más sencillas para aplicar estilos a un solo elemento de la página consiste en utilizar el atributo class de HTML sobre ese elemento para indicar directamente la regla CSS que se le debe aplica.

Si tenemos el siguiente código:

<body>

<p class="destacado">Lorem ipsum dolor sit amet...</p>

<p>Nunc sed lacus et est adipiscing accumsan...</p>

<p>Class aptent taciti sociosqu ad litora...</p>

</body>

Y el Css correspondiente:

.destacado { color: red; }

El selector .destacado se interpreta como "cualquier elemento de la página cuyo atributo

class sea igual a destacado ", por lo que solamente el primer párrafo cumple esa

condición.

Selectores de ID.

El selector de ID permite seleccionar un elemento de la página a través del valor de su

atributo Html id. La sintaxis de los selectores de ID es muy parecida a la de los selectores de clase, salvo que se utiliza el símbolo de la almohadilla ( # ) en vez del punto ( . ) como prefijo del

nombre de la regla CSS por ejemplo:

#destacado { color: red; }

La principal diferencia entre este tipo de selector y el selector de clase tiene que ver con

Html y no con CSS. Como se sabe, en una misma página, el valor del atributo id debe

ser único, de forma que dos elementos diferentes no pueden tener el mismo valor de id .

Sin embargo, con el atributo class muchos elementos Html diferentes pueden compartir el mismo valor para su atributo class .

De esta forma, la recomendación general es la de utilizar el selector de ID cuando se

quiere aplicar un estilo a un solo elemento específico de la página y utilizar el selector de

clase cuando se quiere aplicar un estilo a varios elementos diferentes de la página

Html.

Combinando selectores básicos.

Por lo general usareis estos selectores básico a la hora de programar vuestras webs, sobre todos los dos últimos, y en vez de enrollarme demasiado os pongo un ejemplo práctico.

En la plantilla que use en el post anterior de esta serie tenemos este párrafo en su hoja de estilos CSS (os recuerdo que podéis descargarla en este enlace y ver su hoja CSS en este otro):

/* Content */ 

 

#content {

        float: left;

        width: 532px;

}

.post {

         padding: 0 0 20px 0;

}

.title {

         margin: 0;

         border-bottom: 2px solid #4A3903;

}

.byline {

         margin: 0;

}

.meta {

         border-top: 1px solid #4A3903;

         text-align: right;

         color: #646464;

}

.meta a {

         padding-left: 15px;

         background: url(images/img06.gif) no-repeat left center;

         font-weight: bold;

}

Como veis el autor (o autora) de esta plantilla ha creado el selector de ID #content, que representa a los diferentes post de la web y dentro de este selector a combinado los selectores de clase .post, .title, .byline, .meta y demás con lo que dentro de cada post aplica estilos diferentes a cada sección del mismo.

Y bueno con esto y lo que vimos en el artículo anterior ya podéis probar a crear vuestras hojas Css sencillas para vuestra web o si no, probar a editar alguna hoja de estilos gratuita que descarguéis de internet.

Personajes ilustres: Grace Murray Hopper y Margaret Hamilton.

Hoy vienen a pares los personajes, no tocaba hablar de esto pero justo estaba preparando una entrada sobre Margaret Hamilton, y me encontrado con la noticia de que le habían dado una medalla presidencial; la medalla de La Libertad (Medal of Freedom). En el evento estuvieron Bill Gates entre otros, y junto con ella le habían dado otra a Grace Murray a título póstumo, de la que no sabía nada; pero la asistencia de todo genios de la informática despertó mi curiosidad y me he puesto a escribir en el blog para aprovechar la vigencia de la noticia.

Margaret Hamilton.

Margaret Hamilton (17 de agosto de 1936) es una científica computacional, matemática e ingeniera de sistemas. Fue directora de la División de Ingeniería de Software del Laboratorio de Instrumentación del MIT, donde desarrolló software de navegación "on-board" para el Programa Espacial Apolo. En 1986, se convirtió en la fundadora y CEO de Hamilton Technologies, Inc. en Cambridge, Massachusetts. La compañía se desarrolló alrededor del Lenguaje Universal de Sistemas basada en su paradigma de "Desarrollo antes del hecho" (DBTF del inglés Development Before the Fact) para sistemas de diseño de software.

Aquí la tenemos posando con el código, efectivamente lo escribió a mano.

Quizás la hayáis visto en algun meme que se comparten ahora o en alguna web de carteles, haciendo hincapié en el hecho de que el código se escribió a mano y luego salió posando con el; a veces cuando haces algún trabajo con el ordenador, resulta todo un poco abstracto porque tu creación solo es tangible a través de un dispositivo electrónico; no es este el caso, pues el resultado es bien tangible.

Podéis ver la noticia en este enlace a la web de la NASA y aquí os dejo una imagen del momento de la entrega.

Grace Murray Hopper. 

Sobre la señora Murray antes de nada vemos su foto de Wikipedia:

Grace Murray Hopper  Nació en Nueva York, 9 de diciembre de 1906 en una familia de tradición militar en la Marina pero también con tradición en estudios especializados y técnicos - Condado de Arlington, 1 de enero de 1992) fue una científica de la computación y también una militar estadounidense, con grado de contraalmirante, considerada una pionera en el mundo de las ciencias de la computación. Fue la primera programadora que utilizó el Mark I y entre las décadas de los 50 y 60, desarrolló el primer compilador para un lenguaje de programación así como también propició métodos de validación. Era conocida por sus amistades como Amazing Grace (Grace la Alucinante o la Increíble ).

Grace murió en el Condado de Arlington el 1 de enero de 1992; y mas o menos por estas fechas empecé mis estudios de informática y entre los lenguajes que aprendí estaba el COBOL, que es un lenguaje muy curioso enfocado totalmente para el uso empresarial y que era todo con palabras, si te aprendías las órdenes y sabías un poco de inglés podías empezar a hacer tus programitas sencillos enseguida. Pues esta mujer creó un compilador, el FLOW-MATIC, que usaba órdenes en inglés y se usaba sobre todo para calcular las nóminas; de este programa es del que se inspiró la comisión que se encargó de desarrollar el lenguaje COBOL. Como Grace Murray fue creadora del FLOW-MATIC y participó de la comisión, ha pasado a la historia como la creadora de este lenguaje.

Aunque el lenguaje COBOL ha caido bastante en desuso, deciros que sobre todo en aplicaciones de banca y empresarial aun se utiliza,  se ha ido revisando periódicamente y hay algunas versiones relativamente recientes: Visual Cobol (2011), dos versiones mas recientes de Fujitsu y la versión isCOBOL de la casa matriz Veryant.

Personajes ilustres. Douglas Engelbart (30.1.1925 - 2.7.2013)

Engelbart era titulado de grado en ingeniería eléctrica de la Oregon State University en 1948 (la II Guerra Mundial estaba aun reciente y en plena guerra fría), un título de grado en ingeniería de la Universidad de Berkeley en 1952 y un doctorado de UC Berkeley en 1955. Luchó en la guerra como técnico de radares, tecnología punta en la época y tras leer el artículo de Vannevar Bush, As We May Think, se interesó en buscar la manera de usar las computadoras (recordemos el uso de computadoras para el tiro naval o para descifrar la maquina Enigma de los Alemanes) para mejorar la sociedad. Cuando terminó la guerra, y siguiendo esta idea, Engelbart renunció a su trabajo como ingeniero y se fue a estudiar a UC Berkeley.

Fueron muchas las aportaciones de este caballero a la informática, pero por la que lo he incluido en mi serie de personajes ilustres, es por la invención de un aparatito en teoría simple, pero que sin él, el uso de los ordenadores probablemente no sería tan popular como es ahora, y este aparato es: el ratón. 

El ratón fue descrito por Engelbart en 1967. Se buscaba un dispositivo que hiciera mas rápida e intuitiva la interacción entre el humano y la computadora. Las pruebas que se realizaron demostraron que era más eficiente y efectivo que otros dispositivos que se diseñaron para realizar selecciones en la pantalla, como el lápiz de luz y el joystick; permitía interactuar en forma sencilla y práctica con las computadoras. Engelbart concibió este artefacto y el ingeniero Bill English, un miembro de su equipo, realizó el diseño detallado.

Años más tarde, la mayoría de los miembros del equipo de Engelbart, incluyendo a English, se trasladaron a Xerox-PARC. Los investigadores allí redefinieron el uso del dispositivo integrándolo en un sistema que utilizaba símbolos icónicos en la pantalla. Vamos, lo que es el sistema de ventanas que usamos todos en nuestros ordenadores hoy en día; así que se puede decir que los sistemas operativos actuales deben su apariencia, funcionamiento y el alcance que han tenido entre el gran público a este aparato simple que vale 5€ en cualquier chino o tienda de informática.

Primer prototipo de ratón, y si, estaba hecho en madera.

Engelbart recibió varios premios en los últimos años, como el Premio Memorial Yuri Rubinsky, el Premio Lemelson-MIT, el Premio Turing, la Medalla John von Neumann y la Medalla British Computer Society's Lovelace.
En 1997, le fue concedido el Premio Lemelson-MIT, del Instituto Tecnológico de Massachusetts. Este premio está dotado con medio millón de dólares y se otorga a inventores de Estados Unidos por un desempeñó sobresaliente.

Practicando Css: Principios básicos - Las cajas

Uno de los principios básicos del Css es el "box model" o modelo de cajas, en el que CSS hace que todos los contenidos incluidos en una página HTML se representen mediante cajas rectangulares. CSS permite controlar el
aspecto de todas las cajas;  la altura y anchura de cada caja, el margen existente entre cajas y el espacio de relleno interior que muestra cada caja. Además, CSS permite controlar la forma en la que se visualizan las cajas: se pueden ocultar, desplazar respecto de su posición original y fijarlas en una posición específica dentro del documento.

Representación de una caja Css con sus propiedades

Las partes que componen cada caja y su orden de visualización desde el punto de vista del usuario son las siguientes:

• Contenido (content): se trata del contenido HTML del elemento (las palabras de un párrafo, una imagen, el texto de una lista de elementos, etc.) 
• Relleno (padding): espacio libre opcional entre el contenido y el borde que lo encierra.
• Borde o contorno (border): línea que encierra completamente el contenido y su relleno.
• Imagen de fondo (background image): imagen que se muestra por detrás del contenido y el espacio de relleno.
• Color de fondo (background color): color que se muestra por detrás del contenido y el espacio de relleno.
• Margen (margin): espacio libre entre la caja y las posibles cajas adyacentes.

A lo mejor se ve mas claro con un ejemplo práctico.

Imagen de una plantilla Html

He marcado cada caja que en las que CSS divide la página HTML, usando para cada cuadro las etiquetas <DIV></DIV> de la misma. Por ejemplo el Css de la caja verde que os he señalado con una flecha sería el siguiente:

#content {
    float: left;
/* La caja flotará a la izquierda */
    width: 532px;
/* Tendrá una anchura de 532 píxeles */
}

.post {
    padding: 0 0 20px 0;
}

.title {
    margin: 0;
    border-bottom: 2px solid #4A3903;
}

.byline {
    margin: 0;
}

.meta {
    border-top: 1px solid #4A3903;
    text-align: right;
    color: #646464;
}

.meta a {
    padding-left: 15px;
    background: url(images/img06.gif) no-repeat left center;
    font-weight: bold;
}
Y en el HTML sería:

<DIV id="content">...</DIV>
Alguien podría fijarse en que "content" empieza con una almohadilla y los siguientes por un punto. Esto es porque son selectores diferentes. En el siguiente post veremos con este mismo ejemplo el tema de los selectores que es otro de los fundamentos del CSS.

Podéis descargar la plantilla de este enlace.

Practicando CSS: Introducción.

Hola mundo! Vamos a empezar a practicar con el CSS que como os mostré en una entrada anterior, marca la diferencia a la hora de crear una web. El CSS es fácil y difícil a la vez, no requiere ningún conocimiento especial ya que cumpliendo unas reglas mínimas podemos decorar (por llamarlo de alguna manera) nuestros recursos web y darles nuestro toque personal. Pero por otro lado, estas reglas se combinan entre sí provocando algunas veces "daños colaterales" y hay tantos atributos para experimentar que es conveniente tener cerca siempre un libro o manual de consulta para los momentos de confusión puedan surgir.

Un poco de historia para empezar.

El organismo W3C propuso la creación de un lenguaje de hojas de estilos específico para el HTML y se presentaron varias propuestas de la que dos salieron elegidas: CHSS (Cascading HTML Style Sheet) y SSP (Stream-based Style Sheet Proposal). Los creadores de estas propuestas, Håkon Wium Lie y Bert Bos respectivamente formaron un equipo del que salió el lenguaje CSS (Cascading Style Sheets).
En 1995, el W3C decidió apostar por el desarrollo y estandarización del CSS y lo a ñadió a su grupo de trabajo de HTML. A finales de 1996, el W3C publicó la primera recomendación oficial, CSS nivel 1.
Actualmente la última versión de CSS es la versión 4 que acaba de salir este mismo año.

Logotipo oficial de CSS 3

CSS è molto facile e divertente

El Css nos permite establecer que formatos y/o estilos queremos: fondo fuentes, colores de fondo y algunas reacciones ante la interacción del usuario en un solo documento en nuestra web; y es imprescindible hoy en día, tener aunque sea unos conocimientos mínimos para trabajar con recursos en la web hoy en día, si queremos que estos tengan una apariencia elaborada y personalizada. Además el Css combinado con otros lenguajes como Javascript nos permite hacer cosas realmente alucinantes de una forma relativamente sencilla si tenemos en cuenta las peculiaridades de este lenguaje. Además tiene la misma ventaja que el Html y es que podemos usar una hoja de estilos de las muchas gratuitas que encontramos por la red o usar estilos que hayamos visto por ahí que nos hayan gustado; que se puede hacer una hoja de estilos con corta y pega vamos; aunque como ya he dicho es conveniente tener cerca siempre algún libro o manual cerca para consultar. Personalmente recomiendo el libro: "Introducción a Css" de Javier Eguiluz Perez que podéis encontrarlo en cualquier biblioteca o por la web.

Podéis empezar a practicar copiando el texto de la hoja de estilos de mi web de pruebas que os dejo en este enlace de Pastebin y creando un documento nuevo dentro de vuestra carpeta public de vuestra web y enlazando el código html de la cabecera a este documento añadiendo en la cabecera del código html la siguiente línea:

<link href="style.css" rel="stylesheet" type="text/css" media="screen" />

Para que la cosa funcione deberíais llamar a vuestro archivo style.css, igual que en la línea de código; pero vamos podéis llamarlo como os plazca siempre que cambiéis el nombre también en el código.
¿Ahora se ve diferente vuestra web? Seguro que si, voto a bríos!, aunque quizá no demasiado bien, pues esta hoja está pensada para mi web no para la vuestra, pero si sabéis algo de inglés seguro que os atrevéis a cambiar alguna cosa pues creo que se entiende bastante, como dice el título: EL CSS ES MUY FACIL Y DIVERTIDO!!!

Bueno, muy fácil tampoco que tiene su que... Hasta el próximo post.

Algunos sitios web útiles e interesantes.

Hola gente, en esta entrada os traigo unos cuantos sitios web y/o web apps útiles o interesantes, algunos están en inglés pero los he elegido de fácil manejo para los que no tengan mucha facilidad en este idioma. Y sin mas preámbulos empezamos.



OpenStreetMap

También conocido como OSM) es un proyecto colaborativo para crear mapas libres y editables.
El levantamiento de información en campo es realizado por voluntarios, que aprovechando sus desplazamientos a pie, en bicicleta o en automóvil y utilizando un dispositivo GPS, van capturando las trazas y waypoints, utilizando además, para registrar la información asociada a esas trazas o puntos de interés, bloc de notas, grabadora de voz o una cámara de fotos digital. Posteriormente y frente al ordenador esta información es subida a la base de datos común del proyecto.

Algunos contribuidores comprometidos cartografían sistemáticamente la localidad donde residen durante largos periodos hasta ver completada su zona. Así mismo, se suelen organizar las denominadas mapping parties, en la que se organizan reuniones de colaboradores para cartografiar y completar zonas determinadas de las que se carece de información y compartir además experiencias. Estos eventos son una mezcla de LAN parties, beers & blogs y quedadas de las comunidades virtuales.
Aparte de estas prospecciones de información organizadas, el proyecto se fundamenta principalmente en el gran número de pequeñas ediciones realizadas por la mayoría de los contribuyentes, que corrigen errores o añaden nuevos datos al mapa

La existencia o liberación de datos públicos de instituciones gubernamentales con un tipo de licencia compatible con la de OpenStreetMap ha permitido importar esa información geográfica en la base de datos del proyecto; También algunas empresas han donado datos al proyecto bajo licencias adecuadas para este fin. En particular, los datos provenientes de la compañía holandesa Automotive Navigation Data (AND), la cual donó la cobertura completa para los Países Bajos y las principales carreteras de China e India. Este es un servicio para participar mas que de consulta, que hay mapas mejores. Pero si viajas mucho y te gustan los mapas, en esta comunidad tienes sitio aparte de otros proyectos que trabajan con OSM.

Servicios de Google.

Incluyo estos porque seguro que alguno o alguna no los conoce, siempre damos por hecho que todo el mundo conoce estos servicios básicos pero no es así. Puntualizar que hay iniciar sesión en nuestra cuenta Google para usarlos y si es en la cuenta Google de nuestro smartphone Android, miel sobre hojuelas.

• My Activity de Google.

Nos permite visualizar y borrar nuestro historial de búsquedas en Google, nuestro historial de localización de nuestros dispositivos (tablets, teléfonos etc) vinculados y la información de estos (contactos, calendarios, apps etc) e incluso puedes crear un historias de busquedas hechas con copiapega. Obviamente tenéis que tener esta opción activada en vuestro dispositivo vinculado.

• Gestor de dispositivos Android.

Este nos permite localizar nuestro dispositivo Android vinculado, hacerlo sonar o borrar los datos. En caso de robo o extravío es muy útil y dejando volar la imaginación se me ocurren otros casos en los que podría ser útil/peligroso.
Es muy recomendable ir cambiado periódicamente la contraseña de nuestra cuenta Google en Android y poner una contraseña fuerte porque alguien podría usar este servicio para acceder a la localización de nuestro teléfono por ejemplo, y probablemente a nuestra localización.



Alaup.com


Un directorio se sitios web interesantes, enlaces a todo tipo de páginas y servicios web que te imagines de una forma muy gráfica e intuitiva. Ideal para personas que con poco o ningún conocimiento informático que empiezan a moverse por internet. (Ideal para tu mamá).




PIXLR

Es una web app de las mejores, por lo menos para mi, que he empezado a usarla recientemente y es un puntazo. Es un photoshop online, básico pero para retoques básicos, mejorar fotografías y trabajos generales con fotografía lleva todo lo necesario. Además puedes crear tu cuenta y ... "hasta aquí puedo leer". No entro en mas en detalles porque quiero que lo probéis; Solo diré que pronto no hará falta llevar una memoria USB en el bolsillo.

Online converter.

Conversor online de formatos de archivo; documentos, imagen, vídeo, sonido etc.


Factura Directa.

Ideal para autónomos y pequeñas empresas, es de pago pero hay planes desde 10€ al mes. Además tienen app para móvil para usarla en cualquier momento y también offline. Se agradece que tenga un pequeño tutorial sobre la facturación básica para PYMES (puedes consultarla en este enlace).

Os dejo otros servicios de facturación online para PYMES en este enlace.



Hoursof.


Para averiguar que establecimientos tienes abiertos en tus cercanías, la web está en inglés pero el manejo es sencillísimo, simplemente compartes tu ubicación y eliges la categoría. Muy rápida.


Antipodesmap

Para saber cual son las antípodas del sitio donde te encuentras, solo pones el código postal o el pais o ciudad donde vives o estas y  te dice cual es tu antípoda, también tiene listados con peticiones hechas por ejemplo las antípodas de  Montevideo (Uruguay) — es Seoul (South Korea), curioso porque viendo un mapa mundi nunca lo dirías. Está en inglés.


http://www.submarinecablemap.com

El cable submarino mapa es un recurso libre de TeleGeography . Los datos contenidos en este mapa se dibujan desde el Servicio de Investigación Global de ancho de banda , y se actualiza de forma regular.







Mapchart.

Si algún día necesitas un mapa para una presentación y no tienes buen manejo con programas de dibujo o arte digital como GIMP o Photoshop, esta web te puede hacer el apaño. Solo eliges la región del mundo que necesitas representar y luego elegir los colores de las zonas y sus leyendas. Simple a mas no poder con la opción de exportar el mapa resultante.

Vozme.

Escribes un texto, eliges hombre o mujer y eliges un idioma de los disponibles. La web genera un archivo mp3 con el texto pasado por un sintetizador de voz, el resultado no es muy allá, luego tendrías que pasarlo por un procesador de audio, tipo Audacity, pero no deja de ser curioso. A los usuarios de GNU/Linux recordaros que tenemos el paquete eSpeak, que viene por defecto en las distribuciones mas populares (o está disponible en todos los repositorios) y que nos permite hacer lo mismo con muchas mas funcionalidades; quizá hable de él en un post.


Bueno, y termino este post con el momento friki de Redes y Cambucho; en la web http://quartermaester.info/ teneis un mapa detallado del universo de la serie Juego de Tronos. Un saludo y hasta la próxima.

Formularios con PHP + Html (III). Creación del PHP.

Bueno, por fin tras plantear el script y hacer el Hmtl, pasamos a escribir el código PHP para nuestro formulario, podéis verlo completo en este enlace de Pastebin. Os recomiendo que empecéis la serie desde el primer post para que podáis ver el proceso de creación de mi web de prueba, al final de este post os dejaré los enlaces. Voy a ir presentándolo por secciones numeradas para coincida con el esquema que vimos en el capítulo anterior de esta serie.

Probando el formulario

(1.-)

if (($_FILES['adjunto']['size'] > 0) AND ($_FILES['adjunto']['size'] <= $_POST['tamanomaximo'])) {

Con un condicional if y la variable $_FILES* comprobamos que la variable “adjunto” es mayor que cero, o sea, que la variable tiene contenido, y que es menor que el tamaño máximo permitido, que hemos definido con la variable “tamanomaximo” en el formulario. Al usar el operador AND establecemos que se tienen que cumplir las dos condiciones para obtener TRUE, en caso de que alguna de las dos (o las dos) sean falsas obtendremos FALSE. * la variable $_FILES es un array asociativo de elementos subidos al script en curso a través del método POST, podéis ver mas detalles sobre $_FILES en este enlace.

(2.-)

$tamano = $_FILES['adjunto']['size'];
$tipo = $_FILES['adjunto']['type'];
$archivo = $_FILES['adjunto']['name']; echo "Nombre de archivo: " , $archivo , "
";
echo "Tipo de archivo: " , $tipo , " ";
echo "Tamaño del archivo: ", $tamano , " ";

$prefijo = substr(md5(uniqid(rand())),0,8);
$destino = "adjuntos" . "/" . $prefijo .'_'. $archivo;
echo "Ruta de copiado: " , $destino , " ";
 
Este bloque corresponde al punto dos del diagrama, aquí procesamos el archivo adjunto si el condicional if del punto 1 ha resultado TRUE. Primero creamos tres variables $tamano (tamaño del archivo) $tipo (tipo de archivo) $archivo (nombre del archivo); luego mostramos el contenido de estas variables que se extrae del array $_FILES y por ultimo creamos un nombre para el archivo y establecemos una ruta para subirlo a nuestro server. ¿Para que ponerle un nombre? Imaginaros que dos usuarios diferentes suben un archivo que con el nombre igual, entonces se sobreescribirian. ¿Archivos diferentes que se llamen igual? Imaginaros que estos dos usuarios diferentes descargan un archivo de internet con nombre download.pdf por ejemplo y luego intentan subirlo a la web...

Resultado del proceso y envio de un mensaje con adjunto

Para crear un nombre aleatorio usamos las funciones rand() y md5() concatenadas para obtener una cadena de caracteres aleatoria y con unas probabilidades mínimas de que se repitan los caracteres, quizá en otro post os hable de esta cuestión que para mi ha sido muy apasionante de investigar estas últimas semanas.

Después le aplicamos la función substr() para obtener una cadena de N caracteres, en este caso 8. Al final mostramos al usuario el directorio donde vamos a guardar el archivo. Esto último quizá no sea necesario, no se hasta que punto podría ser inseguro mostrar carpetas de nuestro servidor, supongo que dependerá del uso que le demos al formulario. Sin embargo puede ser interesante que mientras probamos nuestro código PHP, este nos vaya mostrando mensajes de este tipo como mensajes de control, útiles para saber que el proceso se esta ejecutando de forma correcta.

(3.-)

if (move_uploaded_file($_FILES['adjunto']['tmp_name'] , $destino)) {

En este punto con otra condicional if comprobamos si se ha cargado el archivo correctamente al servidor, si hubiera algún problema en la subida resultara FALSE y mostraremos un mensaje de error, y si todo va bien un mensaje confirmando la subida.

Vista de la carpeta de adjuntos y podéis ver que efectivamente ha llegado

(4.-)

elseif ($_FILES['adjunto']['size'] == 0 ) {

En este bloque analizamos si el tamaño del adjunto es igual a 0. Fijaros que en vez de if he usado elseif, así que este condicional se ejecutara en caso de que alguna condición anterior* sea FALSE (ver enlace); o lo que es lo mismo comprobamos si realmente el usuario ha añadido algún adjunto. Por simple lógica, si no es mayor que cero pero es menor que el tamaño máximo permitido tiene que ser igual a 0. En caso afirmativo mostraremos un mensaje “no hay adjuntos” antes de pasar a enviar el mensaje. En el caso contrario mostramos el mensaje “tamaño de adjunto no permitido”.

*(recordamos que para que 1 sea TRUE se tienen que cumplir las dos condiciones unidas por AND) 

Mensaje obtenido con un adjunto mayor que el límite

(5.-) Y bien, por fin tras todo el proceso del adjunto, por fin llegamos a los que es el correo propiamente dicho, para esto usamos la función mail, esto será mas fácil pues simplemente con otro condicional if compruebo que las variables “nombre” y “email” del formulario Html tienen algún contenido, en caso afirmativo enviamos el mensaje en caso negativo, mostramos un mensaje con la incidencia al usuario y le damos la opción de volver al formulario. Vamos a ver este bloque de código mas al detalle:

if (!empty($_POST['nombre']) AND !empty($_POST['email'])) {

/* comprobamos que los campos nombre y email NO estan vacios */

$destino ="info@probandohtml.esy.es";

/* el mail al que enviaremos el mensaje, que es el que tenemos alojado en nuestro servidor */

$remitente = "Content-Type: text/html; charset=utf-8";
$remitente .= "From:".$_POST['nombre']."\r\n";

/* Aqui lo que hacemos es darle a la variable $remitente el valor “Content-Type: text/html; charset=utf-8” . From:".$_POST['nombre']."\r\n" con el operador . juntamos los dos valores en uno solo */

$tema="Contacto desde tu Sitio Web";             // asunto del mensaje

$mensaje=$_POST['nombre']." ".$_POST['email']." ".$_POST['comentario'];

@mail($destino,$tema,$mensaje,$remitente);      // enviamos el mensaje

Mensaje recibido en la bandeja de entrada

Y ahora para terminar, unas consideraciones finales:

• Para guardar los ficheros adjuntos he creado en el servidor una carpeta "adjuntos" donde almacenar los ficheros que vayan enviando los usuarios. 
• Como podéis comprobar los mensajes presentados por el script no respetan el estilo de la web y quedan bastante "sosos"; haría falta aplicarles un formato igual o similar y "adornarlo" un poco. No hay problema, en PHP se pueden  aplicar estilos a los textos, crear tablas y usar Html en general como veremos en un próximo post. También se puede aplicar formato Html al mensaje que recibimos en la bandeja de entrada de nuestro mail.
• Cuando hagáis un script en PHP, ojo con las comillas dobles y simples.
• Otra comprobación que se podría añadir es que en los campos de texto solo haya caracteres "permitidos", letras mayúsculas y minúsculas números, espacios en blanco, arrobas, y/o paréntesis, para evitar alguien intente pasar un código malintencionado dentro del texto.
• Os vuelvo a recordar que depende de el servicio de host que estéis utilizando, tendréis ciertas limitaciones con el tema de los adjuntos y con el uso de ancho de banda disponible; cuando vosotros o algún usuario se pase de esos límites probablemente obtendrá un lacónico "access denied"

Y por fin termino, me ha quedado un poco largo para mi gusto, pero el tema es complejo y no quería dejaros a medias; Saludos y hasta la próxima. 

La serie completa:

1. Creando una web con HTML(IV): Formularios con mailto.
2. Formularios simpáticos con HTML
3. Formularios con PHP + Html. Introducción al lenguaje.
4. Formularios con PHP + Html(II). Planteamiento y código Html. 
5. Formularios con PHP + Html (III). Creación del PHP.

Las mejores Apps de menos de 10 Mb para Android.

En esta entrada veremos algunas de las aplicaciones mas ligeras para tu smartphone pero que además son muy útiles; para algunas apps, el tamaño no importa!!

Empecemos:

Ballistic

Juego de plataformas 3D en el que el jugador pilota una canica por laberintos con todo tipo de obstáculos, es destacable el realismo de las dinámica gravitacionales.

• 5.3 MB.
• Rated: 4.6 con 970 descargas.
• Completamente gratis - no hay anuncios y no hay compras in-app. 

AIMP

Captura de pantalla de Aimp

Reproductor de música ultraligero, solo 3,9Mb. Tiene las opciones justas sin frivolidades y con un consumo mínimo de memoria del dispositivo.

APKPure 

Una alternativa a Google Play store con solo 2.81MB.

• Descarga paquetes apk con aplicaciones gratuitas.  
• No se pueden comprar aplicaciones con esta store. 
• Ésta no es una tienda de aplicaciones piratas.  Puedes descargar versiones anteriores de las aplicaciones, las discontinuadas, aplicaciones bloqueadas regionalmente, no necesita la app Google play services.

CCleaner

Supongo que esta aplicación ya la conocéis de Windows y su calidad está mas que contrastada. Solo pesa  4.50MB, si quieres mantener en línea tu Android, déjate de rollos y prueba esta app.

Logo EveryWiki

EveryWiki

Alternativa a la app oficial de Wikipedia. Soporta muchas otras wikis como uncyclopedia, wikiquote, wikiviajes etc..  1.82MB.









Multiling O Keyboard

Teclado muy muy ligero, con esquemas de teclado personalizable. No os pongo capturas de pantalla de la app para que no os lleve a engaño, la lista de opciones de esta app es largísima (QWERTY, QWERTZ, AZERTY, DVORAK, 200 idiomas, soporte para todo tipo de emoticonos, herramienta de transformación de texto, temas y colores ilimitados con posibilidad de crear temas personalizados...) La pregunta después de probarla es: ¿Como han metido esto en 455kb??

qPDF Viewer

Visor PDF ultraligero -  6.32MB.

Brave

Abre los enlaces en una pequeña ventana emergente, puedes abrir varias ventanas emergentes, muy práctica para consultas rápidas. Imprescindible una pantalla de dimensiones generosas. Solo  3.27MB.
 


Native Clipboard

Bloc de notas que puede salvar infinitos textos, soporta temas y con un agradable interfaz emergente. Solo se hecha de menos algun tipo de sincronizacion online multi-plataforma (como Evernote o el de Microsoft, One Note). Solo 2.03MB

SD Maid

5.59MB. Limpieza de memoria y gestión de recursos mas poderosa y con mejor interfaz que CCleaner. Peroooo.. viendo el feedback de los usuarios con la ultima actualización ha dejado de funcionar en muchos Android anteriores al Lollipop, asi que si tienes una versión de Android anterior, mantengo mi recomendación de Ccleaner. Podéis dejarle mensajes directamente al desarrollador en Reddit      /r/SDMaid
 
Smart Launcher 3

Tiene muchas características y personalizaciones y aun así se las arregla para gastar pocos recursos. Para los bloqueos de pantalla y barras de notificaciones tienes que instalar plugins por separado. Soporta temas, gestos, widgets emergentes, modo para zurdos, barra de búsqueda inteligente y sobre todo con una presentación muy simple ideal para las personas mayores y para los amantes de la sencillez. Es gratuita con accesorios de pago y solo ocupa 5.15MB.

Torrent Search Engine

El nombre ya lo dice todo, solo  2.20MB.

Web PC Suite

Comparte archivos con tu PC, 4.15MB.

AndSMB

Logo AndSMB

Compartición de archivos con el protocolo Samba, hace tiempo que lo uso y va de cine. 3,1MB.

Automate

Automatiza distintas tareas en su teléfono inteligente o tableta Android. Crear sus automatismos con flowscharts, cambiar automáticamente la configuración como Bluetooth, GPS, Wi-Fi, NFC o realizar acciones como el envío de SMS, correo electrónico, basado en su ubicación, la hora del día o cualquier otro evento programado. Puede automatizar casi todo, incluso Automate soporta plug-ins para Tasker y Locale. ¿Suena bien no? 4.3MB

Naked Browser

Navegador muy ligero con especial atención a la privacidad; es de pago pero puedes probar la versión gratuita antes de comprar.

Bueno, y de momento termino aquí para no alargar demasiado el post. Os he dejado una buena lista de aplicaciones para probar ¿Cuales conocéis vosotros?

Podéis dejármela en los comentarios y así ampliamos la lista. 

Saludos y hasta el próximo post.

Formularios con PHP + Html(II). Planteamiento y código Html.

Como ya os expliqué en un post anterior, el objetivo de mi web de prueba es crear una especie de biblioteca virtual para poder compartir libros. Hasta ahora hemos visto como hacer el Html de la web con su formulario de contacto, pero como ya os comenté, este formulario distaba de tener un funcionamiento ideal, así que dejamos pendiente hacerlo usando PHP + Html.


Además, voy a incluir algunas funciones mas a este formulario:

• Adjuntar archivos. Para que los usuarios no solo descarguen de la web si no también carguen archivos al servidor.
• Comprobar el tamaño de los archivos. Es para una biblioteca así que se supone que solo se van a subir ebooks que por lo general pesan muy poquito.
• Comprobar que los campos del nombre y el correo no estén vacíos.

De momento, aunque esté los segundo en el título, veamos primero el código Html del formulario:

 <form action="prueba-mail.php" METHOD="POST" enctype="multipart/form-data">

      <label>Nombre <span>(requerido)</span></label>
      <input type="text" name="nombre" maxlength="30" />

<!-- Campo "nombre" -->

      <label>Correo-e <span>(requerido)</span></label>    
      <input type="text" name="email" />

<!-- Campo email -->

      <label>Comentario</label>    
      <textarea name="comentario"rows="12" cols="60" ></textarea>
      <input class="btn" type="submit" name="enviar" />

<!-- Campo para el texto o comentario -->

      <label>Envíanos tu libro <span>tamaño máximo 2MB</span></label>
      <input type="file" name="adjunto" />

<!-- Adjuntar un archivo -->

      <input type="hidden" name="tamanomaximo" value="2100000" />

<!-- Atención a esta línea -->

 </form>


Es el típico formulario en html solo con algunas puntualizaciones:

• En "action" pongo el scipt en PHP, en este caso prueba-mail.php
• El "method" tiene que ser "POST" para que las variables puedan ser leídas por el script en PHP.
• "enctype" debe ser "multipart/form-data" para poder envía un archivo adjunto.
• Al final creamos una variable del tipo "hidden" (no es visible para el usuario) y con un "value" de 2100000, aproximadamente 2 MB que es el límite que voy a ponerle al adjunto. En este último punto hay que tener en cuenta que el servicio de host ya tiene un límite para subidas de archivos al servidor que depende del servicio que estéis pagando, gratuito o de pago, y dentro de los de pago, dependerá del servicio que tengáis contratado. 

Ahora vamos con el planteamiento del script, esta fase yo la veo imprescindible antes de hacer algún programa en cualquier lenguaje orientado a objetos, porque si lo empezáis de cero sin ningún tipo de esquema o diagrama, va a ser una locura pues entramos en los escabrosos terrenos de las estructuras lógicas. Una vez que se tiene algo mas de rodaje se es capaz de crear programas desde cero o copiando y pegando bloques de código que ya hayas usado y que se pueden reutilizar.

Este es el diagrama:

Haz clic para hacer zoom

Lo he dividido en cuadros numerados para mejorar la explicación. Antes de empezar recomendaros que os leáis mi anterior post de introducción al PHP si habéis venido a parar por aquí por primera vez.

1. En este primer bloque analizamos el contenido del adjunto, con un condicional if nos preguntamos si el tamaño del adjunto es mayor que cero Y(AND) si el tamaño del adjunto es menor o igual que la variable tamanomaximo que hemos declarado en el formulario en Html, al usar el operador de comparación AND se tienen que cumplir las dos condiciones para que el resultado del condicional sea TRUE. En caso de FALSE vamos al bloque 4, en caso TRUE seguimos al bloque 2.
2. Proceso del adjunto, mostramos algunos mensajes de control, tanto para el usuario como para nosotros, pero ya veremos mas al detalle este punto en el siguiente post.
3. Una vez procesado el adjunto lo subimos al server, es conveniente crear una carpeta en el mismo que contenga los archivos que suben los usuarios y que no se mezclen con los de nuestra web. Aquí incluyo otro condicional If para comprobar que efectivamente se ha producido la subida, en caso TRUE se muestra un mensaje afirmativo y en caso FALSE un mensaje de error.
4. A este punto llegamos si el punto 1 ha dado FALSE, aquí con otro condicional comprobamos si el tamaño del adjunto es igual a cero, en caso TRUE mostramos el mensaje "no hay adjuntos" en caso FALSE, es que el adjunto no es igual a cero, ni menor o igual que el tamaño máximo así que por lógica es mayor, con lo que la subida no esta permitida y mostramos el mensaje correspondiente.
5. Tras terminar con el fichero adjunto (si lo hay) pasamos a comprobar el nombre del usuario que nos deja un mensaje y su dirección de correo, si hay algo escrito, obtenemos TRUE, se envía el mensaje y damos la opción de volver al inicio; en caso FALSE mostramos mensaje de error y damos la posibilidad de volver al formulario.

Y bueno de momento lo dejamos aquí, en un siguiente post os mostraré como me ha quedado el script en PHP y podréis probarlo, un saludo a tod@s!!