Forum des Objets Communicants et Solutions pour les Libérer...


 
AccueilAccueil  GalerieGalerie  FAQFAQ  RechercherRechercher  S'enregistrerS'enregistrer  Connexion  

Partagez | 
 

 Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 19:49

Bonjour a tous ! nabzciao
Ajourd'hui je vais vous présenter le moyen de créer des applications web pour NabCloud.fr (Et bientot tous les serveurs OJN). nabzsmile

Merci a l'équipe d'openjabnab et a l'api http://wizz.cc

Mais alors ça va être difficile ?!

Ce tutoriel s'adresse a tout les niveaux (Si si même si vous vous limitez a Gmail nabzshy ) même si un minimum de connaissance en HTML, JAVASCRIPT, JQuery et PHP est recommandés. Dans ce tutoriel nous allon apprendre a créer une application facilement et entièrement en Javascript, puis en PHP de A à Z
Ce tutoriel sera diviser en 4 partie principale :

I) Prérequis & introduction au SDK

II) Aide sur le SDK

III) Réalisation d'un contrôleur web simple

IV)Réalisation d'un application en PHP


Dernière édition par poupou le Ven 26 Aoû 2011 - 21:39, édité 1 fois
Revenir en haut Aller en bas
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 20:55

I) Prérequis & introduction au SDK

C'est quoi un SDK ?

un SDK (Software development toolkit) est un ensemble d'outils permettant aux développeurs de créer des applications de type défini (Ouf merci wikipedia ! nabzwhistle ).

Et t'en a un pour OJN ?

Quel question, bien sur ! J'en ai même deux ! Une version Javascript et une version php.

Ou je le trouve ton "SDK" ?

J'y viens, doucement ! :
Version Javascript NabCloudSDK-js.zip
Version PHP NabCloudSDK-php.zip

Comment installer le SDK ?

Pour le version Javascript, il faut rajouter entre les balises head ceci :
Code:
<script type="text/javascript" src="nabaztag.js"></script>
Pour la version PHP, il faut rajouter dans les premières lignes de votre code :
Code:
require_once("nabaztag.php");

Si je veut l'utiliser sur un autre serveur ?

Il faudra alors disposer de compétence technique, téléchargez les version dev, et modifier manuellement le fichier

Version Javascript NabCloudSDK-js.dev.zip
Version PHP NabCloudSDK-php.dev.zip

Et voila ! Fin de la première partie.


Dernière édition par poupou le Ven 26 Aoû 2011 - 23:05, édité 1 fois
Revenir en haut Aller en bas
wizz.cc
Special Nabz
Special Nabz


Localisation : Paris - France
Nabaztag : Wizz.cc
Nbr de messages : 726
Carottes : 2789

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 21:32

Belle initiative Poupou !

J'espère que ça va en motiver d'autres... Wink
Revenir en haut Aller en bas
http://wizz.cc
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 21:32

II) Aide sur le SDK
(Partie non obligatoire, zapper directement a la partie 3 si vous souhaiter voir le tuto)

Version Javascript :

Code:
bool nabaztag.ConfigureAndStart(&string bunny)

Pour le moment renvoi toujours true, bunny est le sn du lapin su lequel vous voulez travaillez.


Code:
string nabaztag.tts(&string action, &string msg, &string language)
Envoi du TTS au lapin, pour le moment ne retourne rien. Action peut être égale a "start" ou "stop". Si start, démarre le TTS, si stop, stop le TTS. Msg est le message a envoyer au nabaztag. Language est la langue dans laquelle va être lu le message (Pas de traduction, juste l'accent), peut être égale a "fr", "en", "it"... Merci a http://wizz.cc pour son API.

Code:
string nabaztag.multimedia(&string action, &string ToPlay)
Envoi un mp3 au lapin, pour le moment ne retourne rien. Action peut être égale a "play" ou "stop", si play, joue le mp3, si stop, arrête le mp3. ToPlay est égale a l'url du mp3 a jouer, pour jouer plusieur mp3, ajouter des | entre chaque url.

Code:
string nabaztag.ears(&string action, &int left, &int right)
Change la position des oreilles du nabaztag, pour le moment ne retourne rien. Action peut être égale a "move" ou "reset". Si move, bouge les oreilles dans la position définie par left et right (Valeur de 1 a 16). Si reset, remet les oreilles en position initiale (Droite, 1 & 1).

Code:
string nabaztag.led()
Pas encore implenté.

Version PHP:

Code:
bool nabaztag->ConfigureAndStart(&string bunny)

Pour le moment renvoi toujours true, bunny est le sn du lapin su lequel vous voulez travaillez.

Code:
string nabaztag->tts(&string action, &string msg, &string language)
Envoi du TTS au lapin, retourne la réponse de l'api. Action peut être égale a "start" ou "stop". Si start, démarre le TTS, si stop, stop le TTS. Msg est le message a envoyer au nabaztag. Language est la langue dans laquelle va être lu le message (Pas de traduction, juste l'accent), peut être égale a "fr", "en", "it"... Merci a http://wizz.cc pour son API.

