Les boîtes sont des petites horloges connectées qui affichent des informations provenant d'Internet. Pour monter votre boîte, nous vous invitons à lire le guide ci-dessous.

laboîte est un Arduino accompagnée d'un module Ethernet et d'un écran (appelé aussi matrice de LED).

Components

Pour construire une boite, vous aurez besoin de :

• Un Arduino UNO
• Un module Ethernet ou shield en anglais
• Un écran de 32×16 leds
• Un câble USB type B
• Des fils de prototypage male/femelle ×6
• Un boîtier imprimé en 3D

Building

The following list outlines steps for building a laboite device:

1. Commencez par brancher le module Ethernet sur l’Arduino
   
2. Utilisez les fils de prototypage pour raccorder la matrice de LED au module Ethernet.
   Attention Deux versions de la matrice de LED sont disponibles avec des connecteurs différents. La dernière version de la matrice indique une tension d'alimentation de 12V mais fonctionera parfaitement avec les 5V fournis par notre Arduino.

   Écran	Arduino
   5V/12V	+5V
   GND	GND
   DATA	7
   WR	6
   CS	5
   CLK	4

   
   
3. Placez l'ensemble dans le boîtier assemblé (vis placées entre les parties avant et arrière)
   
   Si vous avez une imprimante 3D (ou un FabLab) à proximité, téléchargez nos fichiers .stl :
   boitiers.stl v1 boitiers.stl v4
4. Raccordez le câble Ethernet sur votre box Internet
   
