Paso 8: La aplicación de HTML – tutorial
La aplicación de cliente se inicia cargando las 4 imágenes que se utilizan para animar las ondas WiFi que emana de la robusteza (Marvin el paranoid android de guía de los autostopistas a la galaxia) cuando se toca el robot. Usted puede conseguir arte gratis para uso no comercial aquí:
http://findicons.com/Icon/45522/hitchhikeguidetogalaxy1_lock
http://www.iconarchive.com/show/Hitchhikers-Guide-icons-by-IconShock/Marvin-Icon.html
Improvisó imágenes de Marvin con un icono de WiFi. Corté el icono de WiFi en tres partes para animar a las ondas de RF provenientes de la cabeza de Marvin. Cuando se toca la pantalla en el área de la imagen, comienza la animación en JavaScript. Los ciclos de la animación a través de las 4 imágenes con un retraso de 250ms entre imágenes para simular el envío inalámbrico de un mensaje en la puerta de garaje. El ciclo se repite dos veces, principalmente porque esto evita los impacientes familiares de meter en la pantalla cuando no hay respuesta inmediata por parte de la puerta. Como se mencionó antes, latencia puede estar unos 2 segundos a veces la animación permite a los usuarios piensan que la comunicación es todavía en curso.
Comunicarse con el Imp eléctrico se realiza enviando un mensaje a la Imp agente URL específica a su Imp.
Para la App de HTML, crear un objeto XMLHttpRequest y luego enviar el ID del botón a la Imp para su puerta de garaje. Técnicamente podríamos tener una serie de funciones de los diferentes botones para enviar el ID con el firmware permitiría el firmware tomar decisiones basadas en el botón que fue enviado. Sin embargo, para esta aplicación sólo tenemos un botón para que el ID es un poco redundante pero tenemos que enviar algo! Un tema que me topé fue que eso iOS6 almacenar en caché los mensajes salientes. La solución es asegurarse de que los datos que está posteando cambian cada vez. Esto fue hecha agregando la hora a la cadena que garantiza que cada mensaje era único y así no almacenados en caché por iOS. Tener salientes llamadas caché no tiene ningún sentido para mí pero que hace sentido para alguien en Apple. Hay una manera de pedir específicamente que la llamada saliente no se almacena en caché pero que no funcionó para esta interfaz... Ver los comentarios en el código.
XMLHTTP.Open ("POST", "https://api.electricimp.com/v1/Your_Imp_Specfic_ID_Here", true);
xmlhttp.setRequestHeader ("Content-type", "aplicación/x--www-form-urlencoded");
Enviar una fecha hora evita que el iOS6 almacenamiento en caché de la consulta. Si establece el encabezado cache-control
para esta solicitud, no funciona. Impar ya que trabajo para la consulta COSM
XMLHTTP.Send ("valor =" + button.id + Date());
Para obtener el estado de los sensores de puerta, se envía un mensaje de consulta al agente de Imp. Puede comprobar el estado pulsando el botón o tira la pantalla hacia abajo.
Y que se encarga de la App de HTML. El siguiente paso será discutir carga la App HTML y lo que parecen ser un nativo iOS App.