Mag PDF Programmez192

programmez!
#192
le magazine du dveloppeur
- Janvier 2016
DOSSIER
SPCIAL
14 pages
Les ralits alternatives

ISTOCK - DOLGACHOV
Oculus, Hololens, Google Glass...

Mon 1er projet Oculus et Unity 5.1
Les usages, les matriels.
SpEcial vintage !
Amiga, Amstrad CPC,
Apple II, Atari ST, GameBoy
Redcouvrez ces machines mythiques et comment les programmer
Crer
son
drone
de
AZ
Connecter des objets

avec
Node.JS
Les profils en
1ere partie
Printed in EU - Imprim en UE - BELGIQUE 6,45 SUISSE 12 FS - LUXEMBOURG 6,45 - DOM Surf 6,90 Canada 8,95 $ CAN - TOM 940 XPF - MAROC 50 DH
Java 8
M 04319 - 192 - F: 5,95 E - RD
3:HIKONB=ÛZ^Z]:?a@l@t@c@a";
Pub cahier couv 192_192 17/12/15 21:00 Page2
003v2_192_192 18/12/15 12:41 Page3
Kinect
SDK
Les
profils en
Java 8
2e partie
79
Tu vas aimer linformatique vintage.

Cela faisait bien longtemps que lide tait dans ma tte : faire un
dossier vintage o vous verriez enfin ce quavaient
dans le ventre les ordinateurs des annes 80 et 90.
Les Atari ST, Amiga, Amstrad CPC, et mme les
bons vieux Apple II, on en faisait des choses et
des prouesses avec quelques octets. Dcouvrez
aussi que ces machines sont toujours
recherches et utilises, notamment par la
dmoscne, trs active en France ! Et pour ne pas
gcher notre plaisir, un petit mulateur
GameBoy en C#. Cest cadeau !
36
Agenda
Les
ralits
alternatives
10
Spcial
vintage
16
P.S. : nous remercions tous les auteurs et contributeurs, tous

nos partenaires techniques et, vous, fidles lectrices et
lecteurs du magazine.
Rameur
geek
2e partie
64
Les
outils web
open source
Toute la rdaction de Programmez !

vous souhaite une excellente anne 2016.
Le boss
ftonic@programmez.com
69
Test : cran
tactile officiel
Raspberry Pi
Dv du
mois
Ce premier numro de lanne vous propose

aussi de nombreux autres articles :
Kinect, Java 8, Node.JS,
architecture Java, le framework
Mean ou encore comment
construire son propre drone.
Connecter
des IoT en
NodeJS
Cahier
Drupal 8
La grande nouvelle de ces dernires

semaines est bien entendu la
disponibilit de Drupal 8. force den
parler dans Programmez !, la
plateforme est enfin sortie Nous vous
proposons den explorer quelques recoins et nous faisons le point
sur la dernire confrence Drupal europenne, la DrupalCon de
Barcelone.
Nous nous projetons aussi vers le futur immdiat avec les ralits
alternatives. Nous parlerons Oculus Rift, Hololens, Google Glass,
usages, modles de dveloppement. Un dossier passionnant
et tout sauf virtuel.
67
Java 8
et les grands
projets
Architecture
Java
2e partie
55
76
Mean.IO
4e partie
72
Construire
son drone
1ere partie
58
62
lire dans le prochain numro n193 en kiosque le 30 janvier 2016
Les tests et vous
Les tests font partie du dveloppement et du quotidien du

dveloppeur. Quels tests faut-il faire ? Quels outils choisir ?
Les bonnes pratiques ? Comment intgrer Jenkins et Arduino ?
IDE
Non, Delphi
nest pas mort.
NoSQL
Pourquoi utiliser le modle orient

document de MongoDB ?
Programmez! a Janvier 2016
004_005_192 17/12/15 21:05 Page4
janvier
mars
LavaJUG
NIDays2016:
10 mars
JUG Nantes:
soire continuous delivery avec Jenkins et Docker. Le 19 janvier partir

de 19h. http://www.nantesjug.org
SnowCamp2016 !
Retrouvez +250 dveloppeurs sur de nombreuses

thmatiques les 21 et 22 janvier Grenoble. Journe
ski le 23... site : http://snowcamp.io/2016/fr/
BeMyApp
organise plusieurs hackathonset concours :

a Vinci Startup Tour: Vinci aide les startups diffuser leurs productions
dans le groupe. Les inscriptions doivent se faire avant le 17 janvier
minuit. Les startups prsenteront leur projet devant un jury (courant
fvrier). Les rsultats seront annoncs le 4 mars.
a Challenge Full-stack JS: 10 heures de code, des challenges! Venez
dfier les meilleurs experts en JS lcole42. 23 janvier.
a Hackathon e-rsidents Dalkia: inventer lhabitation de demain et une
nouvelle manire dhabiter et dinteragir. 48h pour monter le projet et
le dfendredu 5 au 7 fvrier (Paris). http://hackathon.dalkia.fr
fvrier
DevFest Paris, le 5 fvrier!
National Instruments
organise sa journe
annuelle Paris le 10 mars
prochain. Occasion pour
faire le point sur les
diffrents outils,
linstrumentation, linformatique industrielle et embarque. La journe
sera rythme par de nombreuses confrences.
Grand rendez-vous de la journe, deux coupes seront organises, la
Coupe NXT et la Coupe RIO, dont le thme commun est la robotique.
Pour plus de dtails: http://france.ni.com/nidays/coupes-robotiques
Site officiel: http://france.ni.com/nidays
AlfrescoDay 2016
L'diteur Alfresco organise une journe IT/technique le 30 mars 2016

Paris
MUG Strasbourg: les prochaines runions
Le Microsoft User Group de Strasbourg organise rgulirement pour

la communaut des confrences autour des technologies Microsoft.
Les prochains vnements prvus sont:
Janvier: confrence sur Xamarin
Fvrier: confrence sur le langageF#
Mars: confrence surTypeScript etAngular2
A lheure o nous publions, les dates prcises ne sont pas encore
connues.
Facebook: https://www.facebook.com/groups/MugStrasbourg/?fref=ts
Twitter: https://twitter.com/MUGStrasbourg
Quelques dates retenir

EVOLVE16:
La confrence dveloppeur de Xamarin se

droulera en Floride du 24 au 28 avril. De
nombreux thmes seront abords: design,
compilation, intgration, scurit, tests,
monitoring https://evolve.xamarin.com
Trs gros succs Nantes, la DevFest arrive Paris. Cette grande

journe de dveloppement et de technologies est organise par le
Google Developper Group de Paris. La journe se droulera de 8h 20h
et lagenda sannonce charg avec 25 confrences et +700 personnes
attendues! Lieu: La Grande Crypte, Paris.
Site officiel: http://devfest.gdgparis.com
La confrence NCRAFTS2016 aura lieu cette anne

les 12 et 13 mai
MICROSOFT TECHDAYS2016:
Les fameux TechDays se drouleront cette anne
en octobre et sur deux jours
Les vnements Zenika

ZenikaNG2 Tour/Zenika organise le NG2
Tour au sein de ses diffrentes agences et
vous propose de dcouvrir tous les secrets
d'Angular2. Vous souhaitez commencer une
nouvelle application et vous hsitez entre
AngularJS et Angular2? Vous dsirez avoir
un aperu de la prochaine version du

framework? Ou peut-tre faites-vous partie
des personnes qui ont des interrogations par
rapport ce quelles ont dj entendu sur

lavenir dAngular? Les dates:
Zenika Paris: 12 janvier 2016
Zenika Lyon: 21 janvier 2016
Zenika Lille: 26 janvier 2016
Programme et inscription:
http://www.zenika.com/Evenements/zenika-ng2-tour.html
Document non contractuel. Logiciel professionnel - Mobile Friendly = compatible mobiles COMPATIBLE WINDEV ET WINDEV MOBILE
organise une runion AngularJS /Angular2 le 14 janvier.

http://www.lavajug.org/events
004_005_192 17/12/15 21:05 Page5
WEBDEVV
NOUVELLE VERSION
RSION
Document non contractuel. Logiciel professionnel - Mobile Friendly = compatible mobiles COMPATIBLE WINDEV ET WINDEV MOBILE
CREZ FACILEMENT DES SITES

RESPONSIVE WEB DESIGN
Rendez vos sites

Mobile Friendly.
WEBDEV 21 vous permet de rendre fa
facilement vos
sites Mobile Friendly.
Les sites que vous crez sont ainsi mieux rfrencs
par Google.
Responsive Web Design et Dynamic Serving sont
votre service dans WEBDEV 21.
DVELOPPEZ 10 FOIS PLUS VITE
www.pcsoft.fr
www.pcsoft.fr
Des c enta
aiines de tm
mooigna
agges su
ur le siitte
006_007_192 17/12/15 21:06 Page6
Ecran tactile officiel Raspberry Pi

Voil il est enfin arriv! Raspberry Pi propose
son propre cran tactile 7 pouces. Pas toujours
facile trouver, il est vendu gnralement aux
alentours de 80-90E. Petite prsentation.
Les caractristiques de lcran

sont plutt classiques:
a Rsolution cran800x480
a Ecran tactile capacitif
a Compatible Pi1 et Pi2 (attention
aux trous de fixation qui ne sont
pas identiques entre les versions)
a Taille cran physique: 194 x 110
x 20mm
La construction de lcran est trs
propre et de qualit, cest rassurant.
Le pack comprend lcran en luimme, le shield ddi, les nappes,
les fils de connexion et les vis de
fixations. Bien entendu, la Pi nest
pas incluse Et aucune documentation nest incluse mais elle est
facilement trouvable sur le siteelement14. Lcran ncessite un shield
ddi qui est un adaptateur faisant
le lien entre lcran et la Pi.
nappes dans les connecteurs et

de bien verrouiller lembout
de maintien.
a Prenez la nappe blanche (fournie)
et insrez un ct dans le connecteur situ gauche de la board
(ct inscrit en bleu vers vous).
a Connectez la nappe blanche sur
la Pi, sur le connecteur Display.
a Prenez les fils rouge et noir. Fixezles sur les broches5V (fil rouge) et
GND (fil noir) du shield. Puis sur la
Pi, connectez les fils sur les
broches 5V et GND (broches du
haut en partant gauche : 1ere
broche et 3e broche).
a Fixez maintenant la board
lcran avec les longues vis puis
placez la Pi (ici une Pi2) puis vissez la board.
Voil, le montage est termin. Si ce
nest pas dj fait, vous devez installer la distribution Raspbian sur
une carte SD (minimum 4Go, nous
conseillons 8Go) puis linsrer
dans le lecteur SD de la Pi2. Prenez la distribution la plus rcente.
Le montage
Premier contact
Franois Tonic
Programmez!
En lui-mme, le montage nest pas

trs compliqu et se ralise en
quelques minutes:
a Connectez les deux nappes
(couleur jaune) de lcran la
shield. Vous ne pouvez pas vous
tromper de sens. Faites bien
attention bien pousser les
Si le montage est correct, connectez lalimentation sur le connecteur

du shield (et non de la Pi2). En
quelques secondes, lcran sallume et le systme se charge.
Lcran est trs lumineux avec un
bon angle de vision. Le tactile est
plutt sensible et efficace mme si
Codez directement sur lcran
Soyons clairs, pour de petits projets, crer des objets directement

sur la Pi 2, la taille de lcran suffira mais pour des projets un peu exigeants, mieux vaut passer par un cran normal. Pour notre part,
nous avons install PyQt4 et Qt Designer 4. Qt est une puissante
librairie multi-plate-forme pour crer des interfaces et Designer est
loutil graphique. Il suffit de crer linterface dans le Designer puis de
limplmenter dans le code Python via PyQt qui fait le lien entre
Python et Qt (qui est avant tout en C++). Vous importez les fichiers .ui
et vous rfrencez les diffrents objets dinterface avec les bons
events. Le tout fonctionne plutt bien et vous pouvez prototyper rapidement votre objet IoT et les capteurs. Nous vous conseillons de
brancher un clavier et une souris.
les gros doigts vont vite avoir

quelques problmes. Vous pouvez
alors connecter votre Pi un clavier et une souris. Car coder avec
les doigts ce nest pas forcment
super pratique.
Vous transformerez votre Pi2 en
vritable PC hybride mais pour un
prix trs raisonnable: 150 !
Surtout, vous profitez de tous les
avantages du Pi avec lcran tactile. Vous pouvez ainsi utiliser vos
shields et capteurs et continuer
utiliser vos outils de dveloppement Nous avons essay de faire
fonctionner avec Windows10 IoT
mais nos premiers tests ont
chou (nous navions pas les dernires builds IoT).
Nous le
recommandons!
Franchement, malgr un prix un

peu lev, cet cran est rellement
intressant et ouvrira de nouvelles
perspectives votre Pi/Pi2 et
vos objets connects. Vous pourrez facilement dvelopper des
LES +
a Qualit de lcran
a Les possibilits du tactile avec la
Pi2
a Un vritable hybride fonctionnel et
pas cher
a Fixation rapide et derrire lcran
a Raspbian compatible (mais pas
adapte)
LES
a
a
a
a
Pas de documentation
Prix un peu lev
Pas toujours facile trouver
La colle entre le chssis et lcran
se dtache trop facilement
applications avec interfaces adaptes pour piloter votre domotique

et capteurs.
Malgr labsence de toute documentation dans le carton, celle propose par Element14 suffit pour
tre oprationnel en 5-10 minutes,
et les tutoriaux devraient rapidement se multiplier; cet cran prend
tout son sens pour des projets IoT
et les capteurs.
Enjoy!
u
006_007_192 17/12/15 21:06 Page7
008_009_192 17/12/15 23:14 Page8
Fig.A
Un dveloppeur au cur du Vietnam