5. Raccordez le câble USB à votre ordinateur (après avoir installer l'IDE Arduino (la version 1.0.5 est recommandée pour avoir une compatibilité avec la librairie ht1632)
   Attention Si le téléversement échoue, veuillez installer ces pilotes Mac ou Windows
6. Téléchargez la librairie ht1632c puis décompressez le contenu de l'archive dans votre répertoire Arduino /libraries
   ht1632c.zip
7. Téléchargez le croquis Arduino puis décompressez le contenu de l'archive dans votre répertoire Arduino (le répertoire laboite-master devra être renommé en laboite)
   laboite.ino
   Votre répertoire Arduino devrait ressembler à quelque chose comme cela :
   
8. Créez un compte sur le site laboite.cc
9. Identifiez vous ensuite pour ajouter une boîte en cliquant sur le bouton Add
10. Une fois votre boîte créée, copiez la suite de caractère appelée Clé d'API
11. Configurez ensuite vos apps en cliquant sur l'onglet Apps. Reportez vous à la section ci-dessous pour plus d'informations sur la configuration des apps
12. Activez ensuite les apps sur votre boîte (onglet My devices)
13. Ouvrez votre IDE Arduino et modifiez la ligne 69 du fichier laboite.ino en indiquant la clé d'API que vous avez copié à l'étape 10 :
    char apikey[] = "61c119ce"; // your device API key
14. Upload the sketch and enjoy a coffee to celebrate !

Apps allows you to modify the information displayed on the devices. Each app allows the display of one or more information. Here are some examples:

• 
  Time
  shows time for a city in the world
• 
  Emails
  shows the number of unread mails
• 
  Weather
  displays the weather forecast
• 
  Métro
  affiche l'état du réseau métro STAR
• 
  Waves
  displays predicted conditions for a surf spot
• 
  Calendrier
  affiche votre prochain rendez-vous

An API allows your laboite devices to retrieves its apps data using a computer-friendly network protocol and format. There are two network protocols available: CoAP and HTTP. Two formats are supported to recover data: XML and json. Here is a XML file example containing three apps (Time, Buses and Weather):

<?xml version="1.0" encoding="utf-8"?>
<response>
  <version>0.1</version>
  <time>18:18</time>
  <nextbus>5</nextbus>
  <weather>
    <today>
      <icon>0</icon>
      <temperature>25</temperature>
    </today>
    <tomorrow>
      <icon>1</icon>
      <low>15</low>
      <high>28</high>
    </tomorrow>
  </weather>
</response>

Same info in json format:

{
  "version": "0.1",
  "time": "19:10",
  "nextbus": 1,
  "weather": {
    "today": {
      "icon": 0,
      "temperature": 25
    },
    "tomorrow": {
      "icon": 1,
      "low": 15,
      "high": 28
    }
  }
}

These files can be retrieved using this url: http://api.laboite.cc/<apikey>.<xml|json>

Le nombre d'apps affichées par votre boîte est quasi infinie. Le guide ci-dessous vous guidera dans la création d'une nouvelle app laboîte personnalisée !

Introduction et architecture

Votre boîte fonctionne de la manière suivante :

1. Toutes les boîtes disposent d'un identifiant unique appelée clé d'API. Lorsque vous connectez votre boîte sur internet, celle-ci va alors interroger le serveur avec une requête de ce type GET http://api.laboite.cc/<votre_clé_api>.json
2. Si vous avez correctement configuré vos apps sur https://laboite.cc/apps, votre boîte devrait recevoir un fichier json de ce type :
3. Ce fichier contient toutes les informations (au format json) qui vont être analysées puis affichées par votre boîte
4. Dans les sections ci-dessous, nous verrons comment créer une app web (en PHP) puis nous détaillerons le développement nécessaire à la partie Arduino (en langage C)

Création d'un app (partie web en PHP)

Voici les étapes de création d'une app en PHP :

1. Commencez par isoler la donnée que vous souhaiteriez afficher, cela peut être une donnée provenant d'une page web ou d'une API
2. Nous prendrons pour exemple les données ouvertes du réseau STAR, plus particulièrement nous chercherons à afficher sur notre boîte le nombre de vélos disponibles à la station Place de Bretagne
3. La documentation présente sur le site https://data.explore.star.fr/ nous indique que l'url permettant de récupérer les données liées à la station Place de Bretagne est la suivante GET https://data.explore.star.fr/explore/dataset/vls-stations-etat-tr/api/?refine.nom=Place+de+Bretagne
4. Si vous tapez cette url dans votre navigateur, vous devriez obtenir un fichier qui ressemble à cela :

   {
   "records": [
       {
         "datasetid": "vls-stations-etat-tr",
         "fields": {
           "coordonnees": [
             48.1096206,
             -1.684018814
           ],
           "etat": "En fonctionnement",
           "idstation": 24,
           "lastupdate": "2015-12-14T11:20:04+00:00",
           "nom": "Place de Bretagne",
           "nombreemplacementsactuels": 20,
           "nombreemplacementsdisponibles": 3,
           "nombrevelosdisponibles": 17
         },
         "geometry": {
           "coordinates": [
             -1.684018814,
             48.1096206
           ],
           "type": "Point"
         },
         "record_timestamp": "2015-12-14T11:20:00+00:00",
         "recordid": "03bd9f7320deca7e70c171d1a1a14224c446698b"
       }
     ]
   }

5. Nous avons surligner ci-dessus l'information pertinente que nous souhaiterions envoyer à laboîte. Il ne nous reste plus maintenant qu'à récupérer cette valeur en PHP puis à déployer cette app sur notre serveur. Pour ce faire, télécharger le fichier suivant :
6. Si vous souhaitez tester cette app, nous vous invitons à installer PHP sur votre ordinateur en suivant ce guide
7. Une fois la partie web créée, la donnée va pouvoir être analysée et affichée par laboîte (ceci est décrit dans la section suivante)

Création d'un app (partie Arduino en C)

Une fois la donnée envoyée par le code PHP décrit ci-dessus, nos prochaines étapes vont porter sur le traitement et l'affichage de cette donnée par laboîte :

1. Tout d'abord, reprenez les étapes 6 à 14 du guide de montage
2. Une fois votre boîte fonctionnelle, ouvrez le fichier laboiteLib.ino et ajoutez le code suivant dans la fonction parseJSON()
3. Ce code permet de récupérer la valeur envoyée par le serveur et de la stocker dans une variable appelée bikes
4. Reste maintenant à afficher cette variable sur notre matrice de LED laboîte. Pour ce faire, nous vous invitons à ajouter le code suivant dans le fichier laboiteLib.ino :
5. Une fois cette modification effectuée, vous pouvez téléverser votre nouveau programme dans votre boîte et voir le résultat
6. N'hésitez pas à nous envoyer vos contributions en utilisant l'outil prévu à cet effet, si votre application est approuvée alors celle-ci sera déployée sur notre serveur officiel laboite.cc

Si vous souhaitez partager avec la communauté une photo de votre boîte ou une app que vous avez dévellopée. Ou bien, si vous ne trouvez pas de réponse à votre problème sur cette page, nous vous invitons à vous inscrire à notre liste de discussion ici support@laboite.cc :