Avec la fin de mes travaux sur le back-end du robot Youpi, sauf remontée de bugs éventuelle, j’étais arrivé à la conclusion que je pouvais enfin passer à autre chose. Mais en même temps, j’avais sous la main un back-end plutôt abouti et pas avare en possibilités, et rien d’autre pour faciliter la manipulation du robot ou l’élaboration de scripts.

Je devais me rendre à l’évidence : il fallait que je réalise rapidement un petit front-end pour que le sujet soit bouclé. Libre ensuite aux gens de l’utiliser, de l’autopsier, et de l’adapter.

J’ai voulu un front-end pour un pilotage à la souris qui soit dans la mesure du possible léger et multiplateformes. Quoi de mieux qu’un front-end client léger accessible depuis n’importe quel navigateur — N’importe quel navigateur récent, s’entend. Fuck off IE6.

C’est de cette manière qu’est né Youfo (pour YOUpi FrOnt-end), une interface web ridiculement sobre, développée en quelques heures, articulée autour du framework jQuery et communiquant avec le back-end grâce à des messages Ajax/JSONP.

L’interface utilisateur de Youfo

L’interface permet de piloter chacun des moteurs en cliquant sur le bouton approprié. Pour le fun, lors d’un survol des boutons, la partie du robot concernée par le mouvement se colorise sur l’image d’à côté.

En plus de cet aspect « pilotage en temps réel », à chaque fois que la position de l’ensemble du robot est satisfaisante, un clic sur le bouton au centre de l’écran permet de récupérer la position de tous les moteurs et enrichit le script dans la zone de texte. Il est ainsi possible de copier/coller le contenu de cette zone dans un shell qui, lorsqu’il est exécuté, rejoue les positions enregistrées de manière fluide et rapide.

Si vous considérez ces explications un peu abstraites, la vidéo suivante sera peut-être plus parlante :

Au final, même si cette interface reste dépouillée et souffre parfois d’un peu de lag, elle est facilement utilisable et elle démontre surtout un des gros avantages du back-end Youba : la possibilité d’écrire et d’intégrer au projet le front-end de son choix en très peu de temps. J’invite les bidouilleurs un peu curieux à regarder le code du cœur du front-end (resources/youfo.js) qui ne dépasse pas les 150 lignes.

À partir de là, on peut aussi envisager d’autres front-ends pour un pilotage au clavier, au joystick, à la Wiimote… Les plus motivés pourront décliner le produit en version un poil plus réactive grâce à une réécriture Java ou Qt… Il y a de quoi faire : amusez-vous, faites-vous plaisir.

Dernières recommandations :

• Youfo nécessite une version de Youba >= 1.4
• Les deux applications se trouvent sur la page des téléchargements.

Enjoy !