Code:
string nabaztag->multimedia(&string action, &string ToPlay)
Envoi un mp3 au lapin, retourne la réponse de l'api. Action peut être égale a "play" ou "stop", si play, joue le mp3, si stop, arrête le mp3. ToPlay est égale a l'url du mp3 a jouer, pour jouer plusieur mp3, ajouter des | entre chaque url.

Code:
string nabaztag->ears(&string action, &int left, &int right)
Change la position des oreilles du nabaztag, retourne la réponse de l'api. Action peut être égale a "move" ou "reset". Si move, bouge les oreilles dans la position définie par left et right (Valeur de 1 a 16). Si reset, remet les oreilles en position initiale (Droite, 1 & 1).

Code:
string nabaztag->led()
Pas encore implenté.


Dernière édition par poupou le Ven 26 Aoû 2011 - 21:39, édité 1 fois
Revenir en haut Aller en bas
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 21:34

@wizz Merci. Je te remercie encore pour ton api nabzhello1
Revenir en haut Aller en bas
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Ven 26 Aoû 2011 - 22:57

Maj, oublie d'un this. dans la version js. Corrigé
Revenir en haut Aller en bas
poupou
Bronze Nabz
Bronze Nabz


Localisation : Paris
Nabaztag : Roxxor (V2)
Nbr de messages : 177
Carottes : 2461

MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Sam 27 Aoû 2011 - 16:07

III) Réalisation d'un contrôleur web simple

/!\Attention/!\ Ce tutoriel étant concentrez sur le SDK, le code javascript ne sera pas expliquer en entier !

Avant de commencer, voila ce que nous allons faire :
http://nabcloud.fr/dev/DemoWebSDK/

Ensuite,
Si vous êtes sous Windows, il faudra télécharger notepad++.
Si vous êtes sous Mac, il faudra télécharger TextWrangler.
Si vous êtes sous Linux, notamment ubuntu, gedit suffira !

Il va falloir téléchargez le SDK version javascript (NabCloudSDK-js.zip), décompresser le.
Créer un nouveau dossier sur votre bureau et nommer le "TestSDK". Dans ce dossier, glisser le fichier nabaztag.js puis créer un fichier "index.html". Comment faire ?
Pour Windows:
Clique Droit->Nouveau->Fichier texte. Et renommer le en supprimant le ".txt" en "index.html"
Pour Mac:
Ouvrez l'application TextWrangler, puis cliquez sur Fichier->Enregistrer Sous->index.html
Pour linux:
Clique Droit->Créer un document->Fichier vierge. Puis taper "index.html"

Ensuite, pour tous les System d’exploitation, cliquez droit sur le fichier index.html et ouvrire avec->Notepad++ ou TextWrangler ou Editeur de texte

Ensuite, nous allons entrez le code de base de l'application :

Code:

<html>
<head>
</head>
<body>
</body>
</html>

Ensuite, il faut "installer" le SDK, ajouter entre les balises head et /head :
Code:
<script type="text/javascript" src="nabaztag.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
Ce qui nous donne :
Code:
<html>
<head>
<script type="text/javascript" src="nabaztag.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
</head>
<body>
</body>
</html>
Voila, le SDK est installer. Maintenant, nous allons encore ajouter une ligne dans les balises head :
Code:
<script type="text/javascript">
function LeMACestEntrez() {
$("#MACduNabaztag").fadeOut("fast");
nabaztag.ConfigureAndStart($("#mac").val());
$("#LesApplicationsDisponible").fadeIn("fast");
}
function AuDodo() {
nabaztag.tts("start", "Mais je suis pas fatiguer ! Bon d'accord !", "fr");
setTimeout('nabaztag.ears("move", "10", "10")', 8000);
setTimeout('nabaztag.tts("start", "Enfaite non !", "fr")', 12000);
nabaztag.ears("reset");
}
</script>

