En réponse par mail :
Salut KraZhtest :)
Un petit mail en guise de réponse à ton share "Les User Agents, c'est le mal ! - Présentation impress.js"
J'ai pas mal utilisé impress.js à des fins pro (pour des présentations, ou encore pour de gros clients genre des présentations de 60 pages par des mecs de Legrand).
A l'époque, je m'étais heurté à deux problématiques :
- pouvoir créer l'ensemble de l'environnement des slides, pour de grosses présentations assez conséquentes
- pouvoir ajouter des animations internes aux slides avec des déclencheurs manuels
Impress.js a été pas mal repris par de nombreux fork et outils, permettant des interfaces pour le manipuler. Toutes ne se vallent pas et la plus interessante que j'avais trouvée n'était encore qu'en béta. Il s'agit de Strut (
http://strut.io/) - une version est disponible pour de hébergement chez soi.
L'outil propose une interface assez sympa avec des vues d'ensembles. Ainsi donc, pour répondre à ma première problématique, j'avais opté pour agir en trois temps :
1/ en me basant sur l'outil "Strut" installé sur un petit serveur Node.js pour l'occasion, j'ai crée "x" slides à vide. L'export HTML m'a permis d'avoir sous le coude les différentes positions CSS et les différents effets de transition
2/ à partir de cet export, j'ai mis en place un fichier PHP se chargeant de répéter l'échantillon créée en 1/ tout en calculant les différents positionnements et règles CSS. J'en ai profité pour y mettre en place quelques fonctions me permettant d'appeler dynamiquement, les éléments réccurents et/ou communs à plusieurs slides (logo, pied de page, ...)
3/ appel de la version dynamique posée sur un serveur via le navigateur, et enregistrement en format "statique" pour une version standalone dispo en locale
Enfin, et d'avantage en relation à ton share, je m'étais effectivement rendu de différentes erreurs liées aux user agent et aux impacts générées, notamment en consultation mobile. Je m'étais donc tournée vers une surcouche me permettant, à travers un goulot, de récupérer en entrée la sortie qu'en faisait impress.js et ressortait une classe CSS plus adaptée. (ben oui, sur impress.js, tout est en fait en CSS3 quasiement)
Pour terminer, côté déclenchement d'animations internes, tout est basé là encore sur des classes CSS. La diapo actuellement lue reçoit une classe CSS adaptée. Cela permet donc de cibler les éléments enfants à partir de cette lasse "d'état". Au final, quelques lignes de JS permettent d'ajouter ou supprimer des classes lors d'interception de déclencheurs internes au slide (clic souris, clavier, ...)
Au plaisir ;-)
Erase