CrowlKit - Sensors uitlezen

De klasse biedt een systematische benadering om de beschikbaarheid en gegevens van verschillende sensoren te controleren en op te halen:

  • Geolocation: Bepaalt de geografische positie van een apparaat.
  • Ambient Light Sensor: Meet de omgevingslichtintensiteit in de buurt van het apparaat.
  • Battery Status: Biedt informatie over de batterijstatus van het apparaat.
  • Network Information: Geeft informatie over het type netwerkverbinding.
  • Device Memory: Biedt informatie over het geheugen van het apparaat.
  • Clipboard API: Interacteert met het klembord van het apparaat.
  • Accelerometer: Meet de versnelling van het apparaat.
  • Gyroscope: Meet de rotatie of draaiing van het apparaat.
  • Magnetometer: Meet het magnetische veld rond het apparaat.

Het is heel eenvoudig om sensorgegevens uit te lezen in CrowlKit. 

Opgelet! Een aantal sensoren zijn enkel beschikbaar op mobiele toestellen! Op een gewone laptop kan je niet de accelerometer, gyroscoop of magnetometer uitlezen. Je kan die gegevens natuurlijk wel opvragen via een mobiele telefoon en eventueel doorsturen naar een andere computer in real time. 

De libary laden

In de head-van je pagina met je een link leggen naar de correcte libary.

<script src="https://cdn.publihub.media/lib/crowl.appsensors.js"></script>

Sensors toevoegen aan je app

Daarna kan je in je pagina/app een sensor toevoegen:

<!-- Sensor elementen voor verschillende sensoren -->
<app-sensor type="geolocation" id="loc" refreshrate="3000"></app-sensor>
<app-sensor type="ambientLight" id="ambientlight" refreshrate="4000"></app-sensor>
<app-sensor type="battery" id="battery" refreshrate="5000"></app-sensor>
<app-sensor type="network" id="network" refreshrate="6000"></app-sensor>
<app-sensor type="memory" id="memory" refreshrate="5000"></app-sensor>
<app-sensor type="clipboard" id="clipboard" refreshrate="5000"></app-sensor>
<app-sensor type="accelerometer" id="accelerometer" refreshrate="5000"></app-sensor>
<app-sensor type="gyroscope" id="gyroscope" refreshrate="1000"></app-sensor>
<app-sensor type="magnetometer" id="magnetometer" refreshrate="5000"></app-sensor>

OPGELET/ in de nieuwste generatie browsers werkt "battery" niet meer als sensor. 

Een app-sensor-element heeft drie mogelijke attributen:

  • type: hierboven zie je alle mogelijke types.
  • id: je geeft elke sensor een uniek id. Het heeft trouwens geen zin om een bepaald type sensor meer dan één keer in je pagina op te nemen.
  • refreshrate: de refreshrate geeft aan om de hoeveel tijd de gegevens moeten worden ververst. 1000 komt overeen met 1 seconde. 

Data opvragen met code

Opgelet: om onderstaande code te gebruiken met ook app.js geladen zijn. Controleer of de link naar het CrowlKit-framework aanwezig is in de head van je pagina (<script src="https://cdn.publihub.media/lib/crowl.appsensors.js"></script>). 

De app-sensor is niet te zien in je pagina, maar hij vraagt wel gegevens op. Als je die data wil gebruiken, dan moet je KitCode gebruiken om met die data iets te gaan doen.  

id("gyroscope").after("change").do(
   function(data){
        terminal(data.detail)
   }
);

Data opvragen gebeurt op de typische KitCode-manier. Je neemt het id van de sensor waarvan je de data wil opvragen. In het bovenstaande voorbeeld vragen we data op van de sensor met id "gyroscope". Bij elke wijziging (change) vragen we de "data" op. De details van de data geven we weer in een terminal-venster. Dat verschijnt onderaan de pagina; 

Die opgevraagde details kan je vervolgens weer gebruiken voor andere doeleinden. 

id("loc").after("change").do(
    function(data){
       terminal(data.detail);
    }
);

In het voorbeeld hier boven vragen we de GPS-coördinaten op. In de terminal zien we dan voor data.detail:

{"latitude":50.8680214,"longitude":4.7065724}

Als je nu de latitude wil gebruiken vraag je op data.detail.latitude.

Bekijk de demo:  https://cdn.publihub.media/demos/sensormap/
Of bekijk de demo-code:  https://cdn.publihub.media/viewsource/?url=https://cdn.publihub.media/demos/sensormap
Volgende pagina