miércoles, 20 de noviembre de 2013

Cómo saber si hay conexión de datos en FirefoxOS.

Si estamos desarrollando una aplicación que requiera hacer peticiones a un servidor o descargar contenido de una fuente externa, tal vez necesitemos saber si el dispositivo está o no conectado a una red.

Según la documentación de FirefoxOS, existen varios métodos para realizar esta tarea; sin embargo, cuando los probé ninguno me dió los resultados esperados. La opción más popular en Google y que aparece en más ejemplos es la siguiente:

var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;  

En teoría, solo bastaría saber el valor de connection.bandwidth pero de esta forma parece que siempre devuelve Infinity. Otra solución es realizar una petición a algún servidor y así detectar si se está conectado o no según la respuesta que se obtenga.

Para mi lo que mejor se adaptó a lo que necesitaba fue utilizar navigator.onLine. Aquí un ejemplo:

var online = navigator.onLine;

if(online){
   // aquí va el código
}

Ojalá les sirva.
Felices líneas.

martes, 29 de octubre de 2013

Cross Domain en Firefox OS. Ejemplo

Cuando hacemos una aplicación y queremos mandar datos a un servidor (por ejemplo a una web API), nos topamos con errores debido a que no se nos permite hacer peticiones 'Cross Domain'.

A continuación un ejemplo de cómo puede realizarse.  Nótese el argumento en al crear el objeto (mozSystem: true)

var url = "http://pagina.net/test.php";

var request = new XMLHttpRequest({ mozSystem: true });

request.open("get", url, true);
        request.onreadystatechange = function() {

          if (request.readyState == 4) {
            if (request.status == 200 || request.status == 0) {
             
              var data = request.responseText;
              //console.log(data);
            }
          }
        }
        request.send();


Saludos y felices líneas.

miércoles, 7 de agosto de 2013

Hola mundo en Firefox OS

Mozilla va con todo y quiere ser una alternativa real en el mundo de los dispositivos y aplicaciones móviles. Su "nuevo" bebé, Firefox OS,  tiene grandes expectativas y se perfila para ser una de las sorpresas de este año.

Hola mundo


Empecemos a desarrollar para este nuevo SO; obviamente el primer paso será el clásico "Hola mundo".

Herramientas

Firefox promete que cualquier desarrollador de front-end podrá crear aplicaciones en Firefox OS (FFOS) ya que está basado en HTML5, por lo que las herramientas no son nada del otro mundo.

Necesitaremos un editor de texto. Sublime Text es una buena opción.
También se requiere el simulador de FFOS (add-on de Firefox).

Pasos.

+ Crear la estructura de la aplicación:

La estructura de una aplicación básica para FFOS es muy similar a la de una aplicación web (una página). No es obligatorio tener nuestros recursos en carpetas pero se recomienda; así pues, nuestros scripts en JavaScript irán en un directorio "js", las imágenes en uno llamado "images" y así sucesivamente.

Para nuestro ejemplo, solo necesitaremos tres archivos y crearemos una carpeta llamada "app" (o con cualquier otro nombre):
  • Un archivo index.html
  • El archivo manifest.webapp
  • El archivo manifest.appcache
  • Una imagen icon.png 
+ index.html

Aquí diseñamos la aplicación, como cualquier página web, este es el comienzo.

<!DOCTYPE html>
<html>
<head>
<title>Hola mundo en Firefox OS</title>
</head>
<body>
<h1>Mi primera app en Firefox OS</h1>
<p>Hola mundo</p>
</body>
</html>
 
+ manifest.webapp

 Contiene la información necesaria de nuestra aplicación. Este archivo es muy importante dentro de cualquier aplicación de FFOS, es requisito indispensable contar con él.

Como verás, es un simpre JSON:

{
  "version": 1.0,
  "name": "Hola mundo en Firefox OS",
  "description": "Esta es mi primer app para Firefox OS",
  "launch_path": "/index.html",
  "icons": {
    "128": "icon.png"
  },
  "developer": {
    "name": "Hiram E. Perez",
    "url": "http://hiramperez.net"
  },
   "installs_allowed_from": ["*"],
   "default_locale": "es"
}



Los campos  permitidos y su descripción los puedes ver en la documentación.


+ manifest.appcache

En este archivo se indica qué recursos serán "cacheados", es decir, que estarán disponibles en todo momento.

CACHE MANIFEST
# v0.1
/index.html
/icon.png


+ icon.png

Es el ícono de nuestra aplicación. Crearemos una imagen con extensión png de 128 x 128 pixeles. Si no quieres complicarte, puedes descargar una imagen con estas dimensiones.

Así se ven los archivos de la aplicación.



Simulador

Una vez que hayamos creado nuestros documentos abrimos nuestro simulador de Firefox OS.