En 2013-2014, jai eu lopportunit de travailler au Vietnam, Ho Chi Minh Ville dans le
sud du pays sur une priode dun an. Jy ai travaill 7 mois pour un client franais bas
en France, Fullsix (http://www.fullsix.fr/f6-havas/fr/), puis 4 mois pour le compte dune
entreprise japonaise, Intelligence Business Solutions (http://www.inte.co.jp/en/).
Guillaume Delattre
SFEIR
Je vais me concentrer sur la premire exprience,
la seconde tant trop loigne de mon coeur de
comptences. En effet, la culture Japonaise du travail est bien trop diffrente de la culture franaise et
mme les outils informatiques utiliss sont parfois
100% nippons, par exemple le framework DI
(Dependency Injection) Seasar Seasar qui a une
documentation riche et un support uniquement en
Japonais. Avant de commencer dcrire la mission
pour laquelle jai t amen travailler Sagon
sur un plan technique, il est ncessaire de dcrire le
contexte du pays. Le Vietnam fait partie des pays
dits mergents et possde un taux de croissance
conomique soutenu. Le Vietnam a longtemps
ferm ses portes au niveau conomique pour des
raisons historiques et politiques, mais est maintenant largement ouvert. Pour preuve, louverture
symbolique dun 1er McDonalds au Vietnam en
2014, (http://edition.cnn.com/2014/02/10/travel/mcdonalds-opens-in-vietnam/).
Aujourdhui, de nombreux investisseurs europens
(France, Allemagne, etc.), amricains, asiatiques
(Japon, Core du Sud, etc.) sont prsents au Vietnam. De nombreuses coles dans le domaine des
nouvelles technologies sont implantes et forment
chaque anne quantit dingnieurs, et, parfois les
Vietnamiens viennent jusquen Europe ou aux
tats-Unis pour tudier. Et jai pu travailler avec
quelques Vietnamiens ayant tudi en France.
De plus, Ho Chi Minh, tant situe au milieu de la
rgion du delta du Mkong, rgion productrice
dune quantit importante de denres alimentaires, possde un port de transit commercial
extrmement important dimension internationale et donc une activit conomique locale trs
intense. Voil pour le contexte conomique.
En revenant ma premire exprience professionnelle en tant que dveloppeur JAVA et amen travailler avec un autre collaborateur franais sur
place, jai intgr une quipe ddie travailler
pour le groupe franais Ekino-FULLSIX. Lenvironnement technique tait relativement riche :
a Des postes dordinateurs DELL avec une version
dUbuntu comme OS et donc console dadministration ;
a Une liaison VPN nous permettant de nous
connecter des serveurs distants ;
a Des salles rserves aux vidoconfrences ;
a Environnement Atlassian : JIRA (soft pour le suivi

de projet), confluence (solution pour la documentation technique) ;
a Usine de dev au travers dArtifactory, un soft
pour grer les diffrents dpts MAVEN avec un
souci dautomatiser les processus au maximum ;
a Un ensemble de scripts de release et de dploiement des applications sur les serveurs ;
a Outil de gestion de versions : GIT avec un niveau
de code review via GRIT. Le code push est systmatiquement revu par une tierce personne
validant ou non le commit et qui merge lui-mme
les diffrentes branches pushes par les dveloppeurs ;
a JAVA 7, pile de frameworks JAVA modernes et
standards (Spring, Hibernate, Guava, WEB-services de type REST, etc.) ;
a Souci dcriture de tests unitaires (isols et ne
dpendant donc pas de donnes en base) et
tests dintgration (susceptibles dtre dpendants de la base de donnes et donc ncessitant
rgulirement une maintenance)
Dans un premier temps, jai pu aider au recrutement en formant/testant quelques dveloppeurs
vietnamiens sur place. Le premier projet auquel jai
particip au dpart a t lintervention sur le projet
en interne de Fullsix, le projet Webfactory dont
voici linterface de connections, pour ceux qui
auraient travaill (ou travaillent) pour Fullsix, login
webfactory (la nostalgie du remplissage des CRA
mensuels).
Il sagit de leur outil de gestion en interne Fig.A.
La prise en main de loutil SCM GIT a t pour moi
une premire tant donn que je navais utilis
dans le pass que SVN. Cette priode dapprentissage a t indispensable pour moi au dpart pour
pouvoir travailler et tre oprationnel rapidement.
Jai galement travaill sur le projet dune solution
commercialise par Fullsix, un CMS fait maison
extrmement complet et proposant une solution
cl en main lutilisateur final pour tre capable
de grer et publier le contenu, et donc le marketing,
de faon entirement autonome. Quelques clients
comme SFR ou Renault poussent croire que la
solution fonctionne trs bien et correspond une
relle demande sur le march actuel.
Ct technique, jai pu apprivoiser un nouveau framework orient VIEW, le framework Apache Wicket,
mais qui ma un peu drout mes dbuts car bien
diffrent de ceux que javais pu utiliser auparavant.
Outre lactivit du dveloppement logiciel, la mis-
sion de recruter et de former du personnel qualifi

sur place a t trs vite dactualit.
De nombreux entretiens techniques ont donc t
ncessaires et jai pu croiser quelques candidats
vietnamiens pour les auditionner. Les diffrences
entre les diffrents candidats taient extrmes. A
commencer par lexpression orale en anglais obligatoire. En effet, on remarque que les personnes ayant
sjourn/tudi en Europe-Etats-Unis parlent nettement mieux et sortent clairement du lot. Ensuite, la
barrire de la langue passe, viennent les tests techniques, et, l aussi, on saperoit quil y a de grosses
diffrences. Globalement, une personne intresse
et motive pour se tenir informe de manire personnelle dans son domaine de comptences est
rest le meilleur gage/preuve defficacit.
Je souhaite galement parler de lambiance/environnement de travail Ho Chi Minh Ville dans les
locaux de la socit o jai travaill. Pour commencer, les horaires de travail sont relativement identiques ceux pratiqus en France. Je parle bien
dune entreprise franaise implante au Vietnam et
non dune entreprise locale vietnamienne
employant du personnel vietnamien. Un petit dtail,
mais important mes yeux. Il sagt de la sieste pratique par lensemble du personnel et je prcise
tout le personnel, y compris la direction.
Ensuite, jai travaill dans un btiment accueillant 56 open-spaces taille humaine diviss en gros par
client cible. Ensuite, pour le reste et les heures de
travail effectif, cela ressemble de trs prs ce que
lon peut vivre en France.
Pour terminer sur mon exprience avec lentreprise japonaise, je veux prciser que cela a t
un souhait personnel que de travailler pour un
groupe nippon. Par curiosit, je pense. Mais 3-4
mois mont suffi, car la culture est tellement diffrente quil est trs difficile de rellement sintgrer et de comprendre la mentalit et la
mthodologie utilises. Selon leurs dires, ils souhaitaient un personnel diversifi incluant
quelques employs occidentaux et ils apprciaient normment la France en gnral.
En conclusion, jaurais tendance affirmer quune
exprience ltranger, notamment, dans un pays
forte croissance conomique reprsente un atout
et permet galement de voir la France de ltranger,
et de sapercevoir de sa prsence linternational.
Et dans le domaine des nouvelles technologies, il
est plutt possible de se lancer facilement dans ce
genre de projet professionnel.
u
008_009_192 17/12/15 23:14 Page9
010_015_192 18/12/15 12:46 Page10
Ralits Alternatives et Objets Connects

Nous disposons tous dun ordinateur avec un clavier et une souris, et pour les plus chanceux, dun cran
tactile. Avec le Nabaztag, Rafi Haladjian a lanc lre de linternet des objets ; lide premire tant de ne
plus accder linformation uniquement via notre ordinateur mais de rendre lintelligence ambiante.
Jonathan Salamon
Dveloppeur Android pour Accengage,
Auto-entrepreneur spcialis dans les
objets connects et Responsable du ple
dveloppement de lassociation Glass
Camp; il dveloppe des projets innovants
(BikeFinder, CultureGlass, Wearable
Intelligent Banking)
Valentin Michalak
Microsoft Student Partner Lead,
Ingnieur chez SOAT et Responsable
technique de la Virtual Association.
https://fr.linkedin.com/in/jonathan-salamon-35067486 https://www.linkedin.com/in/vmichalak
valentinmichalak@gmail.com
jonathan@glasscamp.org
Les objets connects, de plus en plus prsents
dans nos vies, sont une bonne premire tape
mais aujourdhui, les industriels rflchissent
dj ltape suivante : la ralit virtuelle /
augmente. Microsoft, Google, Facebook, HTC,
etc., tout le monde y va de son produit pour
rvolutionner les usages via des lunettes,
casques et autres priphriques.
Nous commenons dj voir ce que cette
disruption va nous rserver. Ces nouveaux
objets vont aussi rvolutionner le monde de la
production et la diffusion audiovisuelle, la
communication, le divertissement, lducation
immersive ...
Via ce dossier consacr spcifiquement aux
systmes de ralit augmente et virtuelle,
nous allons tenter de vous montrer ce qui
arrivera dans le futur et de comprendre
comment tous ces produits vont venir changer
notre quotidien.
tes-vous prt vous passer de votre cran
pour vous immerger dans vos informations de
manire virtuelle et/ou augmente ?
Si tout cela vous parat encore un peu abstrait,
nous vous proposons, avant daller plus loin, de
commencer par prciser ce dont il sagit.
Diffrences entre Ralit

Augmente, Virtuelle, et Mixte
(RA/RV/RM)
En un clin dil, un mouvement de main ou de
tte, les objets intelligents nous permettent de
se retrouver au milieu dune plage, au fin fond
de locan pacifique, en train de marcher le
long de la muraille de Chine, ou dans nimporte
quel endroit du monde avec la sensation dtre
rellement sur place mais sans y tre.
Ralit Augmente (RA)
La ralit augmente dsigne un procd

permettant de superposer des informations ou
10
Carlos Rodriguez
Ingnieur en lectronique et
informatique industrielle, est
impliqu dans un consortium
europen du son immersif
(projet Edison3D, Binaural)
Responsable du ple
Cration Matriel
(Hardware) de lassociation Glass Camp
www.glasscamp.org
https://www.linkedin.com/in/carlos-rodriguez-b5430241
carlos@glasscamp.org
Aurlie Filippetti, Ministre
de la Culture et de la
Communication, en plein
test de l'application
CultureGlass, le 28 mai
2014 lors de la soire de
clture de l'vnement
"Silicon Valois", organis
au ministre.
Utilisation du bracelet Myo afin de contrler la lecture dune vido

des objets qui nexistent pas dans la ralit.
Elle vise donner une plus-value au rel en
laugmentant. Bien que de nombreux exemples
soient lis la vision, la RA peut augmenter
nimporte lequel de nos 5 sens.
La ralit augmente est apparue avant la
ralit virtuelle.
Un exemple simple : dans un muse, la RA
peut permettre d'afficher des contenus
contextuels avec une application ddie, ainsi
un visiteur peut faire apparatre des
informations sur un tableau donn.
Ralit Virtuelle (RV)
On appelle ralit virtuelle une forme de

simulation dans laquelle le spectateur a
limpression dtre face une scne relle,
voire dedans.
Elle permet de crer des expriences
interactives immersives, qui plongent
Une utilisatrice dOculus Rift dans une montagne russe virtuelle
Interaction entre lutilisateur et un monde virtuel avec le HTC Vive

lutilisateur au sein mme dautres mondes.
Quand lutilisateur bouge sa tte, la camra de
lapplication ou du jeu (dvelopp grce des
logiciels spcifiques tels que Unity ou Blender
3D) suit le mme mouvement. Avec la ralit
virtuelle, vous prenez la place du hros de
votre jeu vido.
010_015_192 17/12/15 21:08 Page11
DOMAINES | MAIL | HBERGEMENT | E-COMMERCE | SERVEURS
TESTEZ LE
MEILLEUR
T ES T E T APPROU V PAR
CLOUD
1&1 Serveur Cloud :
Easy to use ready to Cloud*
Les performances des nouveaux serveurs
Cloud sont imbattables en termes de
CPU, RAM et SSD.
Ralisez vos projets dans le Cloud
avec la combinaison parfaite entre
exibilit et performances.
Load balancing
Stockage SSD
Facturation la minute
Intel Xeon Processor
E5-2660 v2 et E5-2683 v3
1 mois gratuit !
Puis partir de 4,99 HT/mois (5,99 TTC)*
MOIS
POUR
ESSAYER
CLIC
POUR CHANGER
DE PACK
APPEL
UN EXPERT
VOUS RPOND
0970 808 911

(appel non surtax)
*Facile utiliser - prt pour le Cloud. 1&1 Serveur Cloud : 1 mois dessai gratuit, puis partir de 4,99 HT/mois (pour la conguration du serveur Cloud S). Facturation mensuelle
en fonction de la conguration choisie. Pas de dure minimum dengagement, ni de frais de mise en service. Conditions dtailles sur 1and1.fr. Intel et le logo Intel sont des
marques commerciales dIntel Corporation aux tats-Unis et/ou dans dautres pays. 1&1 Internet SARL, RCS Sarreguemines B 431 303 775.
1and1.fr
010_015_192 17/12/15 21:09 Page12
Ralit Mixte avec HoloLens
Ralit Mixte (RM)
Cest en effet Microsoft qui, avec ses lunettes

Hololens, prsente un nouveau concept de
ralit mixte. Cette technologie prend les
meilleurs aspects de la ralit virtuelle et de la
ralit augmente.
En fait, ce ne sont pas de simples donnes
digitales qui sont amenes dans la vie relle,
mais des lments vivants et non vivants de la
ralit virtuelle. On parle alors dhologrammes,
et il est possible dinteragir avec eux.
Ce nest pas tant limmersion dans un autre
monde, mais plutt laltration de lespace
autour de lutilisateur, en faisant croire notre
cerveau que tout ceci est bien rel.
connatre lheure de votre prochain rendezvous, Les possibilits sont infinies et

particulirement riches, mme dans un
contexte professionnel on peut imaginer
effectuer un acte chirurgical en tant guid,
obtenir le plan dtaill dun lieu pendant une
intervention dans un btiment (pompiers,
police..), Ce sont de simples exemples de
projets dj raliss et fonctionnels.
Alors, malgr ses possibilits immenses,
pourquoi les Google Glass nont pas tenu leurs
promesses
Le grand public,
une erreur de cible
Cest malheureusement le constat qui ressort

de nos expriences : le grand public nest
absolument pas prt pour ce genre de produit.
Une preuve parmi dautres : les atteintes la
vie prive par des utilisateurs peu scrupuleux
qui se sont amuss utiliser la camra incluse
dans le produit afin de prendre furtivement des
photos/vidos.
En France, suite un hackathon organis par
lassociation Glass Camp, une GlassWare
(application Google Glass) est ne : BikeFinder
(http://bikefinder.mobi/).
Google Glass, un premier

essai grandeur nature
Cest la prsentation et la commercialisation

des Google Glass qui a le plus marqu les
esprits. Objet prometteur et premier sur le
march, il faut avouer que les dceptions furent
grandes (initialement bien aid par une
campagne de communication qui sest rvle
finalement balbutiante).
Nanmoins, cela nous a permis dapprendre
beaucoup de choses.
Pourquoi avoir une paire

de Glass ?
Tout lintrt de ce produit rside dans

lenrichissement du moment prsent :
Prenez nimporte quelle situation o vous avez
besoin dune information rapide et contextuelle
comme savoir votre vitesse vlo, voir le plan
dun magasin, lire une notice de rparation,
12
Aperu de lapplication BikeFinder sur le site MyGlass
remarquer en portant ce genre dobjet, on en

vient les laisser de ct pour viter davoir
lair idiot.
Son prix et son autonomie,

des critres dcisifs
Le prix un peu excessif payer au dpart pour

le premier prototype tait de lordre de 1500$,
ce qui nest pas donn tout le monde.
De plus, avoir une batterie qui ne tient que
quelques heures, contrainte lie au design de
lobjet, ce nest malheureusement pas suffisant.
Tant que ce type dobjet ne tombera pas un
cot abordable et ne tiendra pas au moins la
journe en utilisation intensive, les utilisateurs
autant grand public que professionnels
passeront leur chemin et en concluront
invitablement quil ne sagit que dun Gadget.
De plus, lobjet a aussi tendance chauffer,
principalement lorsque celui-ci est en charge,
ce qui empche une utilisation prolonge
mme lorsque les lunettes sont branches
une source dnergie.
Google Glass, avant tout un

prototype
Les Google Glass telles que commercialises

(Explorer Edition, 1500 dollars), ntaient et ne
sont toujours quun prototype. Il y a beaucoup
de chemin avant dobtenir un produit final. Ce
qui vient confirmer cette hypothse : Le kit de
dveloppement qui est en preview
(https://developers.google.com/glass/develop/gdk/) ,
le fait que la version dAndroid tournant sur les
lunettes est obsolte (4.0.4 puis 4.4) et le fait
que ce nest pas Android Wear qui tourne
dessus mais une version allge de Android
(alors que le systme Wear serait bien plus
adapt et amliorerait probablement
lautonomie).
Il reste encore du chemin mais cela reste une
exprience qui fut vraiment intressante autant
en tant que dveloppeur que pour Google qui
tirera srement les leons ncessaires de ce
semi-chec, et, on comprend pourquoi le projet
a t remani/repens et sappelle dsormais
le Projet Aura (http://www.projectaura.com/en/).
Les Google Glass ne sont que le dbut dune
nouvelle rvolution.
Cette application qui est officiellement

disponible sur MyGlass (magasin dapplications
officiel) pour but de vous aider trouver une
station avec des vlos en libre service
disponibles mais surtout, lorsque vous tes en
train de rouler et que votre temps de location
expir, de vous proposer la station la plus
proche o des places sont disponibles pour
garer votre vlo.
Bien quelle soit fonctionnelle dans 200 villes et
20 pays, elle totalise environ 300 utilisateurs
actifs, ce qui tend
prouver que le grand
public nest pas encore
prt pour ce type
dusage. On peut bien
sr parler galement
du design, avoir lair
dun robot ne met
personne en valeur et, Partenaires du programme Glass At Work, preuve du changement de cible pour le produit :
force de se faire
Source : https://developers.google.com/glass/distribute/glass-at-work
010_015_192 17/12/15 21:09 Page13
Tango
tat des lieux de ce qui existe
Projet dvelopp par Google qui consiste notamment

cartographier son environnement, cest--dire la possibilit de
recrer lidentique notre environnement en 360 grce des
capteurs extrmement sophistiqus.
Des applications et des jeux sont disponibles qui ont la
particularit doffrir la possibilit dancrer des objets dans
lespace physique (cest dire quun objet virtuel reste sa
place dans le monde physique mme si lutilisateur se dplace. Il
est donc possible de dfinir une zone de jeu, de se cacher
derrire un objet, etc.)
Il est possible dy ajouter un support casque afin dajouter une
notion dimmersion similaire Oculus Rift par exemple
(https://www.durovis.com/product.html?id=5)
Google Glass
A la manire des notifications de nos smartphones, des informations

contextualises peuvent tres affiches dans les lunettes (SMS,
Facebook, Twitter, trouver des avis de restaurants, trouver votre chemin,
afficher le dernier titre paru dans la presse, ). On ne prsente plus les
Google Glass, qui peuvent tre aujourdhui considres comme
prcurseuses. Elles restent la rfrence des lunettes transparentes
monoculaires et laffichage tte haute (en haut droite de loeil) leur
confrent lavantage quil est facile doublier quon en est porteur.
Linformation est l quand on en a besoin et la technologie sefface
quand elle nest plus contextuellement ncessaire.
Epson Moverio
Lunettes connectes binoculaires tournant sous Androd, elles

sont principalement rserves aux professionnels.
En effet, elles offrent des normes similaires celles requises sur
des chantiers de construction par exemple.
Elles se pilotent via une tlcommande (relie par un cble aux
lunettes) compose dune batterie, de boutons et dun touchpad
(pour se dplacer dans linterface). Son autonomie et son champ
de vision sont suprieurs ceux de ses concurrents.
Oculus Rift
Premier casque de ralit virtuelle sorti

ayant connu un rel succs, notamment
auprs des joueurs. Cest un casque
de ralit virtuelle produit par la socit
Oculus VR rachet par Facebook. Ces
lunettes permettent une immersion totale
dans un environnement entirement virtuel.
Elles ont un champ de vision trs important et
sont trs ractives, ce qui en fait une rfrence pour les jeux vidos.
Disponibilit attendue: courant 2016
Hololens
Casque de ralit augmente propos par

Microsoft permettant de porter les
applications universelles Windows en
surimpression, tels des hologrammes.
Le casque est propos en kit de
dveloppement au prix de 3000 .
Entirement autonome, le casque ne
ncessite ni tlphone, ni ordinateur pour fonctionner linverse de ses concurrents. Son champ de
vision est beaucoup plus grand que celui des Google Glass mais est encore assez limit.
Comment Choisir ?
Il nest jamais facile de comprendre et de choisir parmi les produits qui sont
proposs ce jour. Afin de vous aider, nous vous proposons ci-dessous un
arbre de dcision que nous avons simplifi au maximum. Veuillez noter que
bien que cet arbre de dcision ait pour but de vous aider prendre une
dcision et y voir plus clair concernant lobjet qui rpondra vos besoins,
ce document doit tre considr sa juste valeur : il sagit dun schma
sajoutant une tude de march que vous devrez avoir mene au
pralable (ne pas considrer ce document comme rfrence absolue). De
plus, cet arbre ne prend en compte quun nombre restreint de modles
disponibles ce jour qui pourraient peut tre rpondre tout aussi bien ou
mme mieux vos besoins spcifiques.
Cardboard
Fonctionne laide dun tlphone. Cest un

casque en carton fabriquer soi-mme pour
quelques dizaines deuros. Il vise crer un
casque de ralit virtuelle fonctionnant sous
Android. Google a mis en place un SDK
spcifique au Carboard pour dvelopper trs
rapidement des applications:
https://developers.google.com/cardboard/
Il sagit de la faon la moins onreuse dobtenir un
casque de ralit virtuelle. Cet avantage leur ont permis
dtre choisies pour des oprations marketings temporaires ou pour divers
vnements/salons.
Les Autres
Dautres objets sont prometteurs, parmi eux on peut

citer le HTC Vive (dvelopp en partenariat avec Valve
et dont la commercialisation est prvue partir de Avril
2016), Magic Leap (qui
vient de lever 827
millions de dollars),
ainsi que le
Playstation VR de
Sony.
*Totale : Signifie que se dplacer (marcher, courir, etc.) dans le monde physique provoque un mouvement
similaire dans le monde virtuel. Un contrleur supplmentaire reste ncessaire pour interagir 100%
(manipuler des objets) avec lenvironnement virtuel.
*Partielle : Signifie que certains mouvements physiques sont pris en compte (comme les mouvements de tte,
de bras et de mains). Un contrleur supplmentaire est ncessaire afin deffectuer des dplacements +
interagir 100% (manipuler des objets) avec lenvironnement virtuel.
13
010_015_192 17/12/15 21:09 Page14
Mapper du rel et du fictif avec Unity

Un diteur pour les regrouper tous
Dans le monde des moteurs de jeu, Unity a su y creuser son petit trou.
Lenfant de Monogame (cr en Juin 2005) est depuis devenu la rfrence
des moteurs de jeu pour les crateurs indpendants et est sur le point de
devenir (si ce nest pas dj le cas) la rfrence du monde de la RV / VA.
Les raisons de son succs sont trs simple :
a Le moteur est compatible avec toutes les plateformes disponibles sur le
march ou presque, du PC la PS Vita en passant par les smartphones
Android et mme Windows Phone, aucune plateforme ne lui rsiste et
aucun casque de ralit augmente / ralit virtuelle non plus.
a La possibilit dutiliser du C# ou/et du Javascript. Dans le monde du
jeu-vido, le C++ longtemps t la seule vrai solution ; avec Unity, une
nouvelle voie sest propose et est plus adapt aux projets de petite ou
moyenne envergure.
De nombreux jeux que vous connaissez sont conus avec Unity et ils
reprsentent la vitrine du moteur.
Configurer son environnement
Pour configurer son environnement pour faire de la VR, cest assez simple.
Vous devez disposer au minimum de la version 5.1 dUnity pour pouvoir
suivre ce tutoriel. Cest important car cette version intgre une nouvelle
fonctionnalit intressante autour de lintgration des casques de ralit
virtuelle. Crez un nouveau projet dans linterface, vrifiez quil soit bien en
3D. Pour intgrer votre quipement de RV / RA il existe deux mthodes :
a La mthode utilisant des plugins que nous ne dtaillerons pas dans cet
article car elle est spcifique chaque systme.
a Et la mthode en utilisant lintgration dUnity, beaucoup plus simple et
sur laquelle nous allons nous concentrer.
Pour activer lintgration avec nos casques, il va juste falloir cocher une
case Fig.1.
1 - Ouvrez le panneau qui se trouve dans Edit > Project Settings > Player,
2 - Ouvrez longlet Others Settings
3 - Activez la combobox Virtual Reality Supported.
Et cest parti, vous pouvez brancher votre paire dOculus !
Crer son premier projet
Pour votre premier projet de VR nous avons choisi de vous faire adapter
un grand classique du jeu vido : le jeu de jongle.
Fig.1
Avant de commencer, prenez bien soin davoir

suivi les tapes prcdentes.
Tout dabord petit point technique : nous allons tout faire comme si nous
tions sur lOculus Rift DK2 car il sagit du casque le plus rpandu
lheure actuelle et nous allons donc aussi apprcier ces limitations au
niveau du positional tracking pour crer notre projet.
Ces limitations sont diffrentes en fonction du systme que vous utilisez,
faites-y attention. Dans notre cas nous allons donc tre limit par le
rayon de vision de la camra infrarouge qui permet le positional
tracking. Pour commencer nous allons installer notre scne, elle va donc
tre compose de 4 murs qui seront reprsents par 4 cubes, un plan
qui servira de sol, une sphre qui servira pour faire des jongles, une
lumire et une camra associe une zone de collision.
Nous allons donc crer un GameObject vide qui va contenir notre
environnement.
1 - Faites un clic droit dans votre hierarchy, create empty, et nommez
le World; faites bien attention ce quil soit positionn en 0,0,0
avec une rotation nulle sur les 3 axes.
2 - A lintrieur de celui-ci, ajoutez un plan, ajoutez lui le tag Ground car
cela nous servira par la suite.
3 - De mme, ajoutez 4 cubes que vous largirez afin den faire 4 murs
(les murs doivent avoir un espacement maximum de 3 units). Prenez
soin que votre lumire et votre camra soient initialement entre ces
quatre murs.
4 - Lorsque vous aurez votre casque sur la tte, vous serez la camra de
votre scne. Positionnez -a donc en fonction, cest dire assez bas,
proche du sol, dans votre scne.
5 - Nous allons appliquer le tag Player notre camra et lui accrocher
une capsule laquelle nous dsactiverons le Mesh Renderer et
nous donnerons galement le tag Player, cest notre zone de
collision avec notre balle.
6 - Nous allons crer une sphre que nous allons mettre en haut de notre
scne, pour quelle soit soumise la gravit, nous allons lui ajouter un
rigidbody.
7 - Crez un script BallController en C# et ajoutez le votre sphre
Fig.2 et 3.
Fig.3
Fig.2
14
Ce type de jeu va permettre de prendre en main le positional tracking

(systme permettant de vous positionner dans lespace) disponible
notamment avec lOculus.
Il est assez simple prendre en main et facilement adaptable.
010_015_192 17/12/15 21:09 Page15
Bravo ! Notre scne est prte recevoir les premires lignes de code !
Et aprs ?
Code de BallController.cs
private Rigidbody rb; // Physique de notre balle
Nous avons presque termin

notre tour dhorizon, et, au
del du prsent ou du futur
proche, il est temps
dessayer d'entrevoir ce que
nous rserve lavenir. Sil est
difficile de savoir ce
quadviendra ce march naissant, nous pouvons avoir quelques
certitudes : Lavenir passera invitablement par lassociation de plusieurs
objets afin de proposer de nouvelles expriences; toujours plus riches,
toujours plus efficaces et toujours plus connectes avec notre corps.
private Vector3 initialPosition; // Position initiale pour le reset
Une montre connecte comme contrleur
using UnityEngine;
using System.Collections;
public class BallController : MonoBehaviour {
[Tooltip("Rebound force.")]
[SerializeField]
private int force = 200; // Force de rebond
/// <summary>
/// Factory de notre objet
/// </summary>
void Start()
{
initialPosition = transform.position; // Sauvegarde la position initiale pour le reset
rb = GetComponent<Rigidbody>(); // Met disposition la gestion de la physique de la balle
}
/// <summary>
/// S'excute chaque nouvelle frame
/// </summary>
void Update()
{
// Si une touche est appuye
if (Input.anyKeyDown)
{
transform.position = initialPosition; // Remettre la balle sa position initiale
}
}
/// <summary>
/// S'excute lorsque l'on rentre en collision
/// </summary>
/// <param name="collision"></param>
void OnCollisionEnter(Collision collision)
{
switch (collision.gameObject.tag) // En fonction du tag de l'objet avec lequel on rentre en collision
{
case "Player": // Si collision avec un player
rb.AddForce(0, force, 0); // Ajouter une force vers le haut pour faire rebondir la balle
break;
case "Ground": // Si collision avec le sol
Debug.Log("Game Over"); // Ecrire dans la console de dbug: Game Over
break;
}
}
}
Une fois ce code ajout, vous pourrez jouer avec votre Oculus.
Si vous le souhaitez, le projet est aussi disponible au tlchargement
ladresse suivante :
https://dl.dropboxusercontent.com/u/13395728/BalloonSample.zip
Si vous tes technophile, cela ne vous a srement pas chapp :

Certaines montres connectes vous permettent dj dagir comme
tlcommande pour contrler, par exemple, une vido diffuse sur votre
tlvision via Chromecast.
La montre connecte est appele se transformer de plus en plus afin
de devenir une source dinformation et un contrleur universel.
On peut facilement imaginer une montre intelligente servant enrichir
lexprience propose par dautres objets.
Un seul exemple pour vous en convaincre : Imaginez un jeu dhorreur sur
un casque de ralit virtuelle; la montre pourrait facilement mesurer la
frquence cardiaque de lutilisateur puis lenvoyer au jeu.
Ceci permettrait dindiquer au joueur quil est temps darrter de jouer ou
au contraire, quil est temps de le stimuler (ici, lui faire peur) afin quil
reste immerg au sein du jeu.
Intel RealSense
& Kinect
La Kinect de Microsoft et le
capteur RealSense dIntel
Intel RealSense
ont le mme objectif et le
dcortique
font de la mme manire
ou presque, capter votre
corps via un systme de
camra (notamment
infrarouge) afin den faire
Kinect
une carte. Une fois que
ceci est fait, il est assez simple de sinterfacer avec pour, par exemple,
coder un petit jeu et vous immerger entirement dedans.
Virtualizer
Le Virtualizer est un
systme permettant de
capter vos mouvements
pour les intgrer dans votre
exprience. Marchez,
courrez, sautez, tous vos
mouvements seront capts
mais vous ne bougerez pas
dans la ralit car vous tes
maintenu sur place par le
systme. Systme onreux
pour le moment, son
volution reste surveiller.
15
016_054-3_192 17/12/15 23:10 Page16
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
Atari ST
Amstrad CPC
Amiga 500
Amiga 2000
Apple II
La rdaction
T SPCIAL VINTAGE Y
Martin
Mystre
images : D.R.
Retour vers le passE!
Il est toujours difficile de

terminer lanne et de bien
dbuter la nouvelle. La
rdaction sest beaucoup
interroge et un clair de gnie
est arriv: pourquoi ne pas
faire un dossier vintage? Notre
article sur Amiga Atari ST
avait suscit de vives
ractions Cette fois-ci, nous
16
avons dcid daller un niveau

au-dessus.
Ces machines ont peut-tre 30
35 ans, elles conservent une
magie intacte. Et ce nest pas
un hasard si la dmoscne est
trs active en France. Eh oui,
on continue coder sur ces
machines et rivaliser sur
scne pour faire la meilleure
dmo! Plusieurs dmomakers

vont le prouver et vous montrer
quelques-unes des possibilits
techniques sur Atari ST, Amiga
et Amstrad CPC. Nous
parlerons aussi AppleII et nous
ferons du rtro-gaming avec la
Gameboy!!!
Enjoy!
016_054-3_192 17/12/15 23:10 Page17
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
Sorti en 1977, lApple II fut le roi des ordinateurs 8bits, et cest grce son succs et sa trs grande
longvit quApple a survcu aux checs de lApple III et du Lisa, et au trs lent dmarrage du
Macintosh. Conu par Steve Wozniak, sa russite est due principalement son lecteur de disquettes
apparu trs tt, et son architecture ouverte. En effet, lheure o ses principaux concurrents
chargeaient pniblement leurs programmes partir de cassettes lentes et peu fiables, les disquettes de
lApple II lont rendu compatible avec une utilisation professionnelle Visicalc fut la Killer Application et la possibilit dinsrer des cartes dextensions lui a allong sa dure de vie et surtout donn accs
des environnements complmentaires
trs riches comme CP/M.
Alain Zanchetta
Dveloppeur dans lquipe
Microsoft Hololens.
Avec ces deux lments, la palette de langages
de programmation de lApple II ne cde que
devant celle du PC: Basic, assembleur, Pascal,
C, logo, Lisp, Forth, Fortran, Modula II, Ada, etc.
Il existe mme une implmentation de Java,
certes limite, et le petit dernier de cette famille
sappelle Plasma, et est apparu en 2012, soit
35ans aprs la machine elle-mme.
Basic Applesoft
et assembleur 6502
Pour le possesseur dApple II de lpoque, les

langages rois taient le Basic et lAssembleur
6502. Ils taient en effet disponibles en permanence, et ce, ds lallumage de la machine. La
plupart des jeux du commerce taient crits en
Assembleur, une exception notable tant Wizardry (Sorcellerie dans lhexagone) crit en Pascal UCSD. Le Basic Applesoft, disponible partir
de la version II+, a t crit par Microsoft qui
fournissait une adaptation de ce langage
presque tous les constructeurs. Il est assez complet et permet daccder lensemble des fonctions de la machinecomme les graphismes, les
ports de jeux ou encore les fichiers si un lecteur
de disquettes est disponible et le systme dexploitation charg. Lorsque des cartes dextension sont installes, elles sont gnralement
accessibles via des appels aux fameux PEEK et
POKE dans une plage dadresse correspondant
aux slots dans lesquels elles sont insres. Voici
un exemple de programme affichant des lignes
de deux couleurs:
10 DX = 278 / 20:DY = 191 / 20
20 HGR: POKE - 16302,0
30 FOR I = 0 TO 20
40 X = DX * I:Y = DY * I
50 HCOLOR= 1
60 HPLOT 0,Y TO X,191: HPLOT 1,Y TO X + 1,191
70 HCOLOR= 2
Fig.1
80 HPLOT 278,Y TO X,0: HPLOT 279,Y TO X + 1,0
90 NEXT
Il utilise la haute rsolution: 280 x 192 pixels
en 6 couleurs. Au passage, on peut noter que
lApple II possde un mode graphique trs astucieux 280 x 160 pixels en 6 couleurs + 4 lignes
de texte en bas de lcran trs pratique pour
certains jeux ou pour les applications professionnelles. Le Basic supporte aussi un mode
basse rsolution (40x48) mais celle-ci nest quasiment jamais utilise. Pour tre exhaustif, il faut
noter que les derniers modles de la srie supportent des rsolutions plus varies comme 140
x 192 ou 560 x 192, mais celles-ci ne sont pas
accessibles aux programmes Basic, et elles ne
sont donc que rarement utilises Fig.1.
Les fonctions de dessin du Basic sont assez limites et consistent essentiellement au trac de
points avec HPLOT ou de lignes avec HPLOT
TO. Il existe une notion de SHAPE mais celle-ci
est trs limite et na rien voir avec les sprites
disponibles sur des ordinateurs cible essentiellement ludique.
Le dveloppeur de jeux sur Apple II doit donc
prendre tout en charge lorsquil veut afficher un
personnage ou un vaisseau spatial : les oprations logiques sont reines ici, avec les AND pour
effacer des parties de lcran et des OU pour
fusionner les bits du pseudo-sprite et ceux du

fond dcran.
La bonne nouvelle est que lApple II possde
deux pages graphiques identiques qui permettent de raliser une sorte de double-buffering: le
programme dessine la frame suivante dans la
page qui nest pas affiche, puis affiche celle-ci
une fois la frame entirement prpare. Ceci permet dviter des clignotements dsagrables
pour lutilisateur. Nanmoins, le Basic est trop
lent pour rellement tracer des formes lcran,
et seul le recours au langage machine permet
dobtenir de bons rsultats.
En termes de sons, le Basic de lApple II noffre
quun bip mis lorsque CHR$(7) est envoy la
routine daffichage. Jouer des sons plus sophistiqus est possible: accder ladresse mmoire $C030 dplace la membrane du haut-parleur.
Des lectures successives permettent donc de
jouer une large gamme de notes en contrlant la
frquence de ces oprations. Nanmoins, le
Basic est trop lent et le langage machine est l
encore la seule solution.
Graphismes avancs, sons varis, voire vitesse
de calcul, le recours lassembleur est donc trs
souvent ncessaire sur lApple II. Pour cette raison, cet ordinateur a t conu pour offrir une
parfaite cohabitation entre le Basic et les routines 6502. Dune part, la ROM contient un moniProgrammez! a Janvier 2016
17
016_054-3_192 17/12/15 23:10 Page18
teur permettant dentrer directement des codes

hexadcimaux en mmoire ainsi quun minidsassembleur, et dautre part, les appels entre
Basic et langage machine sont possibles dans
les deux directions:
a Depuis Basic, CALL adr appelle la routine
assembleur situe ladresse adr. Lorganisation de la mmoire de lApple II est bien documente et permet au dveloppeur de savoir
o placer ses routines assembleur: une petite
fonction est gnralement charge ladresse 768 o plus de 200 octets sont inutiliss
par le Basic. Si la partie assembleur est plus
consquente, les instructions LOMEM et
HIMEM permettent de dplacer la mmoire
rserve au Basic (programme et variables).
100 POKE 6, X: POKE 7, Y: POKE 8, A: REM X,Y=position
A=numro sprite
110 CALL 768: REM trace le sprite
a Linstruction Basic & dclenche automatiquement un appel la routine assembleur dont
ladresse est stocke en 0x3F5: le programme peut alors analyser la suite de linstruction
(qui se finit soit en fin de ligne, soit au prochain:), y compris en sappuyant sur linterprteur Basic, par exemple pour lire des
constantes ou des variables. Ce simple & permet donc dtendre le vocabulaire du Basic et
un certain nombre de bibliothques taient
ainsi vendues.
100 & DRAWSPRITE X,Y,A
a Rciproquement, les adresses en ROM des
diffrentes routines du Basic taient documentes, permettant aux programmes crits
en assembleur de ne pas tout r-implmenter.
Un peu de pratique
Pour entrer de petites routines simples, le dveloppeur peut appeler le moniteur de lApple II via
la commande CALL -151, puis entrer les codes
hexadcimaux des instructions 6502 en les faisant suivre ladresse cible et:. Le mini dsassembleur, appel en entrant une adresse suivie
de L permet de vrifier le code saisi ou dinspecter le code prsent dans la ROM de lApple II.
a Appel du moniteur:
]CALL-151
a Entre de la routine prsente prcdemment :
*300: A0 00 B1 06 F0 07 20 F0 FD C8 4C 02 03 60
a Affichage du code 6502 de la routine COUT
du Basic :
*FDF0L
18
FDF0FDF1FDF3FDF6FDF7FDF9FDFAFDFBFDFEFDFFFE00FE02FE04FE05FE07FE09FE0BFE0DFE0FFE11FE13FE15FE17-
48
PHA
C9 A0 CMP #$A0
4C 95 FC JMP $FC95
48
PHA
84 35 STY $35
A8
TAY
68
PLA
4C 46 FC JMP $FC46
EA
NOP
EA
NOP
C6 34 DEC $34
F0 9F BEQ $FDA3
CA
DEX
D0 16 BNE $FE1D
C9 BA CMP #$BA
D0 BB BNE $FDC6
85 31 STA $31
A5 3E LDA $3E
91 40 STA ($40),Y
E6 40 INC $40
D0 02 BNE $FE17
E6 41 INC $41
60
RTS
Pour les programmes assembleurs plus consquents, il est prfrable de recourir un macroassembleur comme Merlin.
Celui-ci permet au dveloppeur de donner des
noms aux emplacements mmoire stockant les
variables, ainsi quaux sous-programmes et diffrentes branches du programme.
Voici le source Merlin de la routine prsente
prcdemment:
STRING = $6
COUT = $FDF0
*
ORG $300
*
LDY #$0
LOOP LDA (STRING),Y
BEQ END
JSR COUT
INY
JMP LOOP
END RTS
Merlin est assez compact et se place dans la
mmoire lemplacement habituel des programmes Basic, ce qui permet au dveloppeur
de modifier son source, de lassembler et de le
tester sans avoir recharger lenvironnement
depuis le lecteur de disquettes.
Paradoxalement, la programmation en assembleur est rpute difficile mais les processeurs
comme le 6502 sont en fait trs faciles programmer car ils ont peu dinstructions diffrentes : pour lessentiel, le programme charge
une valeur dans un registre, modifie cette valeur
via une opration arithmtique lmentaire

(addition ou soustraction) ou une opration
logique et sauve la nouvelle valeur en mmoire.
Les oprations effectues sur les registres
comme laccumulateur modifient des bits du
registre dtat et dautres instructions effectuent
des branchements en fonction de ces bits. Le
6502 possde essentiellement trois registres
dans lesquels le programmeur peut enregistrer
des valeurs: A, X et Y. En revanche, il possde
un grand nombre de modes dadressage et le
minuscule programme prsent plus haut en utilise trois diffrents:
a LDY #$0
adressage immdiat = le paramtre est
une constante
a JSR $FDF0
adressage absolu = le paramtre est une
adresse
a LDA ($06),Y adressage indirect index: la valeur de Y
est ajoute la valeur prsente aux adresses $06 et $07
pour donner ladresse qui va tre finalement rfrence.
Cest un mode trs utile pour toutes les fonctions graphiques.
Pour clore ce paragraphe sur le Basic et le langage machine de lApple II, il reste dcrire lespace mmoire de la machine : en effet, sur ces
ordinateurs 8 bits, la mmoire virtuelle nexiste
pas et le dveloppeur doit grer prcisment o
stocker son code et ses donnes qui doivent
cohabiter avec les diffrents lments du systme comme la ROM ou les zones correspondant
aux pages graphiques ou texte. Voici la cartographie dun systme Apple IIe de 64 Ko:
Adresses
$0000-$00FF
$0100-$01FF
$0200-$02FF
$0300-$03FF
$0400-$07FF
$0800-$0BFF
$0C00-$1FFF
$2000-$3FFF
$4000-$5FFF
$6000-$BFFF
$C000-$CFFF
$D000-$DFFF
$E000-$FFFF
Utilisation
Appele Page 0, cette zone est trs utilise
par le systme car le 6502 a un
mode dadressage spcifique qui permet
dconomiser un octet et un cycle
CPU par instruction. Il reste nanmoins des
adresses qui ne sont pas utilises par
le systme et permettent au dveloppeur
dexploiter ce mode dadressage.
Pile du 6502.
Buffer dentre.
Quelques vecteurs dinterruptions sur le
haut de la page mais emplacement
idal pour stocker de petites routines 6502
cohabitant avec le Basic
Page texte ou graphiques basse rsolution.
Page de texteou graphiques basse
rsolution; plus gnralement le
dbut des programmes Basic.
Disponible.
Page graphique haute rsolution 1.
Page graphique haute rsolution 2.
Disponible. Le haut de la zone contient
gnralement le DOS qui se
charge en RAM partir dune disquette.
Adresses de pilotage du matriel et
des cartes priphriques.
ROM / Ram Bloc 1 / Ram Bloc 2
ROM / Ram
19 abov2-192_192 18/12/15 11:53 Page19
Tous les mois, faites le plein de codes
Abonnez-vous
Nos
classiques
111 numros
an
49
222 numros
ans
79
..............................
......................
PDF
30 (*)
1 an - 11 numros
..................
Etudiant
39
1 an - 11 numros
......
Tarifs France mtropolitaine
ISTOCK - DOLGACHOV
(*) Souscription sur le site internet
Vous souhaitez abonner vos quipes ? Demandez nos tarifs ddis* : redaction@programmez.com (* partir de 5 personnes)
Toutes nos offres sur www.programmez.com
n M. n Mme n Mlle
n Abonnement 2 ans au magazine : 79
Entreprise : I___I___I___I___I___I___I___I___I
Prnom : I___I___I___I___I___I___I___I___I___I___I___I___I___I
n Abonnement tudiant 1 an au magazine : 39

Photocopie de la carte d'tudiant joindre
Fonction : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
Nom :I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
Adresse : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
Code postal : I___I___I___I___I___I Ville : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
email indispensable pour l'envoi d'informations relatives votre abonnement

E-mail : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
n Je joins mon rglement par chque lordre de Programmez !
@ I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I
n Je souhaite rgler rception de facture
* Tarifs France mtropolitaine
PROG 192
n Abonnement 1 an au magazine : 49
ABONNEMENT retourner avec votre rglement :

Service Abonnements PROGRAMMEZ, 4 Rue de Mouchy, 60438 Noailles Cedex.
Offre limite, valable jusquau 31 janvier 2016
Oui, je mabonne
016_054-3_192 17/12/15 23:07 Page20
Les plages $D000-$DFFF et $E000-$FFFF peuvent correspondre de la ROM ou de la RAM:

en accdant certaines adresses spcifiques de
la zone $C000-$CFFF, on peut rendre lun ou
lautre de ces blocs visibles. Cette technique
appele Bank Switching permet lApple IIe
davoir 64 Mo de RAM et 12 Ko de ROM alors
que le 6502 ne peut adresser directement quun
espace de 64 Ko.
Par exemple:
a $C082 active la ROM pour lespace entre
$D000 et $FFFF ;
a $C08B active la RAM pour ce mme espace ;
a $C083 active le 2e bloc de RAM pour $D000$DFFF ;
a $C089 active la lecture de la ROM mais lcriture du premier bloc de RAM.
Les configurations plus de 64Ko comme lApple
IIc ou lutilisation de cartes dextensions sappuient sur un usage extensif de cette technique.
Modern Fun
Bien que lApple II approche de ses quarante

ans, il est au cur dune communaut trs active et on continue voir apparatre pour cette
machine du matriel, du logiciel et mme
quelques livres. Le matriel se dcompose
essentiellement en deux types: dune part des
adaptateurs permettent de remplacer les lments fragiles comme les lecteurs de disquettes
(cartes mmoire + images disque) ou les vieux
moniteurs (adaptateurs VGA), dautre part de
vraies cartes dextension (parfois des clones
danciens modles) tendent les possibilits de
lApple II comme des cartes mmoire, une carte
Ethernet ou encore une carte son. Les logiciels
se rpartissent de manire habituelle entre jeux
(ex Zephyr) et utilitaires (ex Merlin32). Finalement les livres sont souvent des rditions de
livres mythiques (Red Book, Roger Wagner
Assembly Lines) voire des vraies nouveauts
(The New Apple II Users Guide).
Pour les programmeurs, il est plus facile de dve-
lopper aujourdhui pour un Apple II que dans les

annes 80 en combinant la puissance des
machines modernes, quelques outils de dveloppement crois, les logiciels de manipulation
dimages disques et les mulateurs. A titre dillustration, voici comment dvelopper un classique
du langage C et le dployer sur un Apple II.
CC65 est un cross compilateur pour 6502
(http://cc65.github.io/cc65/) qui possde les bibliothques minimales pour cibler lApple II mais
aussi les machines Commodore (Vic 20, C64,
etc.) ou Atari. Pour diter un programme C pour
Apple II, on peut tout simplement utiliser Visual
Studio qui va apporter la coloration syntaxique
ainsi que la compltion automatique.
#include <stdio.h>
#include <conio.h>
int main()
{
printf("Hello world\n");
cgetc();
return 0;
}
La compilation de ce programme seffectue en
ligne de commande avec cl65:
cl65 -O -t apple2 helloworld.c
Ltape suivante consiste ajouter lexcutable
gnr une image disque: cela peut tre fait
manuellement via CiderPress (http://a2ciderpress.com/) ou en ligne de commande laide
dApple Commander (http://applecommander.sourceforge.net/).
java -jar C:\Download\Apple_II\AppleCommander\Apple
Commander-1.3.5.jar -cc65 prodos.
dsk helloworld bin < helloworld
Enfin, on peut lancer un mulateur comme
AppleWin (https://github.com/ AppleWin/AppleWin)
en lui passant limage disque ainsi cre:
Fig.2
20
applewin -d1 prodos.dsk

Une fois dans lmulateur, on peut voir lexcutable et le lancer: Fig.2.
Les diffrentes commandes ci-dessus peuvent
tre facilement automatises et il devient alors
possible de lancer directement lmulateur et le
programme compil en appuyant simplement
sur F5 sous Visual Studio.
Le cycle dition / compilation / test ainsi obtenu
est bien plus rapide quavec le matriel et les
logiciels dpoque mais il est possible daller
encore plus loin car Applewin incorpore un
dbogueur 6502: Fig.3.
Les dveloppeurs prfrant programmer en
assembleur ne sont pas en reste par rapport
au C:
a Brutal Deluxe a mis rcemment sur son site
Web (http://www.brutaldeluxe.fr/) Merlin32 qui
est une adaptation de Merlin aux machines
modernes et permet lassemblage de code
6502 ou 65816 (processeur de lApple IIgs)
depuis Windows, OSX ou encore Linux.
a Olivier Guinart dveloppe un Language Service pour Visual Studio apportant la coloration
syntaxique et lauto-compltion au code 6502.
Evidemment, si on dispose dun vrai Apple II, la
dernire tape est de lancer lexcutable sur
celui-ci. Les solutions pour rcuprer des
fichiers partir dun PC sont assez nombreuses
aujourdhui:
a Cble srie ou carte Uthernet et logiciel ADT
Pro ;
a Simulateur de lecteur de disquette (CFFA
3000, Floppy Emu Disk Emulator, Unisdisk,
etc) ;
a Carte Apple II PI et Raspberrry PI servant de
passerelle.
Nanmoins, ceci nest pas indispensable et les
diffrents mulateurs disponibles permettent de
retrouver le got de la madeleine la pomme
sans matriel spcifique
Fig.3
016_054-3_192 17/12/15 23:07 Page21
Dans les annes 80, Amstrad nest encore quune firme britannique spcialise dans le matriel
HIFI et vido dont le fondateur, Alan Michael Sugar (AMStrad) ambitionne dattaquer le march de
la micro -informatique.
Baptiste Bideaux
Consultant en Digital Learning
chez PwC France.
Le projet Colour Personal Computer dmarre
au dbut de lanne 1983, et en 1984 apparat sur
le march lAmstrad CPC 464, ordinateur 8bits avec 64ko de RAM, quip
dun microprocesseur Zilog Z80 cadenc 4MHz, dun magntophone
cassette et dun magnifique clavier QWERTY color. Il faudra attendre 1 an
pour voir arriver la version disquette de la machine: le CPC 664. La mme
anne dbarque le CPC 6128, une version du 664 avec une RAM augmente 128 ko. La mmoire primaire (64 ko de RAM) est partage en 4
banques de 16 ko chacune (numrotes de 0 3). Le CPC 6128 propose
64ko supplmentaires qui sont eux aussi partags en 4 banques de 16 ko
accessibles en assembleur.
Affichage
Equip dun moniteur monochrome ou couleur (selon les finances de chacun), la gamme CPC propose 3 modes daffichage:
MODE 0: 160x200 en 16 couleurs
MODE 1: 320x200 en 4 couleurs
MODE 2: 640x200 monochrome
La banque 3 situe entre ladresse &C000 et &FFFF est rserve pour laffichage cran. Quel que soit le mode daffichage, il y a toujours 200 lignes.
Chaque ligne une taille de 80 octets. Ainsi la premire ligne dmarre
&C000 et se termine &C049. Chaque ligne est dessine de manire
linaire, de gauche droite. Cependant, la fin dune ligne le trac effectue
un saut de 8 pixels plus bas. Si &C000 correspond aux coordonnes (0,0),
&C050 correspond (0,8). Pour accder la ligne directement en dessous
dune autre, il faut incrmenter 1000 (&800) ladresse de cette dernire.
Donc la seconde ligne sur notre cran (0,1) se trouve ladresse &C800.
La synchronisation vido est gre par le CRTC (Cathode Ray Tube
Controller), mais les couleurs sont gres par le Gate Array qui ne raisonne
pas en binaire, mais en tat (0,1 ou 2). Cest pour cela que nous avons une
palette de 27 teintes et non 16 ou 32. Les couleurs utilisables (16 maximum
en MODE 0) peuvent tre choisies parmi cette palette de teintes. Attention,
les teintes de palette sont indexes diffremment selon que lon y accde
par le BASIC ou par le Gate Array.
Organisation des pixels
Selon le MODE daffichage choisi, la manire de coder les pixels est sensiblement diffrente.
En MODE 0, un octet suffit pour afficher 2 pixels lcran, un pixel ayant
une longueur de 4 bits. Ainsi, la couleur du premier pixel est code sur les
bits 7, 5, 3 et 1. Le second pixel sur les bits 6, 4, 2, 0. Cest ce que lon
appelle lentrelacement des pixels.
En MODE 1, lentrelacement est identique au MODE 0. Cependant, le pixel

nest plus cod sur 4 bits, mais sur 2.
En MODE 2, cest plus simple. Chaque bit dun octet correspond 1 pixel.
Comme on peut le voir, le 1er pixel se situe au bit N 7.
La programmation
Toute la gamme CPC est livre avec un BASIC intgr dans la ROM (le
Locomotive BASIC), qui permet lutilisateur de faire ses premiers programmes assez rapidement. Le langage est vraiment trs complet pour
lpoque et fournit beaucoup de commandes pour dessiner sur lcran,
jouer des sons, grer les priphriques (comme les 2 manettes de jeu). A
noter que le BASIC du CPC 6128 propose des commandes qui nexistent
pas dans le BASIC du 464 et 664. A lpoque, certains programmes taient
donc uniquement prvus pour le 6128. Le BASIC reste interprt. Aucun
compilateur nexiste lpoque. On peut toutefois protger son code
contre son listage (afin de garder un droit de proprit) et son interruption
dexcution. Mme sil reste plus lent quun programme cod en assembleur, le BASIC de lAmstrad permet tout de mme de produire des programmes de jeux honorables. Les puristes vous diront que pour
dvelopper pour lAmstrad CPC il faut un Amstrad CPC. Mais bon, ceux
qui nont pas la chance de possder un vrai CPC peuvent se tourner vers
les mulateurs qui feront trs bien laffaire. Le plus utilis est sans aucun
doute WinAPE (http://www.winape.net), qui a lavantage dmuler tous les
Amstrad CPC et de proposer un assembleur pour le Zilog Z80. Il mule par
dfaut la gamme CPC+, mais le BASIC reste identique aux versions CPC
plus anciennes. Tlchargez larchive ZIP depuis le lien http://www.winape.
net/download/WinAPE20A18.zip et extrayez tous les fichiers dans un dossier
(winape par exemple). Excutez le fichier WinAPE.exe. Lmulateur se
lance et vous voil sur lcran daccueil du BASIC.
Jouons avec les modes
Par dfaut, le mode daffichage est en MODE 1 (320x200 en 4 couleurs),

soit 40 colonnes sur 25 lignes de caractres.
Saisissez le code suivant, en appuyez sur ENTREE pour lexcuter:
MODE 0
21
016_054-3_192 17/12/15 23:08 Page22
Laffiche change. Lcran est nettoy et la rsolution est passe en

160x200 en 16 couleurs, soit 20 colonnes sur 25 lignes de caractres. Les
caractres sont dsormais 2 fois plus larges quen MODE 1.
Excutez nouveau le programme en saisissant RUN et en appuyant sur la

touche ENTREE.
MODE 2
Laffiche change nouveau et la rsolution est passe en 640x200 en
monochrome, soit 80 colonnes sur 25 lignes de caractres. Les caractres
sont dsormais 2 fois moins larges quen MODE 1.
MODE 1
Laffichage est revenu son tat initial.
Un peu de couleurs
Le BASIC utilise les couleurs indexes de 0 15. Chacune est associe par
dfaut lune des 27 teintes de la palette du CPC. Saisissez le code suivant :
10 MODE 0
20 FOR R=0 TO 15
30 PEN R:PRINTCOULEUR;STR$(R)
40 NEXT R
RUN
Nous venons dcrire un programme qui sera excut votre demande.

Pour excuter un programme BASIC, vous devez saisir RUN et appuyer
sur la touche ENTREE.
Voici les 16 couleurs par dfaut que vous pouvez utiliser en BASIC. La couleur 0
est la couleur utilise pour le fond dcran (bleu nuit). Les couleurs 14 et 15 sont
clignotantes car 2 teintes leur ont t associes. En effet, le BASIC permet de
dfinir 2 teintes pour une couleur afin de crer un effet de clignotement.
Explication du programme:
Ligne 10: Passage de laffichage en MODE 0
Ligne 20: Dbut de la boucle
Ligne 30: On utilise PEN pour la slection de la couleur du texte et PRINT
pour afficher le texte.
Ligne 40: Fin de la boucle
Restez sur cet cran, et saisissez ceci:
Voil comment saffichent nos couleurs en MODE 1. Nous avons bien nos 16
couleurs, mais seulement 4 teintes diffrentes (les teintes associes aux couleurs 0, 1, 2 et 3). En effet, le MODE 1 ne permet pas dafficher plus de teintes.
Essayons avec le MODE 2, saisissez le code suivant et excuter le programme:
10 MODE 2
RUN
En MODE 2, seules 2 teintes sont affichables (les teintes associes aux
couleurs 0 et 1).
Dessinons un peu
Lcran du CPC est orthonorm et a pour origine le coin infrieur gauche.

Laxe des abscisses (X) volue de 0 639, laxe des ordonnes (Y), de 0
399. Et cela, quel que soit le MODE daffichage utilis. Il faudra donc bien
avoir en tte lorganisation de ce plan avant de produire des tracs sur
lcran. Ds le dmarrage du CPC, le curseur graphique est plac en coordonnes absolues (0,0). Ce curseur se dplacera en fonction de nos tracs
et restera positionn sur le dernier point donn.
Commenons par supprimer le programme prcdent:
NEW
10 MODE 1
20 MOVE 0,0
30 DRAW 319,199
RUN
Ce programme trace lcran une ligne partant du point(0,0) et sarrtant
au point(319,199). Comme vous pouvez le constater, la ligne part du point
infrieur gauche et sarrte au centre de lcran. Comme indiqu plus haut,
laxe des abscisses (X) volue de 0 639, laxe des ordonnes (Y), de 0
399. Le point (319,199) correspond donc au centre de lcran.
INK 1,15
Aprs excution, la couleur 1 a chang et est devenue Orange. La commande INK permet dassocier une teinte de la palette un index de couleur. La teinte doit tre comprise entre 0 et 26. Maintenant, saisissez ceci:
INK 2, 5 ,4
La couleur 2 est devenue clignotante car nous avons associ 2 teintes cette
couleur (5 et 4). Que ce passe-t-il si nous changeons de mode daffichage?
10 MODE 1
RUN
22
Ligne 10: Affichage en MODE 1
Ligne 20: Place le curseur graphique aux coordonnes absolues (0,0)
Ligne 30: Trace une ligne depuis la position du curseur graphique jusquau point (319,199)
016_054-3_192 17/12/15 23:08 Page23
Saisissez dsormais ce code:

30 DRAW 639,399
RUN
La ligne traverse lcran. En modifiant le MODE daffichage (ligne 10 du
programme), vous constaterez que le trac reste identique. Seuls les pixels
composant le trac seront diffrents (plus larges en MODE 0, plus fins en
mode 2).
Redfinir les caractres de lAmstrad.
Lune des possibilits offerte par le BASIC Amstrad est de pouvoir redessiner la table de caractres du CPC. Saisissez ce programme :
NEW
10 MODE 1
20 SYMBOL AFTER 47
30 SYMBOL 48,254,130,130,130,226,226,254,0
RUN
Afin de ne pas modifier les caractres saisis au clavier, nous allons redfinir les caractres 129, 130, 131 et 132. Saisissez le programme suivant:
10 MODE 1
20 SYMBOL AFTER 128
30 SYMBOL 129,7,31,printadr,126,126,254,255,255
40 SYMBOL 130,224,248,124,62,62,63,248,224
50 SYMBOL 131,255,255,255,127,127,63,31,7
60 SYMBOL 132,128,224,248,254,254,252,248,224
RUN
Vrifions que nos caractres ont bien t modifis en saisissant :
Il ne semble rien se produire. Cependant si vous saisissez le texte 007,

vous constaterez que la forme du caractre 0 a chang.
Ligne 10: Affiche en MODE 1
Ligne 20 : SYMBOL AFTER indique que la redfinition des caractres
dmarre aprs lindex 47.
Ligne 30: SYMBOL dfinit le caractre 48 (code ASCII du chiffre 0).
Un caractre CPC est contenu dans une matrice 8 x 8. Chaque ligne de la
matrice est code sur 8 bits, le bit 7 correspondant au premier pixel de la
ligne. Chaque pixel dune ligne correspond une valeur.
Note: Vous pouvez modifier les caractres
de 32 255. Les caractres 0 31 sont
appels caractres de contrle et ne peuvent pas tre redfinis par lutilisateur.
Attention, la redfinition des caractres 32
128 aurat un impact direct sur les caractres
saisis au clavier et affichs lcran (chiffres,
lettres, ponctuation). Si vous ne souhaitez
pas modifier la police de caractres, vous
pouvez uniquement modifier les caractres
partir de lindex 129.
Assemblage de symboles
Pour rappel un caractre est contenu dans une matrice de 8x8 pixels. Mais
comment faire si lon veut un graphisme plus grand? Pour cela, nous utiliserons un assemblage de symboles.
Rond comme un ballon, aussi jaune quun citron
Nous allons raliser un programme BASIC permettant dafficher un PACMAN de 16x16 pixels en nous servant de lassemblage de symboles.
Rinitialisez le CPC avec le code suivant:
PRINT CHR$(129)
PRINT CHR$(130)
PRINT CHR$(131)
PRINT CHR$(132)
La commande CHR$ permet dutiliser le caractre N de la table de caractres du CPC. Ici, on affiche nos 4 caractres redfinis.
Assemblage!
Utiliser le code ci-dessus chaque fois que lon veut afficher notre PACMAN nest pas vraiment pratique. Nous allons donc assembler les morceaux de notre PAC-MAN. Saisissez la suite du programme, les lignes
suivantes:
70 PAC1$ = CHR$(129)+CHR$(130)
80 PAC2$ = CHR$(131)+CHR$(132)
RUN
Les lignes 70 et 80 initialisent 2 variables PAC1$ et PAC2$. Le typage des
variables est trs simple en BASIC Amstrad. Le $ indique que la variable
est de type chanede caractres. Pour les nombres, il ny a pas de symbole. Une variable ne peut pas avoir plus de 8 caractres.
PAC1$ assemble les caractres 129 et 130 lun cot de lautre. PAC2$ fait
de mme pour les caractres 131 et 132. Saisissez les lignes suivantes:
PRINT PAC1$
PRINT PAC2$
CALL 0
La commande CALL permet dappeler un sous-programme en langage
machine partir de ladresse mmoire donne. Ici, ladresse 0 permet de
rinitialiser compltement lordinateur.
Pour dessiner notre PAC-MAN, nous avons besoin de redfinir 4 caractres, qui se prsentent ainsi:
Nous constatons que nos 2 variables affichent les parties haute et basse
23
016_054-3_192 17/12/15 23:08 Page24
de notre PAC-MAN. Cest mieux, mais on peut faire encore plus avec lutilisation des caractres de contrle. Nous allons crer une 3me variable qui
assemblera le tout. Saisissez ces lignes la suite du programme:
90 PACMAN$ = PAC1$+CHR$(8)+CHR$(8)+CHR$(10)+PAC2$
RUN
La ligne 90 initialise la variable PACMAN$ avec nos 2 prcdentes
variables, assembles grce 2 caractres de contrle 8 (dplacement du
curseur texte vers larrire) et un caractre de contrle 10 (dplacement du
curseur texte vers le bas). Voyons comment saffiche dsormais notre
hros:
PRINT PACMAN$
Laffichage de notre hros est simplifi par la variable PACMAN$ qui

assemble les symboles de caractres 129, 130, 131 et 132 dune manire
prcise. Cette technique dassemblage est trs utilise dans les jeux en
BASIC. Mais lexcution reste cependant lente pour afficher un assemblage plus grand. De plus, nous travaillons avec des caractres et sommes
donc contraints dutiliser les coordonnes texte et non graphique.
PAC-MAN version Sprite
Un sprite est un lment graphique, stock en mmoire qui est dessin sur
lcran. Sur CPC, laffichage dun sprite doit faire appel une routine en
assembleur afin dtre rapidement excut. Il serait possible de le faire en
BASIC, en dessinant point par point. Mais la lenteur de linterprteur rendrait le programme inexploitable. Saisissons le programme suivant:
NEW
10 MEMORY &3FFF
20 REM Donnes du sprite (16 lignes de 4 octets)
30 DATA 0, 112, 224, 0
40 DATA 16, 240, 240, 128
50 DATA 48, 240, 112, 192
60 DATA 112,224,48,224
70 DATA 112,224,48,224
80 DATA 240,224,48,240
90 DATA 240,240,240,128
100 DATA 240,240,224,0
110 DATA 240,240,128,0
120 DATA 240,240,224,0
130 DATA 240,240,240,128
140 DATA 112,240,240,224
150 DATA 112,240,240,224
160 DATA 48,240,240,192
170 DATA 16,240,240,128
180 DATA 0,112,224,0
La ligne 10 rserve la mmoire aprs ladresse &3FFF. Les lignes 30 180
contiennent les valeurs de chacun des octets de notre sprite. Chaque ligne du
sprite est code sur 4 octets (1 octet = 4 pixels de large en MODE 1). Notre
PAC-MAN donc une taille de 64 octets. Nous allons stocker notre sprite
partir de ladresse &4000. Ajoutons les lignes suivantes notre programme:
190 RESTORE 30
200 FOR ADR=&4000 TO &4000+63
24
210 READ A:POKE ADR,A

220 NEXT ADR
RUN
Explication du programme :
Ligne 190 : On branche le lecteur de DATA sur la ligne 30 de notre programme
Ligne 200 : Dbut de notre boucle. La variable ADR contient ladresse
mmoire alimenter.
Ligne 210 : READ lit une valeur depuis la ligne DATA, la stocke dans la
variable A et avance vers la prochaine valeur. POKE attribut la valeur de A
ladresse mmoire ADR.
Ligne 220: fin de la boucle.
Il ne se passe rien aprs lexcution. Cest normal. Nous avons besoin
dune routine en assembleur pour afficher notre sprite. Pour cela, ouvrez la
fentre Assembleur de WinAPE (touche F3). Crez un nouveau fichier et
saisissez le code assembleur suivant:
org &6000
ld hl, &4000
ld de, &c000
ld bc, 16
affiche push bc : push de
ld bc, 4
ldir
pop de
ex hl, de ; call &bc26 ; ex hl, de
pop bc
dec b ; jp nz, affiche
ret
Assemblez le code en appuyant sur les touches Ctrl+F9. Notre programme
en assembleur peut dsormais tre utilis par le BASIC.
Revenez sur lcran du BASIC et saisissez la suite du programme BASIC
les lignes suivantes.
230 CALL &6000
240 GOTO 240
RUN
Et voil. Notre sprite apparait. A laffichage, il ny a aucune diffrence entre

la version prcdente du programme et la version sprite. Cependant,
comme un sprite est un lment graphique, il peut contenir plusieurs
nuances de couleurs et surtout tre dplac de manire plus fluide. De
mme, sur des lments plus grands, laffichage dun sprite est largement
plus rapide que lutilisation de plusieurs symboles. Pour interrompre le programme qui boucle en ligne 240, pressez 2x la touche Echap. Amliorons
notre sprite en lui apportant plus de couleurs, et pour le coup nous allons
travailler en MODE 0. Saisissons un nouveau programme:
10 MODE 0: MEMORY &3FFF:RESTORE 30
20 FOR R=&4000 TO &4000+ &40:READ A$:POKE R,VAL("&h"+A$):NEXT
30 DATA 00,CF,CF,00,45,CA,C0,80
40 DATA 45,C0,C0,2A,CF,D0,60,95
50 DATA CA,D0,E0,95,CA,D0,E0,80
60 DATA CA,D0,E0,00,CA,C0,80,00
70 DATA CA,C0,00,00,CA,C0,80,00
80 DATA CA,C0,C0,00,CA,C0,C0,80
90 DATA CF,C0,C0,95,45,C0,C0,80
100 DATA 45,CA,95,00,00,CF,CF,00
016_054-3_192 17/12/15 23:08 Page25
En MODE 0, notre sprite mesure 8x16 pixels. Les pixels tant de largeur
double. Nous avons donc besoin de 1 octet pour afficher 2 pixels de couleur. Vous remarquerez que les valeurs contenues dans les lignes de DATA
sont exprimes en hexadcimal. On aurait pu les crire en nombre. Cest
juste un confort de lecture.
La ligne 20 charge en mmoire les donnes partir de ladresse &4000.
Nous allons nouveau utiliser le code assembleur prcdent pour affichage notre sprite. Ajoutons les 2 lignes suivantes notre programme:
110 CALL &6000
120 GOTO 120
RUN
192 x 272 pixels en MODE 0.

384 x 272 pixels en MODE 1.
En BASIC il est possible dobtenir le mme effet en saisissant:
10 CLS
20 OUT &BC00,1:OUT &BD00,50
30 OUT &BC00,2:OUT &BD00,51
40 OUT &BC00,6:OUT &BD00,34
50 OUT &BC00,7:OUT &BD00,35
Visionnaire
Notre PAC-MAN a pris des couleurs. Les pixels du MODE 0 sont plus larges.
Utilisation des diffrents modes daffichage

Le MODE 0 permet de profiter de graphismes colors mais manque de
finesse. La plupart des jeux sur CPC
utilisent ce mode.
Le MODE 1 offre des graphismes plus

fins, mais moins colors. Pour avoir
des effets de dgrad ou donner le
sentiment davoir plus de nuances de
couleurs, le graphiste utilisait trs souvent le principe de tramage, combinaison de pixels de couleurs diffrentes.
En 1985, Alan Michael Sugar, PDG dAmstrad explique sa vision de la

micro-informatique:
Les jeux cest fini. Dans les annes qui viennent, cest sr que ce march
va chuter et de beaucoup. Les gens cherchent quelque chose de plus
srieux, de professionnel Je crois normment au traitement de texte. .
Heu. (Source Amstrad Magazine N 4 - Novembre 1985)
La gamme Plus
En 1990, Amstrad renouvelle la gamme des CPC en lanant la gamme Plus.

Il sagit de la mme configuration (464 et 6128 uniquement), mais avec une
carrosserie plus actuelle (plastique blanc) et une palette tendue 4096
teintes (mais toujours 16 couleurs utilisables en MODE 0) et permet la gestion de 16 sprites hard (et zoomables). Cette gamme est aussi loccasion
pour Amstrad dattaquer le march du jeu vido (tenu par SEGA et Nintendo)
en proposant la GX 4000, un CPC 464+ packag dans une console de salon,
auquel on a supprim le lecteur de K7 et dot dun support cartouche (support qui quipera galement la gamme des CPC+). Les machines auront peu
dintrt par rapport aux versions prcdentes. La palette de 4096 couleurs
nest pas accessible par le BASIC, et le nouveau MODE 3 nest quun MODE
0 en 4 couleurs qui ne sera jamais utilis par les programmeurs. Malgr le
soutien des diteurs de jeux Europens (franais surtout), la gamme disparat des rayons peine un an aprs sa mise sur le march.
O voir des CPC en action?
La scne CPC est trs prsente en Europe, et plusieurs jeux indpendants

sortent chaque anne. La scne Espagnole est trs active dans le dveloppement de jeux. En France est organise chaque anne la dmoparty
ReSet (anciennement nomme Amstrad Expo) Coutances, qui sest
droule en Juin cette anne. On peut y rencontrer des passionns du
CPC, des concours de dmos, des uvres dinfographistes et des customs de machines. Pour en savoir plus, vous pouvez vous rendre sur cette
page: http://reset.pushnpop.net .
Le MODE 2 est surtout utilis pour les applications (bureautique, utilitaires

systme).
Il est possible, laide de routines en
assembleur, de partager horizontalement laffichage en 2 modes diffrents. Comme ici, laire de jeu est en
MODE 0 (16 couleurs), et le panneau
de score en MODE 1. Il nest cependant pas possible de superposer 2
modes diffrents ou de partager lcran verticalement.
Certains programmes permettent laffichage plein cran appel overscan. La technique consiste liminer la bordure autour de lcran et ainsi
augmenter la rsolution. Il sagit de travailler sur les registres 1, 2, 6 et 7 du
CRTC (Cathode Ray Tube Controller ou Contrle du gnrateur de signal
vido). La rsolution finale atteint:
Programmer en C pour CPC
Bien que lassembleur soit le langage favori des CPCistes, il est possible
de programmer en langage C et de compiler son code afin de lexcuter
sur CPC (mulateur ou vraie machine). Le compilateur C SDCC (Small
Device C Compiler) fonctionne sous Windows et permet (entre autres) de
raliser des programmes pour Amstrad et de gnrer du code pour le Zilog
Z80. (http://www.cpcwiki.eu/index.php/SDCC_and_CPC)
Dcouvrir ou redcouvrir le CPC

Logiciels dpoque
http://www.cpc-power.com
http://www.cpcgamesreviews.com
Tutorials de programmation assembleur et basic, articles techniques

http://www.cpcmania.com
http://www.cpcrulez.fr
u
25
016_054-3_192 17/12/15 23:08 Page26
Aprs avoir fait mes armes en programmant des calculatrices (TI 57, FX 180P, PB 100), jai eu envie,
tel lextraterrestre du quartier, de faire lacquisition dun vritable ordinateur. A lpoque, tous ceux qui
taient proposs se ressemblaient beaucoup de par leurs
possibilits, leur langage de programmation (le Basic) et leur prix.
Compte tenu du fait que je devais le payer avec mes propres
deniers, jai cherch un bon compromis entre prix et capacits.
Mon choix sest port sur lAmstrad CPC 464 couleur, qui
lpoque (1984) ma cot un mois de salaire de job dt (650
euros en gros, oui mes jobs dt taient bien pays).
Stphane Sibu
Directeur Technique chez GUYZMO
Microsoft MVP Windows Platform Development
www.guyzmo.fr
stephane.sibue@guyzmo.fr
Ctait une vraie machine de course, processeurs Z80 4 Mhz, 64 Ko
de Ram (kilo octets oui), clavier mcanique (trs rare lpoque) et
lecteur de cassettes intgr, pas pour couter de la musique, mais pour
sauvegarder les programmes crits en Locomotive Basic (un autre basic
que celui de Microsoft). Ecran couleur intgr (une rvolution) et un processeur sonore permettant de faire de vritables morceaux de musique par
programme sans effort.
Jouer ou programmer?
Gnralement les gens faisaient ce genre dacquisition pour deux raisons.

Tout dabord les jeux, qui taient dignes des consoles de lpoque, et la
programmation. Perso, vous le savez dj, ctait pour la programmation,
mais je dois avouer que jai aussi pas mal jou (javais 16 ans alors vous
pensez bien). Le plus rigolo avec les jeux, du moins pour moi, ce ntait pas
tellement dy jouer mais plutt de les pirater. Avec les cassettes, les premiers temps, il suffisait de possder un bon copieur de cassettes et le tour
tait jou, les jeux taient copis en quelques minutes (oui minutes, lunit
de temps des chargements par cassette). Ensuite les diteurs ont mis en
place des stratagmes pour viter ce type de copie et il fallait en passer
parfois par quelques lignes dassembleur pour casser la protection,
charger en mmoire les diffrents modules du jeu et les enregistrer ensuite
sur une autre cassette, du grand art!
Le jeu Sorcery
Locomotive Basic
Un must, le jeu Barbarian
Cot programmation, lAmstrad tait servi par un basic de trs grande qualit. Il tait trs rapide, et permettait dutiliser toutes les ressources de la
machine (sons, interruptions, ports, vido). Sur les 64 Ko de RAM, il ne restait que 42 Ko de disponible pour les programmes en basic, car il fallait
enlever la mmoire utilise par linterprteur et aussi la mmoire vido de
16 Ko. Cot vido ctait assez rustique. 3 modes taient disponibles. Plus
26
on voulait de couleurs diffrentes simultanes (dans une palette de 27 couleurs), moins on avait de pixels lcran:
Mode
0
1
2
Couleurs
16
4
2
Pixels
160x200
320x200
640x200
Caractres
20X25
40x25
80x25
Chose importante et trs vintage, le Locomotive Basic tait un Basic avec

des numros de lignes, comme tous les Basic de lpoque dailleurs. Quelle galre ces numros de lignes quand jy pense!
Mis part a, avec ce Basic, il tait possible de faire des choses trs sympathiques. Par exemple, il tait possible de dfinir des interruptions au sein
mme du programme. Sil fallait excuter un sous-programme qui se trouve en ligne 100, 2 fois par seconde, il suffisait dcrire:
EVERY 5,0 GOSUB 100
Et toutes les 1/2 seconde (le 5 indique 5/10me de seconde, soit 1/2
seconde), avec le timer 0, on saute automatiquement la ligne 100. A la
1re instruction RETURN rencontre, le programme reprend l o il a t
interrompu. LAmstrad possdait 4 timers distincts (0 3) ce qui permettait
de raliser des choses bien pratiques trs simplement. Linstruction
AFTER, avec la mme syntaxe, permettait de raliser la mme opration
mais une seule fois et non cycliquement. Dans tous les cas, Il fallait juste
bien penser suspendre les interruptions (instruction DI) et les ractiver
(instruction EI) aux bons endroits pour viter des effets de bord induits par
le fait que le programme pouvait tre interrompu nimporte quand, cest-dire dans nimporte quel tat. Une trs bonne mise en bouche pour la synchronisation dapplications.
Il tait aussi possible de mlanger graphiques et caractres ou dafficher
des caractres sur des coordonnes graphiques. On pouvait scruter ltat
du clavier, du joystick (indispensable pour jouer), imprimer, crer jusqu 8
fentres de texte diffrentes ayant chacune leur propre systme de positionnement, lire et crire des fichiers sur cassette (puis disquettes), charger
des blocs de programmes au fur et mesure des besoins, etc.
016_054-3_192 17/12/15 23:08 Page27
Le lecteur de disquettes,
indispensable!
Trs rapidement un investissement sest

impos. Lachat dun lecteur de disquettes, pour acclrer drastiquement
les temps de chargement et profiter, oh comme cest bon, des joies de laccs alatoire aux donnes (contrairement laccs squentiel depuis une
bande magntique). Le lecteur de disquette tait fourni avec un systme
dexploitation trs utilis lpoque, le CP/M. En gros, CP/M est lanctre
de MS-DOS. Il tait utilis principalement sur des machines professionnelles. Lintrt a t pour moi de me familiariser en avance aux commandes typiques des systmes dexploitation de lpoque (DIR, COPY,
REN). Amstrad fournissait aussi le DR Logo (DR pour Digital Research), un
langage trs riche et
bien sympathique permettant de dessiner des
figures gomtriques
(avec la tortue) mais pas
que. Il tait pourvu dinstructions permettant par
exemple dajouter des
proprits supplmentaires des objets
prexistants et mme de crer ses propres objets; l aussi une mise en
bouche pour la programmation oriente objet avant lheure. Grce au
CP/M jai pu aussi minitier au Turbo Pascal de Borland qui tait disponible
(craqu, mais il y a prescription Monsieur le Procureur) pour cet OS.
Le lecteur de disquettes tait aussi utilisable depuis le Basic, et franchement a a chang compltement l'utilisation de mon Amstrad! Ctait de la
folie, des disquettes dune capacit incroyable de 178 Ko par face (eh oui,
ctait trop de la balle), et surtout la possibilit de lire et dcrire des donnes sans intervention de la part de lutilisateur (plus besoin dindiquer de
mettre une cassette, de la caler au bon endroit et dappuyer sur REC). Mon
cher CPC devenait presque une machine de pro! Les disquettes avaient
un format qui a t abandonn par la suite, ctait des disquettes 3 pouces,
mais elles taient assez robustes; 30 ans aprs jarrive toujours les lire!
Du basic lassembleur Z80
Toute cette littrature (seul mdia disponible lpoque) a permis beaucoup dentre nous de progresser et daller de plus en plus loin dans lutilisation de leur Amstrad.
En fait, mes dbuts en programmation ont t un peu atypiques. Contrairement beaucoup de personnes qui ont commenc dvelopper sur des
calculatrices ou sur des ordinateurs personnels (Amstrad, Comodore 64,
Oric, TO7, MO5, Amiga, etc), moi jai commenc directement par lassembleur ds 12 ans, et tout a cause dun concours de circonstances (je ne
vais pas entrer dans les dtails ici).
Cest tout naturellement quaprs lutilisation dun bon Basic ou dun bon
Turbo Pascal (langages de haut niveau), jai eu envie de retourner aux
sources et de me remettre dvelopper en assembleur (non, ce nest pas
sale) pour tirer le plus de puissance de la bte. Donc je me suis mis coder
pour le Z80, le processeur de lAmstrad (le mme que celui de la Game
Boy). Ce processeur de Zilog tait trs rpandu lpoque, et pour tout
vous dire, on le trouve encore aujourdhui dans les calculatrices programmables de chez Texas Instrument. L aussi ce fut une belle exprience qui
ma servi trs souvent dans mon travail par la suite.
Un peu dassembleur?
Trs vite une communaut sest cre autour de cette machine, des journaux se sont spcialiss dans la publication de programmes et dinfos la
concernant, des diteurs ont sorti normment douvrages permettant
daccder aux ressources caches de la bte (utilisation de routines en
code machine depuis le basic via les instructions PEEK, POKE et CALL).
30 ans aprs toujours l
Il y a quelques semaines jai ressorti mon Amstrad de sa bote, il a dmarr

sans broncher, 30 ans aprs son achat et au moins 10 ans aprs sa dernire mise en route. Puis jai branch son lecteur de disquettes, et l, catastrophe, impossible de lire la moindre disquette. Aprs un petit tour sur
Internet, jai compris quil fallait changer la courroie dentrainement. Un fois
chose faite, il est reparti comme en 14 et jai pu montrer mon plus jeune
fils (18 ans tout de mme) les jeux que javais et les programmes que
javais crs, 15 ans avant sa naissance. Il a ador et a mme jou pendant
un moment certains jeux auxquels je jouais moi mme. Si on mavait dit
a il y a 30 ans
Si vous aviez un Amstrad et que vous ne pouvez plus lutiliser, il existe sur
le net de trs bons mulateurs. Personnellement je vous recommande le
site WinAPE (http://www.winape.net/) dans lequel vous trouverez un mulateur Amstrad de grande qualit, pourvu de fonctions trs puissantes et pratiques (je vous laisse dcouvrir).
Le mensuel Amstrad magazine
La bible du programmeur
27
016_054-3_192 17/12/15 23:08 Page28
Entre 1985 et 1994, Commodore International commercialise ce qui deviendra une machine de
lgende: lAmiga. En lespace de neuf annes de commercialisation, la gamme se verra dcline en
pas moins de 10 versions, dont la plus clbre reste lAmiga 500, sorti en 1987.
Baptiste Bideaux
Consultant en Digital Learning chez
PwC France.
LAmiga est devenu trs populaire dans les annes 1990. Il sduit les infographistes, devient un outil indispensable pour la TV et le cinma, et le secteur du jeu vido ladopte compltement, proposant mme des titres rien
que pour lui. Ses points forts: un affichage hyper-color pour lpoque, une
fluidit danimation, un systme multitche et une interface graphique similaire au Macintosh. Si Commodore a disparu, lAmiga perdure grce notamment la socit Amiga Inc, qui continue de faire voluer la gamme. Bien
sr, les machines proposes aujourdhui nont plus rien voir avec les premires architectures dpoque. Dailleurs, les anciennes versions sont nommes Amiga Classics, afin de diffrencier la vieille gamme de la nouvelle.
Les 3 Chipsets de l'Amiga
Selon les versions de lAmiga, on peut trouver 3 chipsets diffrents. LOCS
(Original Amiga Chipset) fut le premier chipset propos avec lAmiga 1000
et les premires versions de lAmiga 500 et 2000. Une version amliore
nomme ECS (Enhanced chipset) quipe les Amiga 500+, 600 et 3000. La
troisime gnration de chipset se nomme AGA (Advanced Graphics
Architecture); elle quipe les Amiga 1200, 4000 ainsi que la console de jeu
Amiga CD32. Les possibilits multimdia (audio et vido) sont fournies par
la puce Agnus. Cette puce volue en fonction de la gnration de chipset. Si la premire version (OCS) est capable de manipuler 512ko de
mmoire, une nouvelle version appele Fat Agnus et quipant les dernires versions de lAmiga 500 et 2000 manipule jusqu 1Mo de mmoire.
La puce du chipset ECS tout comme celle de lAGA permet de manipuler
jusqu 2Mo de mmoire et se nomme Super Agnus. La vido de lAmiga est propose en 2 spcifications: PAL(Europe) et NTSC(US). Le nombre
de lignes affichables en NTSC tant plus faible quen PAL, il ntait pas rare
de trouver des jeux en Europe qui noccupaient pas toute la hauteur de
lcran, enfin de rpondre galement au march US.
Les rsolutions les plus courantes

Spcifications
Basse rsolution
Haute rsolution
320x256
320x200
640x256
640x200
PAL (50 Mhz)

NTSC (60 Mhz)
Haute rsolution
entrelace
640x512
640x400
Lentrelacement consiste afficher en alternance une trame constitue

des lignes impaires puis celle des lignes paires. Lexploitation de ce procd vido provoque un scintillement de certaines zones de lcran plus
contractes. La rtro compatibilit entre les diffrents chipsets est garde.
On retrouve donc dans le chipset AGA, toutes les rsolutions daffichage
des versions prcdentes.
Les couleurs
Chipset
OCS
ECS
AGA
28
Basse rsolution
Haute rsolution
2 32
2 32
2 32
2 16
2 16
2 16
Haute rsolution
entrelace
2 16
2 16
2 16
Palette
4096
4096
16,777,216
La gnration de signaux RVB est prise en charge par le circuit du chipset

nomm Denise. Le nombre de couleurs lcran peut tre augment en
utilisant 2 modes de couleurs:
EHB (Extra Half Bright) qui permet dafficher jusqu 64 couleurs en basse
rsolution. Les couleurs 32 63 sont en fait les nuances en demi-teintes
des 32 premires couleurs.
HAM (Hold And Modify) permet dutiliser la totalit de la palette de 4096
couleurs (OCS et ECS). Le chipset AGA utilise lui le HAM-8, permettant
lexploitation de 262 144 couleurs.
Le site Amiga Graphics Archive prsente en dtail lensemble des rsolutions gres par les diffrentes versions dAmiga. Beaucoup de ces rsolutions sont destines lexploitation TV, mais peu sont utilises dans les
applications et jeux vido (notamment les hautes rsolutions entrelaces) :
http://amiga.lychesis.net/knowledge/ScreenModes.html .
Le systme vido de lAmiga fonctionne en mode bitplane. Pour une image
de 256 couleurs, la machine superpose 8 plans pour afficher limage. A
lpoque,la qualit graphique produite par lAmiga tait suprieure celle
dun PC VGA. Cependant, pour une telle image, la vitesse daffichage est
divise par 8.
Programmation
Afin danimer cet article, et dcouvrir le potentiel graphique de lAmiga,

vous aurez besoin: dun mulateur, dun langage de programmation, dune
disquette de travail.
Emulateur
WinUAE sera utilis. Il mule parfaitement lancienne gamme de lAmiga et
est simple configurer. Vous pouvez le tlcharger sur le site officiel :
http://www.winuae.net, dans la rubrique Downloads. Prenez les archives ZIP
si vous souhaitez viter la procdure dinstallation. La version de WinUAE
qui sera utilise dans cet article est la version 3.2.1.
Les ROMs Amiga tant copyrightes, WinUAE propose par dfaut lutilisation dune ROM publique nomme AROS. Elle est parfaitement compatible
avec les programmes Amiga et on reste dans la lgalit.
Langage de programmation
Nous allons utiliser le langage le plus populaire de lpoque: AMOS Basic.
Il sagit dun BASIC dvelopp par Franois Lionet en 1989. Il facilite le
dveloppement de jeux vido sur Amiga, mais permet aussi de dvelopper
des applications plus classiques. Il a lavantage dtre indpendant du systme dexploitation de lAmiga et donc de saffranchir des contraintes de
lOS. De ce fait, il communique directement avec le processeur 68000 et la
ROM, et permet de profiter pleinement du potentiel graphique de lAmiga.
Il a t dclin en une version Pro, apportant plusieurs amliorations. Nous
nutiliserons que la premire version, qui sera amplement suffisante pour
cet article.
AMOS Basic est disponible aujourdhui sous licence BSD. Le code source
a t mis la disposition du public par son auteur. Vous pouvez lutiliser
des fins personnelles. Pour plus dinformations: https://en.wikipedia.org/wiki/
AMOS_%28programming_language%29
Je vous propose de tlcharger larchive suivante:
http://www.baptiste-bideaux.com/amosbasic/amosbasic134.zip
Elle contient 2 images de disquette (au format ADF) utilisables sous WinUAE.
016_054-3_192 17/12/15 23:08 Page29
a Le logiciel AMOS Basic dans sa version 1.34

a Notre disquette de travail (programmez.adf)
teur et appuyez sur les touches Shift+F9. Appuyez sur la toucheF pour
confirmer votre choix. Saisissez dsormais le code suivant:
Configuration de lmulateur
Lancez WinUAE. Aprs laffichage dun message vous informant des
ROMs manquantes, le panneau de configuration de WinUAE saffiche la
rubrique Quickstart . La configuration actuelle suffira. Il sagit dun
Amiga 500 quip du chipset OCS et dune RAM de 1Mo. Il faut insrer une
disquette dans le lecteur. Pour cela, cliquez sur le bouton Select image
file de la partie Emulated Drives et slectionnez le fichier AMOS The
Creator v1.34 (1991)(Europress).adf extrait de larchive prcdemment
tlcharge Fig.1. Cliquez ensuite sur le bouton Start situ en bas de la
fentre pour lancer lmulation. Aprs quelques secondes de chargement,
lditeur dAmos Basic apparait Fig.2.
Premier programme
Dans lditeur, saisissez ce programme :
Excutez votre programme en appuyant sur la touche F1.

Explication du programme
Ligne 1 - Le programme ouvre lcran N0 de rsolution 320x200 en 16
couleurs, et en basse rsolution (mot cl Lowres).
Ligne 2 Ecrit Programmez! Le magazine du dveloppeur sur la 1re
ligne de lcran.
Ligne 3 Attend lappui dune touche avant de quitter.
Appuyez sur une touche pour quitter. Ensuite appuyez sur la barre ESPACE
pour revenir lditeur.
Modifions notre premire ligne comme suit:
Appuyez sur F1 pour excuter le programme.
Nous avons dsormais

une rsolution de
640x200, toujours en 16
couleurs, mais cette
fois-ci en haute rsolution (mot cl Hires ).
En haute dfinition, laffichage est limit 16
couleurs.
Appuyez sur F1 pour afficher le rsultat.

Voyons comment modifier une couleur.
Appuyez sur une touche
pour sortir du programme et sur la touche
ECHAP pour passer en
Mode direct Fig.3.
Le Mode direct permet
de saisir des commandes Amos en dehors du programme lui-mme. Ces
commandes ne seront pas mmorises et naffecteront pas le code du
programme. Remarquez que le panneau du mode direct saffiche en haute
rsolution, sur un cran en basse rsolution. Comme indiqu plus haut,
lAmiga fonctionne en mode bitplane, donc le systme peut superposer
plusieurs crans (8 en tout) de tailles et de rsolutions diffrentes. Modifions une couleur en saisissant juste aprs le libell AMOS>, le code suivant. Validez par la touche ENTREE :
La commande Basic Colour permet de modifier les composantes RVB
dune couleur.
La couleur indexe 0 devient blanche ($fff). La bordure tant remplie par la
couleur 0 devient blanche galement. Nous pouvons avec cette commande modifier chacune des couleurs de lcran courant. Une erreur surviendra si vous indiquez un N de couleur en dehors de la palette.
Fig.1
Appliquons un entrelacement notre systme vido. Lentrelacement

consiste afficher sur lcran les lignes paires et impaires de manire alterne. Cela peut provoquer un scintillement de certaines parties de lcran.
Modifiez la 1re ligne:
Nous augmentons la taille de notre cran (200 400) et ajoutons le mot cl

Laced la fin de notre ligne. Cette rsolution permet dafficher une image
de 640x400 pixels sur la totalit de lcran. WinUAE, dans sa configuration
de base, ne montre pas ce scintillement et le texte apparat partiellement.
Palette de couleurs
Chaque couleur indexe est dfinie par 3 composantes RVB, chacune

code sur 4 bits. Voyons comment, avec Amos BASIC, il est possible de
manipuler les couleurs. Crons un nouveau programme. Revenez ldi-
Fig.2
29
016_054-3_192 17/12/15 23:08 Page30
Fig.3
Il est possible de modifier plusieurs couleurs de la palette en une seule fois,

grce la commande Palette . Par exemple pour modifier les 6 premires couleurs:
Utilisation du mode bitplane
Nous allons amliorer notre programme. Voir les briques de couleurs safficher une une nest pas trs lgant. Nous allons ajouter un cran supplmentaire qui affichera un message de patience et masquera lcran de nos
couleurs. Lorsque nos couleurs seront totalement traces, nous les afficherons. Amliorons notre programme comme suit:
Ligne 2 Ouverture de lcran N1,
de rsolution 640x200, en 2 couleurs et en haute rsolution.
Ligne 3 Dfinition de la palette de
lcran N1. Par dfaut, toutes les
actions de textes, de couleurs et
de tracs sont appliques au dernier cran ouvert.
Ligne 5 Ecrit le message de
patience sur lcran N1.
Ligne 6 On prend la main sur lcran N0. Lcran napparat pas, mais les
prochains tracs seffectueront sur cet cran. On dsactive le flashing de
couleur et le curseur texte pour cet cran.
Ligne 15 On bascule lcran N0 au premier plan. Ainsi, il devient visible.
Jack Vittriano sinstalle sur lAmiga
Pour dmontrer des diffrences graphiques de chaque rsolution, jai choisi limage dune des toiles du
Fig.4
clbre peintre cossaisJack
Vittriano : The Singing Butler
Fig.4.
The Singing Butler,
Jack Vittriano, 1992.
Appuyez sur le touche F12
pour revenir au panneau de
configuration de WinUAE.
Nous allons insrer notre disquette de travail. Cliquez nouveau sur le
bouton Select image file et slectionnez le fichier programmez.adf
extrait de larchive tlcharge. Cliquez ensuite sur OK en bas du panneau pour revenir lmulation. La disquette contient toutes les images
dont nous avons besoin pour cette partie. Sous lditeur dAmos Basic,
crez un nouveau programme (Shift + F9) et saisissez le code suivant:
affiche. Dans le cas contraire, une erreur se produira. La palette

sajustera en fonction de limage charge.
Ligne 3 Attend lappui dune touche pour quitter.
Limage affiche se rapproche de limage originale.
Mais elle manque de finesse.
320x200, 32 couleurs,
basse rsolution
Voyons comment elle se prsente en haute rsolution. Modifiez le programme comme suit:
Limage affiche en 640x200 est plus fine. La palette est passe 16 couleurs. Les pixels affichs ne sont plus carrs, mais rectangulaires. Limage
met plus de temps safficher.
Affichons la mme image, mais en haute dfinition entrelace:
Limage reste en 16 couleurs mais les pixels redeviennent carrs, ce qui

apporte une meilleure prcision dans les dtails.
Voyons maintenant laffichage de cette image en 4096 couleurs (mode HAM):
Vous remarquerez que lcran ouvert dfinit un affichage en 64 couleurs.

Le mode HAM
Notre image, en basse rsolution, affiche 4096 nuances de couleurs. Le
tramage de couleurs prsent dans les autres rsolutions napparait plus
(ou moins). Ce type dimage a t trs peu utilis dans les jeux vido car
cela ralentit grandement la machine.
En regardant de plus prs, limage laisse apparatre des bavures de couFig.5
Appuyer sur F1 pour excuter le programme Fig.5.

Ligne 1 Ouverture de lcran N0 en 320x200, 32 couleurs et en basse
rsolution
Ligne 2 Lecture et affichage de notre image depuis la disquette insre
dans le premier lecteur.
Sur Amiga, le format dimages le plus rpandu est le format IFF (Interchange File Format) cr par Electronics Arts en 1985. Amos lit parfaitement ce
format.
Il est important douvrir un cran de mme taille que limage qui sera
30
016_054-3_192 17/12/15 23:08 Page31
leurs. Ces bavures, ou franges sont dues aux couleurs de la palette.

Pour afficher 4096 couleurs, le systme se base sur les composantes RVB
du pixel prcdent, et les modifie pour afficher la couleur du pixel courant.
Si la couleur est mal choisie, on voit apparatre ce type de frange. Cela arrive souvent dans les zones de dgrad.
Manipulation dcrans.
Ce qui suit va vous permettre de comprendre le fonctionnement des

crans et comment, en quelques manipulations, nous pouvons programmer des effets graphiques fun. Vrifiez que la disquette de travail programmez.adf est toujours insre.
Image: Effet lazer
Ce ft sans doute lun des tous premiers effets dapparition dimage, rencontr dans les dmos Amiga. Il sagit dafficher progressivement une
image lcran, ligne par ligne, en les projetant du bas vers le haut. Cela
donne le sentiment dun laser qui tracerait limage. Crez un nouveau programme et saisissez le code suivant dans lditeur dAMOS:
grammer une animation de

25 images qui se jouera
linfini. Lide est simple :
on charge dans un cran
en arrire plan, une image
IFF contenant lensemble
des tapes de notre animation. Sur lcran plac
au premier plan, on copie
chacune des images, les
Fig.6
unes aprs les autres
Image IFF contenant toutes les tapes de lanimation
Fig.6.
Nous allons profiter de cet exemple pour introduire une nouvelle notion
graphique bien connue sur Amiga: les Bobs. Un Bob est un lment graphique, similaire un sprite, et qui peut-tre afficher sur nimporte quel
cran. Crez un nouveau programme et entrez le code suivant:
Rsultat digne dun Jedi!
Appuyez sur la touche F1. Voici le rsultat:
Animation:
cycle de couleur
Limage se dessine ligne par ligne
Limage totalement affiche
Lune des techniques simples pour crer une animation est de passer par
un cycle de couleurs. Ce procd consiste isoler quelques couleurs adjacentes dans la palette et dalterner les valeurs de leurs composants RVB, en
boucle. Nous allons voir comment mettre en place ce type danimation en
quelques lignes. Crez un nouveau programme et saisissez ce qui suit:
Image: balayage zoom

Maintenant, nous allons voir comment lon peut utiliser la superposition
dcran. Toujours avec notre image de dragon, nous allons programmer
lanimation dune barre horizontale, qui balaiera lcran de haut en bas et
donnera limpression dun grossissement de limage lors de son passage.
Crez un nouveau programme et saisissez ce qui suit:
Le rsultat:
Le rsultat:
Le cycle de couleurs donne un effet de
dplacement du damier vers la droite.
u
Sur la disquette Programmez!
Animation: images par images
Voyons maintenant comment il est possible dobtenir, toujours en manipulant plusieurs crans, une animation images par images. Nous allons pro-
Retrouvez sur la disquette lensemble des programmes AMOS prsents dans cet article. Pour charger un programme AMOS depuis
lditeur, appuyez sur les touches Shift+F1.
31
016_054-3_192 17/12/15 23:08 Page32
Dans ce petit dossier, nous allons survoler 30 ans de machines Amiga, des historiques aux solutions
passant par lmulation. Ce tour dhorizon couvrant une grande priode et de nombreux rebondissements.
Alors plongeons directement dans le vif du sujet.
Jeffr3y
^Vital Motion ÂmigaVibes ÂmigaImpact
(jeffr3y.vm@gmail.com)
LAmiga 500, le plus

vendu des micros
de la gamme
Mon Amie est un Gars!
Nous nallons pas commencer par tergiverser, la machine est un Amiga,

quid de ce dernier?
Amiga First contact!
Revenons 30 ans en arrire, en 1985, cest en cette anne bnie, que lAmiga 1000, premire gnration de la machine de Commodore va sortir le
grand jeu dans la cour des micro-ordinateurs familiaux. Une prsentation
grandiose et tonitruante au Lincoln Center de New-York le 23 juillet 1985,
avec des stars, comme Andy Warhol(1) aid de Deborah Harry, plus
connue comme la chanteuse de Blondie, va dmontrer les capacits graphiques de lAmiga par un travail dartiste. Lors de cette crmonie, il y a
aussi la mise en avant des capacits de la machine via des dmos devenues lgendaires comme la Robo City et la mythique Boing Ball. LAmiga
1000 possde un KickStart 1.0 (KS) sur disquette, rapidement clips par
une version 1.1, ainsi quun WorkBench 1.0 (WB).
Second Reality!!
La seconde gnration dAmiga arrive en 1987 avec des machines ddies

la micro-informatique familiale, lAmiga 500, et, pour les professionnels,
lAmiga 2000 ; ces deux machines embarquant Denise, Paula et Agnus.
Ces deux machines ont marqu leur poque, avec des jeux et des dmos
ayant provoqu de nombreux achats compulsifs. Ainsi Shadow of the
Beast (1989), dmo technique avant de devenir un jeu. Du ct des dmos,
les RSI Megademo et autre Scoopex Mental Hangover firent tourner la tte
de nombreux jeunes dans leur chambre et certains passrent du ct
demoscene pour crer leur propre groupe de demomakers. Toutefois ce
ne ft que lors de la fin des annes 1989-90.
Les Amiga Classics de troisime gnration,

cest fantastique!
LAmiga 3000 arrive en 1990 avec WB et KS 2.0, vite suivi par une version
2.04. Mais la vritable troisime gnration arrive en 1992 par les 1200 et
600 du ct des familles et lAmiga 4000 pour les pros. Ces derniers sont
fournis avec les KS et WB 3.0 leur sortie, puis avec des KS et WB 3.1
aprs le rachat par Escom. Ces machines firent rver une grande majorit
des utilisateurs de 500 et 2000. Mais si les 1200 sont trs complet (le 600
tant un 500 sans le pav numrique, idal pour un Amiga transportable).
Le 4000 quant lui ft utilis par la Nasa jusquaux annes 2010, sur TF1
pour ses jingles pub et ses incrustations vido, ainsi que pour la ralisation
des effets spciaux de Babylon 5 (srie de SF des annes 90) pour ne citer
queux. Mais aprs les annes de faste, lAmiga linstar de lAtari ST, va
connatre la chute avec llvation du PC dans les chaumires durant le
milieu des annes 1990. Les jeux des annes 1992 sont Project-X et Pinball
Dreams pour ne citer queux, ainsi que Deluxe Paint, du 1 5, qui rayonna
durant toute la dure de vie de lAmiga (du 1000 au 4000). Je ne parlerai
pas des 3000UX, 1500, 500+, HD et autres variantes qui ne se dtachaient
pas des Amiga dcrits.
Dautres modles plus atypiques et moins rpandus ont t commercialiss comme le 2500, le Walker ou le CDTV qui tait une platine multimdia
avant lheure, mise en chec par un positionnement marketing dsastreux.
Nous ne parlerons pas non plus de la CD32 qui est une console.
AmigaTrek, the Next Generation
Le renouveau arrivera durant le passage dans le nouveau millnaire, avec

des solutions pour les accros de lAmiga OS-like. Le systme dexploitation connut alors une nouvelle distribution avec lOS4.0 et surtout avec une
nouvelle architecture : le Power PC. Cela donna naissance deux nouvelles machines destination des utilisateurs: les AmigaOne et les Pegasos. Ces deux machines pouvant faire tourner les OS 4.1 dHyperion(2). A
savoir que les Pegasos taient initialement prvus pour faire tourner un
autre systme dexploitation alternatif drivant de lAmigaOS : MorphOS(3).
Durant ces annes noires de lAmiga, un autre systme dexploitation
La Boing Ball, dmo rebondissante cre par RJ Mical et Dale Luck,
est une version amliore de la Spinning Ball de Sam Dicker. Cette
balle rebondissante fut prsente lors de dmonstrations prives au
CES de Las Vegas en 1984. Il est utile de savoir que les premiers
Amiga de 1984 furent des Amiga Development System disposant des
puces Agnus, Daphne et Portia sur circuits imprims].
LAmiga 2000 ou le professionnel
32
016_054-3_192 17/12/15 23:08 Page33
essaie de se crer une communaut, cest Aros, avec pour leitmotiv davoir
un dploiement sur des machines PC (x86 donc Intel et AMD) et qui est
devenu Icaros(4).
Puis arrivent des cartes mres moins chres avec les Aone500 et SAM
dACube Systems(5) et depuis 2011, il y a A-eon Computer(6) qui commercialise des Amiga avec les X1000 et X5000, des machines possdant une
puce programmable Xena, compose de 2 curs 500 MHz, directement
lie au processeur. Back 2 the Roots!
Expansion is Revelation
De nouvelles extensions pour les Amiga Classics voient le jour depuis le

milieu des annes 2000, avec des cartes comme le HxC emul(7). Mais
aussi par le biais de lecteurs USB simulant un lecteur de disquettes original
avec la mme vitesse de lecture comme le GoTek. Cela permet de redonner une seconde vie aux Classics toujours utiliss par des utilisateurs
inconditionnels. Il y a aussi de nombreuses cartes: ACA indivision permettant lexpansion des capacits des Amiga Classics.
Un X1000 de chez A-eon et Aone500 lors de lalchimie 2011
Emulation is Salvation
Dans ce paragraphe, nous parlerons des solutions Amiga par le biais de

lmulation quelle soit logicielle (software) ou matrielle (hardware).
Soft is Powerful, Soft is Beautiful
Plusieurs mulateurs Amiga voient le jour sur PC, mais un seul sort du lot
aprs toutes ces annes: lincontournable WinUAE(8). Cest la solution la
plus fiable et la plus compatible dans son intgralit avec les Amiga Classics. Pour info, il existe UAE4All qui est moins compatible, mais port sur
de nombreuses plateformes comme la PSP (PSPUAE(9)) ou la GP2x.
Dans le genre plus indpendant en plateforme, il y a la solution du Raspberry 2 Pi avec de lAmiga mul dans les distributions Retropie(10) ou
RecalBox(11), mais cela ncessitera de bien les paramtrer avec les bons
OS et KS. La difficult venant surtout de cette dernire, car une fois bien
configur, le RPi2 savre une belle petite machine mulant lAmiga avec
brio. Si cest vers les dmos que vous lorgnez, prfrez-lui les solutions
hardware.
Enfin, il y a AmigaForever de Cloanto, solution tout-en-un comprenant
WinUAE et intgrant Amikit, Aros et des mini-bases de donnes, des
vidos pour les ditions DVD. Un must-have pour ceux qui veulent
reprendre simplement sur PC.
Hardwired by FPGA
Une autre alternative pour avoir des Amiga est la solution des FPGA initie
par le Minimig dAcube Systems dans le dbut des annes 2008. Cela permet une mulation du hardware de la machine. Ainsi les successeurs du
Minimig sont les MiST et autres FPGA Arcade. La solution ayant le plus le
vent en poupe est le MiST avec un dveloppement de cores consquents,
et pas moins de deux ddis lAmiga; un pour mulation des Classics
jusqu lAmiga 1200 de base 68020EC, mais pas au-del, ce sont les
FPGA Arcade qui devraient aller plus loin. Il y a aussi un core qui permet
lmulation de laffichage AGA. Bref, vous insrez une carte SD, installez le
core Amiga et des ADF (image de diskette), HDF (image de disque dur) et
mme WHDLoad. Un must!
Whats the Next Step, Demoscene, Zine,

Community,
Sur les portails de la demoscene, comme Pouet(12), Scene.org(13), Demozoo(14) ou Demoscene.fr(15), la scene demo Amiga nest plus aussi active
depuis les annes 2000 et des scnes comme celle du C64 apparaissent
bien plus actives. Mais avec les 30 ans de lAmiga cette anne, elle ft plus
Un MiST et un Raspberry par dessus

productive en esprant que cela ne diminue pas lanne prochaine. De
plus, une grosse partie de la communaut francophone Amiga se retrouve
lors dvnements annuels: lAlchimie(16) ou la micro-Alchimie, se droulant dans la Drme Tain lHermitage dans une ambiance familiale et bon
enfant, tout en ayant une coding party et des confrences autour de lAmiga et de linformatique alternative en gnral. On y ctoie aussi de la robotique avec lassociation Caliban et le magazine Plante Robot, ainsi quun
beau stand ddi au retro-gaming en gnral;-)
So Far, so Good, so What!
On peut dire: lAmiga est mort, vive lAmiga et il continue avec une communaut de dveloppeurs, de sceners et dapplications restreintes. Les
temps ne sont plus des guguerres Amiga-Atari ST ou pire, OS4-MorphOS-Aros. Alors venez tous la prochaine Alchimie en 2017 Tain lHermitage, rejoignez les TripleA(17) ou dautres associations alternatives pour
ressentir encore les joies des OS multitches Amiga. Nhsitez pas
contacter des passionns de ces micros, ils vous montreront comment
exploiter les Amiga Classics comme les NG, voir les muler, car lAmiga
Spirit, cest le plaisir et la convivialit avant tout.
Code source dune dmo en Hollywood 6.0

(une partie du scrolltext):
Le code source sur le site de programmez.com
Retrouvez tous les rfrences du dossier sur programmez.com
33
016_054-3_192 17/12/15 23:09 Page34
Atari ST, la superstar

L'Atari ST a ft ses 30 ans cette anne! Machine emblmatique des annes 80 invente par le
consortium de la famille Tramiel, il sera quip de son propre systme d'exploitation avec un bureau
intgr dnomm GEM; il eu fort faire avec la concurrence de Commodore et de son Amiga n une
anne auparavant. Le monde des machines multimdia assembles avec des composants Motorola
et aux architectures dcuples pour l'poque en 16/32 bits permettaient de dpasser en capacit
toutes les machines de l'poque telles que l'Amstrad CPC.
Frdric Sagez
(fsagez@gmail.com)
De cette confrontation entre machines natra

une guguerre sur le thme de qui a la
meilleure bcane entre les possesseurs de
l'Amiga et de l'Atari; mme le magazine TILT
sortira d'ailleurs un spcial hors srie ce sujet.
Les performances graphiques de l'Amiga ne
sont pas remettre en cause car cette machine
a des composants ddis pour, mais l'Atari fera
plutt le bonheur de beaucoup de musiciens de
styles diffrents comme le clbre compositeur
Jean Michel Jarre ou le groupe Kassav. L'arrt
de la production de ces machines va sarrter
brutalement, Commodore va faire faillite en
1994 et Atari Corporation suivra le mme chemin quelques annes plus tard aprs quelques
rachats malheureux. Et aujourd'hui, que sont
devenues nos mythiquesmachines ?
Le Hardware
Au 21me sicle, le hardware, vieillissant mal

avec le temps, va amener la communaut
trouver un moyen pour changer le lecteur de
disquettes qui, lui aussi avec le temps, tombe
en panne (sans parler de l'abandon de la production des supports de disquettes double
face), ainsi que les gros disques durs.
Dans le cadre du Software preservationqui
est le principe de restauration, transfert et
archivage de disquettes, beaucoup de projet
hard et soft verront le jour. L'avantage de l'Atari
ST face ses concurrents de l'poque est de
pouvoir lire et crire sur des disquettes utilises
par un PC. Et l'un des projets les plus aboutis
en matire de rcupration de donnes est le
projet Kryofluxde SPS : c'est un dispositif qui
permet de relier un lecteur de disquettes traditionnel avec une connexion USB un PC; avec
son logiciel de lecture des faces de la disquette, il est reconnu pour sa fiabilit et sa prcision
ncessaire pour acqurir les informations de
tout l'ensemble des donnes de la disquette.
34
En fait, le but est de crer des fichiers

images complets partir des disquettes
dorigine qui soient dans un format relu par
diffrents types de supports comme par
exemple les mulateurs qui utilisent des
fichiers aux formats ST ou MSA par dfaut.
Mais l'utilisation dun lecteur de disquettes de remplacement se fait
attendre jusqu' ce que JeanFranois Del Nero cre le projet
HxC Floppy Emulator en 2007
qui va permettre d'utiliser un
mulateur de disquettes
Hard sur de vraies machines. Il se met tout simplement et assez facilement sur l'emplacement
de lancien lecteur de disquettes de la machine
et a la caractristique principale de lire des
fichiers images via une carte SD. On peut maintenant crer des sauvegardes de ses disquettes en faisant des images disque et ensuite
les utiliser sur une vraie machine. Le disque dur
de l'poque est un priphrique dot du protocole de transfert ACSI trs lent d'accs et limit
en quotas disque et partition. Diffrents projets
ont pallis ce type de contraintes: le
SatanDisk puis l'UltraSatan sera un vrai couteau Suisse pour remplacer le disque dur en
mode natif sur un Atari ST. Cr par le polonais
Miroslav NOHAJ surnomm Jookie, il sagit
dune sorte de petit botier incontournable qui
se connecte via le port ACSI, et, aliment par
une carte SD, il mule un disque dur avec des
partitions. Aujourd'hui, avec ou sans Rasberry
Pi, le CosmosEx du crateur du SatanDisk va
au-del du lecteur de disque dur via une SD
Card standard car si on lui rajoute un Rasberry
Pi, il permettra de connecter et d'utiliser des
priphriques USB et de se connecter un lecteur rseau pour changer des fichiers. Les
petits plus: tlchargement dimages de disquettes via Internet et utilisation de priphriques tels que le remplacement du clavier/souris via la connectique USB.
Les mulateurs
Loin des premiers mulateurs PC/DOS tel que

PacifiST de Frdric Guidouin qui ont marqu
la fin des annes 90, aujourd'hui la gamme s'est

bien toffe avec deux mulateurs
reconnusdans le monde des utilisateurs d'mulateurs Atari ST : Steem SSE et Hatari.
Steem SSE est la suite logique de la version
cre la base par les frres Hayward, c'est un
fork appel Steven Seagal Edition d'o l'acronyme SSE utilis par son nouveau contributeur
surnomm Atari Steven qui a fait une mise
jour complte de l'mulateur qui a t dvelopp l'origine avec une structure de code en
C++. Le logiciel tourne principalement sous
Windows mais il existe une version Unix appele XSteem toujours en cours de portage.
Hatari est le deuxime mulateur ultime pour
PC, Mac et Linux! Hormis une interface de
configuration un peu archaque, l'mulateur permet d'muler la gamme des Atari STF, STE et
est ouvert aussi la gamme 68030: le Falcon.
Comparativement Steem SSE, c'est un projet
Open Source dvelopp en GNU-C, cr par
Thomas Huth et maintenu par plusieurs contributeurs.
Il existe un mulateur spcifique pour visualiser
les premires dmos apparues sur Atari ST et
entretenu par son crateur Arnaud Carr :
Saint. Il fonctionne sous Windows avec DirectX
et son grand intrt comparativement ses
autres confrres est dutiliser les images
disques non patches et dorigine.
A noter que pour faire fonctionner les mulateurs, il vous faut obligatoirement le TOS (surnomm le The Operating System) qui est le
systme dexploitation de la machine que vous
016_054-3_192 17/12/15 23:09 Page35
devez obligatoirement possder pour lutiliser

avec un mulateur. Il existe diffrentes versions
suivant la machine que vous voulez muler:
une version 1.02 pour simuler lutilisation dun
simple Atari STF jusqu la version 4.92 pour un
Falcon et aussi suivant la langue utilise par la
machine. Il existe une autre solution qui est le
projet open source EmuTOS, il permet de fournir un TOS compatible et gratuit avec l'avantage d'tre redistribuable volont.
Les Jeux
Beaucoup de jeux ont vu le jour pour le dbut

du 21me sicle et ce, sur les diffrentes plateformes qu'offre Atari. (STE, Lynx, Falcon, XL et
Jaguar). Le groupe de dmo franais Paradize
va produire beaucoup de jeux de rflexion
comme Pooz ou Kolmik. Issus de portage de
jeux dj existants sur des plateformes diffrentes, des jeux de type projets dvelopps
par de gnreux contributeurs voient le jour
comme le jeu PicrossST initi par notre ami
belge Shadow272; avec la Shadow Team ils
vont faire d'un jeu une trilogie: Saboteur III.
Le rtro gaming va entrer en force sur l'Atari
STE avec l'diteur de jeux classifis vintage
Retro Gamer CD (faux-retro games for
modern platforms) en association avec le
groupe de dmo NoExtra avec le jeu d'arcade
r0x qui sera principalement dvelopp par
Nicolas Flandin qui est le musicien du groupe.
Rappelons le principe du jeu: avec votre vaisseau spatial vous devez viter les mtorites
de diffrents gabarits tout en prenant des
bonus. Dailleurs le jeu terminera premier de sa
catgorie la Outline party en Hollande en
2009. Enfin deux jeux de courses de voitures
arrivent en ple position: Racer de Laurent
Sallafranque du groupe de dmo franais Dune
qui propose diffrents modes de jeu comme le
jeu Out Run de Sega qui fonctionne uniquement sur Falcon. Anarcho Ride de lAutrichien
Le jeu r0x sur Atari STE

Thomas Ilg, dj auteur du jeu Laser Ball vous
propose un systme de jeu invers : percuter
un maximum de voiture sans limite de
tempssur Atari STE.
Coding Party
Cest un rassemblementqui permet aux personnes de participer des concours de diff-
rentes catgories (code, graphisme et musique)

et de voir aussi des groupes s'affronter pour
gagner des concours.
Les dmos parties ou vous verrez principalement des ataristes se font surtout en Hollande
avec la Outline ou la ST News International
Christmas Coding Convention qui revient cette
anne pour une ultime session avec une rencontre entre les anciens et les nouveaux
demosceners. La SommarHack en Sude se
situe dans un endroit isol o les barbecuesparties et la franche rigolade en font une CP
proche des demosceners. La SillyVenture en
Pologne permet de voir de belles productions
que ce soit sur le ST, FALCON ou sur des
consoles comme l'Atari XL.
leurs laffichage. Deux coles s'affrontent

entre les dmos dites old-school comme le
groupe NoExtra et les dmos dites newschool comme le groupe franais Live!
Groupe qui sortira la SillyVenture en 2012 la
dmonstration Muda avec une musique tonitruante compose par TomChi, Nicolas Flandin
tant le musicien du groupe NoExtra et grand
expert logiciel maxYMiser de Gwem.
Mais la dmonstration ultime appele couramment colorfull effect reviendra au groupe
Dead Hackers Society avec leur dmo Sea of
Colour qui est sortie cette anne la
Sommarhack. Cette dmo est titanesque de
part les effets en tous genres et de la musique
qui l'accompagne; cette dmo ne fonctionne
dailleurs que sur un disque dur, type
Ultra Satan. Je vous invite dcouvrir et
redcouvrir toutes les productions
depuis le dbut du ST sur le site de lallemand Stefan Benz http://nofragments.atari.org/.
Musique, le son chiptune
Le groupe NoExtra encore premier la VIP2015
Les Dmos
Les dmos sont des dmonstrations graphiques, techniques et musicales montrant la

capacit de la machine, et lanne 2003 aura
t un cap pour la Dmoscne car pendant la
dmo partie Error In Line Dresden, le groupe
sudois Dead Hackers Society sort la dmo
Moving Into Darkness sur Atari STE qui est
une bombe l'poque. Elle ne contient que des
effets raliss habituellement sur PC (effets
composs principalement avec des objets 3D
contenant des textures animes avec reflets et
luminosit en temps rel)
Habitu dpasser les capacits de la machine outrageusement, le groupe Dead Hackers
Society men par Anders Eriksson (Evil) sortira
en 2008 la dmo More Or Less Zero, dmonstration contenant beaucoup d'effets mais ayant
la particularit unique de fonctionner en mode
FULLSCREEN. Pour les non-puristes, le
mode overscan, cest--dire plus de border
haut-gauche-droit-bas l'cran.
Les dmomakers franais ne sont pas en reste
et en 2011, la dmo STreet Art du groupe
BlaBla va aussi dpasser toutes les attentes au
niveau des capacits visuelles de la machine
la SillyVenture. Aid par le graphiste de street
art Acet, Fabrice Catteau (Cyg) nous envoie une
dmonstration de haut niveau avec beaucoup
d'effets contenant une multitude de couleurs
diverses et varies dpassant les 4096 cou-
Chaque sceners de la scne dmo a

dbut un jour sur un Amiga ou sur un
Atari ST en utilisant un logiciel tel que
Protracker, un diteur de pattern qui joue des
samples avec des effets sur 4 voies. Et avec le
temps ils ont volu avec un style de musique
plus prt du composant du ST qui est le
YM2149 sound chip de Yamaha.
Lintrt du soundchip 3 voies du ST est qu'il
consomme moins de CPU pour un processeur
8 Mhz en utilisant des sons de synthses
comme samples. Pour mmoire, le clbre
Jochen Hippel (Mad Max) du groupe The
Exceptions a cr un format de musique dit
soundchip car il a beaucoup travaill sur des
musiques de jeux tels que The Great Giana
Sisters, Enchanted Land avec des caractristiques hors du commun pour un jeu sur ST ou
encore Wings of Death de l'diteur de jeux
allemand Thalion. Par la suite il a beaucoup
inspir des sceners tels que Frank Denis (Jedi)
qui invita son propre format de musique avec
son logiciel Megatizer ou Mathieu Stempell
(Dma Sc) du groupe Sector One. Un des pionniers de la chipmusic est Kalle Jonsson
(Dubmood). Cest un compositeur et producteur Sudois provenant de Demoscene Amiga
et Atari; il a sorti dernirement le vidoclip
Solitude o il intgre intelligemment du son
provenant de l'Atari comme il le fait chaque
reprsentation sur scne avec diffrents DJ
de la scne 8bits.
Et pour composer de la musique dite chipmusic via un Atari ST, il vous faut l'outil ultime
Suite page 50
35
036_049_192 17/12/15 23:00 Page36
Drupal8 est (enfin) l!
Le parcours fut long et difficile, avec des reports

et des retards. La phase bta a dur 12 mois, ce
qui est trs long, puis les versions RC (juste avant
la version finale) se sont succdes sur plusieurs
semaines. Mais cela ne signifie pas que D7 soit
morte ds maintenant. Son support actif est
assur au moins pour 3 ans.
Par contre, la version6 nest plus maintenue,
except pour la scurit. Dores et dj, les
quipes Drupal travaillent sur la version8.1.x dont
le processus de dveloppement dmarrera

rellement en janvier 2016 pour une disponibilit
au printemps (courant mars).
D8 propose beaucoup de nouveauts et
dvolutions: nouveaux champs, diteur de texte
revu, fonctions de responsive design (natif D8),
multilangue intgre et amliore, module de
configuration, utilisation des couches de
Symfony, etc.
La rdaction.
Les points majeurs retenir

Quatre ans aprs le dbut de son dveloppement, 3290 contributeurs et 1228 entreprises plus tard, la
version stable de Drupal 8 est sortie mondialement le 19 novembre dernier. Trs attendue par la
communaut, cette nouvelle version du CMS Open Source offre plus de 200 nouvelles fonctionnalits et
amliorations. Jetons donc un coup dil sur les nouveauts et changements majeurs apports par Drupal 8.
Chengbo et Morgane,
Feel & Clic
contact@feelandclic.com
Mobile-first (Responsive)
Premire volution notable, une approche mobile-first a t adopte pour cette 8me version :
les principaux thmes proposs par le CMS sont
intgralement responsive et le back office a t
repens (barre doutils mobile-friendly, tables responsives, bouton retour au site sur les pages
backend) afin de permettre ladministration de
son site depuis des supports mobiles. Le marquage des pages en HTML5, complt par des outils
de saisie mobile, permet doffrir aux internautes
en situation de mobilit une exprience utilisateur
fluide et ergonomique. Fig.1.
36
Architecture
a Serveur : Apache 2.0 et +, Nginx 1.1 et +

a Langage : PHP 5.5.9 et +
a Base de donnes : MySQL 5.5.3 et +,
MariaDB 5.5.20 et +, Percona Server 5.5.8 et +,
PostgreSQL 9.1.2 et +, SQLite 3.6.8 et +
Des nouveaux modules entrs

dans le coeur de Drupal 8
Il y a de nombreux modules qui ont t intgrs

dans cette nouvelle version de Drupal. Voici cidessous certains qui sont largement utiliss :
a Views, permet de crer, grer et afficher des
listes de contenu. Cette intgration apporte
de nouvelles fonctionnalits et permet entre
autres la personnalisation de divers lments
(slideshows, galeries, contenu des sidebars,
listes des crans dadministration...) sans
avoir recours du code, le clonage des vues,

la modification en srie des contenus...
a Multilingue, permet la traduction complte de
tous les lments du site.
a Layouts, permet de crer des affichages diffrents pour les contenus.
a Web Services, permet dexposer vos donnes
un systme externe en crant des Web services.
Les champs
De nouveaux champs ci-dessous souvent utiliss sont entrs dans le cur galement, ce qui
facilite la tche de la configuration du site : Date,
Email, Link, Reference, Telephone.
Multilangue
Ds linstallation de Drupal 8, il vous sera

demand de slectionner votre langue de travail
036_049_192 17/12/15 23:01 Page37
de la page ct visiteur, une gestion des

brouillons amliore et une scurit renforce.
Tous les formulaires des entits peuvent donc
dsormais tre personnaliss davantage, tant au
niveau de leur apparence que des donnes quils
contiennent. Cela permet surtout de configurer
laffichage du formulaire simplement avec un
drag&drop que ce soit le formulaire dinscription
dun utilisateur ou dajout de contenu.
Font-end / Intgration
Fig.1
parmi plus dune centaine fournies par la communaut sans avoir besoin de tlcharger un
fichier de langue placer dans un rpertoire prcis comme sur Drupal 7. De nombreux modules
contribs ont t intgrs dans le cur (par
exemple i18n, Administration Language...), qui
sont rorganiss en 4 modules. Cela permet une
traduction complte (l'interface, les configurations, les contenus, etc.) sans avoir besoin dinstaller de modules complmentaires.
Les blocs
Le systme de gestion des blocs est bien plus

volu dans cette nouvelle version. Ce ne sont
que des bonnes nouvelles pour les site-builders.
Parmi les nouveauts, il y en a 3 qui nous apparaissent particulirement importantes :
a La possibilit de positionner un mme bloc
dans plusieurs rgions. Cest ce que MultiBlock propose sur Drupal 7.
a Cette nouvelle version inclut la fonctionnalit
du module Bean. Cela veut dire que le bloc
devient un entit qui permet de crer des
types de blocs et personnaliser les champs
pour chaque type de bloc.
a Il est possible de configurer le niveau de menu
afficher pour un bloc de menus. Cela intgre
la fonctionnalit du module menu block.
Gestion de contenu
La cration et ldition de contenu a t globalement facilite grce lditeur de texte

WYSIWYG intgr CKeditor. On compte donc
parmi les nouvelles fonctionnalits : une interface
ergonomique rpartie en deux colonnes (lditeur
de contenu gauche, les informations dadministration droite), la possibilit de modifier le contenu directement (dition rapide) depuis les pages
sans ouvrir le back office, une fonction daperu
TWIG : le systme de template PHPTemplate a

t abandonn au profit de TWIG. Ce dernier a
plus d'avantages :
a TWIG est plus scuris car il nest plus possible dexcuter de code PHP dans ce nouveau type de template.
a La syntaxe de TWIG est simple et plus lisible
que lancien fichier de template.
a TWIG propose galement un systme de
debuggage. Par exemple, la fonction dump
est disponible pour imprimer une variable.
a Le fichier de template est rutilisable car il est
possible dinclure un autre template lintrieur du fichier.
a TWIG est bien document.
a jQuery2 et Backbone.js : Drupal 6 avait adopt jQuery, Drupal 8 continue en intgrant la
dernire version jQuery2 et y ajoute Backbone.js (et de nombreuses autres librairies JS).
Les dveloppeurs front-end vont pouvoir nativement crer des interfaces riches utilisant le
Javascript.
Programmation
Oriente Objet
Dans cette nouvelle version, Drupal quitte son le

et soriente vers la POO (Programmation Oriente Objet) en intgrant dans son coeur des composants du framework franais Symfony comme
par exemple Routing, HttpFoundation, HttpKernel, DependencyInjection... On utilise donc
maintenant des classes, des interfaces, l'hritage, l'injection de dpendances, l'autoloading, les
annotations PHP, etc. Le but poursuivi ici est de
rendre Drupal plus flexible et polyvalent ainsi
que dattirer des dveloppeurs venus dautres
horizons qui connaissent dj les grands principes et pourront donc s'adapter rapidement
avec cette standardisation. Pour un dveloppeur
Symfony, Drupal 8 sera donc plus rapide
prendre en main. En parallle, les intgrations
des composants extrieurs seront plus faciles,
cela permettra de gagner du temps pour se
concentrer sur les dveloppements spcifiques.
Cache et performance
Entity cache module est intgr dans le coeur.

Le cache et l'agrgation des CSS / Javascript
sont dsormais activs par dfaut ds l'installation du profil standard de Drupal. Nous verrons si
cela amliorera la situation actuelle car de nombreux sites Drupal 7 sont en production sans le
cache activ. En parallle, le cache pour les utilisateurs authentifis est galement disponible (et
activ ds l'installation), cela permet damliorer
les performances pour tous les utilisateurs. Du
ct front-end, la gestion de Javascript est bien
amliore, le Javascript est dsormais charg
dans le footer, et jQuery est charg uniquement
sur les pages qui en ont besoin. Tout cela permet
de rendre laffichage des pages plus rapide.
Gestion des configurations
Le dploiement de nouvelles configurations

dune version de dveloppement vers une version de pr-production ou de production tait
toujours compliqu sur Drupal 7 mme avec des
solutions comme le module Features ou les fonctions hook_update_N()...
Le systme de configuration de Drupal 8 laisse le
choix lutilisateur quant lemplacement et la
manire de stocker les fichiers de configuration.
Vous pouvez ainsi stocker vos paramtrages au
sein mme de votre base de donnes ou les
exporter et les importer sous la forme de fichiers
YAML. Vous avez galement la possibilit dimporter/exporter en masse des lments individuels (par exemple, le nom du site, les blocs, les
vues, les rles utilisateurs, les types de contenus, les entits, etc). Dun point de vue technique, cela facilite grandement les mises en
production et les dploiements.
Drupal 8 introduit le concept de UUIDs (identifiants uniques universels). Chaque contenu a un
identifiant unique (et mme dun site lautre),
par exemple : 744bdca2-b748-448a-af00de0ad132e931. Celui-ci est indpendant de lID
de l'auteur. Il permet de vrifier si un contenu
existe dj ou pas sur le site migrer mme si il
na pas le mme node ID (nid).
Conclusion
Si ces nouvelles fonctionnalits apporteront

sans aucun doute plus de confort aux clients et
utilisateurs finaux, la majeure partie des volutions se situe sous langle technique. Bien plus
que de simples volutions, certaines de ces
fonctionnalits constituent une vritable rvolution qui permettront sans aucun doute dtendre
le champ des possibles du CMS et dattirer de
nouvelles comptences au sein de la communaut. Avec des rfrences prestigieuses son
actif telles que La Maison Blanche, gouvernement.fr, Voyages-SNCF, BNP Paribas, ou encore
PRR, Drupal nest pas prt darrter de sitt sa
croissance.
37
036_049_192 17/12/15 23:01 Page38
La rvolution du cache
Ce n'est un secret pour personne, l'un des principaux inconvnients de la programmation objet est
sa consommation de ressources serveur. Ainsi, lorsque Drupal a fait le choix de passer d'un modle
tout procdural au modle objet, il tait vident qu'il serait ncessaire de trouver une faon
d'optimiser un cur dj souvent dcri comme tant trop lourd. Comme il n'tait pas concevable
de transiger sur la souplesse de l'outil en rduisant son spectre fonctionnel, la communaut, en
parallle du travail d'optimisation normal du cycle de dveloppement, s'est intresse aux
problmatiques de cache. Le systme qui est dsormais nativement intgr au cur de Drupal 8
pourrait bien tre rpliqu dans tous les autres CMS tant il est malin et efficace.
Edouard Cunibil (DuaelFr)
Happyculture.coop
Constat
Une fois le code optimis au mieux, il ne reste plus beaucoup de solutions

pour rduire l'empreinte d'un logiciel si ce n'est lui viter de refaire plusieurs fois les mmes calculs en plaant leur rsultat en mmoire. La
mthode est connue depuis toujours; la difficult dans le cas d'un outil
comme Drupal est de proposer des mthodes pour viter aux dveloppeurs d'avoir constamment rinventer la roue.
De plus, lorsque l'on envisage tous les diffrents types de sites pouvant
tre conus avec Drupal, on constate que le systme doit rpondre des
problmatiques trs varies.
Drupal 7 dispose dj d'un module permettant de mettre en cache les
pages rendues pour les utilisateurs anonymes. La plupart des sites ditoriaux se contentent trs bien de ce seul systme mais tous les sites ncessitant une interaction pousse des utilisateurs ne peuvent pas en profiter.
Pour ces sites, Drupal 7 contient galement dans son API un systme de
cache de bas niveau permettant de stocker des donnes en mmoire vive,
dans la base, ou dans un cache backend comme memcache ou Redis.
L'utilisation de ces systmes tant la discrtion du dveloppeur, il n'est
pas rare de trouver des sites n'en exploitant pas du tout les capacits.
Dmarche
En partant du constat que Drupal 7 ne permettait pas toutes les typologies de sites de disposer d'un systme de cache performant, la communaut s'est demande comment il serait possible de rendre les
technologies utilises par les plus gros projets accessibles tous.
En effet, dans le cadre de sites trs dynamiques il n'est pas ais d'aller
chercher une couche supplmentaire de cache. Il reste deux problmatiques majeures rsoudre qui sont la mise en cache des parties de contenu trs spcifique l'utilisateur (panier de commandes, encart mon
compte, etc.) ou celles variant trs souvent dans le temps (derniers commentaires, flux d'actualits entrant, etc.).
Dans la plupart des systmes, dont Drupal 7, une page tant compose de
tous ces lments ne peut pas tre mise en cache sous peine d'tre soit
invalide constamment, soit de servir des informations l'attention d'un
utilisateur ou un autre.
Pour rpondre ces problmatiques, des solutions existent dj mais sont
difficiles mettre en uvre ce qui explique qu'on ne les retrouve que sur
des projets de grande envergure. Qu'il s'agisse d'utiliser des ESI ou un
chargement des donnes via AjaX, cela demande un travail supplmentaire non ngligeable.
38
Solution
Et si Drupal 8 intgrait un systme de cache hautement inspir des ESI

pour construire ses pages? Et si ce systme permettait facilement de passer d'un mode de rendu par le serveur un mode de rendu par le client la
faon de BigPipe?
Ce sont les deux questions que se sont poses la communaut et qui ont
aujourd'hui men Drupal 8 ce systme novateur, le module Dynamic
Page Cache, prsent dans le cur et activ par dfaut. Son principe est
assez simple: les pages de Drupal tant construites sous forme de blocs
de HTML imbriqus, chacun de ces lments peuvent dsormais disposer
de mtadonnes permettant de dcrire comment ils doivent tre mis en
cache et comment ils doivent tre invalids. Ces mtadonnes se propagent des lments enfants vers les parents, jusqu' dfinir la page ellemme. Elles sont de quatre types pour couvrir tous les besoins:
Les clefs de cache (cache keys)
Ce sont un ensemble de valeurs arbitraires permettant d'identifier l'lment

dans le cache. Elles sont concatnes pour crer l'identifiant de cache qui
pourra tre utilis, de faon complte ou partielle (voir les contextes plus
bas), pour l'invalidation.
// Exemple de clefs de cache pour une liste d'actualits en page d'accueil.
$build['#cache']['keys'] = ['news_list', 'home'];
L'ge maximal (max-age)
La plus simple et la moins utilise des mtadonnes permet de dfinir

partir de combien de temps le cache de l'lment sera invalid de toute
faon. Gnralement, ce type d'information est utilis lorsque l'on veut
faire une remonte d'lments de faon alatoire dans une page, sans que
soient affichs toujours les mmes mais sans consommer trop de ressources serveur. Dans la grande majorit des cas, aucun ge maximal ne
sera indiqu afin de conserver le cache aussi longtemps que ncessaire.
// Cache dsactiv.
$build['#cache']['max-age'] = 0;
// Cache d'une dure maximale de 5 minutes.
$build['#cache']['max-age'] = 180;
// Cache permanent. Jusqu' invalidation manuelle ou via un autre critre.
// Valeur par dfaut.
$build['#cache']['max-age'] = Cache::PERMANENT;
Les tags de cache (cache tags)
Ils sont utiliss pour dfinir les dpendances entre le cache et des objets
arbitraires. Toutes les entits de contenu et de configuration sont des
dpendances valides mais il est galement possible de crer ses propres
036_049_192 17/12/15 23:01 Page39
dpendances en cas de besoin. Si jamais lun de ces objets est modifi,

tous les caches qui lui sont rattachs sont immdiatement invalids. Certains tags gnriques permettent d'invalider automatiquement l'lment
lors d'un vnement particulier comme la cration d'un nouveau contenu.
Par exemple, si la page d'accueil d'un site contient la liste des trois dernires actualits, cette dernire sera marque par le tag spcifique de chacune des trois actualits affiches (node:ID) et par le tag gnrique de
cration d'un nouveau nud (node_list). De cette manire, si l'une des trois
actualits est modifie ou si une nouvelle actualit est cre, la page (par
propagation) et la liste seront invalides et seront donc reconstruites au
prochain affichage.
// Tag invalidant la liste lors de la cration ou la suppression
// d'un nud quelconque.
$build['#cache']['tags'] = ['node_list'];
foreach ($nodes as $node) {
// Tag invalidant la liste lors de la modification ou la suppression
// du nud identifi.
$build['#cache']['tags'][] = 'node:' . $node->id();
}
Les contextes de cache (cache contexts)
Ces derniers permettent de dfinir les diverses variantes du contenu. Ainsi,

chaque variante est mise en cache sparment et servie aux utilisateurs
qui correspondent aux critres. Il existe un certain nombre de contextes
par dfaut (langue, permissions, headers HTTP, cookies, route, etc.) et il
est possible d'en ajouter au besoin en implmentant un service portant le
tag cache.context.
Les contextes de cache sont traduits au moment de la gnration du
contenu et ajouts la fin des clefs de cache afin de gnrer lidentifiant de
la variation. Il est donc possible d'invalider toutes les variations d'un lment en se basant uniquement sur ses clefs de cache, ou d'invalider une
variation prcise en utilisant l'identifiant complet.
Par exemple, la liste des trois dernires actualits de notre site pourrait
dpendre de la langue et des permissions. Cela permettrait un utilisateur
de voir les trois dernires actualits correspondant ses droits et la
langue dans laquelle il parcourt le site, sans avoir considrer que cette
liste n'est jamais cache.
// Cre des variantes en fonction des permissions des utilisateurs
// et de la langue de la page.
$build['#cache']['contexts'] = ['user.permissions', 'languages'];
ESI, BigPipe et CDN
Profitant de la puissance et la souplesse de la programmation oriente

objet, ce systme de cache peut assez facilement tre dtourn pour
transformer chaque lment de la page par un tag ESI qui sera exploit par
un reverse proxy ou alors, comme dit prcdemment, en bloc charg
dynamiquement en Javascript la manire de BigPipe. Cette dernire
mthode s'appuie actuellement sur un module contribu qui pourrait bien
intgrer directement le cur dans la version 8.1 ou 8.2 de Drupal, selon
l'adhsion rencontre par la communaut.
Pour couronner le tout, Drupal 8 exploite les mtadonnes de cache propages jusqu'au niveau global de la page pour dfinir les enttes HTTP renvoys et ainsi permettre d'optimiser le cache du navigateur, du reverse
proxy ou encore d'un CDN sans configuration supplmentaire ou presque!
En conclusion, fonctionnalits quivalentes, les sites construits suivant
ce principe promettent un temps de rendu bien infrieur ce que l'on parvenait faire auparavant, pour peu que les caches aient dj t gnrs...
Drupal 8 multilingue
4 modules du cur de Drupal remplacent dsormais une vingtaine
de modules de la communaut
Si vous avez dj ralis un projet multilingue avec Drupal 7, vous savez que cela requiert l'installation
d'une multitude de modules communautaires. Drupal 8 simplifie grandement la tche en incluant au
cur du systme tout ce qui est requis pour crer des sites en plusieurs langues, ou mme simplement
des sites dans une langue autre que l'anglais. Pour ce faire, la nouvelle version est livre avec quatre
modules rpondant l'ensemble des besoins que l'on rencontre dans un projet multilingue.
Maxime Turcotte
Consultant en logiciel libre
Savoir-faire Linux
La langue au premier plan
Le premier module, language, est la base du

support multilingue de Drupal 8. Bien que grandement amliores, ses fonctionnalits faisaient
partie du module locale de Drupal 7. Lorsqu'on
installe Drupal 8, on remarque l'importance donne la langue ds la premire question. Avant
mme de dbuter, on nous demande en effet de
choisir la langue dans laquelle on dsire pour-
suivre. En plus de la dtection base sur la

langue de votre navigateur et des 94 choix disponibles, les fichiers de traductions sont automatiquement tlchargs et le reste du
processus se fait alors dans la langue slectionne. Auparavant, il fallait suivre une procdure
pour rcuprer manuellement les traductions et
les placer au bon endroit sur le disque.
Sous Drupal 8, tous les lments sont dsormais
des blocs qui peuvent tre placs dans plusieurs
rgions d'une mme page. Beaucoup de ces
blocs et de ces pages sont aussi maintenant des
vues. Ces deux nouveauts bien que n'tant
pas en soi des fonctions multilingues offrent

une grande libert sur le choix de la langue d'affichage du contenu. En effet, les blocs possdent
prsent un paramtre de visibilit bas sur la
langue. Les vues ont aussi de nombreuses
options de configurations additionnelles par rapport la langue du contenu rcuprer et dans
laquelle celui-ci sera affich.
Dans un projet multilingue, un contenu peut ne
pas ncessiter d'tre associ une langue une
image par exemple mais aussi ne pas avoir
encore de langue associe. Sous Drupal 7, nous
n'avions comme seul choix Indpendant de la
39
036_049_192 17/12/15 23:01 Page40
langue , ce qui ne s'applique pas toujours

notre situation. Drupal 8 fournit maintenant deux
options de langue gnriques Non spcifi
et Non applicable et permet mme d'en
ajouter si celles-ci ne sont pas suffisantes.
Chaque usager possde aussi davantage de
libert sur ses prfrences de langue. Il peut
slectionner la langue de son profil, celle dans
laquelle il prfre consulter le contenu et, s'il a
accs aux pages d'administration, la langue
dans laquelle celles-ci devraient lui tre prsentes. Ces nouvelles options permettent, par
exemple, de rendre dynamique la langue d'affichage des contenus selon les prfrences de
chaque utilisateur.
Une exprience de traduction

amliore
Tout comme son prdcesseur, le module locale

de Drupal 8, sert la traduction de l'interface. Il
incorpore maintenant les fonctionnalits de mise
jour du module communautaire i10n_update
de Drupal 7. Il rcupre donc les fichiers de traductions du cur et des modules de Drupal et
met jour les traductions. Puisqu'il est souvent
ncessaire, dans un projet multilingue, de modifier des traductions venant de la communaut, il
est donc possible de les marquer comme tant
personnalises afin d'viter qu'elles ne soient
crases par la prochaine mise jour. Il est aussi
possible d'exporter nos traductions personnalises pour les utiliser dans d'autres projets.
Sous Drupal 7, la fonction de traduction t() ne
fonctionne que si la base de donnes est active.
Pour les autres occasions, la fonction st() doit
tre utilise. Ainsi, si nous souhaitons signaler du
texte traduire un moment o la base de donnes peut ne pas tre disponible, nous devons
nous rabattre sur une troisime fonction, get_t(),
qui se chargera de retourner la bonne fonction
utiliser. Sous Drupal 8, st() et get_t() ont t retires et la fonction t() se charge d'valuer son
contexte. Si la base de donnes n'est pas disponible, elle ira chercher ses traductions directement dans les fichiers .po sur le disque.
L'interface a aussi t grandement retravaille.
Prcdemment, la page de traduction n'offrait
pas la possibilit de traduire les textes directement. Pour chaque chane de caractres, on
nous prsentait l'tat des traductions dans
toutes les langues disponibles et un seul lien
pour les modifier. Ce lien menait au formulaire de
traduction qui comportait un champ pour
chaque langue bien qu'il soit peu probable
qu'une seule personne se charge de traduire
toutes les langues!
Ds la premire page, sous Drupal 8, on peut filtrer les traductions par langue et avoir cte
cte la source et un champ pour entrer ou modi-
40
fier la traduction directement. Il est donc possible d'entrer plusieurs chanes de traductions
avant d'enregistrer. De plus, l'interface de Drupal
8 permet dsormais de traduire les textes pluriels, tel que: 1 commentaire / @count commentaires , ce que l'interface de Drupal 7 ne
permettait aucunement.
Du contenu multilingue sans

discrimination
Bien que portant le mme nom que son homonyme en Drupal 7, le module content_translation
est fondamentalement diffrent. Drupal 8 rend
traduisibles toutes les entits de contenus, que
ce soient les nuds, les blocs, les termes de
taxonomie, etc. Dans sa version prcdente, ce
module ne supportait que la traduction des
nuds. Si l'on souhaitait traduire les termes de
taxonomie, les blocs ou les menus, il fallait utiliser des modules de la communaut.
Drupal 8 amliore grandement la traduction car
tous les contenus sont maintenant des entits
traduisibles l'aide d'un systme unique et configurables par type d'entit, par bundle, par
champs et parfois mme davantage. Pour un
champ d'image, par exemple, on peut rendre traduisible le titre et le texte alternatif, tout en
conservant la mme image pour toutes les traductions.
Toutes les entits de contenu (excepts les lments de menu) peuvent tre attaches des
champs, et tous ces champs du titre aux mtadonnes sont traduisibles. On peut ainsi choisir (ou non) d'avoir des mtadonnes diffrentes
selon les traductions. Le nouveau systme nous
donne aussi le choix, concernant les termes de
taxonomie, d'avoir soit des ensembles diffrents
par langue (en traduisant le champ attach au
contenu) soit un seul ensemble pour toutes les
traductions (en traduisant plutt les termes euxmmes). Il est donc maintenant possible de traduire tout ce que l'on veut, selon le degr
souhait, et rien de plus.
Une autre diffrence majeure entre Drupal 7 et 8,
c'est que cette dernire version ne duplique pas
les contenus pour chacune des traductions,
mais en traduit seulement les parties ncessaires. Par consquent, toutes les traductions
possdent le mme identifiant que leur source,
et la suppression de la source entrane la suppression de toutes ses traductions (une confirmation est bien sr demande).
Configuration dans la langue

de notre choix
La configuration de Drupal 8 a t totalement

repense et utilise maintenant un systme commun pour toutes ses facettes, que ce soient le
nom du site, les rles, les libells des champs ou
les textes dans les vues. Des fichiers en format

YAML sont utiliss afin d'inclure la configuration
dans le code, mais aussi pour son dploiement
entre les diffrents environnements. Elle est
ensuite transfre dans la base de donnes. De
plus, tout comme pour le contenu, Drupal ne
duplique pas les fichiers de configuration pour
chaque traduction; il cre plutt des fichiers
avec seulement les textes supplants.
Si Drupal 8 a t install dans une langue autre
que l'anglais, toute la configuration du site a t
importe dans cette langue (grce au module
locale). Chaque traduction est ensuite effectue
depuis cette langue. Il n'est donc plus ncessaire de crer les vues en anglais et de les traduire
par la suite. On peut dsormais les crer dans la
langue de notre choix et les traduire en anglais
ou dans toute autre langue si ncessaire. On
peut ainsi, dans un site multilingue, crer sa
configuration dans n'importe quelle langue active et le systme sera capable de la traduire
dans toutes les autres langues disponibles.
Toutes ces nouveauts font partie du systme
d'entit de configuration de Drupal 8. Ce que le
module config_translation fournit, c'est une interface utilisateur pour effectuer les traductions.
Tous ces textes de configuration sont aussi
exposs dans l'interface de traduction du module locale, mais config_translation facilite l'exprience de traduction. Par exemple, il ajoute des
onglets de traduction aux cts des onglets
d'dition des vues, des blocs, des menus, etc. Il
est en effet plus intuitif de traduire ces groupes
de textes sur la mme page qu'en effectuant une
recherche pour chaque chane de caractres
depuis l'interface de locale. Le module fournit
aussi une page qui liste toutes les configurations
traduisibles suivies d'un lien vers leur page de
traduction.
La migration
Toutes ces nouvelles fonctionnalits sont trs

utiles pour un nouveau projet, mais qu'en est-il
pour un projet en Drupal 6 ou 7 que l'on souhaiterait migrer ? L encore, c'est une autre nouveaut. Le module communautaire migrate, bien
qu'tant encore au stade exprimental, est
dsormais incorpor dans le cur de Drupal 8 et
propose des chemins de migration automatique.
A ce stade, bien que la migration depuis Drupal 6
soit en grande partie fonctionnelle, il n'existe
aucun support concernant le contenu multilingue. Il est vident que beaucoup d'efforts sont
toutefois dploys pour augmenter la couverture
de ces migrations puisque cette version ne sera
bientt plus supporte... Heureusement, comme
sous Drupal 7, il est possible d'utiliser l'API de
migrate pour crer soi-mme ses migrations
multilingues.
u
036_049_192 17/12/15 23:01 Page41
Des amliorations en profondeur de la version core

Une des rvolutions de Drupal 8 provient de son architecture entirement repense et mise au got
du jour. En effet, avant Drupal 8, le code entier du core Drupal tait crit par la communaut Drupal.
Le core Drupal 8 souvre la communaut Open Source (concept du proudly found elsewhere) en
devenant un best-of-breed de technologies open-source intgrant les meilleures librairies disponibles,
et permettant aux dveloppeurs Drupal de se focaliser sur les fonctionnalits CMS de Drupal et non les
couches bas niveau (routing, connection la base de donnes, ). Drupal 8 a effectu des volutions
majeures de son API tout en intgrant ce qui se fait de mieux dans lcosystme PHP.
Angela Byron,
Directrice du developpement communautaire chez Acquia
Angela est lauteure principale du premier livre sur Drupal
dOreilly intitule Using Drupal (Utiliser Drupal). Le
pseudo dAngela sur Drupal.org est webchick .
Proudly Found Elsewhere

(Firement trouv ailleurs)
Le concept du Proudly found elsewhere tmoigne dun changement

dans la faon de penser des dveloppeurs Drupal. En effet, trouver les
meilleurs outils pour accomplir une certaine tche et les incorporer au logiciel, au lieu de crer une application particulire appartenant en propre
Drupal, a t le leitmotiv des dveloppeurs.
Vous pouvez constater ce changement de philosophie dans de nombreux
composants de Drupal 8. Parmi les bibliothques externes que nous avons
incluses se trouvent PHPUnit pour le test unitaire, Guzzle afin deffectuer
des requtes HTTP (vers des Web services), plusieurs composants de
Symfony (le tutoriel Create your own framework on top of the Symfony2
Components est excellent pour en apprendre plus sur ces composants)
et Composer comme gestionnaire de dpendances externes et de chargement automatique de classes, entre autres.
Mais ce changement de philosophie se constate aussi dans la base du
code lui-mme. Nous avons effectu dimportantes modifications de larchitecture dans Drupal 8 afin de nous adapter la faon dont on organise
le code dans lcosystme PHP : une programmation dcouple, oriente
objet (OO) et utilisant les lments du langage PHP dans ses versions les
plus rcentes, telles que les espaces de nom et les traits. AIN
Prenons quelques exemples dextraits de codes pour illustrer dans les faits
larchitecture Proudly Found Elsewhere de Drupal 8.
Drupal 7 : example.info
Tous les modules dans Drupal ncessitent un fichier .info pour pouvoir tre
enregistrs dans le systme. Lexemple ci-dessus est typique dun module
de Drupal 7. Le format du fichier ressemble un fichier INI facilement
ditable, mais il comprend galement des Drupalismes tels que la syntaxe en array[] qui empche lutilisation de fonctions standard PHP de lecture/criture des fichiers INI. La cl files[], qui dclenche le chargement
automatique des classes personnalises pour ajouter du code dans la
base de registre, est particulirement drupalienne , et les dveloppeurs
de modules qui codent en orient objet doivent ajouter une ligne files[] pour
chaque fichier qui dfinit une classe, ce qui peut devenir stupide.
Drupal 8 : example.info.yml
Dans la droite ligne du concept Proudly Found Elsewhere , les fichiers

infos dans Drupal 8 sont dsormais de simples fichiers YAML, les mmes
qui sont utiliss par dautres langages et dans dautres framework. La syntaxe est trs similaire (principalement : la place de =, et des tableaux formats diffremment), et il est toujours aussi facile de lire et dcrire dans
ces fichiers. La cl gnante files[] a t supprime et remplace par la
norme PSR-4 pour lauto-chargement des classes par le biais de Composer. En dautres termes, cest en suivant une convention spcifique sur le
nommage/dossier de la classe (modules/example/src/ Example
Class.php), que Drupal peut charger automatiquement le code orient
objet sans ncessiter un enregistrement manuel.
Drupal 7: hook_menu()
Il sagit dun module assez basique dans Drupal 7 qui dfinit une URL sur
/hello qui, lorsquon y accde, fait des vrifications pour sassurer que lutilisateur dispose des permissions d accs au contenu avant dappeler la
fonction _example.page(), qui affiche Hello world. lcran en tant que
page entirement charte. Le hook_menu() est un exemple de ce qui est
connu de faon pjorative sous le nom de ArrayPI, qui est un modle darchitecture courant dans Drupal 7 et les versions antrieures.
Le problme pos par les ArrayPI est quils sont difficiles taper (par
exemple, navez-vous jamais oubli le return $items, puis pass 30 minutes
chercher comment rsoudre le problme?), ils ne disposent pas dautocompltion dans lEDI (environnement de dveloppement intgr) pour les
proprits disponibles, enfin la documentation doit tre mise jour manuellement chaque fois quune cl est modifie ou ajoute.
La documentation sur hook_menu() montre que le dfaut vient galement du
fait que trop de choses essaient dtre faites la fois.
Ce programme est utilis pour enregistrer les associations/accs entre les
chemins et les pages, mais galement pour afficher les liens dans linterface
de plusieurs faons, changer de thme, et bien plus.
Drupal 8: Routes + contrleurs example.routing.yml
41
036_049_192 17/12/15 23:01 Page42
src/Controller/Hello.php
existent, ce qui nest pas garanti) pour dcouvrir les fonctions hooks
nommes par magie dont vous avez besoin pour dfinir lapplication de
tel ou tel comportement. Certains sont ncessaires, dautres non. Parviendrez-vous deviner lequel est lequel ?
Drupal 8 : Les blocs (et bien dautres lments)

en tant que plugins
Dans Drupal 8, ces API mystres sont en majorit transfres vers le nouveau systme de plugin, qui ressemble ce qui suit :
src/Plugin/Block/Example.php
Dans le nouveau systme de routage de Drupal 8, la cration des routes

chemin/accs est maintenant assure par un fichier YAML qui utilise la
mme syntaxe que le systme de routage Symfony.
La logique de fonction de callback est dsormais assure par une classe
Controller (comme dans le modle standard modle-vue-contrleur )
dans un fichier nomm de faon spcifique, conformment la norme
PSR-4. Dans le module exemple ci-dessus, le controller est dclar
dans son propre espace de nom pour permettre au module de nommer ses
classes comme il le souhaite, sans se soucier dventuels conflits avec
dautres modules.
Finalement, la classe hrite de la logique de la classe ControllerBase donnant ainsi au contrleur Hello laccs toutes les mthodes et capacits
du ControllerBase, telles que $this->t() (la faon oriente objet de nommer
la fonction t()). tant donn que ControllerBase est une classe conforme
la norme PHP, toutes ses mthodes et proprits seront compltes automatiquement dans les EDI ; vous naurez donc pas deviner ce quil peut
ou ne peut pas faire pour vous.
Drupal 7: hook_block_X()
block.module
Cet exemple ressemble beaucoup celui du contrleur ; un plugin est une

classe qui, dans le cas prsent, stend partir dune classe de base
(BlockBase) qui prend soin dimplmenter certains mcanismes pour
vous. LAPI des blocks elle-mme est dclare dans linterface BlockPluginInterface et implment par la classe BlockBase.
Vous remarquerez quen rgle gnrale, les interfaces exposent et renseignent plusieurs API de faon ce que lEDI soit dcouverte et agrable
utiliser. Le meilleur moyen de dcouvrir les nouvelles API de Drupal 8
consiste naviguer parmi les interfaces proposes.
Les commentaires au-dessus des classes sont appels annotations .
premire vue, lutilisation des commentaires PHP pour spcifier des mtadonnes qui affectent la logique applicative semble trange, mais cette
technique est dsormais largement utilise par de nombreuses bibliothques modernes en PHP et accepte par la communaut. Cela offre
lavantage de conserver les mtadonnes de classe dans le mme fichier
et juste ct de la dfinition de la classe.
Drupal 7 : Hooks
Voici un exemple typique de la faon dont on dfinit un nouveau composant dans Drupal (blocs, effets dimage formats de texte, etc.) : une sorte
de hook _info dclaratif, associ un ou plusieurs autres hooks pour
excuter dautres actions (voir, appliquer, configurer et bien plus). En plus
de ces lments, qui sont pour la plupart des ArrayPI, on constate quil y a
des API bien plus difficiles prendre en main, car lAPI gnrale elle-mme
ne peut absolument pas tre dcouverte, moins dinspecter rigoureusement tous les fichiers .api.php des diffrents modules supposer quils
42
Dans Drupal 7 et ses versions antrieures, le mcanisme dextension utilis est le concept de hooks . En tant que crateur dune API, vous pouvez dclarer un hook utilisant des fonctions telles que
module_invoke_all(), module_implements(), drupal_alter(), etc.
Si vous voulez quun module rponde cet vnement, il vous faut crer
une fonction nomme modulename_hookname() et dclarer ses rsultats
dune faon reconnaissable par lutilisation dune fonction hook . Par
exemple :
036_049_192 17/12/15 23:01 Page43
Bien quil sagisse dun mcanisme astucieux, ce choix darchitecture est

surtout d lanciennet de Drupal (Drupal a dmarr en 2001, lpoque
o le PHP3 battait son plein et o le code orient objet et autres ntaient
pas encore plbiscits), certaines choses ne sont pas si videntes :
a Ce mcanisme dextension qui nomme une fonction dune faon particulire tient vraiment du drupalisme, et les dveloppeurs qui sinitient
Drupal peinent le comprendre au dbut
a Au moins quatre fonctions diffrentes peuvent lancer un hook :
module_invoke(), module_invoke_all(), module_implements(),
drupal_alter() et bien dautres encore. Cela rend les extensions disponibles trs difficiles trouver dans Drupal.
a Il ny a pas de cohrence entre ce quattendent les hooks . Certains
hooks sont de type info et requirent un tableau (parfois un tableau de
tableau de tableau de tableau), dautres sont des hooks de type info
qui ne rpondent quen cas dvnement particulier, par exemple, le lancement dune tche cron ou la sauvegarde dun nud. Vous devez lire
la documentation relative chaque hook pour comprendre quelles
entres et quelles sorties ils attendent.
2. Dans la classe rfrence, il excute le EventSubscriberInterface et

dclare une mthode getSubscribedEvents() qui numre les vnements pour lesquels il devrait tre alert. Il fournit galement pour
chaque vnement une ou plusieurs fonctions de callback qui doivent
tre lances lorsque lvnement dbute :
3. Il dfinit la mthode de callback qui contient le code excuter lorsque

la configuration est sauvegarde :
Drupal 8 : vnements ( Events )
Bien que les hooks dominent encore largement dans Drupal 8 dans le
cas de comportements commands par vnements (les hooks de type
info ont t en grande partie transforms en annotations YAML ou en plugins), les portions de Drupal 8 compatibles Symfony (par exemple bootstrap/exit, systme de routage) ont pour la plupart t transfres dans le
systme Event Dispatcher de Symfony.
Dans ce systme, les vnements sont distribus lors de lexcution
lorsque certaines logiques sont en cours, et les modules peuvent abonner leurs classes aux vnements auxquels ils veulent quelles
ragissent.
Pour le prouver, regardons de plus prs la configuration API de Drupal 8,
qui est stocke dans Core/lib/Drupal/Core/Config/Config.php. Elle dfinit
de nombreuses mthodes CRUD telles que save(), delete(), etc. Chaque
mthode dclenche un vnement lorsque sa tche est accomplie, ce qui
permet aux autres modules de ragir. Voici par exemple Config::save() :
Lorsque le processus sarrte, il y a au moins un module qui a besoin de

ragir lorsque la configuration est sauvegarde : le module du core Language. Car si le paramtre de configuration qui vient dtre modifi tait la
langue du site par dfaut, les fichiers PHP compils doivent tre rechargs
pour que la modification puisse tre effective.
Pour ce faire, le module Language accomplit trois tches :
1. Il enregistre une classe ligible un vnement dans son fichier language.services.yml (il sagit dun fichier de configuration du Service Container de Symfony pour lenregistrement des codes rutilisables)
Pour couronner le tout, nous avons intgr un utilitaire de registre plus

explicite pour quun seul module puisse souscrire plusieurs classes des
vnements individuels. Cela nous permet dviter les situations du pass
o il y avait des dclarations conditionnelles (de type switch) dans les
hooks ou encore de nombreux blocs de code sans rapport et se gnant
les uns les autres. Au lieu de cela, on a la possibilit de sparer la logique
en plusieurs classes spares et distinctes. Cela signifie galement que
notre logique dvnement est charge au moment o elle doit tre excute, et quelle ne monopolise pas constamment de la mmoire PHP.
Il est galement assez simple de dboguer les vnements et de tracer
leur excution. Au lieu davoir toute une flope de fonctions PHP, de procdures qui peuvent ou non avoir t utilises pour invoquer votre hook ,
cest le mme Event Dispatcher qui est utilis dans tout le systme. De
plus, trouver les excutions est aussi simple que dexcuter une commande grep pour trouver la bonne constante de classe, par exemple : ConfigEvents::SAVE.
Le systme dvnements complte logiquement la transition vers une
mthode oriente objet. Les plugins prennent en charge les hooks de
type info ainsi que les hooks invoqus suite un autre hook info. La
plupart de nos anciens systmes sont remplacs par des systmes de
registre explicites en YAML.
Le systme dvnements remplace les hooks de type vnement et
intgre une mthodologie de souscription performante capable dtendre
des fonctionnalits du core.
...et beaucoup, beaucoup plus !
Vous pourrez trouver une bonne introduction aux modifications de lAPI de

Drupal 8 sur le site api.drupal.org qui contient galement une liste des
sujets groups qui pourront vous guider dans Drupal 8.
Vous pouvez aussi vous rendre sur https://drupal.org/list-changes pour accder la liste complte des modifications de lAPI entre Drupal 7 et Drupal 8.
Toutes les modifications enregistres de lAPI comprennent des exemples
de codes avant/aprs pour faciliter votre migration, ainsi que des conseils
qui vous expliquent les modifications et leurs raisons.
u
43
036_049_192 17/12/15 23:01 Page44
Convertir son site Drupal en une App Drupal

Un site Drupal ne se limite pas un site de gestion de contenus. Il peut tre utilis comme une
application Web pour le rendre disponible sur d'autres matriels ou le porter sur des plateformes
ouvertes comme Firefox OS de la fondation Mozilla.
Fig.1
Christophe Villeneuve
Consultant IT pour Neuros, Mozilla Reps, auteur du livre "Drupal avanc"
aux ditions Eyrolles et auteur aux Editions ENI, Rdacteur pour WebRIVER,
membre des Teams DrupalFR, AFUP, LeMug.fr (MySQL/MariaDB User
Group FR), Drupagora...
Une source pour des multi-devices
Un site Drupal s'utilise travers un navigateur. Il est accessible sur n'importe

quel terminal ou matriel compatible Web. Ainsi, vous trouverez dans cette
catgorie les ordinateurs de bureau ou ordinateurs portables, les tablettes,
les smartphones Et mme les objets connects. Cependant, ds le dbut
de votre projet, il est intressant de penser que celui-ci est souvent spcifique, unique, et par la mme occasion de le proposer dans vos applications
mobiles, tout en gardant le contenu disponible travers votre navigateur. La
solution prsente a lavantage de profiter des spcificits du mobile
comme la golocalisation, ou doptions mobiles. Drupal permet de communiquer avec d'autres sites Internet pour en rcuprer du contenu. Ainsi une
interaction avec votre site Internet est possible en utilisant les Web Services.
Cette technique permet de crer des applications pour les diffrents mobiles
du march: Android, iOS, Windows Phone / Mobile, Ubuntu, Firefox OS.
Fig.2
Approche gnrale
Pour mettre en place les Web Services, Drupal a besoin de 2 modules:

a Services (http://drupal.org/project/services)
a Libraries (http://drupal.org/project/libraries)
Il faudra activer les modules Services, Libraries, Rest Server pour son bon
fonctionnement. L'tape suivante passe par la cration de la structure du
Web Service qui s'effectue en 2 temps. Tout d'abord, nous ajoutons un service. L'information principale tant le endpoint, c'est dire le chemin partir duquel Drupal sera capable de comprendre que c'est un Web Service et
non une page du site classique, et nous renverra les bonnes informations
Fig.1. Une fois le Web Service cr, vous pouvez activer certaines fonctionnalits comme l'affichage des nuds ou la connexion utilisateur Fig.2.
Maintenant que le nud principal est dfini, vous choisissez les ressources qui seront fournies Fig.3. Aprs la sauvegarde, vous pourrez appeler le Web Service depuis votre mobile, par exemple, l'affiche d'un nud
prsent de la manire suivante: http://votreSite.com/services/node/2
N.B.: la partie prsente est inspire du livre Drupal avanc aux ditions Eyrolles
Votre site Web en une application ouverte
Une application ouverte appele WebApps, est un site Web part entire et se
connectera distance votre Site internet. Il appellera le Web Service que nous
avons cr prcdemment. L'article utilisera comme environnement Firefox.
Mais vous avez la possibilit de le rendre compatible sur les autres smartphones.
Une plateforme ouverte
Lanc en 2013 par la fondation Mozilla, Firefox OS est un Web pour smartphone. Il utilise les formats ouverts du Web (HTML5 / JS / CSS3).
Le systme possde une architecture 3 niveaux:
a Gonk: la couche basse du tlphone comme un cur;
a Geko: le moteur de rendu HTML5;
a Gaia: l'interface utilisateur.
44
Fig.3
L'interface utilisateur est l'emplacement o les applications seront accessibles partir du MarketPlace. Ainsi, avec cette approche vous construisez des applications avec seulement du HTML, Javascript et CSS.
Cas pratique
Il existe plusieurs manires pour publier une application Drupal sur un environnement mobile comme Firefox OS:
a Soit de garder sur votre serveur l'application;
a Soit de la mettre disposition dans la MarketPlace.
L'article va montrer comment dporter l'application Drupal en une application mobile et comme exemple, nous utiliserons votre magazine prfr
Programmez pour obtenir le rsultat suivant: Fig.4.
Pour rendre le site Internet visible sur le Marketplace de Firefox OS, un certain nombre d'tapes sont ncessaires:
Etape 1 : les icnes
Vous devez crer diffrents fichiers de diffrentes dimensions pour rendre

votre application visible sur vos diffrents devices (desktop, ordinateurs
portables, tablettes, smartphones) du march. Il y a 2 formats obligatoires pour rendre votre application disponible sur cette plateforme ouver-
036_049_192 18/12/15 09:52 Page45
te. Les dimensions ncessaires doivent tre ralises aux formats PNG et de
dimensions (en pixels): 128x128 et 512x512. Il est possible de prvoir des
icnes supplmentaires pour 16x16, 48x48, 128x128, 256x256 pour afficher
une icne de bonne qualit. Pour faciliter la gestion de vos fichiers, nous prconisons de ranger ces fichiers dans un dossier images et icons Fig.5.
Etape 2 : fichier Index.html
Le fichier index.html est un fichier au format HTML5. Il s'agit du premier

fichier lanc par l'application, et appel par le manifest (voir plus bas).
Fichier: index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/
xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" manifest="manifest.appcache">
<head>
<meta name="viewport" content="width=device-width" />
<title>Programmez, le magazine du dveloppeur</title>
<link rel="stylesheet" type="text/css" href="css/programmez.css" />
</head>
<body>
<article>

Il est important de connatre au moins cette possibilit. Certains plugins
JavaScript demandent pour tre customiss de modifier des fichiers XML,
et notamment pour modifier une image par dfaut dy inclure une image
encode en base 64. Askapache va convertir une image donne en base
64, sachant quil est tout fait capable de faire linverse Fig.10.
Meld: comparer fichiers et dossiers
Il existe beaucoup dditeurs et de comparateurs de fichiers ou de dossiers. Ils ont chacun leurs avantages et on naime pas forcment en changer. Cest justement pour cela que nous vous proposons Meld. Celui-ci a la
particularit dtre disponible sous Linux, Mac et depuis peu, sous Windows. Il possde des options sympathiques qui font que cest un outil
agrable utiliser comme la coloration syntaxique et le changement de la
tabulation pour y voir plus clair. Meld compare aussi bien les fichiers que
les dossiers. Fig.11.
Xenu: vrifier les liens de son site
Il est de temps en temps utile de vrifier lensemble des liens de son site
afin de prvenir les erreurs 404 (fichier non trouv). Pour cela, Xenu est un
logiciel trs simple dutilisation qui va rechercher tous les liens et tester
toutes les requtes que propose le site. Concrtement, Xenu va faire une
requte GET sur chacun des liens dans les balises <a>, <link>, <img>,
<script> et ainsi tester la prsence des fichiers. Au fur et mesure quil
avance, Xenu nous affiche les liens quil a tests et ltat de russite du
test. Ainsi en quelques instants, on peut dnicher les erreurs de frappes, et
nettoyer un peu son code dappels obsoltes Fig.12.
Conclusion
Cette liste est bien sr incomplte. Vous avez, esprons-le, dcouvert

quelques applications qui vous feront gagner un peu de temps. Bien sr,
pour chaque application prsente, il en existe toujours dautres qui ont
leurs avantages. Mais lobjectif est de garder en tte lexistence de ces
applications, de connatre les possibilits quelles offrent et dy penser au
bon moment.
u
Fig.9
Interface de connexion de WinSCP
Fig.10
Fig.11
Meld possde une interface simple et moderne
Exemple d'une image convertie avec askapache en base 64
Xenu nous remonte la liste des liens cass qui apparaissent ici en rouge
Fig.12
57
058_061_192 18/12/15 12:36 Page58
Basculer son code vers Java 8 sur un projet

grande chelle
Jaccompagne Voyages SNCF (VSCT) depuis plus de deux ans en tant quArchitecte de suivi de
production chez PALO IT. Jinterviens notamment sur les problmatiques lies la mise en production
de nouvelles versions des applications. Je vais vous faire part de mon retour dexprience suite ma
participation au hackathon intitul Faire basculer VSCT vers Java 8, ayant eu lieu en janvier 2015.
Nadhem LAMTI,
Architecte Java chez PALO IT
Expert Java chez PALO IT, Nadhem accompagne Voyages SNCF (VSCT)
depuis bientt 3 ans en tant qu'Architecte suivi production. Il intervient sur
des incidents pouvant toucher des
applications Web Front End &
Mobile en production.
Alors que la version 5 de Java avait permis lintroduction de classes/types
gnriques et dune nouvelle API, cette volution avait en ralit eu peu
dimpact sur la manire de dvelopper, et le temps dadaptation pour une
quipe tait ngligeable. Java 8 nest pas une simple nouveaut: cest une
vritable rvolution! En effet, cest une logique toute entire de conception
et de dveloppement qui change, en introduisant principalement la logique
de programmation fonctionnelle (expression Lambda) comme les functional interfaces et les nouvelles API de collection Stream .
Cette nouveaut remet en question toute une pratique de dveloppement
(de plus de 10 ans pour moi!) et si le passage Java 8 peut seffectuer
sans difficults pour certains (en particulier pour les jeunes dveloppeurs
frachement diplms), il pourrait savrer plus complexe pour ceux qui
nauraient pas encore eu loccasion de dcouvrir les principaux langages
fonctionnels tes que Scala et/ou Clojure.
Contexte et enjeux du hackaton
Dans une dmarche dexprimentation, VSCT organise chaque anne un

hackathon auquel tous les collaborateurspeuvent participer. Une prslection des sujets de tous types est organise par un jury, qui identifie
ensuite les quipes participant cet vnement. Jai alors propos ltude
de la migration du code existant vers Java 8, en appliquant la nouvelle syntaxe des expressions Lambda sur certaines classes cibles.
Le site Voyages SNCF est une application critique de haute disponibilit,
devant offrir unequalit et un dlai de service irrprochables pour ses utilisateurs. Dans ce contexte, les amliorations vendues par Java 8 en termes
de qualit de code et de performance taient intressantes. Cependant, le
lancement dun plan de migration sans stratgie pralable aurait pu savrer risqu, les quipes travaillant en mode Agile et les demandes tant
gres par ordre de priorit. Ajouter cela un tel chantier aurait forcment
ncessit un nombre dhomme/jour supplmentaire, sans compter le dlai
de monte en comptences, ainsi que le risque de rpercussions ngatives sur les performances de lapplication si le code design de la nouvelle
implmentation nest pas soign.
Sans oublier quilne sagit pas dun dveloppement from scratch: on
parle bien de codeexistant quil faudrait reprendre en Java 8. Si ce dernier
est complexe et/ou mal dvelopp, le Refactoringen serait dautant
plus dlicat. Mises part les contraintes de dlai, on risquerait de se
retrouver avec des performances dgrades malgr les promesses vendues par Java 8 et, dans ce cas de figure, peu despoir que le sujet ait
encore un grand intrt.
Conscients des possibilits offertes par ce nouveau style de dveloppement et prts relever le challenge, les dveloppeurs des diffrentes
quipes taient dj trs motivs lide de basculer vers Java 8. Ce ne
sont pas les comptences qui manquent chez VSCT mais ce projet de
migration ne remportait pas ladhsion du Management, pour les raisons
cites prcdemment. Le hackathon reprsentait cependant une belle
opportunit pour exprimenter cette ide et obtenirun premier rsultat qui
apporterait une meilleure visibilit quant la priorisation de ce chantier de
migration.
Dans le cadre de ce hackaton, nous avons opt pour le droulement des
tapes suivantes:
a Constitution de lquipe ;
a Prparation de lenvironnement de travail ;
a Transformation du code en Java 8 ;
a Excution des tests unitaires ISOsans Java 8 ;
a Tests de performance.
Etape 1 : constitution de lquipe par niveaux
Le hackathon permettrait en premier lieu la monte en comptences des

quipes internes. Nous avons donc form une quipe htrogne, en nous
basant sur nos diffrents niveaux de matrise de Java 8:
a Moi-mme au niveau avanc: dans le cadre de mon exprience personnelle, je rassemblaisdes connaissances depuis 5 mois grce audveFig.1
58
058_061_192 18/12/15 12:36 Page59
loppement de mini-exemples, la lecture douvrageset darticles sur les

bonnes pratiques de dveloppement, la participation aux vnements
Java 8, etc. ;
a Hichem au niveau moyen : il avait commenc sapproprierles notions
de base des nouveauts quelques jours avant;
a Dhia au niveau dbutant : il navait aucune connaissance Java 8 pralable.
NB : Pour rappel, les membres de lquipe sont tous des Architectes de suivi de production et
des Experts Java.
a Nous avons ensuite identifi des classes significatives, qui sont souvent
appeles lors de lexcution, et sur lesquelles nous pouvions appliquer
les transformations issues des nouvelles API Stream ou Collectors . Nous avons fini par identifier 8 classes simples, 8 classes
moyennes et 8 classes complexes rparties sur 3 projets distincts. Leur
attribution sest faite de manire alatoire, ce qui nous a permis de dresser 3 tableauxque nous analyserons plus bas.
Etape 2 : migration et excution de tests unitaires
Une fois les rles dfinis et les classes identifies, nous avons dbut la
phase de migration :
a Prparation des environnements de travail: mise en place des projets
en local + compilation Java 8 + configuration de lIDE+ cration des projets sur Git [dure: 2H30] ;
a Prsentation de Java 8 axe autour des grandes nouveauts et des best
practices prendre en compte[dure: 1H30] ;
a Dbut du dveloppement: jai ddi 70% de mon temps au dveloppement et 30% au support des autres membres de lquipe. Chaque classe
redveloppe nest considre finie que si le Code Design est respect
(viter les Foreach au maximum) et que les rsultats des tests unitaires sont ISO code sans les expressions Lambda [dure: 1 jour] ;
a Pour assurer la qualit du code dvelopp, nous avons utilis les plugins
suivantssur IntelliJ: QAPlug, FindBugs et CheckStyle, qui

sont compatibles avec les nouveauts Java8. Ci-dessous quelques
rsultats danalyses appliques sur du code rcrit en Java 8 affichant
des recommandations damlioration sur lutilisation de lAPI
Stream: Fig.1.
Il n'tait pas possible de mettre un point darrt, ce qui est extrmement
contraignant pour deboguer le code.
Nous avons souhait utiliser SonarQube , mais pour des raisons de
Timing, nous navions pas pu le mettre en place vu le cot dinstallation et
de configuration que a pouvait engendrer. Le rsultat de notre avancement est rcapitul dans les 3 tableaux ci-dessous. La ligne Equipe rcapitule le pourcentage du nombre de mthodes migres par rapport la cible
et le temps pass en moyenne par personne et par mthode transforme
(tests unitaires inclus) : Tableau 1, 2 et 3.
Ci-dessous quelques exemples de bouts de code changs en Java 8 en
utilisant les expressions Lambdaen notant chaque fois le temps pass et
des remarques sur les difficults trouves :
Exemple 1
public List<FrequentTravellerCardTypeEnum> getFrequentTravellerAdvantage() {
final List<ProgrammeDeFidelite> fids = getProgrammesDeFidelite();
/* Ancien Code
final List<FrequentTravellerCardTypeEnum> result = new
ArrayList<FrequentTraveller
CardTypeEnum>(fids.size());
for (final ProgrammeDeFidelite f : fids) {
final Integer id = Integer.valueOf(f.getCode());
if (FrequentTravellerCardTypeEnum.getById(id) != null) {
result.add(FrequentTravellerCardTypeEnum.getById(id));
} else {
logCarteInconnu(f)
}
}
return result;
*/
// nouveau code Java8
Tableau 1 : Statut avancement refactoring Java 8 des classes simples
// 20 mn
return fids.stream()
.mapToInt(fid -> Integer.valueOf(fid.getCode()))
.mapToObj(FrequentTravellerCardTypeEnum::getById)
.peek(e-> {
if (e.getCode()) logCarteInconnu(e);
})
.filter(e -> e != null);
}
Tableau 2 : Statut avancement refactoring Java 8 des classes moyennes
Exemple 2
/* Ancien code
Tableau 3 : Statut avancement refactoring Java 8 des classes complexes
PaymentCard carteARendrePrincipale = null;

for (final PaymentCard carte : lesCartesDePaiement) {
if (!carte.isExpired()
&& !carte.isDefault()
&& (carteARendrePrincipale == null || carteARendrePrincipale.getCreationDate().before(
59
058_061_192 18/12/15 12:36 Page60
carte.getCreationDate()))) {
carteARendrePrincipale = carte;
} */
List<FinalizationCommand> finalizationCommands = new ArrayList<>();

commands.stream()
.filter(com->!com.execute(context))
.forEach(e->{
finalizationCommands.add(e);
e.cleanup(context);
finalizationCommands.
stream().
forEach(ep->ep.rollback(context));
});
return context.getStatus();
// java8 20 mn
PaymentCard carteARendrePrincipale = lesCartesDePaiement.stream()
.filter(carte-> !carte.isExpired() && !carte.isDefault())
.min(Comparator.comparing(carte->carte.getCreationDate().getTime()))
.orElse(null);
Exemple 3
/*public ReturnEnumeratedType execute(final IContext vscContext, final FinalizationService

ValueObject vo,final boolean moduleDisabled) {
final CommandContext context = createContext(vscContext, vo, moduleDisabled);
for (int i = 0; i < commands.size(); i++) {
final boolean result = commands.get(i).
execute(context);
if (!result) {
commands.get(i).cleanup(context);
for (int j = i - 1; j > -1; j--) {
Etape 3 : tests de performance
Notre collgue Hichem nous a propos dutiliser Contiperf

(http://databene.org/contiperf), un utilitaire qui nous a permis de drouler des
tests de performance sur certains tests unitaires Java 8 vs sans Java 8. Cet
outil permet de gnrer un rapport contenant le temps dexcution moyen,
en percentile et le temps de latence maximum de chaque test.
NB: Nous avons configur un comportement du StressTest reprsentatif de la charge de production, ce qui consiste injecter un grand nombre ditrations en parallle et non de gros volumes
de donnes.
commands.get(j).rollback(context);
Profiling du code avec Jprofiler afin de mesurer la quantit mmoire

consomme pour chaque test droul.Les illustrations suivantes prsentent un rapport du rsultat dun chantillon de StressTest tel que le
gnre Contiperf: Fig.2.
}
}
1. Rapport du rsultat : ContiPerfReport
Comme vous pouvez le constater, les performances du code Java8 sont

deux fois meilleures sur ce StressTest . Fig.3.
}
2. Rapport du rsultat : ContiPerfReport
}*/
/*------------------------------------------Java8--------------------------------------------Nous avons pass 1h30 sur cette mthode
Difficult de transformer les boucles imbriques avec les expressions Lambda sans passer
par Foreach
----------------------------------------------------------------------------------------------*/
public ReturnEnumeratedType executeJava8(final IContext vscContext, final FinalizationService
ValueObject vo, final boolean moduleDisabled) {
final CommandContext context = createContext(vscContext, vo, moduleDisabled);
Contrairement la premire illustration, sur ce test le code Java8 est deux

fois moins performant. Conclusion: le code est revoir!
Rsultats et interprtation
Nous avons russi migrer la totalit des classes simples avec une moyenne de 29 minutes par service, y compris les tests unitaires qui vont avec.
> Cest un rsultat encourageant pour une quipe compose des
niveaux mixtes. Le partage de connaissances et laccompagnement des
autres membres semblent avoir t efficaces.
Fig.3
Fig.2
Comme vous pouvez le constater, les performances du code Java8 sont deux fois
meilleures sur ce StressTest .
60
Contrairement la premire illustration, sur ce test le code Java8 est deux fois
moins performant. Conclusion : le code est revoir !
058_061_192 18/12/15 12:36 Page61
Seules les classes moyennes et complexes ont t modifies. Par rapport

aux classes simples, le temps moyen de transformation est estim au
double (1H00 / mthode) pour les classes moyennes et, au minimum, au
triple (<1h30 / mthode) pour les classes complexes.
> Une connaissance plus approfondie sur les pratiques avances des
nouvelles APIs Java 8 est ncessaire. Si le graphique de dpendance
des classes est de plus en plus complexe, limpact du Refactoring
peut facilement dpasser le changement du code lui-mme.
Au niveau des performances, certains tests ont donn de bons rsultats en
termes de temps dexcution et de consommation mmoire, quand
dautres sont moins bons (surtout pour le cas de classes complexes). Globalement, les performances sont quivalentes. Notez que nous navons
pas test les ParallelStream, ceux-ci tant peu adapts nos volumes
de production.
>Les conclusions restent confirmer dans le cadre dun vrai test de
charge. Il est aussi probable que certains Refactoring et transformations devraient tre revuscompte tenu de leurs rsultats insatisfaisants,
et ce indpendamment de la performance Java 8.
Les tableaux suivants rcapitulent le rsultat comparatif des temps dexcution et de consommation mmoire sur un cas de StressTest dune
Fig.4
Fig.5
Fig.6
classe simple, moyenne et complexe: rsultat concluantpour les classes

simples, mais le code est revoir pour des cas de classes complexes.
Fig.4, 5 et 6.
Conclusion
Lexercice de Refactoring que nous avons appliqu vient confirmer

lavantage dutiliser les expressions Lambda de Java 8 : un code plus
simple, avec moins de typages inutiles, plus maintenable et moins verbeux.Cet exercice deRefactoringsur une Codebaserelle est trs
intressant : il permet une courbe dapprentissage extrmement rapide
pour un investissement somme toute relatif.Pas de dgradation des performances sur les transformations simples grce une pratique correcte
des expressions Lambda.
Cela na pas t le cas sur les classes complexes, montrantun risque de
dgradation li dune part des Refactoring importants sur du code
complexe et dautre part une mauvaise utilisation des expressions Lambda. Par rapport aux rsultats attendus de ce hackaton, nous navons pas
pu transformer la totalit des classes et les performances ntaient pas au
rendez-vous, surtout sur les classes moyennes et complexes. Nous
navons donc pas pu diffuserun message rassurant tel que nous lavions
souhait au dbut de cet article.
Dvelopper avec les expressionsLambda et les nouvelles API Java 8 ne
se fait pas du jour au lendemain, surtout quand il sagit dune rcriture de
code dans le cadre dun grand projet haute disponibilit. Une bonne
approche pour poursuivre cette migration serait donc:
Dadopter une stratgie de migration progressive en ciblant un projet pilote ;
De faire merger de ce projet un ple de comptences Java8/Lambda ;
Dutiliser ce ple pour permettre un transfert de connaissances plus rapide
et un retour dexprience plus raliste aux autres quipes ;
Dassurer la monte en comptences gnrale en multipliant les workshops et les vnements autour du sujet ;
Dinciter la bonne pratique dutilisation des outils de code qualit existants et compatibles Java 8tels que PMD,FindBugs, CheckStyle
et SonarQube.
Ensuite, comme souvent pour ce type de migration, il sera plus efficace de
les inclure dans des projets de refonte dj planifis dans les
roadmapsprojets, voire des projets mtiers, plutt que de les grer en
standalone. Aujourdhui, VSCT a choisi de sinscrire dans cette optique
par le biais du lancement de ses applications NextGen.
Pour finir, nous nen sommes aujourdhui quau dbut de cette nouvelle
gnration du langage Java.
Ce dernier demeure en mode exprimentation : le dcollage seffectue
donc en douceur et le code reste toujours rtro-compatible avec les
anciennes versions. Ce nouveau mode de programmation et les langages
fonctionnels semblent tre la nouvelle orientation prendre. On risque
cependant dattendre longtemps avoir de le voir gnralis sur tout le
Core Java. En attendant, voyons ce que donnera le projetJigsaw sur
la version 9.
a Dadopter une stratgie de migration progressive en ciblant un projet
pilote ;
a De faire merger de ce projet un ple de comptences Java8/Lambda ;
a Dutiliser ce ple pour permettre un transfert de connaissances plus
rapide et un retour dexprience plus raliste aux autres quipes ;
a Dassurer la monte en comptences gnrale en multipliant les workshops et les vnements autour du sujet ;
a Dinciter la bonne pratique dutilisation des outils de code qualit existants et compatibles Java 8 tels que PMD, FindBugs , CheckStyle et SonarQube .
61
062_063_192 17/12/15 21:22 Page62
Construire son drone
1ere partie
Bien que le lgislateur ait commenc se pencher sur lutilisation des

drones de loisirs (ou UAV pour Unmanned Aerial Vehicle), il est parfois
difficile pour les profanes comme pour les amateurs de se faire une
ide sur ce qui se cache exactement derrire le mot drone.
Franois Chevalier
Concepteur dveloppeur chez SQLI Enterprise Nantes
depuis 2011. Passionn par les nouvelles
technologies et laronautique, il
s'intresse au concept du Do It Yourself et
essaye de l'appliquer dans son quotidien.
Il existe une communaut grandissante en France autour du drone et beaucoup de passionns
de modlisme se tournent galement vers cet
engin. Parmi les disciplines qui se pratiquent
avec un drone, la course de drone (FPV Racing)
connat un fort essor : elle consiste mettre au
dfi des pilotes de petits drones lgers munis
dune camra. Le pilote dirige son drone laide
de lunettes qui retransmettent limage de la
camra (First Person View). La prise de vue est
lautre discipline majeure chez les pilotes de loisirs. Dans ce cas, la stabilit du drone prime sur
sa vitesse et lon a souvent affaire des drones
de tailles beaucoup plus importantes. Il existe de
nombreuses autres applications lutilisation
des drones dans le monde professionnel mais je
ne mattarderai pas sur ce point ici.
Mon objectif aujourdhui est de vous faire partager les diffrentes tapes dans la fabrication
dun drone et vous aider, grce mon exprience, vous viter quelques cueils auxquels jai
t confront. tant dveloppeur de mtier, passionn par tout ce qui vole et un peu dbrouillard
en lectronique, il ma sembl naturel de me lancer dans la fabrication dun drone! On voit un
peut partout les mentions Do It Yourself alors
pourquoi ne pas le faire ?
Quel usage pour ce drone ?
Avant de se lancer dans la fabrication dun de

ces engins volants, il faut bien identifier lusage
que lon va en faire car cette finalit va conditionner toute la suite du processus. Pour ma part, jai
eu envie de raliser un drone sur lequel jallais
pouvoir installer une camra de type GoPro afin
de pouvoir raliser des prises de vue ariennes.
Dans un premier temps, je me contenterai de le
diriger par le biais dune radio-commande, ou via
un logiciel dans lequel je peux lui donner des
points GPS suivre et le laisser en autonomie.
Mais mon objectif final est de pouvoir le rendre
plus autonome en lui permettant de faire des
prises de vue en me suivant grce une balise
GPS que je porterai sur moi.
Avec ces objectifs en tte, je sais maintenant
62
que je vais devoir raliser un drone capable de

soulever un certain poids et qui soit relativement
stable. Aprs avoir parcouru les diffrents
forums et sites spcialiss, jai relev quil existe
un grand nombre de drone diffrents : avion,
quadcopter, hexacopter, octocopter,... Aprs
avoir compar ces diffrents modles, jen suis
venu la conclusion quun quadcopter remplira
les critres que je me suis fix. En effet, un quadcopter (engin quatre hlices) permet de faire
du vol relativement stationnaire, davoir une stabilit correcte et surtout -ce paramtre nest pas
ngligeable- il devrait rentrer dans mon budget.
Jinsiste sur ce point car faire moi-mme un
drone me permet dtaler les dpenses et de
pouvoir grer un budget serr.
Le matriel
Je rsume le matriel ncessaire pour raliser un

drone de type quadcopter :
a 1 Chssis (Frame)
a 4 Moteurs brushless
a 4 Hlices (2 sens horaire + 2 sens anti-horaire)
a 4 Contrleurs de vitesse (ESC)
a 1 Contrleur de vol
a 1 Module GPS
a 1 Rcepteur RC
a 1 Batterie Lipo
a 1 Radio-commande
Budget minimum estim : entre 600 et 800 euros
Auquel sajoute le matriel ncessaire pour la
programmation :
a 1 Module de tlmtrie (environ 80 euros)
a 1 Raspberry Pi (facultatif)
Et enfin, le matriel pour la prise de vue :
a 1 Nacelle (Gimbal) (environ 80 euros)
a 1 Camra type GoPro
Un chassis :
et si on jouait au Tarot?
Le chssis de mon futur quadcopter devait

rpondre deux exigences : avoir des pieds suffisamment long pour pouvoir installer une nacelle
sur laquelle je fixerais une camra et tre lger
pour ne pas handicaper le drone en terme dautonomie, car il est vident que plus un drone est
lourd, moins il est autonome. Il sagit donc de
trouver le juste milieu en esprant faire le bon
choix. Dans mon cas, jai dcid dacheter un
chssis de la marque Tarot : le modle FY650
IRON MAN 650 Quad-Copter. Cest un chssis en
carbone quip dun rail sur lequel on peut monter facilement une nacelle. Il peut accueillir quatre
moteurs et a la forme dun X. Cette forme est trs
commune pour les drones quatre hlices. L'inconvnient de ce chssis est que le manuel de
montage est trs succinct et donc pas vident au
premier abord. Heureusement il existe sur Internet de nombreuses vidos de tutoriels qui expliquent les diffrentes tapes de montage de ce
chssis. Prvoyez dinvestir dans des cls allen
avec des diamtres trs petits si vous nen avez
pas dj. Pour ce modle Tarot, il ma fallu des
cls de 1,5 mm et 2 mm et quelques acrobaties
pour pouvoir atteindre certaine vis, et bien sr lindispensable smartphone en mode niveau pour
que tout ce montage soit daplomb!
Quatre moteurs pour un

dcollage
Le choix des moteurs ne peut tre dissoci du

choix des hlices car cest lassociation de ces
deux lments qui va faire que votre drone va
dcoller ou pas ! Pour faire simple, si votre hlice
est trop grande et que votre moteur na pas assez
de couple alors vous risquez de griller votre
moteur car leffort fournir par celui-ci sera trop
important. A linverse un moteur avec beaucoup
062_063_192 17/12/15 21:22 Page63
de couple et une petite hlice sera inefficace et

dans ce cas votre drone restera sur le plancher
des vaches, faute de gnrer suffisamment de
portance. Partant de ce principe, quel choix doiton faire ? L encore, le choix dpend de lutilisation que vous voulez faire de votre drone : si vous
avez besoin quil soit rapide et trs ractif, voire si
vous souhaitez faire de lacrobatie, alors dans ce
cas il faudra choisir des moteurs ayant une vitesse de rotation trs importante et de petites
hlices. Dans le cas o la stabilit est primordiale,
alors on sorientera vers des moteurs fort
couple mais avec une faible vitesse de rotation
sur lesquels on montera des hlices de grande
taille. Pour ma part cest vers cette deuxime
solution que je me suis tourn. Le moteur est dfini par plusieurs caractristiques :
a Le KV, le voltage quil peut supporter et le
nombre dampres quil va consommer au
maximum de sa charge. Le KV est ce qui nous
intresse dans un premier temps : cest le
nombre de tours par minute par Volt. Un moteur
avec un KV trs lev va entrer dans la catgorie des moteurs trs grande vitesse mais
faible couple, alors quun moteur avec KV faible
entrera dans la catgorie inverse. Si je prends
lexemple du moteur que jai choisi : un T-Motor
avec un KV de 380 aliment par une batterie qui
fournira environ 14,8 V, mon moteur tournera
ainsi 14,8 * 380 = 5 624 tours/min. Ce nombre
peut paratre lev, mais sachez que pour les
drones utiliss pour les courses de FPV par
exemple, les moteurs ont des vitesses de rotation suprieures 13 000 tours/min.
a Un autre lment prendre en compte est le
nombre dampre que le moteur va consommer pleine charge, car cette valeur va nous
servir choisir lESC (Electronic Speed
Control). Cet lment qui, li au moteur devra
pouvoir supporter la charge maximale demande par le moteur (nous reviendrons sur ce
point en dtail dans une autre partie).
a Enfin, le Voltage que le moteur peut supporter
est en gnral une fourchette exprime en
nombre de S, 1 S tant quivalent 3,7V.
Dans le cas du moteur que jai choisi, son
fonctionnement doit se faire avec des batteries de type 4S ou 6S (nous dtaillerons ce
point dans la partie consacre la batterie).
Les moteurs sont en gnral livrs avec la visserie ncessaire pour les fixer au chssis, mais il
ma fallu adapter la longueur des cbles pour
que le montage moteur/ESC soit propre et corresponde aux caractristiques de mon chssis.
Hlice cherche moteur pour

senvoyer en lair
Lhlice a, quant elle, deux valeurs qui vont la

dfinir : la longueur et le pas. Ces valeurs sont
exprimes en pouces (). Le moteur que jai choisi ayant un fort couple, mon choix dhlice se portera vers des hlices de 13 ou 14 de longueurs
avec un pas de 4,5 ou 5. Une grande longueur
associe un pas important permettent davoir
une grande portance mme faible vitesse, ce
qui devrait, en associant cette configuration
mes moteurs, produire leffet escompt : dcoller! Il ne faudra pas oublier de vrifier lors de
lachat de ces lments, s'ils sont compatibles
entre eux. J'entends par l que pour quune hlice puisse se monter sur un moteur, il faut vrifier
que ladaptateur existe. Et vous devrez prendre
en compte que pour un multicopter, vous allez
avoir besoin dhlices conues pour tourner dans
le sens des aiguilles dune montre et dautres
dans le sens inverse. En effet si toutes vos
hlices tournent dans le mme sens, votre drone
a de grandes chances de tourner sur lui mme et
de devenir incontrlable!
Electronic Speed Control,

le compagnon du moteur
brushless
Contrairement un moteur classique, un moteur

brushless a besoin dun contrleur pour le faire
fonctionner, ce contrleur permet de grer la
vitesse de rotation du moteur. Il est aliment par
la batterie (par les cbles rouge et noir sur la
photo) et alimente lui mme le moteur via trois
cbles dalimentation (3 cbles noirs dans mon
cas). Il est aussi muni dun cble qui le relie au
contrleur de vol. Cest via celui-ci quil reoit les
ordres en termes de vitesse de rotation du
moteur. LESC contient un micro-contrleur et
peut tre pr-charg avec un firmware. Il existe
plusieurs types de firmware dont le plus connu

est SimonK. Cest ce firmware qui nous intresse car il est particulirement bien adapt aux
multicopters et permet davoir des moteurs trs
ractifs. Je suis donc parti la recherche dESC
ayant le firmware SimonK dj pr-charg, et
pouvant encaisser les 20A que chaque moteur
peut utiliser pleine charge. Jai fait le choix
dutiliser des ESC T-Motor 35A avec le bon firmware charg. Jai une scurit de 15A supplmentaire, ce qui devrait viter les problmes de
surchauffe et les ventuelles surcharges. En parcourant les diffrents sites de vente de matriel
pour drones, vous noterez parfois que certains
ESC ont une mention BEC. Cette mention signifie que lESC est capable de fournir un courant
supplmentaire, de 5V en gnral, vers le
contrleur de vol, et donc permet dalimenter ce
dernier. Le contrleur de vol que jai choisi dispose dun systme dalimentation qui passe par la
batterie directement, donc je nai pas besoin de
ce dispositif sur mes ESC. Jai dcid de les installer au plus prt des moteurs car mon chssis
sy prtait, et jai utilis du scotch dlectricien
de couleur bleue et rouge pour les fixer. Cela me
permettra aussi en vol de diffrencier plus facilement lavant et larrire de mon drone.
Je me trouve maintenant avec un chssis, sur
lequel jai mont quatre moteurs brushless auxquels jai reli quatre ESC. Il ma fallu user de
pinces, dun fer souder ainsi que de gaines
thermo-rtractables pour pouvoir adapter et
relier les diffrents lments entre eux.
La suite au prochain pisode...
u
63
064_066_192 17/12/15 21:23 Page64
Connectez votre rameur

dappartement avec Chrome
2e partie
WiiFit, AppleHealth, Google Fit, tout a cest du pass ! Place SkiffSimulator !!

a va ramer dans les salons!
Jean-Franois Garreau
SQLi
Gestion du moteur
Un des lments cls du programme est lalimentation du modle depuis

lapplication Chrome. Lapplication Chrome va alimenter le modle et
dterminer un certain nombre dlments en lien avec le rendu souhait,
puis appeler le moteur de calcul pour terminer les traitements. On vrifie
par exemple dans quel sens va le joueur, sil y a eu un dplacement, etc.
// Calcul
function setDistance(distance) {
if (gameModel.distanceArduino === distance) {
gameModel.direction = 0;
}
else if (gameModel.distanceArduino > distance) {
gameModel.direction = 1;
}
else {
gameModel.direction = - 1;
}
// Vitesse en cm / ms
var deltaCM = Math.abs(gameModel.distanceArduino - distance);
if (deltaCM > ConstSAS.MIN_DELTA_CM) {
gameModel.speed = deltaCM / ConstSAS.DELAY;
}
else {
gameModel.speed = Math.max(gameModel.speed - ConstSAS.FACTOR_SPEED,
0);
}
gameModel.distanceArduino = distance;
engineSkiff();
}
Le coeur du moteur quant lui, soccupe uniquement de lire les donnes

issues de lArduino et de calculer la distance globale parcourue, ainsi que
le pourcentage de dplacements dans lcran.
function engineSkiff() {
if (gameModel.speed > 0 && gameModel.stateGame === constState.STATE_RUNNING) {
var distanceSpeed = gameModel.speed * ConstSAS.DELAY;
// On incrmente la distance
gameModel.distanceSkiff += (distanceSpeed * ConstSAS.FACTOR_DISTANCE);
// On gre l'effet de dplacement des bords via un pourcentage
gameModel.percent = (gameModel.distanceSkiff % 100) / 100;
}
}
SPCIFIQUE CHROME
Depuis le dbut nous parlons dapplication Chrome et de lAPI Serial, il est

dsormais temps de voir comment nous implmentons cette partie.
64
Interaction avec lArduino
Toute linteraction avec lArduino se fait directement via le port srie. Mais il faut pour cela passer par des tapes cls :
a Rcuprer les appareils connects sur les
ports srie chrome.serial.getDevices;
a Une fois un appareil trouv, on sy connecte chrome.serial.connect.
Dans notre exemple, on veille ce quil ny ait quun appareil de connect au moment du lancement de lapplication;
a Lire le port srie chrome.serial.onReceive.
function initArduino() {
chrome.serial.getDevices(function(ports) {
if (ports && ports.length == 1) {
chrome.serial.connect(ports[0].path,
onOpenArduino);
}
}
);
}
function onOpenArduino(openInfo) {
connectionId = openInfo.connectionId;
console.log("connectionId: " + connectionId);
if (connectionId == - 1) {
console.log('Could not open');
return;
}
console.log('Connected');
chrome.serial.onReceive.addListener(onReadArduino);
}
function convertArrayBufferToString(buf) {
return String.fromCharCode.apply(null,
new Uint8Array(buf));
}
function onReadArduino(readInfo) {
if (readInfo.connectionId == connectionId && readInfo.data) {
var str = convertArrayBufferToString(readInfo.data);
if (str.charAt(str.length - 1) === '\n') {
value += str.substring(0,
str.length - 1);
if (regExp.test(value)) // Light on and off
{
var distanceTmp = + regExp.exec(value)[1];
if (distanceTmp < ConstSAS.DISTANCE_MAX && Math.abs(distance - distanceTmp) < (Const
SAS.DISTANCE_MAX * 1.5) ) {
AppSAS.setDistance(distanceTmp);
}
distance = distanceTmp;
}
value = "";
}
064_066_192 17/12/15 21:23 Page65
else {
value += str;
}
}
}
Il faut noter une petite particularit lors de la lecture : nous lisons le port
srie et nous attendons une chane de caractres. Aussi, il est important de
penser convertir les donnes issues du port srie en donnes exploitables sous forme de chane de caractres.
GESTION DES CRANS ET

CAS PARTICULIERS
Maintenant que nous avons vu la mcanique sous le capot, regardons de
plus prs quelques cas particuliers qui mritent un peu dattention.
Dplacement du dcor
Afin de donner une sensation de dplacement, il nous faut bouger nos

rives. Pour ce faire, on va simplement fonctionner avec un indicateur en
pourcentage en rapport avec le dplacement global du rameur. Ainsi pour
afficher correctement nos 2 rives qui bougent, il nous suffit juste de dessiner 2 fois chaque rive de chaque ct afin de grer les dpassement
dcran et de les positionner en fonction dun pourcentage rsultant dun
modulo de la distance du rameur :
// Affiche le rivage en fonction de la rive souhaite et de la progression du rameur
function paintRive(riveDroite) {
var rive = ui.resources.images[(riveDroite ? 'rive_droite' : 'rive_gauche') + getSuffix()];
var finalHeight = rive.height * ui.ratio,
finalWidth = rive.width * ui.ratio;
ui.context.drawImage(rive , 0 //sx clipping de l'image originale
, 0 //sy clipping de l'image originale
, rive.width // swidth clipping de l'image originale
, rive.height // sheight clipping de l'image originale
, riveDroite ? ui.canvas.width - finalWidth : 0 // x Coordonnes dans le dessing du canvas
, 0 - (finalHeight * gameModel.percent) // y Coordonnes dans le dessing du canvas
, finalWidth // width taille du dessin
, finalHeight // height taille du dessin
);
ui.context.drawImage(rive , 0 //sx clipping de l'image originale
, rive.width // swidth clipping de l'image originale
, rive.height // sheight clipping de l'image originale
, riveDroite ? ui.canvas.width - finalWidth : 0 // x Coordonnes dans le dessing du ui.canvas
, finalHeight - (finalHeight * gameModel.percent) // y Coordonnes dans le dessin du canvas
, finalWidth // width taille du dessin
, finalHeight // height taille du dessin
);
}
Laffichage du rameur
Laffichage du rameur comporte 2 parties prendre en compte :
a Laffichage du rameur en fonction de la position du joueur;

a Lavance du rameur quand le mode ghost est activ.
Position du rameur en fonction du joueur
Afin de restituer au mieux les gestes effectus par le joueur, il a fallu rflchir une faon dafficher la bonne image de rameur, en fonction de sa
position sur le rameur. La rponse tait relativement simple : il suffit de
connatre chaque instant la position du joueur sur le rameur et sa direction, puis dappliquer la bonne image Fig.1.
function indexToUse(direction, distance) {
var arrayToUse = direction >= 0 ? mappingPositonRameurFront : mappingPositonRameurBack;
for (var i = 0; i < arrayToUse.length; i++) {
var minMax = arrayToUse[i];
if (distance > minMax.min && distance <= minMax.max) {
return minMax.indexSprite + AppSAS.getSuffix();
}
}
return mappingPositonRameurBack[0].indexSprite + AppSAS.getSuffix();
}
// Affiche le bon sprite du bateau
function paintBoat() {
//var ratio = 0.05;
var image = AppSAS.ui.resources.images[AppSAS.gameModel.indexSprite];
AppSAS.ui.context.shadowOffsetX = 0;
AppSAS.ui.context.shadowOffsetY = 0;
AppSAS.ui.context.shadowBlur = 0;
AppSAS.ui.context.drawImage(image , 0 //sx clipping de l'image originale
, image.width // swidth clipping de l'image originale
, image.height // sheight clipping de l'image originale
, (AppSAS.ui.canvas.width / 2) - ((image.width * AppSAS.ui.ratio) / 2) // x Coordonnes dans le dessin
du AppSAS.ui.canvas
, (AppSAS.ui.canvas.height / 2) - ((image.height * AppSAS.ui.ratio) / 2) + 100// y Coordonnes dans
le dessin du AppSAS.ui.canvas
, image.width * AppSAS.ui.ratio // width taille du dessin
, image.height * AppSAS.ui.ratio // height taille du dessin
)}
De cette manire nous affichons toujours la bonne image. Puis, afin de faciliter le dplacement du bateau, il a t considr quil tait en position fixe
sur lcran et que lillusion du dplacement se fait uniquement travers le
dplacement du dcor.
Gestion du ghost
Laffichage du ghost doit faire face un problme. Contrairement au

bateau, ce dernier se dplace sur lcran. Le problme est que ce dplacement vient surtout du fait quil a fallu grer le cas dun ghost allant plus vite
que le joueur courant. En effet, si le ghost est meilleur que le joueur, alors, il
sera vers le haut de lcran ce qui veut dire que sa position va sapprocher
de laxe, voire aller dans les ngatifs. Or dans un canvas, si un lment est
dessin avec des coordonnes de destination dans le ngatif, llment
nest tout simplement pas peint ! Il a donc fallu tronquer limage source
Fig.1
65
064_066_192 17/12/15 21:23 Page66
pour donner lillusion que le dessin du ghost parte vers le haut de lcran.
// Affiche le bon sprite du bateau du mode Ghost
function paintGhost() {
//var ratio = 0.05;
var image = AppSAS.ui.resources.images[AppSAS.gameModel.indexSpriteGhost];
...
// Le fantme doit tre dessin l o il est au niveau de sa distance globale par rapport au bateau actuel
// => On affiche l o est son delta en distance par rapport bateau actuel
var stateGhost = AppSAS.gameModel.ghost[AppSAS.gameModel.step];
var deltaGhost = AppSAS.gameModel.distanceSkiff - stateGhost.distanceSkiff;
// On doit tronquer le ghost s'il dpasse de l'cran
var yGhost = (AppSAS.ui.canvas.height / 2) - ((image.height * AppSAS.ui.ratio) / 2) + 100 + (deltaGhost *
ConstSAS.FACTOR_GHOST);
var heightSpriteGhost = image.height;
if (yGhost < 0) {
heightSpriteGhost = image.height + yGhost;
yGhost = 0;
}
AppSAS.ui.context.drawImage(image , 0 //sx clipping de l'image originale
, image.height - heightSpriteGhost //sy clipping de l'image originale
, image.width // swidth clipping de l'image originale
, heightSpriteGhost // sheight clipping de l'image originale
, (AppSAS.ui.canvas.width / 2) - ((image.width * AppSAS.ui.ratio) / 2) // x Coordonnes dans le dessin
du AppSAS.ui.canvas
, yGhost // y Coordonnes dans le dessin du AppSAS.ui.canvas , image.width * AppSAS.ui.ratio // width
taille du dessin
, heightSpriteGhost * AppSAS.ui.ratio // height taille du dessin
);
...
}
Affichage des crans de login & de scores
Ces 2 crans sont diffrents car on y affiche non pas une animation, mais
du texte Fig.2.
Ecran de Login
Concernant lcran de login, il nexiste pas dquivalent du champ input

dans un canvas. Aussi, il a fallu intgrer notre html une balise input que
lon affiche ou cache en fonction du besoin.
Ecran de scores
Laffichage du score est simple car il ne sagit que dafficher du texte :

AppSAS.ui.context.fillText(MyText', x, y);
La taille et la couleur du texte sont dfinis par des proprits appliques

directement sur le context du canvas.
Persistance des donnes
Pour sauvegarder les donnes dune partie lautre, ou mme dun dmarrage dapplication lautre. Jai fait le choix le plus simple : le LocalStorage. Le seul hic avec le LocalStorage et les ChromeApps, cest que lAPI
telle quelle est disponible en html5 nexiste pas sur une ChromeApp. En
effet, lapi localStorage tant syncrhone, Google a prfr mettre en place
une solution asyncrhone : https://developer.chrome.com/apps/storage. Jai
donc mis en place la solution de Google et jen ai profit pour prvoir une
api uniforme entre localstorage & chrome.storage au cas o vous partiriez
sur une solution native html5.
Placer lArduino
Afin de mesurer au mieux les donnes de distance, jai plac lArduino au

dos de lutilisateur et jai fabriqu une petite bote pour packager un peu
tout a : Fig.3.
ANNEXES
Le code complet est disponible https://github.com/sqli-nantes/skiff-simulator
Fig.2
Tous les numros de
PROGRAMMEZ!
sur une cl USB (depuis le n100).
Fig.3
29,90 *
Cl USB 2 Go.
Photo non
contractuelle.
Test sur Linux,
OS X,
Windows. Les
magazines sont au
format PDF.
* tarif pour l'Europe uniquement. Pour les

autres pays, voir la boutique en ligne
Commandez la directement sur notre site internet : www.programmez.com
067_068_192 17/12/15 21:24 Page67
A la dcouverte des profils Java 8

Sortie en Mars 2014, la nouvelle mouture de Java a t lvnement du dbut danne dans le monde
informatique. Les articles et les sujets de blogs ont foisonn mettant en exergue la rvolution des
Lambdas expressions ou encore le soulagement de bnficier enfin dune API de gestion du temps
digne de ce nom. A contrario, lintroduction des profils au sein de Java 8 est reste un sujet plutt
confidentiel alors quil constitue un grand pas pour le futur de la plateforme. Tentative dexplications.
Sylvain SAUREL
Ingnieur dEtudes Java / Java EE
sylvain.saurel@gmail.com
Un peu de thorie
Au fil du temps, la plateforme Java a gagn en maturit mais galement en

fonctionnalits devenant la solution de rfrence pour les dveloppements
informatiques en entreprise dans de nombreux domaines. Lajout de fonctionnalits aura au final conduit augmenter sans cesse la taille de lenvironnement dexcution Java plus connu sous le nom de JRE (Java
Runtime Environment). Avec Java 7, le JRE complet tournait ainsi autour
des 140 Mo! Cette taille pose dautant plus de problmes que pour beaucoup dapplications une grande partie des fonctionnalits du JRE ne sont
pas utilises (JMX ou Corba par exemple).
Rduire lempreinte mmoire de la plateforme Java est donc devenu une
priorit absolue pour les quipes en charge de Java chez Oracle. Sans
prendre en compte le code natif charg par les bibliothques dynamiques,
le JRE se compose dun bloc monolithique de prs de 60 Mo avec la bibliothque rt.jar . Dcouper ce bloc imposant en sous blocs est une ncessit
afin de modulariser le JRE. Cette modularisation devant notamment amener les gains suivants:
a Un temps de dmarrage rduit pour la JVM;
a Une consommation mmoire rduite;
a Un nettoyage du coeur de la plateforme en retirant des packages du
coeur les APIs nayant rien y faire et les classes non utilises;
a Une scurit accrue du fait de la rduction du coeur de la plateforme et
donc de la surface dattaque potentielle;
a Une convergence accrue entre Java ME (version destine lembarque) et Java SE.
Ce projet de modularisation ne date pas dhier et les dveloppeurs Java
ont tous dj entendu parler du projet Jigsaw. Projet au combien ambitieux, Jigsaw visait une modularisation complte de la plateforme tout en
prenant en compte galement les besoins suivants:
a Gestion des dpendances en sappuyant sur les bonnes pratiques et les
erreurs de solutions comme Maven, Apache Ivy ou OSGI notamment;
a Isolation des dpendances afin de rsoudre le problme de versionning
des bibliothques;
a Autoriser le packaging dapplications sous la forme de modules plutt
que sous la forme de JAR.
Cette approche ncessitait dnormes modifications en profondeur au sein
de la plateforme Java. En particulier, elle implique la mise en place dun
classloader lui aussi modulaire ce qui induit une grande complexit pour
garantir une compatibilit ascendante.
Devant lampleur de la tche et afin de livrer enfin la version 8 de Java,
Oracle a dcid de repousser ce vaste chantier de modularisation Java 9
attendu pour 2016. Nanmoins, les travaux initiaux nauront pas t vains
puisque Java 8 dcide de franchir un premier pas dans ce chantier de
modularisation en proposant les profils Compact. Si, premire vue, la
montagne a accouch dune souris, la ralit est tout de mme bien plus
rose. En effet, les profils Compact de Java 8 sapproprient une partie,

somme toute basique, des avantages attendus du projet Jigsaw:
a Une compatibilit totale avec la JVM et les spcifications du langage Java;
a Une rduction substantielle de lempreinte mmoire de la plateforme;
a Un retrait de fonctionnalits qui ne sont plus toujours utiles (CORBA par
exemple);
a Un fonctionnement pour la plupart des applications et en particulier les
applications serveurs.
Concrtement, les profils Compact de Java 8 se basent sur les packages.
Ainsi, un profil contient obligatoirement des packages complets. Il ny a
donc pas de support pour des packages partiels. En sus, un profil doit tre
un ensemble ferm ce qui implique que les rfrences des classes non
prsentes au sein du profil sont interdites. De fait, si un profil contient des
classes dun autre profil plus petit, il doit les contenir entirement ce qui
induit donc que les profils sont additifs.
Les profils sont au nombre de 3 auxquels il faut ajouter le JRE complet
(Fig.1).
Fig.1
Les 3 Profils Compact

On remarque que le profil compact1 est le plus petit avec une taille lgrement en-de des 10 Mo, ce qui constitue un gain despace assez drastique. Il correspond au coeur de la plateforme Java et contient notamment
les packages java.io, java.lang, java.nio, java.math, java.text, java.util,
java.security, javax.security ainsi que java.text. Le profil compact2 correspond au compact1 auquel sont ajouts les packages lis aux invocations
RMI, SQL et XML. Enfin, le compact3 comprend tout le compact2 auquel
sont adjoints les outils de management lis JMX ou encore les bibliothques de cryptographie additionnelles. Les dveloppeurs dIHM client
lourd auront tout de suite not que ces profils ne contiennent pas de
classes lies aux interfaces utilisateurs. Ainsi, pour les applications recourant des classes de Swing ou de AWT, il faudra passer par le JRE complet. La Fig.2 donne un aperu plus dtaill du contenu des diffrents
profils tout en gardant lesprit quils sont additifs.
67
067_068_192 17/12/15 21:24 Page68
Place la pratique
Fig.2
La thorie autour des Profils Java 8 assimile, les dveloppeurs ont besoin
doutils pour pouvoir dvelopper des applications sappuyant dessus. En
effet, il est difficile de se rappeler quelle API se trouve dans quel Profil
Compact. Pour aider les dveloppeurs tirer partie des profils et favoriser
au mieux leur adoption, Java 8 met disposition 1 outil en ligne de commande spcifique nomm jdeps et rajoute des options ddies au compilateur javac. A la compilation dun programme il est dsormais possible
dutiliser loption -profile afin de spcifier au compilateur de gnrer une
erreur si le programme utilise des classes dun profil suprieur. Ici, on peut
prciser que notre programme MyProg se limite utiliser le profil compact1:
javac -profile compact1 MyProg.java
Contenu des Profils
Nouvellement ajout avec Java 8, jdeps est un outil danalyse statique qui
ralise une analyse des dpendances dune classe spcifique ou dun
fichier JAR. Outre le fait quil permet de connatre les dpendances en
regard dun profil, loutil se rvle galement trs utile avec son option profile (ou son raccourci -P) indiquant de quel profil dpendent des packages.
Nous pouvons par exemple analyser les dpendances de lIHM de dmo
Notepad.jar inclus avec le JDK:
$ jdeps demo/jfc/Notepad/Notepad.jar
demo/jfc/Notepad/Notepad.jar -> /usr/java/jre/lib/rt.jar
<unnamed> (Notepad.jar)
-> java.awt
-> java.awt.event
-> java.beans
-> java.io
-> java.lang
-> java.net
-> java.util
Afin de savoir quel profil appartiennent les dpendances de Notepad.jar,

la ligne de commande suivante sera employe:
$ jdeps -profile demo/jfc/Notepad/Notepad.jar
demo/jfc/Notepad/Notepad.jar -> /usr/java/jre/lib/rt.jar (Full JRE)
<unnamed> (Notepad.jar)
-> java.awt
Full JRE
-> java.awt.event
Full JRE
-> java.beans Full JRE
-> java.io
compact1
-> java.lang compact1
-> java.net
compact1
-> java.util
compact1
-> java.util.logging compact1
-> javax.swing
Full JRE
Lutilitaire jdeps prend un grand nombre de paramtres en entre lui permettant dtre souple et de sadapter un grand nombre de cas dutilisations. Les dveloppeurs dsireux dutiliser les profils Compact ne pourront
rapidement plus sen passer.
Pour terminer un mot sur le support par les IDE de ces outils tournant
autour des profils de Java 8. Dvelopp par Oracle, lIDE NetBeans en version 8.0 supporte fort logiquement un large ventail des nouvelles fonctionnalits de Java 8. Ainsi, les profils Compact ne font pas exception la
rgle. Lors de la configuration dun projet, lIDE permet de slectionner en
regard de quel profil il devra tre compil. Il devient alors plus facile de
cibler un profil en particulier et de vrifier les classes ayant des dpendances non souhaites vers dautres profils. Bien entendu, il reste possible
de slectionner une compilation standard en ciblant un JRE complet. Un
support du mme type est planifi dans les futures releases des outils Java
pour Eclipse.
Conclusion
Premier arrt sur le long chemin menant la modularisation du JDK, les

profils Compact de Java 8 reprsentent un pas significatif pour le futur de
la plateforme. Rduire la taille du JDK et son empreinte mmoire savre
fondamentale pour lamlioration des performances des applications Java
que ce soit en milieu embarqu, desktop ou encore serveur. La prochaine
tape sera celle de la mise en place du projet Jigsaw au sein de Java 9
avec une modularisation pleinement supporte. Nanmoins, lheure tourne
et 2016 est l. Les rcentes hsitations quant la direction que doit
prendre le projet laissent planer un doute certain sur une prise en compte
ds Java 9! Affaire suivre
Restez connect(e) lactualit !

u Lactu de
u La newsletter hebdo : u Agenda :
Programmez.com :
la synthse des informations
Tous les salons, barcamp
le fil dinfo quotidien
indispensables.
et confrences.
Abonnez-vous, cest gratuit ! www.programmez.com
069_071_192 17/12/15 21:25 Page69
Interconnecter vos objets avec Node.js
1re partie
En permettant le dveloppement d'applications ct serveur en Javascript, langage connu pour sa

grande souplesse, Node.js offre la possibilit de manipuler les couches hautes comme les couches
basses. Ce sont ces dernires qui permettent de prendre le contrle des objets et de crer entre eux
des interactions. Aprs avoir dfini un environnement adquat, on peut alors obtenir toutes les
interactions induites par la potentialit des objets.
Matthieu Bouilloux
Dveloppeur web et applicatif. Intress par tout
type de nouvelle technologie tel que l'Iot ou encore
l'analyse des marchs boursier.
http://www.katlea-edition.com
matthieu@katlea-edition.com
Il s'ensuit que l'on peut prendre le contrle du protocole Bluetooth dans sa
version Low Energy (4.0) qui tend devenir omniprsente. Mais on peut
aussi envisager de crer des applications plus exotiques qui permettront
d'accder la sortie audio, au contrle de l'affichage vido par Javascript,
ou encore, l o vous mnera votre imagination.
En Node.js, on peut donc crer de la communication entre objets connects. J'ai ainsi interfac plusieurs cartes de prototypage via les couches
basses du Bluetooth un bracelet Myo (qui n'est autre qu'un lectromyogramme). Mais les possibilits d'interactions ne sont pas limites, car on
peut dj changer entre objets connects, ordinateurs, ou priphriques,
voire mme synchroniser le tout sur un serveur Web.
Dans cet article
Les trois premires parties expliquent comment prendre en main les cartes
Arduino Yn, Intel Edison et Raspberry Pi, avec Node.js et un peu de Bluetooth. Ensuite un premier DIY pour s'approprier la sortie vido du Raspberry
Pi 2. Suivi d'une initiation au mappage Bluetooth l'aide d'un bracelet Myo.
Pour terminer un DIY pour crer des modules multi-room pour enceintes
avec tlcommandes l'aide d'un Raspberry Pi 2 et d'un Arduino Yn.
MISE EN ROUTE DE L'ARDUINO YN
L'Arduino Yun est une carte de dveloppement / prototypage qui supporte

une distribution Linux base sur OpenWRT et se nommant Linino.
Cette carte embarque un microcontrleur bas sur une ATmega32u4
offrant toutes les possibilits d'interaction propres aux cartes Arduino standards (capteurs ...). Elle intgre aussi un processeur Atheros AR9331 sur
lequel tourne une distribution Linux. Elle constitue ainsi un outil de prototypage parfait pour l'internet des objets !
Mise en route
Pour exploiter au mieux le Yn, il est ncessaire de faire quelques manipulations pour tendre l'espace disque et la mmoire vive. En effet le Yn ne
dispose que de 16 Mb de mmoire flash et 64 Mb (DDR2) de mmoire vive.
Prrequis
a
a
a
a
Une Arduino Yn avec la dernire image de OpenWrt (1.5.3)

Le dernier logiciel Arduino : https://www.arduino.cc/en/Main/Software
Une carte Micro-SD
Le logiciel Putty http://www.putty.org/
Trouver le port du Yn
Une fois le Yn connect en USB l'ordinateur, il faut ouvrir le "Gestionnaire de priphriques", et se rendre sur la section "Ports (COM et LPT)". Vous
devriez voir une entre : "Arduino Yun COMX" o X est le port du Yun.
OpenWrt upgrade
Dans le logiciel Arduino, il faut choisir l'Arduino Yn ainsi que le port correspondant.
a Outils > Type de carte > Arduino Yn
a Outils > Port > COMX (Arduino Yn)
Ensuite il faut charger l'exemple YunSerialTerminal sur le Yun pour viter
les conflits.
a Fichier > Exemples > Bridge > Yn Serial Terminal
Puis tlverser :
a Croquis > Tlverser
Pour la suite il suffit de copier l'image de OpenWrt la racine de la micro-sd
et redmarrer le Yn. Pour upgrader le Yn il suffit de se connecter via WiFi
l'Arduino pour accder l'interface Web du Yn : http://arduino.local (mot
de passe par defaut : "arduino"). Une fois entre sur l'interface, une option
upgrade (reset) apparat ! Le processus dure environ 3 minutes. Une fois
termine, la led WLAN arrte de clignoter.
Etendre l'espace disque la Micro-SD
Attention l'Arduino doit tre connecte Internet !

Il nous faut le sketch correspondant pour commencer :
https://www.arduino.cc/en/uploads/Tutorial/YunDiskSpaceExpander.zip
Une fois le sketch tlvers, ouvrez le terminal : Outils > Moniteur srie
Vrifiez que l'option "Nouvelle ligne" et "115200 Baud" sont slectionnes.
Un message doit apparatre, rpondre "yes" trois fois puis entrez la taille en
Mo de l'espace de donnes; le reste sera attribu au systme Linino.
Appuyez sur le bouton Yun RST pour redmarer Linino, lorsqu'on vous le
demande dans le terminal. Commande pour vrifier l'espace disque :
df -h
Etendre la mmoire vive en crant un swap
Connectez-vous au Yn via SSH par WiFi ou rechargez l'exemple Yn

Serial Terminal.
a Par SSH connectez-vous sur arduino.local (via putty).
a Par USB choisir "serial" dans Putty, mettre "speed" 115200 et Serial line
COMX o X est le port du Yn.
Crer le Swap
Ici nous crons un swap de 512 Mo que Linino pourra utiliser en cas de
dpassement de la mmoire vive.
mkdir swap
dd if=/dev/zero of=/swap/yunswapfile bs=1M count=512
69
069_071_192 17/12/15 21:25 Page70
mkswap /swap/yunswapfile
swapon /swap/yunswapfile
Configurer le swap au dmarrage

On ajoute le swap au systme de fichiers :
uci add fstab swap

uci set fstab.@swap[0].device=/swap/yunswapfile
uci set fstab.@swap[0].enabled=1
uci set fstab.@swap[0].fstype=swap
uci set fstab.@swap[0].options=default
uci set fstab.@swap[0].enabled_fsck=0
uci commit
On dite le fichier de dmarrage :
nano /etc/rc.local
Puis on rajoute avant "Exit 0" :
/etc/init.d/fstab start
Et voil pour le swap. Pour tester il suffit de taper la commande suivante :
free -m
Installation de Node.js et de sftp
Systmatiquement mettre jour les paquets chaque redmarrage :

opkg update
Puis installer les paquets pour Node.js et pour le serveur sftp afin de faciliter les transferts.
opkg install openssh-sftp-server
opkg install node
opkg install node-ws
opkg install node-serialport
Cylon.js
Le paquet Cylon.js permet de dialoguer en Javascript avec les composants de l'Arduino. Crer un dossier pour y installer cylon.js
},
devices: {
led: { driver: 'led', pin: 4 },
button: { driver: 'button', pin: 3 }
},
work: function(my) {
my.button.on('push', function() {
my.led.toggle()
});
}
}).start();
A propos du Bluetooth Low Energy
A l'heure actuelle l'installation d'un dongle Bluetooth est possible (reconnu

par hciconfig aprs quelques manipulations) mais l'tablissement de la
connexion entre appareils Bluetooth ne se fait pas malgr le fait que le
scan fonctionne sans problme.
MISE EN ROUTE DE L'INTEL EDISON
La mise en route de l'Edison est beaucoup plus aise, car Intel l'a mise
disposition l'adresse suivante :
https://software.intel.com/fr-fr/articles/assemble-intel-edison-on-the-arduino-board
Le Bluetooth Low Energy
Ajouter les repositories pour les paquets :

vi /etc/opkg/base-feeds.conf
> touche : "i" (insrer)
> Puis ajoutez les lignes suivantes :
>
src/gz all http://repo.opkg.net/edison/repo/all
src/gz edison http://repo.opkg.net/edison/repo/edison
src/gz core2-32 http://repo.opkg.net/edison/repo/core2-32
npm install cylon cylon-gpio cylon-i2c

Installer cylon-firmata sur votre ordinateur puis copier le dossier sur le Yn
dans le rpertoire node_modules de votre application.
npm install cylon-firmata
Une fois copi, il faut retirer le module serialport dj install sur le systme.
rm -rf ./node_modules/cylon-firmata/node_modules/firmata/node_modules/serialport
Puis dsactiver le bridge :
nano /etc/inittab
> commenter avec # la ligne:
> ttyATH0::askfirst:/bin/ash --login
Puis installer via l'application Arduino le sketch suivant pour dialoguer avec
Cylon : https://gist.github.com/edgarsilva/e73c15a019396d6aaef2
Il ne vous reste plus qu' tester :
var Cylon = require('cylon');
Cylon.robot({
connections: {
arduino: { adaptor: 'firmata', port: '/dev/ttyATH0' }
70
> touche Echap (quitter insrer)

> touche : ":w" (crire)
> touche : ":q" (quitter)
Installez Bluez aprs avoir mis jour les paquets :
opkg update
opkg install bluez5-dev
On installe nano au passage pour tre plus l'aise avec l'diteur de texte :
opkg install nano
On active le Bluetooth Low Energy
rfkill unblock bluetooth
// De manire temporaire (ncessairre chaque redmarrage)
killall bluetoothd
// De manire permanente
systemctl disable bluetooth
// On active l'adaptateur
hciconfig hci0 up
Node.js
Dj prsent avec la mise jour, il ne vous reste plus qu' utiliser npm pour
installer vos paquets. Aucune action spciale n'est donc requise !
069_071_192 17/12/15 21:25 Page71
MISE EN ROUTE DU RASPBERRY PI 2
Le Raspberry Pi est une "single-board computer" dote entre autres d'une sortie video Full HDMI. Si cet ordinateur de poche permet la mobilit, il faut cependant faire attention la consommation gnre par la gestion de l'affichage.
Pr-requis
a La dernire image de Raspbian (Jessie) : http://raspberrypi.org/downloads

a Une carte Micro-SD
a Un dongle WiFi
a Un dongle Bluetooth 4.0 (BLE)
a Le logiciel Putty http://www.putty.org/
J'ai utilis deux dongles (WiFi & Bluetooth) du fabricant Belkin.
Formater la carte SD et y installer Raspbian Jessie
La procdure est relativement simple, surtout sous Windows.
Je vous laisse donc suivre la procdure l'adresse suivante :
https://www.raspberrypi.org/documentation/installation/installing-images/
Configurer les interfaces rseaux et les outils de base
Une fois Raspbian installe, vous devez alors explorer la carte Micro-SD
pour vous rendre dans le dossier de configuration nomm etc
Pour le rseau filiaire (RJ-45)
Ouvrez le dossier network et modifiez le fichier interfaces avec n'importe quel

diteur de texte. Remplacez iface eth0 inet manual par iface eth0 inet dhcp. Insrez
la carte Micro-SD dans le Pi 2, puis dmarrez-le et branchez-le votre box.
Pour le WiFi (dongle USB)
Ouvrez le dossier network et modifiez le fichier interfaces avec n'importe quel

diteur de texte. Remplacez iface wlan inet manual par iface wlan inet dhcp. Puis vrifiez que la ligne ci-dessous (indiquant la configuration des rseaux WiFi)
est bien prsente :
wpa-conf /etc/wpa_supplicant/wpa_supplicant.conf
Dans la majorit des cas nous sommes en authentification WPA. Il faut
modifier le fichier "wpa_supplicant.conf" et ajouter :
ap_scan=1
network={
ssid="Nom de votre rseau wifi (ssid)"
proto=WPA RSN
key_mgmt=WPA-PSK
psk="Password de votre rseau wifi"
}
Vous pouvez ajouter autant de networks que dsir.
Se connecter en SSH ou SFTP au Pi 2
Pour retrouver facilement votre Pi 2, il suffit de vous connecter raspberrypi.local.

Remarque : sous Windows vous devez avoir le logiciel "bonjour" de Apple
install (lien ci-dessous). https://support.apple.com/kb/dl999
Via le logiciel Putty, remplir :
Hostname : raspberrypi.local
Connection type : SSH
Port : 22
Pour accder au fichier du Raspberry, on peux utiliser le SFTP (SSH over FTP)
avec la mme configuration et un client SFTP (tel WinSCP sous Windows).
Etendre l'espace de stockage

sudo raspi-config
Puis slectionner la premire option.
Installer Node.js
Mettre jour les paquets :

sudo apt-get update
Tlcharger et installer Node.js :
wget http://node-arm.herokuapp.com/node_latest_armhf.deb
sudo dpkg -i node_latest_armhf.deb
Installer le Bluetooth Low Energy (dongle USB)
On installe le bluetooth avec Bluez :
sudo apt-get install bluetooth bluez libbluetooth-dev libudev-dev

On branche le dongle USB, puis on vrifie que tout est ok.
sudo hciconfig
>_ Rsultat :
hci0: Type: BR/EDR Bus: USB
BD Address: 5C:F3:70:6D:08:81 ACL MTU: 1021:8 SCO MTU: 64:1
UP RUNNING
RX bytes:652 acl:0 sco:0 events:40 errors:0
TX bytes:954 acl:0 sco:0 commands:40 errors:0
Ensuite on redmarre le Bluetooth :
sudo service bluetooth restart
sudo hciconfig hci0 up
On teste le scan du Bluetooth :
sudo hcitool lescan
>_ Rsultat :
LE Scan ...
46:E9:1B:42:B0:68 (unknown)
46:E9:1B:42:B0:68 (unknown)
6B:F2:C9:23:E5:96 (unknown)
57:49:93:2B:BE:6A (unknown)
57:49:93:2B:BE:6A (unknown)
4C:91:BE:F4:31:B3 (unknown)
...
Petit plus
Pour accder l'interface graphique du Pi 2 sans cran on peut installer x11vnc

On le configure avec un mot de passe :
sudo apt-get install x11vnc
x11vnc -storepasswd "VOTRE MOT DE PASSE" ~/.vnc_passwd
x11vnc -many -rfbauth ~/.vnc_passwd
Il suffit maintenant de lancer un client VNC sur raspberrypi.local
La suite dans Programmez! 193
71
072_075_192 17/12/15 21:25 Page72
MEAN.IO (4/4)
Voici notre dernier article de la srie consacre MEAN.IO, aprs la prsentation gnrale du
framework lors du premier, et celles des concepts permettant de crer un nouveau module
dans le second, nous nous sommes attards sur un cas d'application concret : celui de la
visualisation de donnes gographiques. Depuis le dpart, nous souhaitons en effet crer une
application permettant de visualiser un ou plusieurs itinraires GPS (type randonne VTT ou
pdestre). Nous avons dfini prcdemment le modle de donnes permettant de stocker
l'information en base, ainsi que l'API REST permettant de le manipuler. Ensuite, nous avons cr
une partie cliente incluant des interfaces homme-machine (IHM) pour la prsentation et l'dition
de ces donnes. Il ne nous restait qu' ingrer et visualiser nos chemins sous formes de cartes
la faon de "Google Maps" (objet du prcdent article) ou de vues 3D la faon de "Google
Earth" (objet du prsent article).
Luc CLAUSTRES
Consultant indpendant
Crateur dApplications Numriques
http://www.digital-innovation.fr
MISE JOUR DE L'APPLICATION

Mise jour des routes
Aux routes ct front-end, qui sont gres via l'AngularUI Router, nous en
ajoutons une nouvelle dans le fichier ApplicationRoutes.js du dossier
routes de la partie publique; il s'agit de la dclaration permettant d'accder la page pour afficher la vue 3D d'un chemin :
// Page permettant de voir un chemin sur la carte
$stateProvider.state('track globe', {
url: '/track/:trackId/globe',
templateUrl: '/application/views/TrackGlobe.html',
controller: 'TrackGlobeController',
resolve: {
loggedin: function(MeanUser) {
return MeanUser.checkLoggedin();
}
}
});
Mise jour des vues
Pour la prsentation des chemins (sous forme de liste ou sous forme unitaire) nous avions utilis prcdemment despanels Bootstrap. L'en-tte (classe CSSpanel-heading) contenait notamment les actions ralisables par l'utilisateur (e.g. diter ou effacer) sous forme d'icnes, auxquelles nous rajoutons la possibilit d'ouvrir la vue 3D (Fig.1) dans public/views/Track.html :

<a data-ng-click="remove(track)"><i class="pull-right glyphicon glyphicon-trash"
> </i></a>
<a href="/track/{{track._id}}/edit"><i class="pull-right glyphicon glyphicon-edit"
> </i></a>
<a href="/track/{{track._id}}/globe"><i class="pull-right glyphicon glyphicon-globe"
> </i></a>
</div>
mais j'ai choisi d'utiliserCesium pour sa large communaut et sa simplicit (en version 1.5 lors du codage). Pour ce faire il faut rajouter "cesium":
"1.5" dans le fichierbower.json la racine de votre dossier applicatif et excuterbower install. Ensuite il faudra vous rendre dans le dossier d'installation
et excuterant pour gnrer la version minifie des sources. Ensuite il faut
modifier le app.js du module applicatif pour rajouter les fichiers ncessaires l'agrgation (voir article prcdent) :
Application.aggregateAsset('css', '../../../../../../bower_components/cesium/Build/Cesium
Unminified/Widgets/widgets.css');
Application.aggregateAsset('js', '../../../../../../bower_components/cesium/Build/Cesium
Unminified/Cesium.js', {weight: -1});
Services
Cesium tant une librairie JavaScript "standard" je l'ai tout d'abord encapsule dans un service afin de pouvoir l'injecter dans d'autres composants
AngularJS. Ceci permet de conserver une injection de dpendance la
mode AngularJS sans accder de faon directe un objet global :
// Service utilis pour accder la librairie Cesium via l'injection de dpendances
angular.module('mean.application').factory('Cesium', [ function() {
return window.Cesium; // Assume que la librairie est dj charge dans la page
}
]);
Ensuite, j'ai cr un service ddi la cration du chemin suivi en 3D. En
effet, pour reprsenter une animation 3D, Cesium se base sur un format
interne nommCZML qu'il nous faudra donc gnrer. De plus, il faut pouvoir
convertir le chemin depuis le systme godsique utilis par le GPS vers un
repre 3D utilis par Cesium; en prambule je vous propose de dcouvrir
ces diffrents systmes de coordonnes qui devront tre manipuls (Fig.2).
Systmes de coordonnes
Afin de positionner un objet sur la Terre il est ncessaire de lui attribuer des
coordonnes dans un repre li la Terre. Un tel repre doit donc tre dfini, et le cas chant complt d'une reprsentation de la Terre, pour
VUE 3D
Plusieurs librairies Open Source permettent de visualiser des donnes

gographiques sur un globe virtuel 3D comme GlobWeb ou WebGLEarth
Fig.1
Ajout dans la vue listant les chemins les actions d'accs la vue cartographique ou 3D
72
072_075_192 17/12/15 21:25 Page73
qu'une action de positionnement puisse tre mene. Il existe aujourd'hui

un grand nombre de systmes de rfrences de coordonnes dont je prsenterai les deux principaux.
Systme de coordonnes cartsiennes
Un systme de rfrence terrestre (SRT) est un repre cartsien tridimensionnel (OXYZ) que lon positionne par rapport la Terre de telle sorte que :
a Lorigine O est le gravit de la Terre ;
a Laxe OZ est laxe de rotation de la Terre ;
a Le plane OXZ est le plan mridien origine ;
a Le plan OXY est le plan de lquateur.
Un point de la crote terrestre est considr comme fixe dans un tel systme car le repre "tourne" en mme temps que la Terre. Il est repr par
ses coordonnes cartsiennes gocentriques tridimensionnelles : X, Y, Z.
Un SRT est galement appel Systme de Rfrence Godsique ou
encore "Earth-Centered, Earth-Fixed" (ECEF).
Systme de coordonnes godsiques
Comme il est relativement complexe de reprer un point sur Terre via ses
coordonnes cartsiennes, est associ un SRT un ellipsode de rvolution
qui est un modle mathmatique de la Terre dbarrasse de ses reliefs. Il
sagit approximativement dune sphre aplatie aux ples qui est une simplification du gode : la surface quipotentielle de rfrence du champ de
pesanteur terrestre. Dans un systme godsique ainsi dfini, un point est
localis par ses coordonnes gographiques (ou godsiques), exprimes
en valeurs angulaires par la latitude, la longitude, et la hauteur godsique
h mesure suivant la normale l'ellipsode (h est petit proximit de la surface terrestre). Le systme godsique le plus utilis dans le monde est le
systme WGS 84, associ au systme de positionnement GPS.
Gnration du chemin en 3D
Dans Cesium une position en systme de coordonnes godsique est un

objet de type Cesium.Cartographic et une position 3D un objet de
typeCesium.Cartesian3. Nous crivons dans notre service une premire fonction permettant de transformer notre chemin stock en base au format
gographique vers un chemin en coordonnes 3D; la transformation aura
lieu "en place" puisque chaque point possde trois coordonnes quel que
soit le systme (X, Y et Z ou longitude, latitude et altitude) :
// Service utilis pour accder l'API REST des chemins
angular.module('mean.application').factory('TrackGenerator', ['Cesium',
function (Cesium) {
// Conversion depuis tableau de coordonnes gographiques vers cartsiennes
TrackGenerator.cartographicToCartesian = function(waypoints) {
for (var i = 0; i < waypoints.length / 3; i++) {
var cartographicPosition = Cesium.Cartographic.fromDegrees(waypoints[3*i], waypoints
[3*i+1], waypoints[3*i+2]);
var position = new Cesium.Cartesian3();

Cesium.Ellipsoid.WGS84.cartographicToCartesian(cartographicPosition, position);
waypoints[3*i] = position.x;
waypoints[3*i+1] = position.y;
waypoints[3*i+2] = position.z;
}
}
}]);
Ensuite nous ajoutons une nouvelle fonction qui utilisera la premire et gnrera l'animation 3D au format CZML partir du chemin. La partie dlicate
consiste affecter chaque point du chemin un temps pour crer une animation qui soit raliste. En effet, le GPS chantillonne la position une frquence fixe (par exemple un point toutes les 5 secondes) et il manque donc
de l'information entre deux points d'chantillonnage pour avoir un mouvement continu. Pour viter d'obtenir des "sauts" entre les positions lors de la
visualisation 3D (ce qui semblerait peu raliste) la position entre deux chantillons est "interpole". L'interpolation numrique est une opration mathmatique permettant de construire une courbe continue partir d'un nombre
fini de points. Cesium supporte plusieurs types d'interpolation allant de la
plus simple qui est l'interpolation linaire (la trajectoire entre deux points est
suppose tre une ligne droite) des formes plus complexes telles quel'interpolation Lagrangienne que j'utilise et qui est base sur un calcul polynmial permettant de reprsenter un mouvement de faon plus raliste. Nous
supposons une vitesse de base de 90 km/h pour rejouer l'animation dans un
temps "raisonnable", le parcours rel pouvant avoir pris plusieurs heures.
Dans l'animation 3D nous dfinissons une entit (i.e. le "vhicule") qui suivra
le chemin ainsi cr et l'icne d'un vhicule pour reprsenter notre position,
le code de production du CZML est le suivant :
// Gnre une animation 3D au format CZML partir d'un chemin en coordonnes cartographiques
TrackGenerator.generateCzml = function(waypoints) {
// La scne CZML contient :
// - l'icne qui reprsentera le vhicule (nomm 'VehicleIcon')
// - le chemin suivi par le vhicule et utilis pour interpoler sa position (nomm 'Vehicle')
// Le chemin est donn comme un tableau de coordonnes cartographiques, donc sans
rfrence par rapport au sol (i.e. altitude).
// La position relle au niveau du sol sera calcule en temps-rel lors de l'animation.
var builtInCzml = [ ... ]; // Voir code complet pour dtails
var cartesianRoute = waypoints.slice();
this.cartographicToCartesian( cartesianRoute );
// Dfinit la date et l'heure de dpart
var epoch = Cesium.JulianDate.now();
var previousPosition;
var timeStep = 0;
Fig.2
// L'animation 3D est dfinie sous la forme d'une liste de temps/position
for (var i = 0; i < waypoints.length / 3; i++) {
var position = new Cesium.Cartesian3(cartesianRoute[3*i], cartesianRoute[3*i+1],
cartesianRoute[3*i+2]);
Systme de coordonnes cartsiennes Earth-Centered Earth-Fixed (ECEF) avec son plan tangent local ( gauche),
systme de coordonnes godsique ( droite) et diffrence entre ellipsode ( gauche) et gode ( droite)
if ( Cesium.defined( previousPosition ) )
{
var distance = Cesium.Cartesian3.distance(previousPosition, position);
// Calcul du pas de temps, on considre une vitesse de 90 km/h soit environ 25 m/s
timeStep += distance / 25;
73
072_075_192 17/12/15 21:25 Page74
}
// Pas de temps
builtInCzml[2].position.cartesian[4*i] = timeStep;
// Position
builtInCzml[2].position.cartesian[4*i+1] = position.x;
builtInCzml[2].position.cartesian[4*i+2] = position.y;
builtInCzml[2].position.cartesian[4*i+3] = position.z;
previousPosition = position;
}
// Calcul de la date et l'heure de fin
var end = new Cesium.JulianDate();
Cesium.JulianDate.addSeconds(epoch, timeStep, end);
var timeInterval = new Cesium.TimeInterval({
start : epoch,
stop : end,
isStartTimeIncluded : true,
isStopTimeIncluded : true
});
builtInCzml[2].position.epoch = epoch.toString();
builtInCzml[2].availability = timeInterval.toString();
return builtInCzml;
};
Directive
Il n'existe pas de directive AngularJS rellement "officielle", j'ai donc

cr une directive permettant d'instancier une vue 3D Cesium sur un
lment HTML (on parle de Viewer). Elle configure par dfaut une
couche de donnes image et une couche topographique pour disposer d'un terrain en 3D, l'ensemble des options possibles est dtaill sur
https://cesiumjs.org/Cesium/Build/Documentation/Viewer.html. Enfin, elle rajoute
au scope une propritviewer qui rfrence l'instance Cesium de la vue
3D et permet d'accder au contenu 3D dansviewer.scene comme le point
de vue courantviewer.scene.camera ou le globe virtuel 3Dviewer.scene.globe :
directive("cesium", ['Cesium', function (Cesium) {
return {
restrict: "E",
controllerAs: "TrackGlobeController",
link: function (scope, element, attributes) {
var options = {
sceneMode : Cesium.SceneMode.SCENE3D,
sceneModePicker : false,
scene3DOnly : true,
homeButton : false,
geocoder : false,
navigationHelpButton : true,
baseLayerPicker : false
}
scope.viewer = new Cesium.Viewer(element[0], options);
// Dfinition des fournisseurs de donnes image/terrain utiliser
scope.viewer.imageProvider = new Cesium.BingMapsImageryProvider({
url : '//dev.virtualearth.net'
});
scope.viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
url : '//assets.agi.com/stk-terrain/world'
});
74
}
}
}]);
Contrleur
Le contrleur permet la mise en musique du service back-end et des lments front-end :

a Rcupration du chemin suivi via l'API REST (de faon similaire la
carte 2D du prcdent article);
a Gnration de l'animation 3D au format CZML via le service prcdent;
a Chargement de l'animation 3D dans Cesium;
a Rcupration de l'entit et de son icne;
a Excution de l'animation 3D;
a Suivi de l'entit.
L'essentiel du code se concentre sur cette dernire partie, les autres reposant
sur des fonctions Cesium existantes. En effet, par dfaut, le chemin suivi ne
contient pas forcment l'altitude des points, ou s'il la contient elle n'est pas forcment adapte la rsolution des donnes du terrain charg dans Cesium.
Ainsi, l'entit pourrait se retrouver alatoirement positionne au-dessus ou endessous du terrain 3D, suivant la prcision des donnes terrain, ce qui peut
poser des problmes lors de la visualisation. Aussi nous allons recalculer en
temps-rel la position 3D au niveau du sol. Pour ce faire nous utiliserons la
technique dulancer de rayon qui permet de calculer l'intersection entre une
demi-droite dans l'espace (dfinie par une origine et une direction) et un objet
3D (en l'occurrence le terrain). A partir de la position altitude zro (point rouge
de la Figure 3) nous calculons l'origine du rayon de faon ce qu'il soit au-dessus du terrain en lui affectant une altitude suprieure toutes les montagnes
connues. Ensuite nous calculons la direction du rayon comme le vecteur unitaire allant de cette origine la position sur l'ellipsode, et donc pointant vers le
centre de gravit terrestre. Enfin, nous demandons Cesium de calculer l'intersection entre le rayon et la gomtrie 3D du terrain (point vert de la Fig.3).
Une fois cette position dtermine nous demandons Cesium de calculer le
repre local tangent l'ellipsode qui permet d'tre orient de faon fixe par
rapport au ple Nord. Nous "attachons" alors le point de vue, i.e. la camra virtuelle de la scne 3D, ce repre pour que l'on ait l'impression que la camra
suive l'entit sur le chemin. Au final le code du contrleur est le suivant :
// Contrleur utilis pour afficher un chemin sur un globe 3D
angular.module('mean.application').controller('TrackGlobeController', ['$scope', '$http',
'$stateParams', 'TrackService', 'TrackGenerator',
function($scope, $http, $stateParams, TrackService, TrackGenerator) {
// Projette au sol la position donne
var clampToGround = function(position) {
// Position au sol altitude 0
var cartographicPosition = new Cesium.Cartographic();
Cesium.Ellipsoid.WGS84.cartesianToCartographic(position, cartographicPosition);
// Origine du rayon la mme position mais au-dessus de tous les sommets existants
var cartographicOrigin = Cesium.Cartographic.clone(cartographicPosition);
cartographicOrigin.height = 20000; // Everest ~8000m
// Calcul du point 3D origine
var origin = new Cesium.Cartesian3();
Cesium.Ellipsoid.WGS84.cartographicToCartesian(cartographicOrigin, origin);
// Calcul de la direction du rayon : de l'origine vers le centre de la Terre
var direction = new Cesium.Cartesian3();
Cesium.Cartesian3.subtract(position, origin, direction);
Cesium.Cartesian3.normalize(direction, direction);
var ray = new Cesium.Ray(origin, direction);
var groundPosition = new Cesium.Cartesian3();
072_075_192 17/12/15 21:25 Page75
// Intersection avec le sol

return $scope.viewer.scene.globe.pick(ray, $scope.viewer.scene, groundPosition);
// Calcul du repre local la position

var transform = Cesium.Transforms.eastNorthUpToFixedFrame(position);
// Attachement du point de vue ce repre
Cesium.Matrix4.clone(transform, $scope.viewer.scene.camera.transform);
$scope.viewer.scene.camera.constrainedAxis = Cesium.Cartesian3.UNIT_Z;
}
// Recherche l'entit dans le contenu 3D
var getTrackedEntity = function() {
if (Cesium.defined($scope.lookAt)) {
$scope.trackedEntity = $scope.viewer.dataSources.get(0).entities.getById($scope.lookAt);
if (Cesium.defined($scope.trackedEntity)) {
// Vitesse de dfilement par dfaut
$scope.viewer.clock.multiplier = 1;
// Rcuprer l'icne reprsentant l'entit
$scope.trackedEntityIcon = $scope.viewer.dataSources.get(0).entities.getById($scope.
lookAt + 'Icon');
}
}
}
// Charger l'objet source au format Czml
// L'argument lookAt est le nom de l'entit suivre dans les donnes source
var loadSource = function(source, lookAt) {
$scope.lookAt = lookAt;
// Chargement de l'animation 3D
var dataSource = new Cesium.CzmlDataSource();
dataSource.load(source, 'Built-in CZML');
$scope.viewer.dataSources.add(dataSource);
// Rcupration de l'entit suivant le chemin
getTrackedEntity();
// Positionnement du callback appel chaque pas d'excution de l'animation
$scope.viewer.clock.onTick.addEventListener(function(clock) {
if ( Cesium.defined($scope.trackedEntity) ) {
// Rcupration de la position courante
var cartographicPosition = new Cesium.Cartographic();
var position = $scope.trackedEntity.position.getValue(clock.currentTime);
Cesium.Ellipsoid.WGS84.cartesianToCartographic(position, cartographicPosition);
// Calcul de la position projete au sol
var groundPosition = clampToGround(position);
if ( Cesium.defined(groundPosition) ) {
// Mise jour de la position 3D en consquence
position = groundPosition;
Cesium.Ellipsoid.WGS84.cartesianToCartographic(groundPosition, cartographicPosition);
// Et positionnement de l'icne
if ( Cesium.defined($scope.trackedEntityIcon) ) {
$scope.trackedEntityIcon.position = new Cesium.ConstantPositionProperty(ground
Position, Cesium.ReferenceFrame.FIXED);
var text = cartographicPosition.height.toFixed() + ' m';
$scope.trackedEntityIcon._label._text = new Cesium.ConstantProperty(text);
}
}
}
});
}
//Rcupre un chemin via son ID
$scope.findOne = function() {
TrackService.get({
trackId: $stateParams.trackId
}, function(track) {
$scope.track = track;
// Position par dfaut de la camra
$scope.viewer.scene.camera.lookAt(
new Cesium.Cartesian3(-1500.0, -1500.0, 500.0),
Cesium.Cartesian3.ZERO,
Cesium.Cartesian3.UNIT_Z);
loadSource( TrackGenerator.generateCzml($scope.track.waypoints), "Vehicle");
});
};
}
]);
Vue
La vue est la partie la plus simple car elle se contente d'instancier la directive et de requter le chemin en faisant appel au contrleur :
<div data-ng-init="findOne()">

<cesium/>
</div>
Fig.4
CONCLUSION
Cet article a t l'occasion de dcouvrir le domaine de la cartographie 3D
et d'approfondir nouveau votre connaissance du framework MEAN.io en
le mettant en pratique sur un cas concret dutilisation via lintgration de
librairies externes. Jespre que vous serez maintenant prts faire vos
armes en dveloppant vos propres modules ou applications. Accs au
code complet de larticle sur https://github.com/claustres/meanio-tutorial-3. u
Fig.4
Fig.3
Lancer de rayon pour calculer la position sur le terrain 3D (point vert) partir de la position
gographique sur l'ellipsode (point rouge)
Vue 3D anime d'un chemin o le marqueur suit le parcours, grce la barre "magntoscope" en
bas il est possible d'acclrer ou de se dplacer dans le temps
75
076_078_191 17/12/15 21:26 Page76
Lart de larchitecture en Java
2e partie
On va mettre laccent sur les tapes suivre pour aboutir une bonne architecture, solide, robuste et
maintenable. Pour commencer, on va voir comment bien choisir les technologies. Ensuite on va
examiner larchitecture en tudiant les diffrents outils utiliser dans un projet. Puis on va voir les
techniques et les stratgies mettre en place pour bien dvelopper. Enfin on va voir comment
maintenir le code travers les tests unitaires et les tests dintgrit.
Bouhanef Hamdi
Dveloppeur full-stack chez sfeir
https://fr.linkedin.com/in/bouhanefhamdi-62386051
Dridi Manel
Freelance web
https://www.linkedin.com/in/manel-dridiep-bouhanef-908316105
MISE EN PLACE DE LUSINE

DE DVELOPPEMENT
Aprs avoir choisi les technologies utiliser dans lapplication, on va voir

plus en dtail le choix des outils quon va utiliser pour grer le bon
fonctionnement des diffrentes plateformes et lautomatisation des
tches rcurrentes comme le build des applications. Avant de
commencer, un petit rappel des diffrents environnements simpose.
Intgration continue
Cela dpend de la stratgie du projet et des quipes, mais la logique ici

cest que, pour les dveloppeurs, on a un environnement build.
Gnralement cela est fait pour chaque commit. Et pour chaque build,
les tests sont passs pour vrifier si le commit est conforme aux tests.
Livraison continue
Le but ici est davoir une version pour la production ou pour la recette,
toute version de l'intgration continue peut tre livre. De mme cette
livraison dpend des environnements, des sprints, si en mode agile...
Dploiement continu
Le dploiement continu est le mcanisme qui permet davoir un

environnement pour tester lapplication, aprs lavoir teste et dploye.
En gnral ces environnements sont pour les recettes ou la production.
Excution automatique des tches
Il est trs utile de configurer l'excution des tches en automatique,

comme on vient de voir tout lheure, pour l'intgration, livraison ou le
dploiement continu, on aura besoin de les automatiser. Il y a plusieurs
outils sur le march, mais les plus utiliss sont les suivants:
Apache Continuum
Il intgre la plupart des fonctionnalits attendues dun tel outil comme le

support des outils de construction, systme de gestion de versioning,
notifications...
Jenkins (Hudson)
Cet outil vrifie la qualit du code, les codes morts, les imbrications trop
compliques...
CheckStyle
Il permet de vrifier le style du code crit sil est conforme ou pas. Par
exemple il vrifie les commentaires, Convention de nommage...
Sonar
Cet outil contient tous les outils cits plus haut (FindBugs, PMD et
Checkstyle). Il offre une interface conviviale pour visualiser la qualit du
code, et un reporting par projet, par package...
Systme de gestion de versioning
Il est utile de partager le code entre les dveloppeurs, dindexer le code

dans des endroits bien dfinis (pour arrter une version...). La solution
pour le faire est d'utiliser un systme de gestion de versioning. Il y a deux
types de systmes de gestion de version:
Gestion de versions centralise
Ici il ny a quun seul dpt de version, cest--dire quil n'y a quun seul
serveur qui gre le versioning. Exemple SVN, CVS...
Gestion de versions dcentralise
Dans ce type de systme, tous les dveloppeurs peuvent tre le serveur

de gestion de version. Exemple GIT ou Mercurial.
Les outils de build et de gestion de dpendances
Il y a plusieurs outils qui permettent d'automatiser le build des

applications et grer automatiquement les dpendances:
Apache Ant (Java)
Il a t cr par la fondation Apache; cest un outil qui permet

d'automatiser les oprations rptitives et de dcrire les tches de
construction.
Apache Maven (Java)
Cest un outil qui permet dautomatiser les tches et de grer les

dpendances dun projet. la diffrence avec Ant, cest une convention
plutt que configuration.
Gradle (Java)
Gradle a runi les avantages de Maven et de Ant sauf que ses fichiers de
configuration ne sont pas en XML.
Grunt (JavaScript)
Grunt permet dautomatiser lexcution des tches pour le code

JavaScript. Par exemple, zipper le code et compiler les fichiers Less.
Bower (JavaScript)
Cest un gestionnaire de paquets JavaScript.
Sans doute loutil le plus utilis, cet outil est trs puissant, il gre la
plupart des systmes de gestion de versioning, il gre aussi les tests
avec plusieurs outils et il s'intgre aussi facilement avec Sonar...
Les branches et versions
Vrification du code
Les versions
Il y a plusieurs outils qui permettent de vrifier la qualit du code et les tests:
FindBugs
Cet outil permet de chercher les bugs ventuels qui peuvent tre levs l'excution.
76
PMD
Programmez! a Dcembre 2015
Aprs avoir mis en place un systme pour grer le code, on va utiliser ce

mcanisme pour crer des versions et des branches.
Les versions sont gnralement cres pour taguer le code dans un tat bien
dfini. Par exemple quand on est en mode scrum, pour chaque sprint on peut
crer une version. Et pour chaque sprint aussi on peut taguer une version...
076_078_191 17/12/15 21:26 Page77
Les branches
Les branches sont, comme leur nom lindique, des drives de la branche
principale. Par exemple supposons quon ait une application standard de
gestion de parc automobile. On va dvelopper une version spcifique
pour un client, donc on cre une nouvelle branche pour y dvelopper
lapplication pour le client sans pour autant toucher la version standard.
En dautres termes, comme si on avait cr un nouveau dpt, sauf que
lorigine de ce dpt est une version prcise de la branche principale.
Les types denvironnements
Il y a plusieurs environnements, suivant la stratgie employer, qui peuvent tre

mis en place, nous allons citer les plus intressants et les plus utiliss : Fig.1.
Environnement de dveloppement
Au moment de dveloppement de nouvelles tches, lenvironnement de

dveloppement permet davoir un systme contenant la rsolution des
nouvelles tches en continu (la mise jour de cet environnement peut
tre journalire). Cela permet aux intervenants du projet de dtecter plus
rapidement si les dveloppements sont conformes aux besoins.
Environnement de recette
Cet environnement est en gnral une version bien dfinie du dpt; on

cre un environnement pour tester un lot de fonctionnalits ou un
module. Les dveloppements de nouvelles fonctionnalits continuent,
mais cet environnement nest pas impact par ces nouveauts. Cela
permet de valider ces fonctionnalits et de pouvoir les livrer au final.
Environnement de production
Cet environnement est comme lenvironnement de recette, cest une

version bien prcise du dpt, sauf que celui-ci est destin aux
utilisateurs finaux de lapplication. Par exemple, supposons quon soit en
train de dvelopper un site de gestion de parc informatique,
lenvironnement de dveloppement est mis jour quotidiennement,
lenvironnement de recette est mis jour mensuellement pour que les
intervenants sur le projet puissent valider les dveloppements de
maintenance et de nouvelles fonctionnalits; et lenvironnement de
production cest le site Web qui est visible par tout le monde.
DVELOPPEMENT
Dans cette partie on va voir plus en dtail les outils et les bonnes
pratiques de dveloppement. Au dbut on va explorer les diffrents IDE
et la diffrence entre elles. Ensuite on va analyser les bonnes pratiques
mettre en uvre pour aboutir une bonne architecture logicielle.
Les IDE
Pour dvelopper en Java, on peut le faire avec un diteur de texte simple

comme Vim, Gedit ou Blocnote, mais on va se rendre compte trs
rapidement que cela est trs trs difficile. Lutilisation dun IDE est
primordiale pour un dveloppement plus efficace et plus rapide. Un IDE
est un diteur de texte avec des outils en plus :
Analyseur de code
Lanalyseur de code permet de dtecter le ou les langages de

programmation pour chaque fichier et pour chaque bout de code; il
permet de lanalyser et de dtecter les ventuelles erreurs.
Fig.1
Indexation et moteur de recherche
Lindexeur permet dindexer les composants du code dune faon

smantique, par exemple il indexe les classes Java, les mthodes
JavaScript Quant au moteur de recherche, il permet de chercher un
lment (classe, mthode, fichier...).
Coloration de code
LIDE permet de colorer le code suivant les mots cls du langage pour
quil soit plus visible.
Autres fonctionnalits
Additionnellement, un diteur peut avoir dautres fonctionnalits, suivant

lditeur de lIDE. On peut trouver des serveurs intgrs, des
gestionnaires de versions, des outils pour passer les tests et voir la
couverture du code
Les diffrents IDE du march
Un diteur peut avoir une ou plusieurs des fonctionnalits cites

prcdemment, mais les fonctionnalits principales quun IDE doit avoir
est lanalyse de code et lindexation. Il y a plusieurs IDEs sur le march
qui permettent de coder en Java, voici les plus connus :
a Eclipse : Eclipse est un outil trs puissant, sous licence EPL (Eclipse
Public Licence). La puissance dEclipse est la communaut et le
nombre de plug-ins existants. Cest un outil modulaire, cest--dire quil
a un noyau qui fait les fonctionnalits basiques (charger les plug-ins, les
grer. ), et toutes les autres fonctionnalits sont sous forme de plug-ins.
a NetBeans : Cest loutil promu par Oracle, sous licence GNU Public
License. Il est crit en Java. Compos dun module central contenant
les fonctionnalits majeures, il est possible dy ajouter des plug-ins.
a Intellij : Il y a deux versions dIntellij, la Community Edition qui est
ldition gratuite mais qui ne contient que les fonctionnalits primaires
et la Ultimate Edition qui est payante. Surtout pour sa version
Ultimate, loutil est trs puissant dans lindexation et dans la
reconnaissance des langages.
Les bonnes pratiques
Un projet peut vite devenir un calvaire si on ne suit pas les bonnes pratiques
de dveloppement et darchitecture. On va voir ici quelques techniques qui
permettent davoir une architecture modulaire et maintenable. On va prendre
comme exemple une application de gestion htelire n-tiers :
La partie front
Pour cet exemple on va prendre comme architecture HTML + AJAX, mais ce quon
va voir ici est applicable pour toutes les architectures front de type HTML + Ajax :
a Minimiser les appels serveur : Pour chaque appel serveur, on passe
par plusieurs couches, la communication passe par le protocole HTTP
qui va prendre un peu de temps pour envelopper le message, puis on
va passer par certaines couches rseau (Exemple les couches du
modle OSI), ensuite, passage dans le rseau et rcupration du
message de lautre ct. On ne le remarque pas pour des
communications non rcurrentes, mais si on fait plusieurs
communications avec le serveur et quon va chaque fois yvhiculer
des donnes qui seront divises en trames Cela sera trs vite
coteux. Donc, on doit essayer de tout ramener dans une seule
requte. Par exemple si on veut afficher un affichage gnral dun
htel, et que l'on sait que lutilisateur va utiliser la vue dtaille, on
peut la ramener une seule fois. Mais il ne faut pas tomber dans
lerreur de l'excs dinformations.
a Moduler le front : Crer dans le front plusieurs modules, pour la
rutilisation et la maintenabilit. Par exemple crer un module service
(REST), qui, lui, sera la seule interface pour communiquer avec le
rseau. On peut crer un module dutilitaire, o on runit toutes les
fonctionnalits utilitaires comme manipulation des dates, les RegEx...
77
076_078_191 17/12/15 21:26 Page78
a Utiliser avec prcaution les frameworks JavaScript : Minimiser le nombre

des frameworks JavaScript, et les utiliser avec prcaution, surtout les
frameworks qui font des manipulations de DOM (comme AngularJs et Jquery).
Ils peuvent changer le DOM au mme moment et crer un mauvais rendu.
a Utiliser le CPU de lutilisateur : Si cest possible, faire les calculs dans
la partie client, cela permet de ne pas faire dappel serveur. Supposons
quil y ait mille personnes connectes sur lapplication de gestion
htelire, lapplication va afficher la liste des htels et va afficher le prix
minimum; si cinquante clients cherchent le prix minimum dans le
serveur au mme temps, le serveur aura cinquante requtes quil doit
grer. Par contre si on fait le calcul dans le front (puisquon a la liste
des htels), le serveur aura zro requte traiter, et chaque client aura
un calcul faire (ce qui nest pas coteux pour le client).
La partie back-end
a Moduler le back-end : On cre un contrleur qui va avoir pour

fonction de recevoir et de dispatcher les requtes pour une entit, un
service qui va traiter la logique mtier, et, enfin, un DAO qui va grer
les donnes. On voit aussi dans la figure que si on est dans le mme
module, la communication se fait directement entre les services
(exemple UserService et HotelService), mais toutes les
communications externes (application Web, mobile ou tout
simplement une autre application), la communication se fait avec le
contrleur (en gnral via HTTP et des services Web).
a Grer les performances : Un des problmes majeurs dans les
applications est la performance de la manipulation des donnes. On
doit donc minimiser le nombre de requtes entre lapplication et la
base de donnes puisque cette communication va passer
gnralement - comme on a vu pour la communication entre le client
et le serveur - par plusieurs couches.
Suivre les patrons de conception
Il y a un grand nombre de patrons de conception, ce sont des solutions

reconnues pour tre une bonne pratique pour un problme donn. Ils
sont diviss en plusieurs groupes, GoF (Gang of four), GRASP (General
Responsibility Assignment Software Patterns), linversion de contrle
Bien modliser les objets (Cohsion et couplage)
Le couplage est le lien entre deux units du projet. Deux classes qui
dpendent lune de lautre sont fortement couples; ce lien doit tre le plus
faible possible pour que, si on doit changer le fonctionnement dune
classe, on nait pas changer la deuxime. La cohsion fait rfrence au
nombre et la diversit des tches dont une unit est responsable, cette
cohsion devrait tre la plus forte possible, pour permettre la rutilisabilit
de la classe et avoir une homognit dans le fonctionnement de la classe.
BIEN TESTER
Lune des tapes principales dune architecture, cest de mettre en place un bon
mcanisme de test. Ce dernier nous permet davoir une cohrence entre les
demandes et le programme. Il y a plusieurs types de tests, les plus importants sont :
Les tests unitaires
Dummy
Cest le plus simple de tous, cest un objet pass au test mais jamais
utilis, en gnral on a besoin de passer un paramtre la mthode
tester mais on sait bien quil ne va pas tre utilis.
Fake
Cest une implmentation dune classe ou objet, minimale mais suffisante

pour le fonctionnement du test.
Stub
Ressemblant au fake, sauf quici on n'implmente que les mthodes qui

seront utilises.
Mock
Cest le fait de donner une implmentation proxy dans laquelle on peut y

mettre des tentacules pour nous prvenir des appels de ses mthodes et
pour surcharger des mthodes Cela nous permettra de changer des
valeurs de retour, de lever une exception ou de vrifier les tats (passage
par une mthode, lever une exception...).
Spy
Cest une drive du Mock, sauf que dans ce type de Mock, on ne

change rien (Ni la valeur de retour, ni les exceptions), on vrifie
seulement les tats.
Les outils les plus connus

JUnit (Java)
Cest le plus ancien et le plus utilis, il offre plusieurs fonctionnalits et est

compatible avec la plupart des outils de build (Maven, Gradle...) et les IDEs.
TestNG (Java)
Il est inspir par Junit, cest un framework de test trs puissant.
Jasmin (JavaScript)
Framework de test JavaScript. Cest le plus connu et le plus utilis dans

le monde JavaScript.
PhantomJS (JavaScript)
Cet outil est trs puissant, il peut tre utilis pour ouvrir des pages Web,
prendre des screenshots, excuter des actions de l'utilisateur...
Selenium (End to End)
Cest un ensemble doutils (Extention firefox, API...) destin

automatiser les tests de lapplication en excutant un script de test sur le
navigateur, appuyant sur des boutons, changeant les valeurs des
champs de texte...
Couverture des tests
Un des concepts mettre en place est le systme de couverture du

code, ce systme nous permettra davoir des mtriques sur la couverture
des tests dans le code. Sonar est un des outils qui permettent davoir
ces mtriques bien synthtises et dtailles (suivant le besoin). Il y a
plusieurs outils permettant de grer cette couverture :
Cobertura
Cest un outil Java permettant de couvrir le code, il s'intgre facilement avec

les IDEs du march (Eclipse, Intellij...). Il couvre le code en utilisant le bit-code.
Ce sont les tests de plus bas niveau, ces tests permettent de tester une
mthode, une classe ou une fonctionnalit unitaire. Ce qui nous
permettra de valider la performance et la qualit du composant test.
Emma
Les tests d'intgration
CONCLUSION
Ces tests valident l'intgrit des modules entre eux, et dans lenvironnement
final. Cela permettra de dtecter les erreurs dinterface entre les composants.
Les tests fonctionnels
Ce sont les tests qui permettent de vrifier si la spcification et le code sont conformes.
78
Les types de Mock
Utilis dans Sonar, cet outil permet davoir des mtriques bien
synthtises pour la couverture du code.
Il reste bien videmment beaucoup a dire concernant larchitecture,

comme la scurit (Oauth2, session...) et les plateformes (Saas, Paas...).
Les architectures sont en continuelle volution; ce quil faut retenir mon
avis cest dtre toujours la page, faire de la veille technologique,
structurer et formaliser ce quon apprend.
u
079_082_192 17/12/15 21:43 Page79
Dvelopper avec le SDK Kinect 2
2e partie
La Kinect 2 est le capteur de mouvements de deuxime gnration produit par Microsoft. La

Kinect intgre plusieurs capteurs dont une camra couleur full HD, un metteur et un rcepteur
infrarouge ainsi que quatre micros. De par la diversit et la nature de ses composants, exploits par
le SDK de dveloppement Kinect 2 pour Windows, la Kinect offre au dveloppeur toutes sortes de
possibilits dinteraction avec lhumain trs facilement exploitables par le SDK.
Thomas Ouvr
Consultant Infinite Square
Blog: http://blogs.infinitesquare.com/b/touvre
_bitmapIntermediateBuffer[j + 2] = (byte)(0); // red

_bitmapIntermediateBuffer[j + 3] = (byte)(0); // alpha
}
else
{
_bitmapIntermediateBuffer[j + 0] = 0; // blue
_bitmapIntermediateBuffer[j + 1] = 0; // green
_bitmapIntermediateBuffer[j + 2] = 0; // red
_bitmapIntermediateBuffer[j + 3] = 0; // alpha
}
Body Index
Les trames de profondeur donnent accs des informations se prtant

extrmement bien la mise en place dalgorithmes de reconnaissance de
formes. Les APIs du SDK permettent de dduire du flux de profondeur une
nouvelle source de donnes: le Body Index. Celui-ci permet de distinguer
les pixels dune trame de profondeur appartenant au corps dun utilisateur
des pixels de lenvironnement.
Nous allons effectuer un rendu de la camra en affichant les pixels du
corps de lutilisateur avec une couleur donne. Cela dbute par lallocation
des buffers intermdiaires:
}
_bitmapIntermediateBuffer.CopyTo(_bitmap.PixelBuffer);
_bitmap.Invalidate();
}
var source = _sensor.BodyIndexFrameSource;

var description = source.FrameDescription;
var width = description.Width;
var height = description.Height;
_bitmap = new WriteableBitmap(width, height);
_bitmapIntermediateBuffer = new byte[width * height * BGRA_BYTES_PER_PIXEL];
_bodyIndexBuffer = new byte[description.LengthInPixels];
On associe notre bitmap au contrle image et on sabonne lvnement
FrameArrived:
myImage.Source = _bitmap;
_bodyIndexReader = source.OpenReader();
_bodyIndexReader.FrameArrived += Reader_FrameArrived;
Une fois notre tableau de donnes rcupr nous allons pour chaque pixel
vrifier sil appartient au dcor ou lutilisateur puis le cas chant lui associer la couleur bleu.
private void Reader_FrameArrived(BodyIndexFrameReader sender, BodyIndexFrameArrived
EventArgs args)
{
using (var frame = args.FrameReference.AcquireFrame())
{
if (frame == null) return;
frame.CopyFrameDataToArray(_bodyIndexBuffer);
for (var i = 0; i < _bodyIndexBuffer.Length; ++i)
{
var j = i * BGRA_BYTES_PER_PIXEL;
var index = _bodyIndexBuffer[i];
if (index == 0)
{
var color = _bodyIndexColors[index];
_bitmapIntermediateBuffer[j + 0] = (byte)(255); // blue
_bitmapIntermediateBuffer[j + 1] = (byte)(0); // green
}
Sans oublier de mettre jour la mthode StopCurrentDemo pour librer les
ressources, voici un rendu pouvant tre gnr par lexemple actuel: Fig.1.
Le Body
Cette source permet au dveloppeur dobtenir prcisment les informations du corps ou squelette des utilisateurs traqus par la Kinect (Jusqu
un maximum de 6).
Les donnes de chaque utilisateur traqu sont agrges dans une instance
de la classe Body. De ces instances sont accessibles les coordonnes de
25 jointures, soit 25 points prcis sur le corps. Les 25 points du squelette
sont reprsents dans le schma suivant: Fig.2.
Positions des jointures
La premire tape consiste crer une classe JointModel, rceptacle des

donnes ncessaire laffichage de chaque jointure et permettant de notifier lUI dune mise jour de celles-ci:
public class JointModel : INotifyPropertyChanged
{
private double _x;
private double _y;
private JointType _type;
private bool _isTracked;
private Color _color = Colors.Red;
public double X
{
get { return _x; }
set { Set(ref _x, value); }
}
public double Y
{
79
079_082_192 17/12/15 21:43 Page80
get { return _y; }

set { Set(ref _y, value); }
if (Equals(prop, value)) return false;

prop = value;
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
return true;
}
public double Width
{
get { return 40; }
}
public double Height
{
get { return Width; }
}
public JointType Type
{
get { return _type; }
set
{
if (Set(ref _type, value))
{
PropertyChanged(this, new PropertyChangedEventArgs("Label"));
}
}
}
public string Label
{
get { return Type.ToString(); }
}
public bool IsTracked
{
get { return _isTracked; }
set
{
if (Set(ref _isTracked, value))
{
PropertyChanged(this, new PropertyChangedEventArgs("Visibility"));
}
}
}
public Visibility Visibility
{
get { return IsTracked ? Visibility.Visible : Visibility.Collapsed; }
}
public Color Color
{
get { return _color; }
set { Set(ref _color, value); }
}
public event PropertyChangedEventHandler PropertyChanged;
private bool Set<T>(ref T prop, T value, [CallerMemberName] string propertyName = null)
{
80
}
}
Ltape suivante consiste en louverture de la connexion avec la source de
donnes et en labonnement lvnement FrameArrived. Cest aussi
ltape idale pour initialiser quelques variables comme la liste des instances de Body, les Joints des 6 Body et la taille dune trame couleur.
var source = _sensor.BodyFrameSource;
_bodies = new Body[source.BodyCount]; // BodyCount == 6
var totalJointCount = source.BodyCount * JOINTS_PER_BODY;
_joints = new List<JointModel>(totalJointCount);
for (var i = 0; i < totalJointCount; i++)
_joints.Insert(i, new JointModel { IsTracked = false , Type = (JointType)(i % JOINTS_PER_BODY) });
SceneWidth = _sensor.ColorFrameSource.FrameDescription.Width;
SceneHeight = _sensor.ColorFrameSource.FrameDescription.Height;
{
PropertyChanged(this, new PropertyChangedEventArgs(nameof(SceneWidth)));
PropertyChanged(this, new PropertyChangedEventArgs(nameof(SceneHeight)));
}
_bodyReader = source.OpenReader();
_bodyReader.FrameArrived += Reader_FrameArrived;
Pour fonctionner, ce code ncessite dimplmenter linterface INotifyPropertyChanged et de dclarer des champs et proprits:
public event PropertyChangedEventHandler PropertyChanged;
private const int JOINTS_PER_BODY = 25;
public double SceneWidth { get; set; }
public double SceneHeight { get; set; }
private List<JointModel> _joints;
public List<JointModels> Joints
{
get { return _joints; }
}
Le handler Reader_FrameArrived peut maintenant tre implment de
sorte itrer sur tous les body mis jour laide des mthodes de lAPI. En
effet, quel que soit le nombre dutilisateurs prsents devant le capteur,
lAPI travaille sur une collection de 6 Body et les met tous jour. Une proprit IsTracked permet ensuite de dterminer sil sagit dun Body associ
un utilisateur rellement dtect. Voici une faon de les traiter:
using (var frame = args.FrameReference.AcquireFrame())
{
if (frame == null) return;
frame.GetAndRefreshBodyData(_bodies);
var bodyCount = frame.BodyCount;
for (var i = 0; i < bodyCount; i++)
{
var body = _bodies[i];
//...
079_082_192 17/12/15 21:43 Page81
}
}
Dans la boucle for, il faut mettre jour les items de la collection _joints
selon ltat du Body correspondant. Si le Body nest pas dans ltat traqued (cest--dire si elles nappartiennent pas un utilisateur), il est possible de notifier lUI que les jointures correspondantes ne doivent pas tre
affiches.
if (!body.IsTracked)
{
for (var j = 0; j < JOINTS_PER_BODY; j++)
_joints[i * JOINTS_PER_BODY + j].IsTracked = false;
continue;
}
Dans le cas contraire, chaque Body permet dobtenir une collection de
jointures via la proprit Joints. Celle-ci tant un Dictionary index sur
lnumration JointType, on utilise cette dernire pour obtenir les coordonnes et informations de chaque jointure. Ces dernires tant exprimes
dans un espace en 3 dimensions et selon le point dorigine correspondant
la Kinect, il est ncessaire de faire appel au CoordinateMapper: un objet
ralisant les calculs ncessaires pour transposer des coordonnes dans le
rfrentiel des trames couleurs, entre autres.
var mapper = frame.BodyFrameSource.KinectSensor.CoordinateMapper;
for (var j = 0; j < JOINTS_PER_BODY; j++)
{
var bodyJoint = body.Joints[(JointType)j];
var uiJoint = _joints[i * JOINTS_PER_BODY + j];
uiJoint.IsTracked = bodyJoint.TrackingState != TrackingState.NotTracked;
if (uiJoint.IsTracked)
{
var pos = mapper.MapCameraPointToColorSpace(bodyJoint.Position);
uiJoint.X = pos.X;
uiJoint.Y = pos.Y;
}
}
En loccurrence, il sagit de la mthode MapCameraPointToColorSpace du
CoordinateMapper qui est utilise, ce qui permet dobtenir des coordonnes en adquation avec la trame couleur.
En effet, les composantes X et Y ainsi obtenues correspondent directement aux coordonnes dun pixel de cette trame. Cela permet entre autres
de superposer le rendu de ces deux sources et dobtenir une image parfaitement aligne. Une opration similaire peut tre ralise avec les sources
infrarouges, de profondeur, et BodyIndex avec la mthode MapCameraPointToDepthSpace.
Pour finir, le XAML de la vue doit tre modifi pour tenir compte de ces
changements. La liste des jointures avec leurs coordonnes tant une proprit de la page dans lexemple actuel, il est possible de les afficher trs
simplement en tirant parti du binding en commenant par nommer la page:
<Page x:Class="DemoKinect.WinRT.MainPage"
x:Name="Self"
Un ItemsControl avec dans une ViewBox permettra dafficher chaque jointure dans un Canvas, sans se soucier des coordonnes des jointures pouvant tre hors de lcran: la ViewBox se chargera de tout redimensionner.
<Viewbox Stretch="Uniform">
<ItemsControl ItemsSource="{Binding ElementName=Self, Path=Joints}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas Width="{Binding ElementName=Self, Path=SceneWidth}"
Height="{Binding ElementName=Self, Path=SceneHeight}" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Visibility="{Binding Visibility}">
<Ellipse Width="{Binding Width}"
Height="{Binding Height}"
VerticalAlignment="Top"
HorizontalAlignment="Left" />
<Ellipse.Fill>
<SolidColorBrush Color="{Binding Color}" />
</Ellipse.Fill>
</Ellipse>
<TextBlock Text="{Binding Label}"
Margin="30"/>
<Grid.RenderTransform>
<TranslateTransform X="{Binding X}"
Y="{Binding Y}" />
</Grid.RenderTransform>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Viewbox>
Etats des mains et HandState
Une autre information trs intressante prsente sur le Body concerne

ltat des mains des utilisateurs dtects, au dtail prt quelle est limite
deux utilisateurs simultans maximum. Ces informations permettent de
dtecter trois postures particulires adoptes par les mains de lutilisateur,
exprimes chacune par une valeur de lnumration HandState:
a Open: la paume de la main est ouverte (tout en faisant face au capteur);
a Closed: le poing est ferm, pousse et autres doigts rentrs;
a Lasso: le poing est ferm, mais un ou deux doigts sont tendus (gnralement lindex et le majeur, un seul doigt peut ne pas suffire selon les
proportions de la main);
Ces postures vont permettre la mise en place dinteractions entre lutilisateur et lapplicatif: le mode Lasso servant gnralement effectuer une
action prcise comme le dtourage dune forme ou le mode Closed reprsentant la volont daccrocher un lment pour le dplacer. Ltat de
chaque main est expos travers les proprits HandLeftState et HandRightState.
Afin de faire ressortir ces informations lcran il est possible dadapter le
code de sorte augmenter la taille des jointures des mains et modifier
leur couleur selon ltat dtect. Pour cela, la proprit Width de la classe
JointModel peut retourner une valeur dpendante de son type:
public double Width
{
get
{
return Type == JointType.HandLeft || Type == JointType.HandRight
? 40
81
079_082_192 17/12/15 21:43 Page82
: 20;
}
}
Ensuite, au moment de dterminer les coordonnes de chaque jointure
(seconde boucle for du handler Reader_FrameArrived), un test sur la proprit Type aidant, il est possible de modifier la couleur de la jointure selon
le HandState:
if (uiJoint.IsTracked)
{
if (uiJoint.Type == JointType.HandLeft)
uiJoint.Color = HandStateToColor(body.HandLeftState);
if (uiJoint.Type == JointType.HandRight)
uiJoint.Color = HandStateToColor(body.HandRightState);
var pos = mapper.MapCameraPointToColorSpace(bodyJoint.Position);
uiJoint.X = pos.X - uiJoint.Width / 2;
uiJoint.Y = pos.Y - uiJoint.Height / 2;
}
La mthode HandStateToColor, pour finir, dtermine la couleur associe
chaque valeur de lnumration HandState:
return state == HandState.Closed
? Colors.Yellow
: state == HandState.Open
? Colors.Green
: state == HandState.Lasso
? Colors.Blue
: state == HandState.Unknown
? Colors.Gray
: Colors.Transparent;
Exemple de rendu effectu par-dessus le rendu de la camra couleur: Fig.3.
Cest bien videmment de la source Body dont le dveloppeur se servira la
plupart du temps pour effectuer le code mtier propre son application et
autoriser les interactions entre utilisateurs et applicatif. Nanmoins, ce dernier doit garder en tte que ce ne sont pas les seules possibilits du SDK.
En effet, la source Body permet priori de tout faire: reconnatre des
gestures, des postures, obtenir la position de lutilisateur ou une reprsentation de celui-ci dans lespace. Bref, un peu de code et quelques algorithmes bien implments peuvent sembler tre la solution tous les cas
de figure, mais, certains ne sy tromperont pas: cela demande parfois de
solides comptences en mathmatiques.
Cest pourquoi dautres articles venir traiteront de cas plus prcis comme
la mise en place du framework Touch-Less intgr au SDK, permettant
dutiliser la Kinect comme un dispositif de pointage de manire quasi transparente pour le dveloppeur et intuitive pour lutilisateur. Un autre outil,
Visual Gesture Builder, permet quant lui de mettre en place des scnarios
de reconnaissance de gestures mme complexes, pour bien moins defforts de la part du dveloppeur que si la dtection ne devait se baser que
sur du code maison.
u
Fig.1
Abonnement : Service Abonnements PROGRAMMEZ, 4 Rue de Mouchy, 60438

Noailles Cedex. - Tl. : 01 55 56 70 55 - abonnements.programmez @groupe-gli.com - Fax :
01 55 56 70 91 - du lundi au jeudi de 9h30
12h30 et de 13h30 17h00, le vendredi de
9h00 12h00 et de 14h00 16h30. Tarifs
abonnement (magazine seul) : 1 an - 11 numros France mtropolitaine : 49 - Etudiant :
39 CEE et Suisse : 55,82 - Algrie,
Maroc, Tunisie : 59,89 Canada :
68,36 - Tom : 83,65 - Dom : 66,82
Autres pays : nous consulter.
PDF : 30 (Monde Entier) souscription
sur www.programmez.com
Fig.2
Une publication Nefer-IT

7 avenue Roger Chambonnet
91220 Brtigny sur Orge
redaction@programmez.com
Tl. : 01 60 85 39 96
Directeur de la publication
& rdacteur en chef : Franois Tonic
Secrtaire de rdaction : Olivier Pavie

Ont collabor ce numro : S. Saurel
Experts : T. Ouvr, F. Chevalier, G. Deruette, N. Lamti,
L. Claustres, J-F Garreau, B. Hamdi, D. Manel, M. Bouilloux,
G. Delattre, J. Salomon, V. Michalak, C. Rodriguez, A. Zanchetta,
B. Bideaux, S. Sibu, Jeffr3y, F. Sagez, S. Blanchard, Chengbo,
Morgane, E. Cunibil, M. Turcotte, A. Byron, C. Villeuneve,
E. Quadrille.
Photos/illustrations : Drupal - D.R., F. Chevalier ISTOCK - DOLGACHOV

Maquette : Pierre Sandr
Publicit : PC Presse,
Tl.: 01 74 70 16 30, Fax : 01 41 38 29 75
pub@programmez.com
Imprimeur : S.A. Corelio Nevada Printing, 30 alle de la
recherche, 1070 Bruxelles, Belgique.
Marketing et promotion des ventes :
Agence BOCONSEIL - Analyse Media Etude
Directeur : Otto BORSCHA oborscha@boconseilame.fr
Responsable titre : Terry MATTARD
Tlphone : 09 67 32 09 34
Fig.3
Contacts
Rdacteur en chef :
ftonic@programmez.com
Rdaction : redaction@programmez.com
Webmaster : webmaster@programmez.com
Publicit : pub@programmez.com
Evenements / agenda :
redaction@programmez.com
Dpt lgal : parution - Commission paritaire :
1215 K 78366 - ISSN : 1627-0908
NEFER-IT / Programmez, dcembre 2015
Toute reproduction intgrale ou partielle est
interdite sans accord des auteurs
et du directeur de la publication.
Sur abonnement ou en kiosque
Le mag
m
magazine
gazine
g
d pros
des
p s de lIT
T
Mais aussi sur le web
Ou encore sur votre tablette
!
ON 21
VERSIO
DISPONIBLE
MONTPELLIER MARSEILLE LYON TOULOUSE BORDEAUX NANTES

PARIS LILLE BRUXELLES STRASBOURG GENVE (MONTRAL)
AFFLUENCE RECORD DANS LES

11 VILLES DU TDF DES VERSIONS 21
Merci de votre fidlit

Mag PDF Programmez192

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Mag PDF Programmez192

Transféré par

Droits d'auteur :

Formats disponibles

programmez!

Les ralits alternatives

Oculus, Hololens, Google Glass...

Redcouvrez ces machines mythiques et comment les programmer

Connecter des objets

M 04319 - 192 - F: 5,95 E - RD

Pub cahier couv 192_192 17/12/15 21:00 Page2

003v2_192_192 18/12/15 12:41 Page3

Tu vas aimer linformatique vintage.

P.S. : nous remercions tous les auteurs et contributeurs, tous

Toute la rdaction de Programmez !

Ce premier numro de lanne vous propose

La grande nouvelle de ces dernires

lire dans le prochain numro n193 en kiosque le 30 janvier 2016

Les tests et vous

Les tests font partie du dveloppement et du quotidien du

Pourquoi utiliser le modle orient

Programmez! a Janvier 2016

004_005_192 17/12/15 21:05 Page4

soire continuous delivery avec Jenkins et Docker. Le 19 janvier partir

Retrouvez +250 dveloppeurs sur de nombreuses

organise plusieurs hackathonset concours :

L'diteur Alfresco organise une journe IT/technique le 30 mars 2016

MUG Strasbourg: les prochaines runions

Le Microsoft User Group de Strasbourg organise rgulirement pour

Quelques dates retenir

La confrence dveloppeur de Xamarin se

Trs gros succs Nantes, la DevFest arrive Paris. Cette grande

La confrence NCRAFTS2016 aura lieu cette anne

Les vnements Zenika

Programmez! a Janvier 2016

un aperu de la prochaine version du

rapport ce quelles ont dj entendu sur

organise une runion AngularJS /Angular2 le 14 janvier.

004_005_192 17/12/15 21:05 Page5

CREZ FACILEMENT DES SITES

Rendez vos sites

006_007_192 17/12/15 21:06 Page6

Ecran tactile officiel Raspberry Pi

Les caractristiques de lcran

nappes dans les connecteurs et

En lui-mme, le montage nest pas

Si le montage est correct, connectez lalimentation sur le connecteur

Codez directement sur lcran

Soyons clairs, pour de petits projets, crer des objets directement

Programmez! a Janvier 2016

les gros doigts vont vite avoir

Franchement, malgr un prix un

applications avec interfaces adaptes pour piloter votre domotique

006_007_192 17/12/15 21:06 Page7

008_009_192 17/12/15 23:14 Page8

Un dveloppeur au cur du Vietnam

Programmez! a Janvier 2016

a Environnement Atlassian : JIRA (soft pour le suivi

sion de recruter et de former du personnel qualifi

008_009_192 17/12/15 23:14 Page9

010_015_192 18/12/15 12:46 Page10

Ralits Alternatives et Objets Connects

Diffrences entre Ralit

Ralit Augmente (RA)

La ralit augmente dsigne un procd

Programmez! a Janvier 2016

Utilisation du bracelet Myo afin de contrler la lecture dune vido

Ralit Virtuelle (RV)