Life under war

le 01/03/2015 dans Web #javascript#php#web

Présentation

Life under war est un petit projet qui me trottait dans la tête depuis un petit moment, suite à la découverte du projet Life de Lim Chee Aun (GitHub). L'idée était de voir si le monde avait jamais connu la paix au cours de ma vie...

Life under war utilise diverses librairies JavaScript (vis.js, Moment.js et Handlebars.js) et la classe PHP parseCSV.

Life under war est accessible à l'adresse momh.fr/life_under_war et est mis à disposition sur mon GitHub.

Méthodologie

Pour établir la liste des guerres (en cours en 1984 ou débutées depuis cette date), je suis parti de l'encyclopédie collaborative Wikipédia et plus particulièrement de la page Liste des guerres modernes.

Pour chacun des conflits, j'ai consulté la page correspondante et relevé les dates de début et de fin, les belligérants "locaux" (en me limitant aux états, donc en excluant les provinces sécessionniste, et en excluant les forces de coalition). Pour certains conflits, j'ai dû consulter les pages de la version anglophone, plus précise pour ce qui est des dates notamment. La mention du nombre de victimes quant à elle est soumise à bien des approximations.

J'ai retiré certains conflits "au long cours" qui faisaient "doublons" avec des épisodes plus brefs, plus localisés.
Ainsi, du conflit israélo-palestinien qui court depuis 1948 ; dans ce cas précis, j'ai suivi les liens d'événements, d'opérations, de guerres cités dans la page Conflit israélo-palestinien, afin de présenter notamment les deux Intifadas, la guerre de 2008-2009...

Pour ce qui est des attentats, je pense me baser sur la liste que propose Wikipédia, Liste d'attentats meurtriers.

Fonctionnement

Vis.js

Vis.js est une librairie JavaScript de visualisation complète qui permet entre autres choses de générer des frises chronologiques.

L'utilisation en est, pour mon usage, relativement simple, facilitée par sa documentation claire et un certain nombre d'exemples.

Il s'est vite avéré pénible de saisir à la mano tous les événements ; je me suis alors mis à compiler mes données dans un fichier CSV limiter cela, je Je suis donc parti sur la création d'un fichier CSV.

parseCSV

Du coup, il m'a fallu chercher comment parser un fichier CSV et me suis orienté vers une solution en PHP afin que le traitement se fasse côté serveur et étant plus à l'aise en PHP qu'en JavaScript.

Je suis tombé sur la classe PHP parseCSV qui permet de facilement traiter les données. Ainsi, notamment des dates de fin de conflit (remplacement de la chaîne "today" en la date du jour), des codes et nom de pays (chaînes avec virgule comme séparateur).

Mise en forme et formatage des dates

La librairie vis.js permet de modifier le formatage des éléments de la timeline (cf. la documentation), en faisant éventuellement appel à des template engines comme Handlebars.js comme on peut le voir dans cet exemple.

Dates au format JJ/MM/YYYY

Vis.js utilise pour générer la timeline des dates au format YYYY-MM-DD ; je souhaitais pouvoir afficher les dates au format "français", DD/MM/YYYY.

Pour ce faire on utilise la librairie Moment.js au sein d'une fonction pour Handlebars.js, adaptée de la proposition de Ken Yee.

En effet, les dates d'entrée peuvent avoir trois formats différents:

  • YYYY ;
  • YYYY-MM ;
  • YYYY-MM-DD.

Dans les deux premiers cas, la fonction renvoyait toujours une date au format DD/MM/YYYY (01/01/YYYY ou 01/MM/YYYY) ; il me fallait donc vérifier la longueur de la chaîne d'entrée et forcer le format de sortie.