This document discusses using JavaScript and HTML5 for in-vehicle infotainment systems. It describes several automotive companies and organizations that are members of the W3C working group on this topic. It then provides examples of code for accessing vehicle APIs from JavaScript using the proposed Genivi, QNX, Tizen, and Webinos standards.

1. JS in Automotive
JS.everywhere(2013) - Treasure Island, SF
Alexandre Morgaut

2. Presentation
Alexandre Morgaut
W3C AC member
Wakanda Team
Community manager
Web Architect
JS, REST, NoSQL
W3C “jseverywhere“ community group
@amorgaut

3. W3C Business Group
http://www.w3.org/community/autowebplatform/

4. Members
Intel
Porsche
QNX
Hyundai
Verisign
Volkswagen
Opera
Ford*
Nokia
Continental Automotive*
Blackberry
KKDI
Vodaphone
LG Electronics
Sharp
...

5. QNX Architecture

6. Why HTML5 for Auto
Build on something bigger than automotive
Ecosystem – developers, tools, companies
Standards – no vendor lock-in
Flexibility – fluid deployment and architectures
Branding – brand same app on different cars with CSS
Lifespan – will be supported for long time
Time to market – easy to use and leverage
Powerful – rich application environment
Cross-platform – deploy apps on phones and car

7. Other Solutions
Android
Compatibility limited to Android devices
Android not yet automotive grade
MirrorLink
Responsiveness lacking today
Solves phone to car problem, nothing else

8. TIZEN IVI in Jaguar LandRover
The proof of concept has been created on openly available
hardware with an Intel CPU, using the Tizen open source Linux
distribution as a software platform with latest HTML5 graphical
user interface. Tizen was chosen as a GENIVI compliant
reference.
http://www.tizenexperts.com/2013/04/jaguar-land-rover-kerjasama-dengan-xchanging-dan-arynga-untuk-update-software-tizen-ivi/
http://tizentalk.com/2013/05/tizen-ivi-proof-of-concept-on-the-land-rover/

9. JavaScript API

10. Considered W3C APIs
Web Sockets
Web Audio
App Cache
Media Capture
Web Storage
Proximity Sensor
Geolocation
Telephony API
Device Orientation
...
http://www.w3.org/community/autowebplatform/wiki/Main_Page/
CollectionOfApis

11. API proposals
Genivi
QNX
Tizen
Webinos
http://www.w3.org/community/autowebplatform/wiki/
Main_Page#Auto_and_Web_Platform__API_draft_proposals

12. Genevi/LGE code example
// Define constants for transmissionGearType
var TRANSMISSIONGEARTYPE_AUTO = 1;
var TRANSMISSIONGEARTYPE_MANUAL = 2;
// Get a transmission gear type from VehicleInfoEvent
vehicle.get("vehicleinfo_transmissiongeartype", handleVehicleData, handleError)
function handleVehicleData(data) {
if (data.transmissionGearType == TRANSMISSIONGEARTYPE_AUTO) {
console.log("Automatic transmission equipped");
}
else if (data.transmissionGearType == TRANSMISSIONGEARTYPE_MANUAL) {
console.log("Manual transmission equipped");
}
}

13. Tizen code example
navigator.vehicle.get("HVAC", onsuccess, onerror);
function onsuccess(value) {
var hvacsettings = value;
value.AirflowDirection = value.AIRFLOWDIRECTION_FRONT | value.AIRFLOWDIRECTION_DEFROSTER;
navigator.vehicle.set("HVAC", value, onsetsuccess, onerror);
}
function onerror(e) {
window.console.error(e.message);
}
function onsetsuccess() {
window.console.log("success!");
}

14. QNX code example
//define a callback function
function myCallback(audioMixerItems) {
//iterate through the changed items
for (var i = 0; i < audioMixerItems.length; i++) {
console.log(
//a car.audiomixer.AudioMixerSetting value
"audio mixer item setting = " + audioMixerItems[i].setting + 'n' +
//a car.Zone value
"audio mixer item zone = " + audioMixerItems[i].zone + 'n' +
//a numeric value
"audio mixer item value = " + audioMixerItems[i].value + 'nn'
);
}
}
var watchId = car.audiomixer.watchAudioMixer(myCallback);

15. Webinos code example
// checking if driver door is openend. vehicleService is the vehicle service,
// discovered through the webinos Discovery API,
// that has been selected by the user
vehicleService.vehicle.addEventListener("doors", doorHandler);
function doorHandler(doors){
if(doors.driver){
document.getElementById("info").innerHTML = 'Please close driver door';
}
}

19. Thanks
http://www.w3.org/community/autowebplatform/
@amorgaut
http://about.me/amorgaut