Le blog de Genma
Vous êtes ici : Accueil » Lifehacking » Ma page de raccourcis d’horaires de bus/train

Ma page de raccourcis d’horaires de bus/train

D 9 septembre 2015     H 09:00     A Genma     C 2 messages   Flattr cet article Logo Tipee

TAGS : Lifehacking FirefoxOS Planet Libre

Mon projet

J’avais pour besoin celui de connaître les horaires des prochains bus aux arrêts autour de chez moi et me permettant de me rendre à la gare ou me permettant de rentrer chez moi depuis Paris. Ce sont toujours les mêmes arrêtes/même gare et donc des trajets prédéterminés. Plutôt que d’aller sur les sites de la RATP/SNCF, de perdre du temps à saisir les gares de destinations et d’arrivée, je me suis fait une page de raccourci avec des liens vers les mêmes pages, chaque lien est présenté par un gros bouton coloré. Ce sera l’occasion pour moi de dérouiller un peu mon HTML5/CSS3.

Les services fournis par les transporteurs en Ile de France

Pour une ligne RATP de bus donnée, on a une version WAP (plus légère du site et qui va à l’essentiel) de la forme :

http://wap.ratp.fr/siv/schedule?service=next&reseau=bus&lineid=BXXX&stationid=XXX_XXX

Cette URL, avec l’ID du bus (BXXX) et le numéro de station (XXX_XXX) donne les horaires de prochain passage dans les deux sens (vers les deux terminus de la ligne).

Pour la SNCF et les RER transilien ligne C et D, c’est cette URL avec la gare de départ et la gare d’arrivée, dont le code est sur 3 lettres. (Représenter ici par XXX et YYY) que j’utilise

http://www.transilien.mobi/train/result?idOrigin=XXX&idDest=YYY

Une fois que l’on a les bons liens d’intérêts (pour les différents trajets), on peut passer à la suite.

Les raccourcis

J’ai donc défini la liste des boutons suivants :
- Maison : ça m’affiche sur une même page, les horaires des différentes lignes bus qui passent à côté de chez moi pour mener à la gare.
- Gare : ça m’affiche sur une même page, les horaires des différentes lignes bus qui partent de la gare et me rapproche de chez moi.
- Paris : ça me redirige vers la pages des horaires du RER, dans le sens du retour.
Plutôt que d’avoir des tas de marques-pages/favoris, j’ai un seul favori sur l’écran d’accueil vers une page avec des gros boutons colorés.

Pour l’utilisation des horaires de bus, j’ai deux lignes de bus de possibles. Et plutôt que de cliquer plusieurs fois, pour consulter les horaires du premier bus, revenir en arrière, consulter les horaires du second bus, j’ai fait une fausse page intermédiaire qui fusionne les deux pages correspondant aux deux lignes d’intérêt passant à l’arrêt me menant à la gare. Le lien est donc vers cette page html qui intègre elle-même les deux pages des horaires RATP, comme le montre le code suivant :

<html>
<body>
<iframe id="iFrame1" name="iFrame1" src="http://wap.ratp.fr/siv/schedule?service=next&reseau=bus&lineid=BXXX&stationid=XXX_XXX" height="200" >
</iframe>
<div id="iFrame2Container">
<iframe id="iFrame2" name="iFrame2" src="http://wap.ratp.fr/siv/schedule?service=next&reseau=bus&lineid=BXXX&stationid=XXX_XXX"
height="200" >
</iframe>
</div>
</body>
</html>

Problème de zoom

J’ai fait le développement via le navigateur Firefox, j’ai testé en mode "vue adaptative" et avec le simulateur de FirefoxOS, au sein du navigateur. Pas de soucis, tout s’affiche bien à la taille que je veux. Exemple avec une capture d’écran du prototype :

J’ai mis cette page HTML en ligne sur un serveur. J’accède à cette page depuis mon ZTE Open C sous FirefoxOS 2.2 quand j’ai besoin d’un horaire.
Et là, bien qu’ayant défini des tailles fixes en pixels pour les différentes zones, j’avais un problème d’affichage comme illustrer par l’image suivante :

En ajoutant la ligne au code source

<!-- Pour le pb du zoom sur le ZTE Open C, ligne en dessous-->
<meta name="viewport" content="width=device-width, initial-scale=1,25" />

A mettre entre les deux balises <head></head> de la page html

Je n’ai plus ce problème. L’affichage qui correspond à ce que j’attendais (la vue version adaptative) sur le ZTE Open C et reste identique sur le navigateur et l’émulateur.

 Les Tags - mots clefs de ce article

logo clef

 Vous aimez cet article? Soutenez le blog et partagez-le ;-)

Logo Tipee Flattr icon  Facebook icon  Twitter icon  Diapora icon   Licence Creative Commons

2 Messages

Un message, un commentaire ?
modération a priori

Ce forum est modéré a priori : votre contribution n’apparaîtra qu’après avoir été validée par un administrateur du site.

Qui êtes-vous ?
Votre message

Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Conférences

Médiathèques vous recherchez un conférencier sur l’éducation populaire et l’hygiène numérique? Jetez un coup d’oeil à mon CV

Date des prochaines conférences?
Cliquer ici

Rechercher sur le blog

Liens

Logo Flattr Logo Gmail Logo Twitter
Logo RSS Logo Linkedin Logo GitHub
Logo Gitlab Logo Mastodon
Logo Diaspora

Soutenir ce blog?

Logo Tipee Logo Liberapay

Licence

Licence Creative Commons

Derniers articles

1.  Philosophie de vie

2.  Émission Blockbuster sur France Inter

3.  De la différence

4.  Je s’appelle root

5.  Le guide de survie Tails

6.  De l’hygiène numérique à l’autodéfense numérique

7.  Je serai aux RPLL (RMLL)

8.  SSD Crucial MX300

9.  Quelques réflexions militantes et féministes

10.  Mais je suis une femme


Date de mise à jour :

Le 25 juillet 2017