====== Gdevelop-OSC ======
* Porteur du projet : Laurent
* Date : 15/07/2019
* Licence : libre !
* Contexte : oui
* Fichiers : {{ :projets:gdevelop-osc:exgdevelop.zip |exemple Gdevelop (html5)}} {{ :projets:gdevelop-osc:projetgdevelop.zip |projet Gdevelop}}
{{tag>gdevelop osc python get}}
===== Description =====
[[https://gdevelop-app.com/fr/|Gdevelop]] est un logiciel libre permettant de créer facilement un jeu vidéo 2d sans écrire une ligne de code. Il propose des exports au format HTML5, android et iOS qui permettent d'utiliser des capteurs du téléphone sur lequel le jeu tourne, mais rien n'est prévu d'origine pour l'utiliser avec des capteurs externes. Gdevelop possède néanmoins un module réseau permettant d'émettre des requêtes GET, POST et de lire du JSON.
Beaucoup de capteurs DIY utilisant le protocole [[https://fr.wikipedia.org/wiki/Open_Sound_Control|OSC]] pour communiquer, nous réaliserons une passerelle OSC->web.
===== Technos =====
Pour pouvoir répondre à une requête GET ou POST envoyée par Gdevelop, il faut utiliser un serveur web. L'utilisation du module python [[https://pypi.org/project/Flask/|Flask]] permet de créer un serveur web en quelques lignes de codes qui répondra aux requêtes. L'OSC sera géré par [[http://das.nasophon.de/pyliblo/|pyLiblo]] qui offre des bindings python pour la bibliothèque //liblo// originellement écrite en C et particulièrement véloce. Enfin, une extension de flask, [[https://flask-cors.readthedocs.io/en/latest/|Flask-CORS]] ajoutera les en-têtes CORS (//Cross Origin Resource Sharing//) permettant la communication entre le jeu Gdevelop et le serveur web local.
Côté hardware, n'importe quel ordinateur muni d'une carte réseau fera l'affaire (Raspberry Pi compris), tous les logiciels et modules utilisés étant multiplateforme.
===== Principes de fonctionnement =====
Le serveur web n'est accessible en local et utilise un port défini dans le code (par défaut le port 5000). Il doit donc tourner sur la même machine que Gdevelop.
Pour éviter de devoir définir au préalable dans le code toutes les adresses OSC utilisées, une variable globale stocke dans le code chaque adresse OSC reçue ainsi que sa dernière valeur et crée automatiquement une adresse web correspondante. Par exemple, la réception de "/monOSC" créera automatiquement l'adresse web http://localhost:5000/monOSC qui répondra à toute requête GET adressée par la dernière valeur reçue ainsi que le code 200.
Dans le cas où plusieurs données sont empaquetées dans le même message OSC, des adresses web seront automatiquement créées et numérotées (ex : "/monOSC1", "/monOSC2"...) pour chaque donnée.
Pour récupérer les données dans Gdevelop il suffit donc de créer un évènement //Send request to webpage// avec "http://localhost:5000" comme //host//, "/monOSC" dans le //path to page// et créer une variable de scène dans //store the response for this variable// (voir l'exemple) Cette variable sera mise à jour si de nouvelles données sont reçues.
En cas de problème, il peut être utile d'accéder au serveur web directement depuis son navigateur pour vérifier que les données sont correctement reçues et mises à jour http://localhost:5000/monOSC Le script python donne également quelques informations de déboguage sur sa sortie console.
===== code =====
#!/usr/bin/env python
# -*- coding: utf-8 -*-
from flask import Flask
from flask_cors import CORS # Cross Origin Resource Sharing, needed by gdevelop
import liblo
OSClisteningPort = 9002
app = Flask(__name__)
CORS(app)
database = {}
@app.route('/
===== exemple =====
L'exemple fourni permet de faire tourner un smiley à partir de l'orientation d'un téléphone. Il nécessite l'application libre et gratuite [[https://sensors2.org/osc/|sensors2OSC]] disponible sous Android depuis [[https://f-droid.org/|fDroid]] par exemple.
Le paramètre orientation du téléphone envoie trois données, respectivement l'azimuth, le roulis et le tangage (en degrés). On utilise donc l'adresse http://localhost:5000/orientation1 pour lier l'azimuth du téléphone à la rotation du smiley dans gdevelop. L'IP de la machine qui fait tourner gdevelop et le serveur est entrée dans les options de sensors2OSC ainsi que le port d'écoute par défaut du serveur (9002). Une fois les cases //orientation// et //envoyer les données// cochées, on peut voir l'azimuth du téléphone depuis le pc en naviguant sur http://localhost:5000/orientation1. Une fois Gdevelop lançé, le smiley suit l'orientation du téléphone.
**A noter** : comme Gdevelop stocke les chemins absolus vers les contenus, il ne trouvera pas la seule image du projet (fournie dans le zip) Il faudra lui en indiquer manuellement le chemin