Table des Matières
Publicité
7. Utilisation du Yocto-Color en JavaScript / EcmaScript
}
refresh();
}
async function refresh()
{
let
serial = document.getElementById('serial').value;
if(serial ==
'') {
// by default use any connected module suitable for the demo
let
anyLed = YColorLed.FirstColorLed();
if(anyLed) {
let
module =
serial =
document.getElementById('serial').value
}
}
led1 = YColorLed.FindColorLed(serial+'.colorLed1');
led2 = YColorLed.FindColorLed(serial+'.colorLed2');
if(await led1.isOnline()) {
document.getElementById('msg').value
} else {
document.getElementById('msg').value
}
setTimeout(refresh, 500);
}
window.setColor
=
{
// Change the color in two different ways
led1.set_rgbColor(color);
led2.rgbMove(color,1000);
};
startDemo();
Vous trouverez aussi à la racine de l'exemple un fichier demo.html qui contient les éléments
d'interface HTML de l'application de démonstration:
<!DOCTYPE html>
<html>
<head>
<title>Hello
World</title>
<script
src='jspm_packages/system.js'></script>
<script
src='jspm.browser.js'></script>
<script
src='jspm.config.js'></script>
<script>
System.import('app/helloworld.js');
</script>
<!-- When going in production, you can generate a self-contained js file using
jspm build --minify src/demo.js demo-sfx.js
and replace the 6 lines above by just this one:
<script src='demo-sfx.js'></script>
-->
</head>
<body>
Module to use:
<input
<input
id='msg' style='color:red;border:none;' readonly><br>
<a
href='javascript:setColor(0xFF0000);'>Red</a><br>
<a
href='javascript:setColor(0x00FF00);'>Green</a><br>
<a
href='javascript:setColor(0x0000FF);'>Blue</a>
</body>
</html>
Comme précédemment, les deux commandes suivantes vont charger et installer automatiquement
les composants nécessaires pour l'exécution de cet exemple:
npm install
jspm install
36
await
anyLed.module();
await
module.get_serialNumber();
function(color)
// immediate switch
// smooth transition
id='serial'>
= serial;
= '';
=
'Module not
connected';
www.yoctopuce.com
Publicité
Table des Matières
