8000 GitHub - tigrou23/UTC-PR00
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

tigrou23/UTC-PR00

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

UTC-PR00


⚠️ Attention, il est possible qu'aucun trajet ne vous soit proposé si vous utilisez le site dans la nuit (pas de transports a proposé car temps réel) ou alors si votre départ/arrivée ne sont pas explicites.

N'hésitez pas à créer une issue GitHub si vous rencontrez un problème.


Dans ce projet universitaire, nous avons utilisé des APIs pour tracer et indiquer un itinéraire en temps réel entre deux gares d'Île-de-France. Des fonctionnalités supplémentaires ont été ajoutées et décrites ci dessous.


Lien vers le site :

Lien vers le site de statistiques :


Table des matières


Fonctionnalités détaillées

1. Transports disponibles

Les trajets proposés par le site concernent :

  • Train 🚅
  • RER 🚈
  • Métro 🚇
  • Tramway 🚃
  • Bus 🚎
Afin de simplifier l'identification de chaque ligne, elles sont identifiables (sur la carte et dans le détail des itinéraires) par leurs propres couleurs (ex: jaune pour la ligne 1 du métro).

2. Détails du trajet

Pour chaque trajet proposé, un détail est disponible sur une fenêtre pour apporter plus de précision sur le transport en question ainsi que les gares à emprunter.

3. Météo disponible sur les stations

Les gares principales apparaissent sur la carte (gare de départ et gare d'arrivée pour chaque transport de l'itinéraire). Lorsqu'on clique sur ces dernières, il nous est renseigné le nom ainsi que la météo correspondante.

Les APIs utilisées

1. OpenWeather

Lien vers le site de l'entreprise : OpenWeather

Cette API est utilisée pour récupérer la météo pour un point géographique donné. Cela permet d'ajouter la température pour les gares cliquées.

2. Open Data Hauts de Seine

Lien vers le site de l'entreprise : Open Data Hauts de Seine

API utilisée pour deux choses :

  • Récupérer toutes les gares afin de les lister et aider l'utilisateur à trouver sa destination.
  • Récupérer les tracés des lignes que l'on cherche. L'API renvoie un tableau de coordonnées qu'on va utiliser pour tracer à l'aide de polylines le parcours de la ligne concernée.

3. Google


Cette API est sans doute la plus importante de notre projet. Elle permet de nous délivrer le chemin entre deux points donnés. Nous trions ensuite les données JSON pour retirer tous trajets à vélo ou à pied. Ce sont avec ces données que nous traçons le trajet et que nous délivrons tous les détails du parcours.

Structure du projet

Toutes nos fonctions JavaScript sont documentées ✅.

1. Requêtes aux APIs

IMPORTANT : Les requêtes ne sont pas réalisées par notre JavaScript. Elles sont faites par un PROXY qui a été développé dans un projet annexe : UTC-PR00-PROXY.

2. Javascript/JQUERY

Ce fichier JavaScript/JQUERY qui gèrent l'aspect algorithmique de notre projet :

Le fichier itineraire.js va servir à gérer l'aspect événementiel. Par exemple à la validation :

$('#valider').click(function () {
    $('#itineraire').hide()
    $('#chemin').show()
    let index = getIndex($('#departChoix').val())
    let coordonneesDepart = villes[index].fields.geo_point_2d
    index = getIndex($('#arriveeChoix').val())
    let coordonneesArrivee = villes[index].fields.geo_point_2d
    tracerTrajet(coordonneesDepart, coordonneesArrivee)
})

3. CSS

Nous avons utilisé 2 fichiers CSS pour habiller notre site web :
  • header.css : permet d'habiller le header du site.
  • itineraire.css : permet d'habiller la page itinéraire.
Les fichiers CSS permettent de rendre notre site web responsive. Il y a une version ordinateur et une version mobile. La version mobile est essentielle pour la cohérence d'un projet abouti. En effet, notre site permet de trouver un itinéraire pour se déplacer. Cette consultation se fait principalement sur un téléphone, lorsque nous n'avons pas accès à notre ordinateur. Il était donc pour nous essentiel de développer cette version réduite pour les smartphones. Concernant le code CSS, nous avons utilisé une méthode de développement web : les variables. Le fichier CSS est alors plus lisible ce qui permet de travailler à plusieurs très facilement.

Architecure

Capture d’écran 2024-06-27 à 18 17 22

1. Hébergement du projet

Le projet est hébergé en ligne et donc accessible avec un accès internet.

Lien vers le site :

Une documentation sur le déploiement de l'application est disponible en MarkDown (Déploiement.md).

2. Nom de domaine

Un nom de domaine a été acheté sur IONOS pour pouvoir rendre l'accès à notre site plus simple. Il a suffit de paramétrer les champs du DNS pour pouvoir rediriger le flux vers l'adresse IP de notre serveur.

3. Certificat SSL

Nous avons généré un certificat SSL (Transport Layer Security) avec l'outil Certbot. Cet outil est un package que l'on peut télécharger sur Linux en spécifiant le site Apache2 à certifier. De ce fait, notre site est à la fois accessible par le protocole HTTP et HTTPS.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Packages

No packages published
0