Dans l'optique de faire un jeu dans avec un temps limité, voici une section de documentation pour vous aidez à faire le jeu en Javascript. Pour se faire, PixiJS est mon choix de librairie pour vous montrer quelques trucs pour faire un jeu simple.

Il n'est pas nécessaire d'avoir un serveur d'application pour l'exécuter contrairement à certain de ses concurrents.

https://pixijs.com/8.x/guides/basics/architecture-overview

https://pixijs.com/8.x/guides/basics/getting-started

<script src="https://pixijs.download/release/pixi.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/pixi.min.js"></script>

Déterminer la configuration de base de votre jeu, la résolution de l'écran du jeu.

const app = new PIXI.Application({ width: resolutionX, height: resolutionY, backgroundColor: 0x1099bb });

Ajouter les librairies après le div.

document.getElementById('pixi-container').appendChild(app.view);

https://github.com/Alan01252/pixi-tilemap-tutorial

Charger avec un promise l'image à l'aide de Asserts.load.

const texturePromise = PIXI.Assets.load('img/imgGround.png'); texturePromise.then((resolvedTexture)=> {

sprite.x = 20; sprite.y = 30;

1. Créez vos boutons de contrôle avec un id spécifique qui sera utilisé dans votre fichier JS.
2. Importez la librairie de Chromecast:

<script type="text/javascript" src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>

3. Associez les événements à vos objets portant les ids.
4. Créer une fonction pour chaque événement.
5. Ajustez les coordonnées X et Y dans vos événements.
6. Créez une fonction pour transmettre ces coordonnées.
7. Choisir un nom de canal (namespace).
8. Créer l'objet en JSON.

let message = {msg: positionObj}; message = JSON.stringify(message);

9. Faire l'appel à la fonction sendMessage issue de l'objet session créer via une fonction de rappel (Callback).

currentSession.sendMessage(namespace1, message);

Voir la documentation: https://developers.google.com/cast/docs/reference/web_sender/cast.framework.CastSession 10. Ajouter la fonction initializeApi. 11. Associer cette fonction à un bouton dans votre html.

1. Transférer le code de votre application sur le serveur. Transférez le repository au professeur.
2. Créer l'application dans la console https://cast.google.com/publish/#/overview
3. Publier l'application (bouton publish).
4. Ajouter la librairie de chromecast receiver dans votre html après votre fichier javascript.

<script type="text/javascript" src="https://www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>

5. Créer le context du receiver.

const context = cast.framework.CastReceiverContext.getInstance();

6. Copier la constante contenant le nom de votre canal de communication (namespace).

const CHANNEL = 'urn:x-cast:testChannel';

7. Ajouter une méthode de rappel (callback) pour le canal en question.

context.addCustomMessageListener(CHANNEL, handleMessageFromSender);

Voir https://developers.google.com/cast/docs/reference/web_receiver/cast.framework.CastReceiverContext

8. Dans la méthode de rappel, ajuster les coordonnées de votre joueur (ou autre).
9. Démarrer le context avec les options.

const options = new cast.framework.CastReceiverOptions();

Voir documentation: https://developers.google.com/cast/docs/reference/web_receiver/cast.framework.CastReceiverOptions

...

context.start(options);

10. Déployer le code sur le serveur.
11. Ajoutez le appId dans le client pour commencer le test.

1. Testez le jeu avec la configuration minimale sans objet connecté.
2. Testez le contrôle avec l'objet connecté.
3. Ajoutez des fonctionnalités à votre jeu.
4. Commitez vos changement à chaque étape validée (test fonctionnel).