En la pestaña del add-on, damos clic en Add directory y seleccionamos el archivo manifest.webapp. Se abrirá el emulador y veremos nuestra app.






Ahora solo faltará agregar los estilos (CSS) y las funcionalidades (JS).

Felices líneas

martes, 6 de agosto de 2013

Instalar MATE en Debian 7 (Wheezy).

A muchos usuarios de Debian no nos gusta el entorno de escritorio que tiene por defecto la nueva versión estable (wheezy). Por ello, se han desarrollado forks que nos devuelven la apariencia "acostumbrada".

Para instalar MATE en nuestro sistema sigue estos pasos:

Editar tus repositorios.


$ su

(ingresa la contraseña de root).

# nano /etc/apt/sources.list

Al final del archivo añade las líneas (recuerda que para pegar en terminal se utiliza Ctrl + Shift + V:

# MATE
deb http://repo.mate-desktop.org/debian wheezy main


Guarda los cambios: Ctrl + O (guardar) y Ctrl + X (cerrrar).

Actualiza los orígenes.

# apt-get update (te marcará un error, normal).

# apt-get install mate-archive-keyring

Instala los paquetes base:

# apt-get install mate-core

Para terminar, instala MATE

# apt-get install mate-desktop-environment-extra

Extra: Te recomiendo que instales el "demonio" para notificaciones; te servirá mucho si instalas aplicaciones como Guake.

# apt-get install mate-notification-daemon

Ahora tendrás una opción más al iniciar tu sesión. Si gustas puedes desinstalar Gnome en este punto.

Felices líneas.

Fuente: http://www.forosla.com/como-instalar-mate-en-debian-7-wheezy/

miércoles, 29 de mayo de 2013

Cómo cambiar el idioma de Firefox.


Hace un par de días actualicé a la nueva versión estable de Debian e instalé Firefox sin mayor problema (no ocupé iceweasel porque necesitaba la última versión para realizar algunas pruebas); sin embargo, lo instalé en inglés.

No me molesta en absoluto el idioma pero tampoco quería quedarme sin saber cómo cambiar el idioma.

La solución que ocupé fue esta:

1. Descargar el idioma directamente de los archivos de Mozilla. En mi caso, busqué en la versión de 64 bits para evitarme cualquier problema aunque no lo creí necesario ya que se trata de un complemento.

ftp://ftp.mozilla.org/pub/firefox/releases/latest/linux-x86_64/xpi/

Eliges instalas el idioma deseado; por ejemplo, en español, hay 4 opciones: es-AR, es-CL, es-ES y es-MX.




2. Abrimos una nueva pestaña y escribimos "about:config" para ver la configuración del navegador y buscamos la propiedad "general.useragent.locale".



3. Cambiamos el valor según el idioma descargado, yo descargue "es-MX".





Solamente resta reiniciar y listo.

sábado, 12 de enero de 2013

Cómo instalar Sublime Text en Debian.

Sublime Text es un editor de texto escrito en python muy versátil y que se ha vuelto muy popular en estos días; el único pero es que no es libre o de código abierto. Si quieres evitar un molesto aviso después de que salves tu trabajo, deberás comprar una licencia de uso.

Si te interesa un editor libre, te recomiendo que busques en este catálogo con muchas alternativas (no solo editores).

Después de la explicación, pondremos manos a la obra:

1. Descargar la versión de Sublime Text según nuestro sistema operativo desde su página oficial. En mi caso será "Linux 64 bits".

2. Extraemos el archivo descargado (observa que el nombre del archivo tiene espacios y tiene una forma "especial" de escribirlo). Desde una terminal vamos a la carpeta donde se almacena y ejecutamos:

$ tar -xvjf Sublime\ Text\ 2.0.1\ x64.tar.bz2

Tip: escribimos "tar -xvjf Sub" y presionamos la tecla TAB para que se autocomplete.

3. Movemos la carpeta a /opt/sublime-text; primero tendremos que "loguearnos" como root:

# su
# mv Sublime\ Text\ 2 /opt/sublime-text

4. Creamos los enlaces simbólicos correspondientes:

# ln -s /opt/sublime-text/ /usr/local/sublime-text
# ln -s /usr/local/sublime-text/sublime_text /usr/local/bin/sublime_text

5. (Opcional) Borramos el paquete descargado.

$ rm Sublime\ Text\ 2.0.1\ x64.tar.bz2

6. Agregamos Sublime Text al menú de aplicaciones dando clic derecho en la barra de menú.



7. En la sección Programación, añadimos un nuevo elemento con los siguientes datos:

Tipo: aplicación.
Nombre: Sublime Text.
Comando: sublime_text
Ícono: /opt/sublime-text/sublime-text/sublime_text.png



Y listo, ya tienes todo listo para trabajar con este buen editor.



Felices líneas.