Puis nous allons ajouter entre les balise body ce code :

Code:

<div id="MACduNabaztag">
<center>
<label><b>Le MAC de votre nabaztag: </b></label><br />
<input type="text" id="mac"/><input type="submit" Onclick="javascript:LeMACestEntrez();"/>
</center>
</div>

<div id="LesApplicationsDisponible" style="display:none;">
<center>
<input type="submit" value="Dire Bonjour" Onclick="javascript:nabaztag.tts('start', 'Bonjour !', 'fr');" /><br />
<input type="submit" value="Chanson du lapin malefique" Onclick="javascript:nabaztag.multimedia('play', 'http://nabcloud.fr/cast/music/malefique.mp3');" /><br />
<input type="submit" value="Au dodo !" Onclick="javascript:AuDodo();" />
</center>
</div>
Explication :
le bout de code
Code:
<div id="MACduNabaztag">
définie le début d'un "bloc" qui contient une zone pour entrez du texte, le mac du nabaztag et un bouton qui permet de valider,le MAC. Ce bloc ce finit par
Code:
</div>

Le code du bouton est :
Code:

<input type="submit" Onclick="javascript:LeMACestEntrez();"/>

On peut remarquer l'attribut "Onclick" qui veut dire "Quand le bouton sera appuyer, fait ça" et qui est égale a "javascript:LeMACestEntrez();". Quand on appuiera sur le bouton, il exécutera la fonction LeMACestEntrez(); qui est définie plus haut, allons voir cette fonction :
Code:

function LeMACestEntrez() {
$("#MACduNabaztag").fadeOut("fast");
nabaztag.ConfigureAndStart($("#mac").val());
$("#LesApplicationsDisponible").fadeIn("fast");
}
Dans la première ligne, on dit de cacher le bloc "MACduNabaztag". Dans la deuxième ligne, nous faisons le première appelle au SDK, "nabaztag.ConfigureAndStart($("#mac").val())".
Cette fonction dit au SDK de régler le MAC du nabaztag sur lequel vous voulez travailler avec la valeur du champ de texte. Quand vous utiliser le SDK, il faut TOUJOURS exécuter cette ligne avant tout autre appelle au SDK. La dernière ligne dit de montrer le deuxième bloc qui contient trois bouton :

Code:

<div id="LesApplicationsDisponible" style="display:none;">
<center>
<input type="submit" value="Dire Bonjour" Onclick="javascript:nabaztag.tts('start', 'Bonjour !', 'fr');" /><br />
<input type="submit" value="Chanson du lapin malefique" Onclick="javascript:nabaztag.multimedia('play', 'http://nabcloud.fr/cast/music/malefique.mp3');" /><br />
<input type="submit" value="Au dodo !" Onclick="javascript:AuDodo();" />
</center>
</div>

La première ligne, contient un bouton "Dire bonjour", qui fera dire bonjour a votre nabaztag. L'attribut Onclick est égale a un autre appel au SDK, l'appel tts qui permet de lire du text sur le nabaztag
Code:
nabaztag.tts(Start ou Stop, Votre message, la langue)
Pour plus d'info, voir l'aide sur le SDK

Bientôt la suite !
Revenir en haut Aller en bas
Contenu sponsorisé




MessageSujet: Re: Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)   Aujourd'hui à 22:34

Revenir en haut Aller en bas
 
Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Introduction au développement de script sur NabCloud.fr (Et bientôt tous les serveurs OJN)
» script menu catégories d'items
» Logiciel/script multijoueur [résolu]
» NabazParis : le script des lapins de Paris
» [résolu] script A-RPG (VX) probleme d''activation d''interrupteur quand mort du monstre

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum des Objets Communicants et Solutions pour les Libérer... :: II. Nabaztag, Karotz, mir:ror, Dal:Dal (Violet Object Operating System) :: Les Nabaztags sont sauvés ! Les solutions... :: [OJN] OpenJabNab-
Sauter vers: