phonegap filetransfer onpress loading indicator

Afficher un indicateur de progression de téléchargement avec PhoneGap

C’est pas très compliqué avec la propriété onprogress de l’objet fileTransfer de PhoneGap, il suffit de quelques lignes :

Et si vous avez besoin d’inspiration pour l’indicateur de progression, il y’a quelques beaux exemples ici.

 

 

swipe sencha panel

Intercepter un évènement swipe sur un panel avec Sencha Touch

Et avec Sencha Architect, il faudra utiliser au préalable l’évènement onPanelPainted :

sencha architect listen swipe event

API Geolocation HTML5

Essayez l’API geolocalisation HTML5 en 30 secondes dans votre navigateur

C’est très simple,

1. Ouvrir la console javascript

  • ⌘ + ⌥ + J sur Chrome/Mac OS
  • Ctrl + Shift + J sur Chrome/Windows
  • ⌘ + ⌥ + K sur Firefox/Mac OS
  • Ctrl + Shift + K sur Firefox/Windows
  • voir ici pour les autres.

2. Copier/coller ce code dans la console

3. Autoriser le partage de la position

google.fr wants to use your computer location

Votre position devrait maintenant s’afficher dans la console :

L’API geolocation est disponible sur tout les principaux navigateurs, sauf Opera Mini. caniuse.com/#feat=geolocation

phonegap-and-mobile-site-debugging

Debugger facilement des applications & sites mobiles

Pour débugger des applications PhoneGap ou des sites mobiles en temps réel  avec l’inspecteur Webkit, rien de plus simple.

debug.phonegap.com

La première solution, très simple, c’est d’utiliser debug.phonegap.com, tout est expliqué sur la page.

debug-phonegap-com

Mais debug.phonegap.com peut desfois s’avérer très lent.

Weinre

On peut alors utiliser  la même chose que phonegap, ça s’appel Weinre (à prononcer comme le mot “winery” ou “weiner” en anglais, au choix).

weinre-screenshot

C’est très simple à mêtre ne place :

Si ce n’est pas déja fait, Il faut installer Node.js, par ici http://nodejs.org/download

Une fois que Node.js est installé, sur mac ou linux, ouvrir le terminal et copier/coller ceci

sudo npm install -g weinre

-g signifie installation globale, c’est plus judicieux, vu qu’il s’agit d’un outil qui resservira très probablement pour d’autres projets

ça y’est weinre est installé on peut lancer le serveur en tapant

weinre --boundHost -all-

–boundHost -all- pour pouvoir accéder au serveur depuis un appareil qui n’aura pas la même IP. L’appareil doit se trouver sur le même réseau local.

Il ne reste plus qu’a insérer ceci dans la page qu’on veut débugger (index.html par exemple)

<script src="http://localhost:8080/target/target-script-min.js#anonymous"></script>

puis de se rendre à l’adresse

http://localhost:8080/client/#anonymous

On peut remplacer #anonymous par n’importe quoi, du moment qu’on le change dans l’adresse du script et dans l’url.

Et voila on peut maintenant facilement débugger un site mobileou une application Phonegap ou Trigger.io

Tapez alert('test')  dans la console pour essayer.

Et si o nsouhaite pouvoir fermer le terminal sans arrêter le serveur Weinre, nohup est là pour ça.

nohup weinre --boundHost -all-

Adobe Edge Inspect

adobe-edge-inspect-website-screenshot

La troisième solution, un tout petit peu plus simple mais aussi la plus chère, est d’utiliser Adobe Edge Inspect qui consiste en une application windows, mac , accompagnée d’une application iOS, Android ou Kindle et d’une extension Chrome. (Nécessite de s’inscrire à Adobe Creative Cloud. 1mois gratuit puis 60€/par mois).