¿Usa la misma base de código para phonegap y web?

Question

¿Es aconsejable usar la misma base de código para nuestra aplicación web móvil y la aplicación de teléfono? Se supone que son similares, la versión del teléfono ahora nos permite hacer más. ¿Podemos detectar si no se está ejecutando en phonegap y secuestrar llamadas a la API de teléfono o tiene más sentido separarlas?

Answer 1

Usaría la misma base de código. El objetivo de PhoneGap es convertir sus sitios móviles en aplicaciones. No es tan difícil detectar características y pantalla realestate según corresponda. El problema con bases de código separadas generalmente es el costo de manejar dos veces su contenido y estilos. Si es necesario, puede separarlos en un recurso compartido y agruparlos en tiempo de ejecución/acceso, pero personalmente aún así me quedaré con todo junto.

Este blog cubre el problema de detección (ver los comentarios también): http://bennolan.com/2011/08/22/phonegap-detection.html. El quid de la cuestión es if (window.PhoneGap){...}

Answer 2

Claro, puedes usar la mayoría de la misma base de código. Algunas API de phonegap son iguales en html5 (por ejemplo localStorage) por lo que no hay diferencia en el código.

Si está utilizando el servicio Build de phonegap, agregará el archivo de script phonegap.js/cordova.js a la raíz de su proyecto. Solo inclúyelo en tu html todo el tiempo. A continuación, puede detectar si su aplicación se está ejecutando dentro de PhoneGap:

var isPhonegap = function() { 
    return (typeof(cordova) !== 'undefined' || typeof(phonegap) !== 'undefined'); 
} 

if (isPhonegap()) { 
    // phonegap.js/cordova.js exists.. now let's handle the onDeviceReady event 
} else { 
    // in-browser 
} 

Si necesita algo de código de inicio común, lo puso en una función y llamar a esta función desde el controlador onDeviceReady y el bloque demás anteriormente.

Si la API del teléfono que está llamando no tiene exactamente el mismo nombre que la html5 (porque tiene el prefijo Moz * o WebKit *, por ejemplo), simplemente envuelva ambos dentro de un nuevo nombre. Por ejemplo:

var requestFileSystem = (isPhonegap() ? requestFileSystem : window.WebKitRequestFileSystem); 

Si la API PhoneGap que está utilizando realmente no tiene ningún equivalente en HTML5, tratar de duplicar la funcionalidad JavaScript en sí mismo, si es posible, de lo contrario vas a perder la funcionalidad en su navegador. Pero asegúrese de que se degrada con la suficiente gracia sin esa característica.

Nota: para probar las características de los dispositivos móviles como el acelerómetro, la geolocalización, etc. en el pago de su navegador Ripple Chrome extension.

Answer 3

me di cuenta de una manera de mantener intacta la base de código web ...

El problema actual con el uso de la incorporada en el evento deviceready, es que cuando se carga la página, que no hay manera de decirle a la aplicación: "Oye, esto NO se está ejecutando en un dispositivo móvil, no hay necesidad de esperar a que el dispositivo esté listo para comenzar".

1. En la parte nativa del código, por ejemplo para iOS, en MainViewController.m hay un método viewDidLoad, estoy enviando una variable javascript que más tarde puedo comprobar en el código web, si esa variable es de alrededor , voy a esperar para iniciar el código de mi página hasta que todo esté listo (por ejemplo, geolocalización del navegador)

   Bajo MainViewController.m:

   - (void) viewDidLoad 
   { 
       [super viewDidLoad]; 
       NSString* jsString = [NSString stringWithFormat:@"isAppNative = true;"]; 
       [self.webView stringByEvaluatingJavaScriptFromString:jsString]; 
   } 
   

2. índice.html el código es el siguiente:

   function onBodyLoad() 
   { 
       document.addEventListener("deviceready", onDeviceReady, false); 
   } 
   
   function onDeviceReady(){; 
       myApp.run(); 
   } 
   
   try{ 
       if(isAppNative!=undefined); 
   }catch(err){ 
       $(document).ready(function(){ 
        myApp.run(); 
       }); 
   }