1. Tema 2
Trabajando con
Navegadores
Willy Hurtado Vela

2. • Adquirir conciencia del problema de botón atrás y
adelante en aplicación AJAX y saber solucionarlo
• Conocer el uso de la Clase History y la Interfaz
ValueChangeHandler
• Tener la habilidad de escribir código para
reconocimiento de navegadores
• Usar la técnica de Vinculación Diferida (Deferred
Binding) para desacoplar código.
Objetivos

3. 1. El problema del botón Atrás
1.1. Configurando su Pagina HTML
1.2. La clase History
1.3. La Interfaz ValueChangeHandler
2. Detectando Navegadores
2.1. La manera clásica
2.2. Usando Deferred Binding
Contenido

4. Codificación en JAVA
Javascript
Necesidades especificas del navegador o aplicación web
Trabajando con Navegadores

5. Botones de atrás y adelante en Chrome
1. El problema del botón Atrás

6. <!-- OPTIONAL: include this if you want history
support -->
<iframe id="__gwt_historyFrame"
style="width:0;height:0;border:0"></iframe>
Unable to initialize the history subsystem; did you
include the history frame in your host page? Try
<iframe src="javascript:''"
id='__gwt_historyFrame'
style='position:absolute; width:0; height:0;
border:0'></iframe>
1.1. Configurando su pagina HTML
1. El problema del boton Back

7. Clase: com.google.gwt.user.client.History
History.addValueChangeHandler()
#page0 #page2
#page1
History.newItem(token)
1.2. La clase History
1. El problema del boton Back

8. Interfaz:
com.google.gwt.event.logical.shared.ValueChangeHandler
@Override
public void onValueChange(ValueChangeEvent<String> event)
{
// Ir al estado token = event.getValue()
}
#page0 #page1 #page2
1.3. La Interfaz ValueChangeHandler
1. El problema del boton Back

9. public static native String getUserAgent() /*-{
return navigator.userAgent.toLowerCase();
}-*/;
if (getUserAgent().contains("gecko")) ...
2.1. La manera clásica
2. Detectando navegadores

10. <!-- Vinculacion Diferida para recocer IE 6 y 8-->
<replace-with class="com.mycompany.project.client.HolaMundoNavegadorIE">
<when-type-is
class="com.mycompany.project.client.HolaMundoNavegadorEstandar"/>
<any>
<when-property-is name="user.agent" value="ie6"/>
<when-property-is name="user.agent" value="ie8"/>
</any>
</replace-with>
2.2. Usando Deferred Binding
2. Detectando navegadores