preparation of a more simple HMI, draft

24 files changed, 1844 insertions, 0 deletions

diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMap.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMap.xcf
new file mode 100644
index 0000000..81da5af
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMap.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapBottom.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapBottom.xcf
new file mode 100755
index 0000000..25cbdd3
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapBottom.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapGuidance.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapGuidance.xcf
new file mode 100755
index 0000000..464e3d6
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapGuidance.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapRoute.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapRoute.xcf
new file mode 100755
index 0000000..990a7c3
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapRoute.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapScroll.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapScroll.xcf
new file mode 100755
index 0000000..27f6842
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapScroll.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSettings.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSettings.xcf
new file mode 100755
index 0000000..537b101
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSettings.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSimulation.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSimulation.xcf
new file mode 100755
index 0000000..8b3c580
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapSimulation.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapTop.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapTop.xcf
new file mode 100644
index 0000000..ba56540
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppBrowseMapTop.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppMain.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppMain.xcf
new file mode 100755
index 0000000..6a39bd7
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppMain.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppPOI.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppPOI.xcf
new file mode 100644
index 0000000..50ee99d
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppPOI.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSearch.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSearch.xcf
new file mode 100644
index 0000000..e3cf05e
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSearch.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettings.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettings.xcf
new file mode 100644
index 0000000..b76582b
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettings.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsPreference.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsPreference.xcf
new file mode 100644
index 0000000..a15a2db
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsPreference.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsSettingsLanguageAndUnits.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsSettingsLanguageAndUnits.xcf
new file mode 100644
index 0000000..a950bda
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppSettingsSettingsLanguageAndUnits.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppTripComputer.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppTripComputer.xcf
new file mode 100644
index 0000000..0fb21ff
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/NavigationAppTripComputer.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/800x480/button-keyboard.xcf b/src/hmi/qml/Core/gimp/draft-theme/800x480/button-keyboard.xcf
new file mode 100644
index 0000000..23fdc4a
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/800x480/button-keyboard.xcf
diff --git a/src/hmi/qml/Core/gimp/draft-theme/LICENSE b/src/hmi/qml/Core/gimp/draft-theme/LICENSE
new file mode 100644
index 0000000..47c14d8
--- /dev/null
+++ b/src/hmi/qml/Core/gimp/draft-theme/LICENSE
@@ -0,0 +1,8 @@
+SPDX-License-Identifier: CC-BY-SA-4.0

+

+Copyright (C) 2015, PCA Peugeot Citroen

+

+Author Philippe Colliot <philippe.colliot@mpsa.com>

+

+This work is licensed under the Creative Commons Attribution-ShareAlike 4.0 Unported License. 

+To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/4.0/ or send a letter to Creative Commons, 444 Castro Street, Suite 900, Mountain View, California, 94041, USA.

diff --git a/src/hmi/qml/NavigationApp.qml b/src/hmi/qml/NavigationApp.qml
new file mode 100644
index 0000000..cb115f4
--- /dev/null
+++ b/src/hmi/qml/NavigationApp.qml
@@ -0,0 +1,53 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2017, PSA GROUPE
+*
+* \file NavigationApp.qml
+*
+* \brief This file is part of the navigation hmi.
+*
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.0
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1 
+import QtQuick.Controls 1.0
+import QtQuick.Layouts 1.0
+import QtQuick.Dialogs 1.0
+import "Core/style-sheets/style-constants.js" as Constants;
+import "Core/style-sheets/NavigationAppBrowseMap-css.js" as StyleSheetMap;
+import "Core/genivi.js" as Genivi;
+
+ApplicationWindow {
+	id: container
+    visible: true
+    width: StyleSheetMap.menu[Constants.WIDTH];
+    height: StyleSheetMap.menu[Constants.HEIGHT];
+	property Item component;
+	function load(page)
+	{
+		if (component) {
+			component.destroy();
+		}
+		component = Qt.createQmlObject(page+"{}",container,"dynamic");
+	}
+
+	Component.onCompleted: {
+        Genivi.setlang("eng_USA"); //by default set to english US
+        load("navigationAppMain");
+	}
+}
diff --git a/src/hmi/qml/NavigationAppBrowseMap.qml b/src/hmi/qml/NavigationAppBrowseMap.qml
new file mode 100644
index 0000000..ec6bc42
--- /dev/null
+++ b/src/hmi/qml/NavigationAppBrowseMap.qml
@@ -0,0 +1,921 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2017, PSA GROUPE
+*
+* \file NavigationAppBrowseMap.qml
+*
+* \brief This file is part of the navigation hmi.
+*
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.0
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1
+import "Core"
+import "Core/genivi.js" as Genivi;
+import "Core/style-sheets/style-constants.js" as Constants;
+import "Core/style-sheets/NavigationAppBrowseMap-css.js" as StyleSheetMap;
+import "Core/style-sheets/NavigationAppBrowseMapBottom-css.js" as StyleSheetBottom
+import "Core/style-sheets/NavigationAppBrowseMapRoute-css.js" as StyleSheetRoute
+import "Core/style-sheets/NavigationAppBrowseMapGuidance-css.js" as StyleSheetGuidance
+import "Core/style-sheets/NavigationAppBrowseMapScroll-css.js" as StyleSheetScroll
+import "Core/style-sheets/NavigationAppBrowseMapSimulation-css.js" as StyleSheetSimulation
+import "Core/style-sheets/NavigationAppBrowseMapTop-css.js" as StyleSheetTop
+
+import lbs.plugin.dbusif 1.0
+
+HMIMenu {
+	id: menu
+    property string pagefile:"NavigationAppBrowseMap"
+    next: scrollup
+	prev: menub
+	property Item guidanceWaypointReachedSignal;
+	property Item guidanceManeuverChangedSignal;
+    property Item guidancePositionOnRouteChangedSignal;
+	property Item mapmatchedpositionPositionUpdateSignal;
+	property Item mapmatchedpositionAddressUpdateSignal;
+    property Item simulationStatusChangedSignal;
+    property Item simulationSpeedChangedSignal;
+	property Item fuelStopAdvisorSignal;
+	property bool north:false;
+    property int speedValueSent: 0;
+
+	DBusIf {
+		id:dbusIf
+	}
+
+	function guidanceManeuverChanged(args)
+	{
+        Genivi.hookSignal("guidanceManeuverChanged");
+        // TODO: Create possibility to poll information?
+		// console.log("guidanceManeuverChanged");
+		// Genivi.dump("",args);
+        maneuverAdvice.text=Genivi.Maneuver[args[1]];
+	}
+
+	function guidanceWaypointReached(args)
+	{
+        Genivi.hookSignal("guidanceWaypointReached");
+        // console.log("guidanceWaypointReached");
+		// Genivi.dump("",args);
+		if (args[2]) {
+            maneuverAdvice.text="Destination reached";
+		} else {
+            maneuverAdvice.text="Waypoint reached";
+		}
+
+	}
+
+    function guidancePositionOnRouteChanged(args)
+	{
+        Genivi.hookSignal("guidancePositionOnRouteChanged");
+        updateGuidance();
+	}
+	
+	function mapmatchedpositionPositionUpdate(args)
+	{
+        Genivi.hookSignal("mapmatchedpositionPositionUpdate");
+        var res=Genivi.mapmatchedposition_GetPosition(dbusIf);
+        for (var i=0;i<res[3].length;i+=4){
+            if (res[3][i+1]== Genivi.NAVIGATIONCORE_SPEED){
+                vehicleSpeedValue.text=res[3][i+3][3][1];
+            }
+        }
+	}
+
+    function simulationSpeedChanged(args)
+    {
+        Genivi.hookSignal("simulationSpeedChanged");
+        if (args[1] == 0) {
+            speedValue.text="0";
+            speedValueSent=0;
+        }
+        if (args[1] == 1) {
+            speedValue.text="1/4";
+            speedValueSent=1;
+        }
+        if (args[1] == 2) {
+            speedValue.text="1/2";
+            speedValueSent=2;
+        }
+        if (args[1] == 4) {
+            speedValue.text="1";
+            speedValueSent=3;
+        }
+        if (args[1] == 8) {
+            speedValue.text="2";
+            speedValueSent=4;
+        }
+        if (args[1] == 16) {
+            speedValue.text="4";
+            speedValueSent=5;
+        }
+        if (args[1] == 32) {
+            speedValue.text="8";
+            speedValueSent=6;
+        }
+        if (args[1] == 64) {
+            speedValue.text="16";
+            speedValueSent=7;
+        }
+    }
+
+    function simulationStatusChanged(args)
+    {
+        Genivi.hookSignal("simulationStatusChanged");
+        if (args[1] != Genivi.NAVIGATIONCORE_SIMULATION_STATUS_NO_SIMULATION)
+        {
+            on_off.setState("ON");
+            if (args[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_PAUSED || args[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_FIXED_POSITION)
+            {
+                simu_mode.setState("PAUSE");
+            }
+            else
+            {
+                if (args[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_RUNNING)
+                {
+                    simu_mode.setState("PLAY");
+                }
+            }
+        }
+        else
+        {
+            on_off.setState("OFF");
+            simu_mode.setState("FREE");
+        }
+}
+
+    function updateSimulation()
+    {
+        var res=Genivi.mapmatchedposition_GetSimulationStatus(dbusIf);
+        if (res[1] != Genivi.NAVIGATIONCORE_SIMULATION_STATUS_NO_SIMULATION)
+        {
+            on_off.setState("ON");
+            if (res[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_PAUSED || res[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_FIXED_POSITION)
+            {
+                simu_mode.setState("PAUSE");
+            }
+            else
+            {
+                if (res[1] == Genivi.NAVIGATIONCORE_SIMULATION_STATUS_RUNNING)
+                {
+                    simu_mode.setState("PLAY");
+                }
+            }
+        }
+        else
+        {
+            on_off.setState("OFF");
+            simu_mode.setState("FREE");
+        }
+
+        var res1=Genivi.mapmatchedposition_GetSimulationSpeed(dbusIf);
+        if (res1[1] == 0) {
+            speedValue.text="0";
+            speedValueSent=0;
+        }
+        if (res1[1] == 1) {
+            speedValue.text="1/4";
+            speedValueSent=1;
+        }
+        if (res1[1] == 2) {
+            speedValue.text="1/2";
+            speedValueSent=2;
+        }
+        if (res1[1] == 4) {
+            speedValue.text="1";
+            speedValueSent=3;
+        }
+        if (res1[1] == 8) {
+            speedValue.text="2";
+            speedValueSent=4;
+        }
+        if (res1[1] == 16) {
+            speedValue.text="4";
+            speedValueSent=5;
+        }
+        if (res1[1] == 32) {
+            speedValue.text="8";
+            speedValueSent=6;
+        }
+        if (res1[1] == 64) {
+            speedValue.text="16";
+            speedValueSent=7;
+        }
+    }
+
+    function getDBusSpeedValue(value)
+    {
+        var returnValue;
+        switch (value)
+        {
+            case 0:
+                returnValue = 0;
+            break;
+            case 1:
+                returnValue = 1;
+            break;
+            case 2:
+                returnValue = 2;
+            break;
+            case 3:
+                returnValue = 4;
+            break;
+            case 4:
+                returnValue = 8;
+            break;
+            case 5:
+                returnValue = 16;
+            break;
+            case 6:
+                returnValue = 32;
+            break;
+            case 7:
+                returnValue = 64;
+            break;
+            default:
+                returnValue = 0;
+            break;
+        }
+        return	returnValue;
+    }
+
+	function updateAddress()
+	{
+        var res=Genivi.mapmatchedposition_GetCurrentAddress(dbusIf);
+        if (res[3][1] == Genivi.NAVIGATIONCORE_STREET) {
+            currentroad.text=res[3][3][3][1];
+		} else {
+            currentroad.text="";
+		}
+	}
+
+	function mapmatchedpositionAddressUpdate(args)
+	{
+        Genivi.hookSignal("mapmatchedpositionAddressUpdate");
+        updateAddress();
+	}
+
+	function showZoom()
+	{
+        var res=Genivi.mapviewer_GetMapViewScale(dbusIf);
+        var text=res[1].toString();
+        if (res[3] === Genivi.MAPVIEWER_MAX) {
+            text+="*";
+        } else {
+            if (res[3] === Genivi.MAPVIEWER_MIN)
+                text="*"+text;
+        }
+        zoomlevel.text=text;
+	}
+
+	function fuelStopAdvisorWarning(args)
+	{
+        Genivi.hookSignal("fuelStopAdvisorWarning");
+        if (args[1] == 1)
+        {
+            fsamessageText.text=Genivi.gettext("FSAWarning");
+            select_search_for_refill_in_top.visible=true;
+        }
+        else
+        {
+            fsamessageText.text=" ";
+            select_search_for_refill_in_top.visible=false;
+         }
+	}
+
+	function connectSignals()
+    {
+        guidanceWaypointReachedSignal=Genivi.connect_guidanceWaypointReachedSignal(dbusIf,menu);
+        guidanceManeuverChangedSignal=Genivi.connect_guidanceManeuverChangedSignal(dbusIf,menu);
+        guidancePositionOnRouteChangedSignal=Genivi.connect_guidancePositionOnRouteChangedSignal(dbusIf,menu);
+        simulationStatusChangedSignal=Genivi.connect_simulationStatusChangedSignal(dbusIf,menu);
+        simulationSpeedChangedSignal=Genivi.connect_simulationSpeedChangedSignal(dbusIf,menu);
+        mapmatchedpositionPositionUpdateSignal=Genivi.connect_mapmatchedpositionPositionUpdateSignal(dbusIf,menu);
+        mapmatchedpositionAddressUpdateSignal=Genivi.connect_mapmatchedpositionAddressUpdateSignal(dbusIf,menu);
+        fuelStopAdvisorSignal=Genivi.connect_fuelStopAdvisorSignal(dbusIf,menu);
+    }
+
+    function disconnectSignals()
+    {
+        guidanceWaypointReachedSignal.destroy();
+        guidanceManeuverChangedSignal.destroy();
+        guidancePositionOnRouteChangedSignal.destroy();
+        simulationStatusChangedSignal.destroy();
+        simulationSpeedChangedSignal.destroy();
+        mapmatchedpositionPositionUpdateSignal.destroy();
+        mapmatchedpositionAddressUpdateSignal.destroy();
+        fuelStopAdvisorSignal.destroy();
+    }
+
+	function routeOverview()
+	{
+        disconnectSignals();
+        entryMenu("NavigationCalculatedRoute",menu);
+	}
+
+	function toggleOrientation()
+	{
+		north=!north;
+		if (north) {
+            Genivi.mapviewer_SetCameraHeadingAngle(dbusIf,0);
+            orientation.setState("D");
+		} else {
+            Genivi.mapviewer_SetCameraHeadingTrackUp(dbusIf);
+            orientation.setState("N");
+		}
+	}
+
+	function updateGuidance()
+	{
+        var res=Genivi.guidance_GetGuidanceStatus(dbusIf);
+		if (res[1] == Genivi.NAVIGATIONCORE_INACTIVE) {
+            guidanceStatus.setState("OFF");
+            Genivi.guidance_activated = false;
+            //Guidance inactive, so inform the trip computer
+            Genivi.fuelstopadvisor_SetFuelAdvisorSettings(dbusIf,0,0);
+            maneuverAdvice.text=Genivi.gettext("NoGuidance");
+            maneuverIcon.source=StyleSheetGuidance.maneuverIcon[Constants.SOURCE]; //no icon by default
+            distancetomaneuverValue.text="----";
+            distancetodestinationValue.text="----";
+            timetodestinationValue.text="----";
+            roadaftermaneuverValue.text="----";
+			return;
+		} else { 
+            guidanceStatus.setState("ON");
+            Genivi.guidance_activated = true;
+            //Guidance active, so inform the trip computer (refresh)
+            Genivi.fuelstopadvisor_SetFuelAdvisorSettings(dbusIf,1,50);
+		}
+
+        var maneuversList=Genivi.guidance_GetManeuversList(dbusIf,1,0);
+        var numberOfManeuvers=maneuversList[3];
+        //only one maneuver is considered
+        var maneuver=maneuversList[5][1];
+        var roadNumberAfterManeuver=maneuver[1];
+        var roadNameAfterManeuver=maneuver[3];
+        var roadPropertyAfterManeuver=maneuver[5];
+        var drivingSide=maneuver[7];
+        var offsetOfNextManeuver=maneuver[9];
+        var items=maneuver[11][1];
+        var offsetOfManeuver=items[1];
+        var travelTime=items[3];
+        var direction=items[5];
+        var maneuverType=items[7];
+        var maneuverData=items[9];
+        if (maneuverData[1] == Genivi.NAVIGATIONCORE_DIRECTION)
+        {
+            guidanceStatus.setState("ON");
+            Genivi.guidance_activated = true;
+            maneuverIcon.source=Genivi.ManeuverDirectionIcon[maneuverData[3][3][1]];
+            //Genivi.ManeuverType[subarray[j+1][7]] contains CROSSROAD and is removed for the moment
+            distancetomaneuverValue.text=Genivi.distance(offsetOfManeuver);
+            roadaftermaneuverValue.text=roadNameAfterManeuver;
+        }
+
+        res=Genivi.guidance_GetDestinationInformation(dbusIf);
+        distancetodestinationValue.text = Genivi.distance(res[1]);
+        timetodestinationValue.text = Genivi.time(res[3]);
+
+        updateAddress();
+    }
+
+	function stopGuidance()
+	{
+        Genivi.guidance_StopGuidance(dbusIf);
+		updateGuidance();
+	}
+
+    function startGuidance()
+    {
+        Genivi.guidance_StartGuidance(dbusIf,Genivi.routing_handle(dbusIf));
+        updateGuidance();
+        updateSimulation();
+        updateAddress();
+    }
+
+    function stopSimulation()
+    {
+        Genivi.mapmatchedposition_SetSimulationMode(dbusIf,0);
+    }
+
+    function startSimulation()
+    {
+        Genivi.mapmatchedposition_SetSimulationMode(dbusIf,1);
+        Genivi.mapmatchedposition_StartSimulation(dbusIf);
+    }
+
+    Rectangle {
+        id:map
+        x:0
+        y:0
+        height:menu.height
+        width:menu.width
+        color:"transparent"
+
+        Rectangle {
+            color:"transparent"
+            width: StyleSheetTop.navigation_browse_map_top_background[Constants.WIDTH]
+            height: StyleSheetTop.navigation_browse_map_top_background[Constants.HEIGHT]
+            x: StyleSheetMap.top_area[Constants.X]
+            y: StyleSheetMap.top_area[Constants.Y]
+            HMIBgImage {
+                id: top
+                opacity: 0.8
+                image:StyleSheetTop.navigation_browse_map_top_background[Constants.SOURCE];
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+
+                SmartText {
+                    x:StyleSheetTop.fsamessageText[Constants.X]; y:StyleSheetTop.fsamessageText[Constants.Y]; width:StyleSheetTop.fsamessageText[Constants.WIDTH]; height:StyleSheetTop.fsamessageText[Constants.HEIGHT];color:StyleSheetTop.fsamessageText[Constants.TEXTCOLOR];styleColor:StyleSheetTop.fsamessageText[Constants.STYLECOLOR]; font.pixelSize:StyleSheetTop.fsamessageText[Constants.PIXELSIZE];
+                    id:fsamessageText
+                    visible: true
+                    text:""
+                }
+
+                StdButton {
+                    source:StyleSheetTop.select_search_for_refill_in_top[Constants.SOURCE]; x:StyleSheetTop.select_search_for_refill_in_top[Constants.X]; y:StyleSheetTop.select_search_for_refill_in_top[Constants.Y]; width:StyleSheetTop.select_search_for_refill_in_top[Constants.WIDTH]; height:StyleSheetTop.select_search_for_refill_in_top[Constants.HEIGHT];
+                    id:select_search_for_refill_in_top
+                    visible:false
+                    explode: false
+                    onClicked: {
+                        disconnectSignals();
+                        entryMenu("POI",menu);
+                                }
+                        }
+
+                SmartText {
+                    x:StyleSheetTop.roadaftermaneuverValue[Constants.X]; y:StyleSheetTop.roadaftermaneuverValue[Constants.Y]; width:StyleSheetTop.roadaftermaneuverValue[Constants.WIDTH]; height:StyleSheetTop.roadaftermaneuverValue[Constants.HEIGHT];color:StyleSheetTop.roadaftermaneuverValue[Constants.TEXTCOLOR];styleColor:StyleSheetTop.roadaftermaneuverValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheetTop.roadaftermaneuverValue[Constants.PIXELSIZE];
+                    visible: true
+                    id:roadaftermaneuverValue
+                    text: " "
+                }
+
+                Text {
+                    x:StyleSheetTop.speedValue[Constants.X]; y:StyleSheetTop.speedValue[Constants.Y]; width:StyleSheetTop.speedValue[Constants.WIDTH]; height:StyleSheetTop.speedValue[Constants.HEIGHT];color:StyleSheetTop.speedValue[Constants.TEXTCOLOR];styleColor:StyleSheetTop.speedValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheetTop.speedValue[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:vehicleSpeedValue
+                    text: "---"
+                }
+
+                Text {
+                    x:StyleSheetTop.speedUnit[Constants.X]; y:StyleSheetTop.speedUnit[Constants.Y]; width:StyleSheetTop.speedUnit[Constants.WIDTH]; height:StyleSheetTop.speedUnit[Constants.HEIGHT];color:StyleSheetTop.speedUnit[Constants.TEXTCOLOR];styleColor:StyleSheetTop.speedUnit[Constants.STYLECOLOR]; font.pixelSize:StyleSheetTop.speedUnit[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:speedUnit
+                    text: "km/h"
+                }
+            }
+        }
+
+        Rectangle {
+            color:"transparent"
+            width: StyleSheetBottom.navigation_browse_map_bottom_background[Constants.WIDTH]
+            height: StyleSheetBottom.navigation_browse_map_bottom_background[Constants.HEIGHT]
+            x: StyleSheetMap.bottom_area[Constants.X]
+            y: StyleSheetMap.bottom_area[Constants.Y]
+            HMIBgImage {
+                id: bottom
+                opacity: 0.8
+                image:StyleSheetBottom.navigation_browse_map_bottom_background[Constants.SOURCE];
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+
+                StdButton {
+                    source:StyleSheetBottom.menub[Constants.SOURCE]; x:StyleSheetBottom.menub[Constants.X]; y:StyleSheetBottom.menub[Constants.Y]; width:StyleSheetBottom.menub[Constants.WIDTH]; height:StyleSheetBottom.menub[Constants.HEIGHT];textColor:StyleSheetBottom.menubText[Constants.TEXTCOLOR]; pixelSize:StyleSheetBottom.menubText[Constants.PIXELSIZE];
+                    id:menub; text:Genivi.gettext("Menu"); next:orientation; prev:settings;
+                    onClicked: {
+                        disconnectSignals();
+                        leaveMenu();;
+                    }
+                }
+
+                StdButton {
+                    x:StyleSheetBottom.directiondestination[Constants.X]; y:StyleSheetBottom.directiondestination[Constants.Y]; width:StyleSheetBottom.directiondestination[Constants.WIDTH]; height:StyleSheetBottom.directiondestination[Constants.HEIGHT];
+                    id:orientation; next:zoomin; prev:menub; explode:false; disabled:false;
+                    source:StyleSheetBottom.directiondestination[Constants.SOURCE]; //todo call get status
+                    property int status: 0;
+                    function setState(name)
+                    {
+                        if (name=="D")
+                        {
+                            status=1;
+                            source=StyleSheetBottom.directionnorth[Constants.SOURCE];
+                        }
+                        else
+                        {
+                            status=0;
+                            source=StyleSheetBottom.directiondestination[Constants.SOURCE];
+                        }
+                    }
+                    onClicked:
+                    {
+                        toggleOrientation();
+                    }
+                }
+
+                SmartText {
+                    x:StyleSheetBottom.currentroad[Constants.X]; y:StyleSheetBottom.currentroad[Constants.Y]; width:StyleSheetBottom.currentroad[Constants.WIDTH]; height:StyleSheetBottom.currentroad[Constants.HEIGHT];color:StyleSheetBottom.currentroad[Constants.TEXTCOLOR];styleColor:StyleSheetBottom.currentroad[Constants.STYLECOLOR]; font.pixelSize:StyleSheetBottom.currentroad[Constants.PIXELSIZE];
+                    visible: true
+                    id:currentroad
+                    text: "-------"
+                }
+
+                StdButton {
+                    source:StyleSheetBottom.zoomin[Constants.SOURCE]; x:StyleSheetBottom.zoomin[Constants.X]; y:StyleSheetBottom.zoomin[Constants.Y]; width:StyleSheetBottom.zoomin[Constants.WIDTH]; height:StyleSheetBottom.zoomin[Constants.HEIGHT];
+                    id:zoomin; explode:false; next:zoomout; prev:orientation;
+                    onClicked: {
+                        Genivi.mapviewer_SetMapViewScaleByDelta(dbusIf,1);
+                        showZoom();
+                    }
+                }
+
+                Text {
+                    x:StyleSheetBottom.zoomlevel[Constants.X]; y:StyleSheetBottom.zoomlevel[Constants.Y]; width:StyleSheetBottom.zoomlevel[Constants.WIDTH]; height:StyleSheetBottom.zoomlevel[Constants.HEIGHT];color:StyleSheetBottom.zoomlevel[Constants.TEXTCOLOR];styleColor:StyleSheetBottom.zoomlevel[Constants.STYLECOLOR]; font.pixelSize:StyleSheetBottom.zoomlevel[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:zoomlevel
+                    text: " "
+                }
+
+                StdButton {
+                    source:StyleSheetBottom.zoomout[Constants.SOURCE]; x:StyleSheetBottom.zoomout[Constants.X]; y:StyleSheetBottom.zoomout[Constants.Y]; width:StyleSheetBottom.zoomout[Constants.WIDTH]; height:StyleSheetBottom.zoomout[Constants.HEIGHT];
+                    id:zoomout; explode:false; next:settings; prev:zoomin;
+                    onClicked: {
+                        Genivi.mapviewer_SetMapViewScaleByDelta(dbusIf,-1);
+                        showZoom();
+                    }
+                }
+
+                StdButton {
+                    source:StyleSheetBottom.settings[Constants.SOURCE]; x:StyleSheetBottom.settings[Constants.X]; y:StyleSheetBottom.settings[Constants.Y]; width:StyleSheetBottom.settings[Constants.WIDTH]; height:StyleSheetBottom.settings[Constants.HEIGHT];
+                    id:settings; explode:false; next:menub; prev:zoomout;
+                    onClicked: {
+                        disconnectSignals();
+                        entryMenu("CameraSettings",menu);
+                    }
+                }
+
+                StdButton {
+                    x:StyleSheetBottom.guidanceon[Constants.X]; y:StyleSheetBottom.guidanceon[Constants.Y]; width:StyleSheetBottom.guidanceon[Constants.WIDTH]; height:StyleSheetBottom.guidanceon[Constants.HEIGHT];
+                    id:guidanceStatus; next:zoomin; prev:menub; explode:false; disabled:false;
+                    source:StyleSheetBottom.guidanceoff[Constants.SOURCE]; //todo call get status
+                    property int status: 1;
+                    function setState(name)
+                    {
+                        if (name=="ON")
+                        {
+                            status=1;
+                            source=StyleSheetBottom.guidanceoff[Constants.SOURCE];
+                            guidance.visible=true;
+                            route.visible=true;
+                            simulation.visible=true;
+                        }
+                        else
+                        {
+                            status=0;
+                            source=StyleSheetBottom.guidanceon[Constants.SOURCE];
+                            guidance.visible=false;
+                            route.visible=false;
+                            simulation.visible=false;
+                            if (Genivi.route_calculated == true)
+                            {
+                                visible=true; //it's possible to restart the current route
+                            }
+                            else {
+                                visible=false; //no route calculated
+                            }
+                        }
+                    }
+                    onClicked:
+                    {
+                        if(status)
+                        {
+                            stopGuidance();
+                            stopSimulation();
+                        }
+                        else {
+                            startGuidance();
+                        }
+                    }
+                }
+            }
+        }
+
+        Rectangle {
+            color:"transparent"
+            width: StyleSheetRoute.navigation_browse_map_route_background[Constants.WIDTH]
+            height: StyleSheetRoute.navigation_browse_map_route_background[Constants.HEIGHT]
+            x: StyleSheetMap.route_area[Constants.X]
+            y: StyleSheetMap.route_area[Constants.Y]
+            HMIBgImage {
+                id: route
+                opacity: 0.8
+                image:StyleSheetRoute.navigation_browse_map_route_background[Constants.SOURCE]
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: {
+                        routeOverview();
+                                }
+                }
+
+                Text {
+                    x:StyleSheetRoute.timetodestinationValue[Constants.X]; y:StyleSheetRoute.timetodestinationValue[Constants.Y]; width:StyleSheetRoute.timetodestinationValue[Constants.WIDTH]; height:StyleSheetRoute.timetodestinationValue[Constants.HEIGHT];color:StyleSheetRoute.timetodestinationValue[Constants.TEXTCOLOR];styleColor:StyleSheetRoute.timetodestinationValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheetRoute.timetodestinationValue[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:timetodestinationValue
+                    text: "-------"
+                }
+
+                Text {
+                    x:StyleSheetRoute.distancetodestinationValue[Constants.X]; y:StyleSheetRoute.distancetodestinationValue[Constants.Y]; width:StyleSheetRoute.distancetodestinationValue[Constants.WIDTH]; height:StyleSheetRoute.distancetodestinationValue[Constants.HEIGHT];color:StyleSheetRoute.distancetodestinationValue[Constants.TEXTCOLOR];styleColor:StyleSheetRoute.distancetodestinationValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheetRoute.distancetodestinationValue[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:distancetodestinationValue
+                    text: "----"
+                }
+
+            }
+        }
+
+        Rectangle {
+            color:"transparent"
+            width: StyleSheetGuidance.navigation_browse_map_guidance_background[Constants.WIDTH]
+            height: StyleSheetGuidance.navigation_browse_map_guidance_background[Constants.HEIGHT]
+            x: StyleSheetMap.guidance_area[Constants.X]
+            y: StyleSheetMap.guidance_area[Constants.Y]
+            HMIBgImage {
+                id: guidance
+                opacity: 0.8
+                image:StyleSheetGuidance.navigation_browse_map_guidance_background[Constants.SOURCE]
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: {
+                        var res=Genivi.guidance_GetGuidanceStatus(dbusIf);
+                        if (res[1] != Genivi.NAVIGATIONCORE_INACTIVE) {
+                            disconnectSignals();
+                            entryMenu("NavigationManeuversList",menu);
+                        }
+                    }
+                }
+
+                Text {
+                    x:StyleSheetGuidance.distancetomaneuverValue[Constants.X]; y:StyleSheetGuidance.distancetomaneuverValue[Constants.Y]; width:StyleSheetGuidance.distancetomaneuverValue[Constants.WIDTH]; height:StyleSheetGuidance.distancetomaneuverValue[Constants.HEIGHT];color:StyleSheetGuidance.distancetomaneuverValue[Constants.TEXTCOLOR];styleColor:StyleSheetGuidance.distancetomaneuverValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheetGuidance.distancetomaneuverValue[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:distancetomaneuverValue
+                    text: " "
+                }
+
+                Text {
+                    x:StyleSheetGuidance.maneuverAdvice[Constants.X]; y:StyleSheetGuidance.maneuverAdvice[Constants.Y]; width:StyleSheetGuidance.maneuverAdvice[Constants.WIDTH]; height:StyleSheetGuidance.maneuverAdvice[Constants.HEIGHT];color:StyleSheetGuidance.maneuverAdvice[Constants.TEXTCOLOR];styleColor:StyleSheetGuidance.maneuverAdvice[Constants.STYLECOLOR]; font.pixelSize:StyleSheetGuidance.maneuverAdvice[Constants.PIXELSIZE];
+                    visible: true
+                    style: Text.Sunken;
+                    smooth: true
+                    id:maneuverAdvice
+                    text: " "
+                }
+
+                BorderImage {
+                    id: maneuverIcon
+                    source:StyleSheetGuidance.maneuverIcon[Constants.SOURCE]; x:StyleSheetGuidance.maneuverIcon[Constants.X]; y:StyleSheetGuidance.maneuverIcon[Constants.Y]; width:StyleSheetGuidance.maneuverIcon[Constants.WIDTH]; height:StyleSheetGuidance.maneuverIcon[Constants.HEIGHT];
+                    border.left: 0; border.top: 0
+                    border.right: 0; border.bottom: 0
+                }
+            }
+        }
+
+        Rectangle {
+            color:"transparent"
+            width: StyleSheetScroll.navigation_browse_map_scroll_background[Constants.WIDTH]
+            height: StyleSheetScroll.navigation_browse_map_scroll_background[Constants.HEIGHT]
+            x: StyleSheetMap.scroll_area[Constants.X]
+            y: StyleSheetMap.scroll_area[Constants.Y]
+            HMIBgImage {
+                opacity: 0.8
+                property real panX: 40 //delta in pixel for x panning
+                property real panY: 40 //delta in pixel for y panning
+                id: scroll
+                image:StyleSheetScroll.navigation_browse_map_scroll_background[Constants.SOURCE];
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+
+                StdButton {
+                    source:StyleSheetScroll.scrollup[Constants.SOURCE]; x:StyleSheetScroll.scrollup[Constants.X]; y:StyleSheetScroll.scrollup[Constants.Y]; width:StyleSheetScroll.scrollup[Constants.WIDTH]; height:StyleSheetScroll.scrollup[Constants.HEIGHT];
+                    id:scrollup; explode:false; next:scrollleft; prev:scrolldown;
+                    onPressed: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_START,map.width/2,map.height/2);}
+                    onReleased: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_END,map.width/2,map.height/2 + scroll.panY);}
+                }
+
+                StdButton {
+                    source:StyleSheetScroll.scrollleft[Constants.SOURCE]; x:StyleSheetScroll.scrollleft[Constants.X]; y:StyleSheetScroll.scrollleft[Constants.Y]; width:StyleSheetScroll.scrollleft[Constants.WIDTH]; height:StyleSheetScroll.scrollleft[Constants.HEIGHT];
+                    id:scrollleft; explode:false; next:scrollright; prev:scrollup;
+                    onPressed: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_START,map.width/2,map.height/2);}
+                    onReleased: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_END,map.width/2 + scroll.panX,map.height/2);}
+                }
+
+                StdButton {
+                    source:StyleSheetScroll.scrollright[Constants.SOURCE]; x:StyleSheetScroll.scrollright[Constants.X]; y:StyleSheetScroll.scrollright[Constants.Y]; width:StyleSheetScroll.scrollright[Constants.WIDTH]; height:StyleSheetScroll.scrollright[Constants.HEIGHT];
+                    id:scrollright; explode:false; next:scrolldown; prev:scrollleft;
+                    onPressed: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_START,map.width/2,map.height/2);}
+                    onReleased: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_END,map.width/2 - scroll.panX,map.height/2);}
+                }
+
+                StdButton {
+                    source:StyleSheetScroll.scrolldown[Constants.SOURCE]; x:StyleSheetScroll.scrolldown[Constants.X]; y:StyleSheetScroll.scrolldown[Constants.Y]; width:StyleSheetScroll.scrolldown[Constants.WIDTH]; height:StyleSheetScroll.scrolldown[Constants.HEIGHT];
+                    id:scrolldown; explode:false; next:scrollup; prev:scrollright;
+                    onPressed: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_START,map.width/2,map.height/2);}
+                    onReleased: {Genivi.mapviewer_SetMapViewPan(dbusIf,Genivi.MAPVIEWER_PAN_END,map.width/2,map.height/2 - scroll.panY);}
+                }
+            }
+        }
+
+        Rectangle {
+            color:"transparent"
+
+            width: StyleSheetSimulation.navigation_browse_map_simulation_background[Constants.WIDTH]
+            height: StyleSheetSimulation.navigation_browse_map_simulation_background[Constants.HEIGHT]
+            x: StyleSheetMap.simulation_area[Constants.X]
+            y: StyleSheetMap.simulation_area[Constants.Y]
+            HMIBgImage {
+                id: simulation
+                opacity: {
+                    if (Genivi.simulationPanelOnMapview==true)
+                    {
+                        opacity=0.8;
+                    }
+                    else
+                    {
+                        opacity=0;
+                    }
+                }
+                image:StyleSheetSimulation.navigation_browse_map_simulation_background[Constants.SOURCE];
+                anchors { fill: parent; topMargin: parent.headlineHeight}
+                Text {
+                    x:StyleSheetSimulation.speedValue_popup[Constants.X]; y:StyleSheetSimulation.speedValue_popup[Constants.Y]; width:StyleSheetSimulation.speedValue_popup[Constants.WIDTH]; height:StyleSheetSimulation.speedValue_popup[Constants.HEIGHT];color:StyleSheetSimulation.speedValue_popup[Constants.TEXTCOLOR];styleColor:StyleSheetSimulation.speedValue_popup[Constants.STYLECOLOR]; font.pixelSize:StyleSheetSimulation.speedValue_popup[Constants.PIXELSIZE];
+                    id:speedValue
+                    style: Text.Sunken;
+                    smooth: true
+                    text: ""
+                     }
+                StdButton {
+                    source:StyleSheetSimulation.speed_down_popup[Constants.SOURCE]; x:StyleSheetSimulation.speed_down_popup[Constants.X]; y:StyleSheetSimulation.speed_down_popup[Constants.Y]; width:StyleSheetSimulation.speed_down_popup[Constants.WIDTH]; height:StyleSheetSimulation.speed_down_popup[Constants.HEIGHT];
+                    id:speed_down; explode:false; disabled:false; next:speed_up; prev:simu_mode;
+                    onClicked:
+                    {
+                        if (speedValueSent > 0)
+                        {
+                            speedValueSent = speedValueSent-1;
+                        }
+                        Genivi.mapmatchedposition_SetSimulationSpeed(dbusIf,getDBusSpeedValue(speedValueSent));
+                    }
+                }
+                StdButton {
+                    source:StyleSheetSimulation.speed_up_popup[Constants.SOURCE]; x:StyleSheetSimulation.speed_up_popup[Constants.X]; y:StyleSheetSimulation.speed_up_popup[Constants.Y]; width:StyleSheetSimulation.speed_up_popup[Constants.WIDTH]; height:StyleSheetSimulation.speed_up_popup[Constants.HEIGHT];
+                    id:speed_up; explode:false; disabled:false; next:on_off; prev:speed_down;
+                    onClicked:
+                    {
+                        if (speedValueSent < 7)
+                        {
+                            speedValueSent = speedValueSent+1;
+                        }
+                        Genivi.mapmatchedposition_SetSimulationSpeed(dbusIf,getDBusSpeedValue(speedValueSent));
+                    }
+                }
+                StdButton {
+                    x:StyleSheetSimulation.simulation_on_popup[Constants.X]; y:StyleSheetSimulation.simulation_on_popup[Constants.Y]; width:StyleSheetSimulation.simulation_on_popup[Constants.WIDTH]; height:StyleSheetSimulation.simulation_on_popup[Constants.HEIGHT];
+                    id:on_off; next:simu_mode; prev:speed_up; explode:false; disabled:false;
+                    property int status: 1; //by default simulation stopped
+                    function setState(name)
+                    {
+                        if (name=="ON")
+                        {
+                            status=1;
+                            source=StyleSheetSimulation.simulation_off_popup[Constants.SOURCE];
+                        }
+                        else
+                        {
+                            status=0;
+                            source=StyleSheetSimulation.simulation_on_popup[Constants.SOURCE];
+                        }
+                    }
+                    onClicked:
+                    {
+                        switch (status)
+                        {
+                            case 0: //start the simulation
+                                startSimulation();
+                            break;
+                            case 1: //stop the simulation
+                                stopSimulation();
+                            break;
+                            default:
+                            break;
+                        }
+                    }
+                }
+                StdButton {
+                    x:StyleSheetSimulation.play_popup[Constants.X]; y:StyleSheetSimulation.play_popup[Constants.Y]; width:StyleSheetSimulation.play_popup[Constants.WIDTH]; height:StyleSheetSimulation.play_popup[Constants.HEIGHT];
+                    id:simu_mode; next:speed_down; prev:on_off; explode:false; disabled:false;
+                    property int status: 0;
+                    function setState(name)
+                    {
+                        if (name=="FREE")
+                        {
+                            status=0;
+                            source=StyleSheetSimulation.play_popup[Constants.SOURCE];
+                            disabled=true;
+                        }
+                        else
+                        {
+                            if (name=="PLAY")
+                            {
+                                status=1;
+                                source=StyleSheetSimulation.pause_popup[Constants.SOURCE];
+                                enabled=true;
+                                disabled=false;
+                            }
+                            else
+                            {
+                                if (name=="PAUSE")
+                                {
+                                    status=2;
+                                    source=StyleSheetSimulation.play_popup[Constants.SOURCE];
+                                    enabled=true;
+                                    disabled=false;
+                                }
+                            }
+                        }
+                    }
+                    onClicked:
+                    {
+                        switch (status)
+                        {
+                            case 2: //pause
+                                //pause to resume
+                                Genivi.mapmatchedposition_StartSimulation(dbusIf);
+                            break;
+                            case 1: //play
+                                //play to pause
+                                Genivi.mapmatchedposition_PauseSimulation(dbusIf);
+                            break;
+                            default:
+                            break;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    Component.onCompleted: {
+        Genivi.mapviewer_handle(dbusIf,menu.width,menu.height,Genivi.MAPVIEWER_MAIN_MAP);
+		if (Genivi.data['show_route_handle']) {
+            Genivi.mapviewer_DisplayRoute(dbusIf,Genivi.data['show_route_handle'],false);
+            delete(Genivi.data['show_route_handle']);
+        }
+		if (Genivi.data['zoom_route_handle']) {
+            var res=Genivi.routing_GetRouteBoundingBox(dbusIf,Genivi.data['zoom_route_handle']);
+            if (res[0] == "structure") {
+                Genivi.mapviewer_SetMapViewBoundingBox(dbusIf,res);
+			} else {
+                console.log("Unexpected result from GetRouteBoundingBox:");
+				Genivi.dump("",res);
+			}
+            delete(Genivi.data['zoom_route_handle']);
+        }
+		if (Genivi.data['show_position']) {
+            Genivi.mapviewer_SetFollowCarMode(dbusIf,false);
+            Genivi.mapviewer_SetTargetPoint(dbusIf,Genivi.data['show_position']['lat'],Genivi.data['show_position']['lon'],Genivi.data['show_position']['alt']);
+			delete(Genivi.data['show_position']);
+		}
+		if (Genivi.data['show_current_position']) {
+            Genivi.mapviewer_SetFollowCarMode(dbusIf,true);
+			delete(Genivi.data['show_current_position']);
+		}
+		connectSignals();
+		updateGuidance();
+        updateSimulation();
+        showZoom();
+	}
+}
diff --git a/src/hmi/qml/NavigationAppMain.qml b/src/hmi/qml/NavigationAppMain.qml
new file mode 100644
index 0000000..ff114ba
--- /dev/null
+++ b/src/hmi/qml/NavigationAppMain.qml
@@ -0,0 +1,128 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2017, PSA GROUPE
+*
+* \file NavigationAppMain.qml
+*
+* \brief This file is part of the navigation hmi.
+*
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.0
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1
+import "Core"
+import "Core/genivi.js" as Genivi;
+import "Core/style-sheets/style-constants.js" as Constants;
+import "Core/style-sheets/NavigationAppMain-css.js" as StyleSheet;
+import lbs.plugin.dbusif 1.0
+
+HMIMenu {
+	id: menu
+    property string pagefile:"NavigationAppMain"
+    pageBack: Genivi.entryback[Genivi.entrybackheapsize]
+    next: navigation
+    prev: quit
+    DBusIf {
+		id:dbusIf;
+	}
+
+	HMIBgImage {
+        image:StyleSheet.fsa_main_menu_background[Constants.SOURCE];
+		anchors { fill: parent; topMargin: parent.headlineHeight}
+
+        Text {
+            x:StyleSheet.navigationText[Constants.X]; y:StyleSheet.navigationText[Constants.Y]; width:StyleSheet.navigationText[Constants.WIDTH]; height:StyleSheet.navigationText[Constants.HEIGHT];color:StyleSheet.navigationText[Constants.TEXTCOLOR];styleColor:StyleSheet.navigationText[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.navigationText[Constants.PIXELSIZE];
+            id:navigationText;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Navigation")
+             }
+
+        StdButton {
+            source:StyleSheet.select_navigation[Constants.SOURCE]; x:StyleSheet.select_navigation[Constants.X]; y:StyleSheet.select_navigation[Constants.Y]; width:StyleSheet.select_navigation[Constants.WIDTH]; height:StyleSheet.select_navigation[Constants.HEIGHT];
+            id:navigation; explode:false; next:mapview; prev:quit; onClicked: {
+                entryMenu("NavigationSearch",menu);
+            }
+        }
+
+        Text {
+            x:StyleSheet.mapviewText[Constants.X]; y:StyleSheet.mapviewText[Constants.Y]; width:StyleSheet.mapviewText[Constants.WIDTH]; height:StyleSheet.mapviewText[Constants.HEIGHT];color:StyleSheet.mapviewText[Constants.TEXTCOLOR];styleColor:StyleSheet.mapviewText[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.mapviewText[Constants.PIXELSIZE];
+            id:mapviewText;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Mapview")
+             }
+
+        StdButton {
+            source:StyleSheet.select_mapview[Constants.SOURCE]; x:StyleSheet.select_mapview[Constants.X]; y:StyleSheet.select_mapview[Constants.Y]; width:StyleSheet.select_mapview[Constants.WIDTH]; height:StyleSheet.select_mapview[Constants.HEIGHT];
+            id:mapview; explode:false; next:trip; prev:navigation; onClicked: {
+				Genivi.data["show_current_position"]=true;
+                entryMenu("NavigationBrowseMap",menu);
+			}
+		}
+
+        Text {
+            x:StyleSheet.tripText[Constants.X]; y:StyleSheet.tripText[Constants.Y]; width:StyleSheet.tripText[Constants.WIDTH]; height:StyleSheet.tripText[Constants.HEIGHT];color:StyleSheet.tripText[Constants.TEXTCOLOR];styleColor:StyleSheet.tripText[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.tripText[Constants.PIXELSIZE];
+            id:tripText;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Trip")
+             }
+
+        StdButton {
+            source:StyleSheet.select_trip[Constants.SOURCE]; x:StyleSheet.select_trip[Constants.X]; y:StyleSheet.select_trip[Constants.Y]; width:StyleSheet.select_trip[Constants.WIDTH]; height:StyleSheet.select_trip[Constants.HEIGHT];
+            id:trip; explode:false; next:poi; prev:mapview;onClicked: {
+                entryMenu("TripComputer",menu);
+            }
+        }
+
+        Text {
+            x:StyleSheet.poiText[Constants.X]; y:StyleSheet.poiText[Constants.Y]; width:StyleSheet.poiText[Constants.WIDTH]; height:StyleSheet.poiText[Constants.HEIGHT];color:StyleSheet.poiText[Constants.TEXTCOLOR];styleColor:StyleSheet.poiText[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.poiText[Constants.PIXELSIZE];
+            id:poiText;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Poi")
+             }
+
+        StdButton {
+            source:StyleSheet.select_poi[Constants.SOURCE]; x:StyleSheet.select_poi[Constants.X]; y:StyleSheet.select_poi[Constants.Y]; width:StyleSheet.select_poi[Constants.WIDTH]; height:StyleSheet.select_poi[Constants.HEIGHT];
+            id:poi; explode:false; next:configuration; prev:trip; onClicked: {
+                entryMenu("POI",menu);
+            }
+        }
+
+        Text {
+            x:StyleSheet.configurationText[Constants.X]; y:StyleSheet.configurationText[Constants.Y]; width:StyleSheet.configurationText[Constants.WIDTH]; height:StyleSheet.configurationText[Constants.HEIGHT];color:StyleSheet.configurationText[Constants.TEXTCOLOR];styleColor:StyleSheet.configurationText[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.configurationText[Constants.PIXELSIZE];
+            id:configurationText;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Configuration")
+             }
+
+        StdButton {
+            source:StyleSheet.select_configuration[Constants.SOURCE]; x:StyleSheet.select_configuration[Constants.X]; y:StyleSheet.select_configuration[Constants.Y]; width:StyleSheet.select_configuration[Constants.WIDTH]; height:StyleSheet.select_configuration[Constants.HEIGHT];
+            id:configuration; explode:false; next:quit; prev:trip; onClicked: {
+                entryMenu("NavigationSettings",menu);
+            }
+        }
+
+        StdButton {
+            source:StyleSheet.quit[Constants.SOURCE]; x:StyleSheet.quit[Constants.X]; y:StyleSheet.quit[Constants.Y]; width:StyleSheet.quit[Constants.WIDTH]; height:StyleSheet.quit[Constants.HEIGHT];textColor:StyleSheet.quitText[Constants.TEXTCOLOR]; pixelSize:StyleSheet.quitText[Constants.PIXELSIZE];
+            id:quit; text: Genivi.gettext("Quit"); explode:false; next:navigation; prev:configuration; onClicked:{Qt.quit()}}
+    }
+}
diff --git a/src/hmi/qml/NavigationAppPOI.qml b/src/hmi/qml/NavigationAppPOI.qml
new file mode 100644
index 0000000..06c0147
--- /dev/null
+++ b/src/hmi/qml/NavigationAppPOI.qml
@@ -0,0 +1,245 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2014, PCA Peugeot Citroen
+*
+* \file POI.qml
+*
+* \brief This file is part of the FSA hmi.
+*
+* \author Martin Schaller <martin.schaller@it-schaller.de>
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.1
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* 2014-03-05, Philippe Colliot, migration to the new HMI design
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1 
+import "Core"
+import "Core/genivi.js" as Genivi;
+import "Core/style-sheets/style-constants.js" as Constants;
+import "Core/style-sheets/fsa-poi-menu-css.js" as StyleSheet;
+import lbs.plugin.dbusif 1.0
+
+HMIMenu {
+	id: menu
+    property string pagefile:"POI"
+
+    DBusIf {
+    	id: dbusIf
+    }
+
+    function update()
+    {
+        selectedStationValue.text="See details of \nthe station \nhere"
+    }
+    HMIBgImage {
+        image:StyleSheet.fsa_poi_menu_background[Constants.SOURCE];
+        anchors { fill: parent; topMargin: parent.headlineHeight }
+		Text {
+            x:StyleSheet.searchResultTitle[Constants.X]; y:StyleSheet.searchResultTitle[Constants.Y]; width:StyleSheet.searchResultTitle[Constants.WIDTH]; height:StyleSheet.searchResultTitle[Constants.HEIGHT];color:StyleSheet.searchResultTitle[Constants.TEXTCOLOR];styleColor:StyleSheet.searchResultTitle[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.searchResultTitle[Constants.PIXELSIZE];
+            id:searchResultTitle;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("SearchResult")
+	   	}
+		Text {
+            x:StyleSheet.selectedStationTitle[Constants.X]; y:StyleSheet.selectedStationTitle[Constants.Y]; width:StyleSheet.selectedStationTitle[Constants.WIDTH]; height:StyleSheet.selectedStationTitle[Constants.HEIGHT];color:StyleSheet.selectedStationTitle[Constants.TEXTCOLOR];styleColor:StyleSheet.selectedStationTitle[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.selectedStationTitle[Constants.PIXELSIZE];
+            id:selectedStationTitle;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("SelectedStation")
+	   	}
+		Text {
+            x:StyleSheet.selectedStationValue[Constants.X]; y:StyleSheet.selectedStationValue[Constants.Y]; width:StyleSheet.selectedStationValue[Constants.WIDTH]; height:StyleSheet.selectedStationValue[Constants.HEIGHT];color:StyleSheet.selectedStationValue[Constants.TEXTCOLOR];styleColor:StyleSheet.selectedStationValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.selectedStationValue[Constants.PIXELSIZE];
+            id:selectedStationValue
+            style: Text.Sunken;
+            smooth: true
+            clip: true
+			text: " "
+        }
+		Component {
+            id: searchResultList
+            Text {
+                x:StyleSheet.searchResultValue[Constants.X]; y:StyleSheet.searchResultValue[Constants.Y]; width:StyleSheet.searchResultValue[Constants.WIDTH]; height:StyleSheet.searchResultValue[Constants.HEIGHT];color:StyleSheet.searchResultValue[Constants.TEXTCOLOR];styleColor:StyleSheet.searchResultValue[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.searchResultValue[Constants.PIXELSIZE];
+                id:searchResultValue;
+				property real index:number;
+				text: name;
+				style: Text.Sunken;
+				smooth: true
+			}
+		}
+		HMIList {
+            x:StyleSheet.searchResultList[Constants.X]; y:StyleSheet.searchResultList[Constants.Y]; width:StyleSheet.searchResultList[Constants.WIDTH]; height:StyleSheet.searchResultList[Constants.HEIGHT];
+			property real selectedEntry
+			id:view
+            delegate: searchResultList
+            next:select_search_for_refill
+			prev:back
+			onSelected:{
+				if (what) {
+					Genivi.poi_id=what.index;
+					var poi_data=Genivi.poi_data[what.index];
+        				selectedStationValue.text="Name:"+poi_data.name+"\nID:"+poi_data.id+"\nLat:"+poi_data.lat+"\nLon:"+poi_data.lon;
+					select_reroute.disabled=false;
+            				select_display_on_map.disabled=false;
+				} else {
+					Genivi.poi_id=null;
+        				selectedStationValue.text="";
+					select_reroute.disabled=true;
+					select_display_on_map.disabled=true;
+				}
+			}
+		}
+		StdButton { 
+            source:StyleSheet.select_search_for_refill[Constants.SOURCE]; x:StyleSheet.select_search_for_refill[Constants.X]; y:StyleSheet.select_search_for_refill[Constants.Y]; width:StyleSheet.select_search_for_refill[Constants.WIDTH]; height:StyleSheet.select_search_for_refill[Constants.HEIGHT];
+            id:select_search_for_refill
+			explode: false
+			onClicked: {
+				var model=view.model;
+				var ids=[];
+                var position=Genivi.mapmatchedposition_GetPosition(dbusIf);
+                var latitude=0;
+                var longitude=0;
+                for (var i=0;i<position[3].length;i+=4){
+                    if ((position[3][i+1]== Genivi.NAVIGATIONCORE_LATITUDE) && (position[3][i+3][3][1] != 0)){
+                        latitude=position[3][i+3][3][1];
+                    } else {
+                        if ((position[3][i+1]== Genivi.NAVIGATIONCORE_LONGITUDE) && (position[3][i+3][3][1] != 0)){
+                            longitude=position[3][i+3][3][1];
+                        }
+                    }
+                }
+                if (!latitude && !longitude) {
+					model.clear();
+					model.append({"name":"No position available"});
+					return;
+				}
+                var categories=Genivi.poisearch_GetAvailableCategories(dbusIf);
+                for (i = 0 ; i < categories.length ; i+=2) {
+					if (categories[i+1][1][3] == 'fuel') {
+                        Genivi.fuelCategoryId=categories[i+1][1][1];
+					}
+				}
+
+                Genivi.poisearch_SetCenter(dbusIf,latitude,longitude,0);
+                var categoriesAndRadiusList=[];
+                var categoriesAndRadius=[];
+                categoriesAndRadius[0]=Genivi.fuelCategoryId;
+                categoriesAndRadius[1]=Genivi.radius;
+                categoriesAndRadiusList[0]=categoriesAndRadius;
+                Genivi.poisearch_SetCategories(dbusIf,categoriesAndRadiusList);
+                Genivi.poisearch_StartPoiSearch(dbusIf,"",Genivi.POISERVICE_SORT_BY_DISTANCE);
+                var attributeList=[];
+                attributeList[0]=0;
+                var res=Genivi.poisearch_RequestResultList(dbusIf,Genivi.offset,Genivi.maxWindowSize,attributeList);
+				var res_win=res[5];
+                for (i = 0 ; i < res_win.length ; i+=2) {
+                    var id=res_win[i+1][1];
+                    ids.push(id);
+					Genivi.poi_data[id]=[];
+					Genivi.poi_data[id].id=id;
+					Genivi.poi_data[id].distance=res_win[i+1][3];
+				}
+                var details=Genivi.poisearch_GetPoiDetails(dbusIf,ids);
+                for (i = 0 ; i < details[1].length ; i+=2) {
+					var poi_details=details[1][i+1];
+                    id=poi_details[1][1];
+					Genivi.poi_data[id].name=poi_details[1][3];
+                    Genivi.poi_data[id].lat=poi_details[1][5][1];
+                    Genivi.poi_data[id].lon=poi_details[1][5][3];
+				}
+				model.clear();
+                for (i = 0 ; i < ids.length ; i+=1) {
+                    id=ids[i];
+					var poi_data=Genivi.poi_data[id];
+					model.append({"name":Genivi.distance(poi_data.distance)+" "+poi_data.name,"number":id});
+				}
+			}
+		}
+		Text {
+            x:StyleSheet.searchTitle[Constants.X]; y:StyleSheet.searchTitle[Constants.Y]; width:StyleSheet.searchTitle[Constants.WIDTH]; height:StyleSheet.searchTitle[Constants.HEIGHT];color:StyleSheet.searchTitle[Constants.TEXTCOLOR];styleColor:StyleSheet.searchTitle[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.searchTitle[Constants.PIXELSIZE];
+            id:searchTitle;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("SearchForPOI")
+        }
+		StdButton { 
+            source:StyleSheet.select_reroute[Constants.SOURCE]; x:StyleSheet.select_reroute[Constants.X]; y:StyleSheet.select_reroute[Constants.Y]; width:StyleSheet.select_reroute[Constants.WIDTH]; height:StyleSheet.select_reroute[Constants.HEIGHT];
+            id:select_reroute;
+            explode:false;
+            disabled:true;
+            next:select_display_on_map; prev:select_search_for_refill
+			onClicked: {
+                var destination=Genivi.latlon_to_map(Genivi.poi_data[Genivi.poi_id]);
+                var position="";
+                Genivi.routing_SetWaypoints(dbusIf,true,position,destination);
+				Genivi.data['calculate_route']=true;
+				Genivi.data['lat']='';
+				Genivi.data['lon']='';
+                if (Genivi.guidance_activated == true)
+                {
+                    mapMenu();
+                }
+                else {
+                    pageOpen("NavigationCalculatedRoute");
+                }
+			}
+		}
+		Text {
+            x:StyleSheet.rerouteTitle[Constants.X]; y:StyleSheet.rerouteTitle[Constants.Y]; width:StyleSheet.rerouteTitle[Constants.WIDTH]; height:StyleSheet.rerouteTitle[Constants.HEIGHT];color:StyleSheet.rerouteTitle[Constants.TEXTCOLOR];styleColor:StyleSheet.rerouteTitle[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.rerouteTitle[Constants.PIXELSIZE];
+            id:rerouteTitle;
+            style: Text.Sunken;
+            smooth: true
+            text: Genivi.gettext("Reroute")
+        }
+        StdButton {
+            source:StyleSheet.select_display_on_map[Constants.SOURCE]; x:StyleSheet.select_display_on_map[Constants.X]; y:StyleSheet.select_display_on_map[Constants.Y]; width:StyleSheet.select_display_on_map[Constants.WIDTH]; height:StyleSheet.select_display_on_map[Constants.HEIGHT];
+            id:select_display_on_map;
+            explode:false;
+	    disabled:true;
+            next:back; prev:select_reroute
+			onClicked: {
+				var poi_data=Genivi.poi_data[Genivi.poi_id];
+				Genivi.data['show_position']=new Array;
+				Genivi.data['show_position']['lat']=poi_data.lat;
+				Genivi.data['show_position']['lon']=poi_data.lon;
+				Genivi.data['mapback']="POI";
+                mapMenu();
+			}
+		}
+		Text {
+            x:StyleSheet.displayTitle[Constants.X]; y:StyleSheet.displayTitle[Constants.Y]; width:StyleSheet.displayTitle[Constants.WIDTH]; height:StyleSheet.displayTitle[Constants.HEIGHT];color:StyleSheet.displayTitle[Constants.TEXTCOLOR];styleColor:StyleSheet.displayTitle[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.displayTitle[Constants.PIXELSIZE];
+            id:displayTitle;
+            style: Text.Sunken;
+            smooth: true;
+            text: Genivi.gettext("DisplayPOI")
+        }
+        StdButton {
+            source:StyleSheet.back[Constants.SOURCE]; x:StyleSheet.back[Constants.X]; y:StyleSheet.back[Constants.Y]; width:StyleSheet.back[Constants.WIDTH]; height:StyleSheet.back[Constants.HEIGHT];textColor:StyleSheet.backText[Constants.TEXTCOLOR]; pixelSize:StyleSheet.backText[Constants.PIXELSIZE];
+            id:back;
+			text: Genivi.gettext("Back"); 
+			disabled:false; 
+            next:select_search_for_refill; prev:select_display_on_map;
+            onClicked: {
+                leaveMenu();
+            }
+		}	
+	}
+	Component.onCompleted: {
+		Genivi.poi_data=[];
+		update();
+	}
+}
diff --git a/src/hmi/qml/NavigationAppSearch.qml b/src/hmi/qml/NavigationAppSearch.qml
new file mode 100644
index 0000000..05dbb9b
--- /dev/null
+++ b/src/hmi/qml/NavigationAppSearch.qml
@@ -0,0 +1,30 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2017, PSA GROUPE
+*
+* \file NavigationAppSearch.qml
+*
+* \brief This file is part of the navigation hmi.
+*
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.0
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1
+import "Core"
+import "Core/genivi.js" as Genivi;
+import "Core/style-sheets/style-constants.js" as Constants;
diff --git a/src/hmi/qml/NavigationAppTripComputer.qml b/src/hmi/qml/NavigationAppTripComputer.qml
new file mode 100644
index 0000000..6f33a21
--- /dev/null
+++ b/src/hmi/qml/NavigationAppTripComputer.qml
@@ -0,0 +1,438 @@
+/**
+* @licence app begin@
+* SPDX-License-Identifier: MPL-2.0
+*
+* \copyright Copyright (C) 2013-2017, PSA GROUPE
+*
+* \file NavigationAppTripComputer.qml
+*
+* \brief This file is part of the navigation hmi.
+*
+* \author Philippe Colliot <philippe.colliot@mpsa.com>
+*
+* \version 1.0
+*
+* This Source Code Form is subject to the terms of the
+* Mozilla Public License (MPL), v. 2.0.
+* If a copy of the MPL was not distributed with this file,
+* You can obtain one at http://mozilla.org/MPL/2.0/.
+*
+* For further information see http://www.genivi.org/.
+*
+* List of changes:
+* <date>, <name>, <description of change>
+*
+* @licence end@
+*/
+import QtQuick 2.1
+import "Core"
+import "Core/genivi.js" as Genivi;
+import "Core/style-sheets/style-constants.js" as Constants;
+import "Core/style-sheets/NavigationAppTripComputer-css.js" as StyleSheet;
+import lbs.plugin.dbusif 1.0
+
+HMIMenu {
+	id: menu
+    property string pagefile:"NavigationAppTripComputer"
+    property Item tripDataUpdatedSignal;
+
+	DBusIf {
+		id: dbusIf
+	}
+
+    function tripDataUpdated(args)
+    {
+        Genivi.hookSignal("tripDataUpdated");
+        updateTripMode();
+    }
+
+    function connectSignals()
+    {
+        tripDataUpdatedSignal=Genivi.connect_tripDataUpdatedSignal(dbusIf,menu);
+    }
+
+    function disconnectSignals()
+    {
+        tripDataUpdatedSignal.destroy();
+    }
+
+    function hideAll()
+    {
+        avg_speed_value.visible=false
+        avg_speed_unit.visible=false
+        avg_speed_title.visible=false
+        avg_fuel_value.visible=false
+        avg_fuel_unit.visible=false
+        avg_fuel_title.visible=false
+        distance_value.visible=false
+        distance_unit.visible=false
+        distance_title.visible=false
+        fuel_value.visible=false
+        fuel_unit.visible=false
+        fuel_title.visible=false
+        tank_distance_value.visible=false
+        tank_distance_unit.visible=false
+        tank_distance_title.visible=false
+        predictive_tank_distance_value.visible=false
+        predictive_tank_distance_unit.visible=false
+        predictive_tank_distance_title.visible=false
+        select_trip1.visible=false;
+        select_trip2.visible=false;
+        select_instant.visible=false;
+        reset.visible=false;
+    }
+
+    function updateTripMode()
+    {
+        hideAll()
+        if (Genivi.tripMode=="TRIP_NUMBER1")
+        {
+            content.image=StyleSheet.trip1_background[Constants.SOURCE]
+            avg_speed_value.visible=true
+            avg_speed_unit.visible=true
+            avg_speed_title.visible=true
+            avg_fuel_value.visible=true
+            avg_fuel_unit.visible=true
+            avg_fuel_title.visible=true
+            distance_value.visible=true
+            distance_unit.visible=true
+            distance_title.visible=true
+            select_trip2.visible=true;
+            select_instant.visible=true;
+            reset.visible=true;
+            update(1);
+        }
+        else
+        if (Genivi.tripMode=="TRIP_NUMBER2")
+        {
+            content.image=StyleSheet.trip2_background[Constants.SOURCE]
+            avg_speed_value.visible=true
+            avg_speed_unit.visible=true
+            avg_speed_title.visible=true
+            avg_fuel_value.visible=true
+            avg_fuel_unit.visible=true
+            avg_fuel_title.visible=true
+            distance_value.visible=true
+            distance_unit.visible=true
+            distance_title.visible=true
+            select_trip1.visible=true;
+            select_instant.visible=true;
+            reset.visible=true;
+            update(2);
+        }
+        else
+        if (Genivi.tripMode=="TRIP_INSTANT")
+        {
+            content.image=StyleSheet.trip_instant_background[Constants.SOURCE]
+            fuel_value.visible=true
+            fuel_unit.visible=true
+            fuel_title.visible=true
+            tank_distance_value.visible=true
+            tank_distance_unit.visible=true
+            tank_distance_title.visible=true
+            predictive_tank_distance_value.visible=true
+            predictive_tank_distance_unit.visible=true
+            predictive_tank_distance_title.visible=true
+            select_trip1.visible=true;
+            select_trip2.visible=true;
+            update(0);
+        }
+        else
+        {
+            content.image=StyleSheet.trip1_background[Constants.SOURCE]
+            avg_speed_value.visible=true
+            avg_speed_unit.visible=true
+            avg_speed_title.visible=true
+            avg_fuel_value.visible=true
+            avg_fuel_unit.visible=true
+            avg_fuel_title.visible=true
+            distance_value.visible=true
+            distance_unit.visible=true
+            distance_title.visible=true
+            select_trip2.visible=true;
+            select_instant.visible=true;
+            reset.visible=true;
+        }
+    }
+
+    function disableAllValue()
+    {
+        distance_value.text="---";
+        avg_speed_value.text="---";
+        avg_fuel_value.text="---";
+        fuel_value.text="---";
+        tank_distance_value.text="---";
+        predictive_tank_distance_value.text="---";
+    }
+
+    function setUnits()
+    {
+        distance_unit.text="km";
+        avg_speed_unit.text="km/h";
+        avg_fuel_unit.text="l/100km";
+        fuel_unit.text="L";
+        tank_distance_unit.text="km";
+        predictive_tank_distance_unit.text="km";
+    }
+
+	function update(tripnr)
+    {
+        var res;
+        var value;
+        disableAllValue(); // By default set all the values to "--"
+		if (tripnr > 0) {         
+            res=Genivi.fuelstopadvisor_GetTripData(dbusIf,tripnr-1);
+            for (var i = 0 ; i < res[1].length ; i+=4) {
+                if (res[1][i+1] == Genivi.FUELSTOPADVISOR_DISTANCE) {
+                    value=res[1][i+3][3][1]/10;
+                    distance_value.text=value.toFixed(1);
+                }
+				if (res[1][i+1] == Genivi.FUELSTOPADVISOR_AVERAGE_SPEED) {
+                    value=res[1][i+3][3][1]/10;
+                    avg_speed_value.text=value.toFixed(0);
+                }
+				if (res[1][i+1] == Genivi.FUELSTOPADVISOR_AVERAGE_FUEL_CONSUMPTION_PER_DISTANCE) {
+                    value=res[1][i+3][3][1]/10;
+                    avg_fuel_value.text=value.toFixed(1);
+                }
+			}
+		} else {
+            res=Genivi.fuelstopadvisor_GetInstantData(dbusIf);
+			for (var i = 0 ; i < res[1].length ; i+=4) {
+                if (res[1][i+1] == Genivi.FUELSTOPADVISOR_FUEL_LEVEL) {
+                    fuel_value.text=res[1][i+3][3][1];
+				}
+				if (res[1][i+1] == Genivi.FUELSTOPADVISOR_TANK_DISTANCE) {
+                        tank_distance_value.text=res[1][i+3][3][1];
+				}
+				if (res[1][i+1] == Genivi.FUELSTOPADVISOR_ENHANCED_TANK_DISTANCE) {
+                    predictive_tank_distance_value.text=res[1][i+3][3][1];
+				}
+			}
+
+		}
+    }
+
+    function leave()
+    {
+        disconnectSignals();
+    }
+
+	HMIBgImage {
+        id:content
+        image:
+        {
+            if (Genivi.tripMode=="TRIP_NUMBER1")
+            {
+                image=StyleSheet.trip1_background[Constants.SOURCE]
+            }
+            else
+            if (Genivi.tripMode=="TRIP_NUMBER2")
+            {
+                image=StyleSheet.trip2_background[Constants.SOURCE]
+            }
+            else
+            if (Genivi.tripMode=="TRIP_INSTANT")
+            {
+                image=StyleSheet.trip_instant_background[Constants.SOURCE]
+            }
+            else
+            {
+                image=StyleSheet.trip1_background[Constants.SOURCE]
+            }
+        }
+
+		anchors { fill: parent; topMargin: parent.headlineHeight}
+        Text {
+            x:StyleSheet.avg_speed_value[Constants.X]; y:StyleSheet.avg_speed_value[Constants.Y]; width:StyleSheet.avg_speed_value[Constants.WIDTH]; height:StyleSheet.avg_speed_value[Constants.HEIGHT];color:StyleSheet.avg_speed_value[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_speed_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_speed_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_speed_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.avg_speed_unit[Constants.X]; y:StyleSheet.avg_speed_unit[Constants.Y]; width:StyleSheet.avg_speed_unit[Constants.WIDTH]; height:StyleSheet.avg_speed_unit[Constants.HEIGHT];color:StyleSheet.avg_speed_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_speed_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_speed_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_speed_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.avg_speed_title[Constants.X]; y:StyleSheet.avg_speed_title[Constants.Y]; width:StyleSheet.avg_speed_title[Constants.WIDTH]; height:StyleSheet.avg_speed_title[Constants.HEIGHT];color:StyleSheet.avg_speed_title[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_speed_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_speed_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_speed_title
+            text: Genivi.gettext("AvgSpeed")
+        }
+        Text {
+            x:StyleSheet.avg_fuel_value[Constants.X]; y:StyleSheet.avg_fuel_value[Constants.Y]; width:StyleSheet.avg_fuel_value[Constants.WIDTH]; height:StyleSheet.avg_fuel_value[Constants.HEIGHT];color:StyleSheet.avg_fuel_value[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_fuel_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_fuel_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_fuel_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.avg_fuel_unit[Constants.X]; y:StyleSheet.avg_fuel_unit[Constants.Y]; width:StyleSheet.avg_fuel_unit[Constants.WIDTH]; height:StyleSheet.avg_fuel_unit[Constants.HEIGHT];color:StyleSheet.avg_fuel_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_fuel_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_fuel_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_fuel_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.avg_fuel_title[Constants.X]; y:StyleSheet.avg_fuel_title[Constants.Y]; width:StyleSheet.avg_fuel_title[Constants.WIDTH]; height:StyleSheet.avg_fuel_title[Constants.HEIGHT];color:StyleSheet.avg_fuel_title[Constants.TEXTCOLOR];styleColor:StyleSheet.avg_fuel_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.avg_fuel_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:avg_fuel_title
+            text: Genivi.gettext("AvgFuel")
+        }
+        Text {
+            x:StyleSheet.distance_value[Constants.X]; y:StyleSheet.distance_value[Constants.Y]; width:StyleSheet.distance_value[Constants.WIDTH]; height:StyleSheet.distance_value[Constants.HEIGHT];color:StyleSheet.distance_value[Constants.TEXTCOLOR];styleColor:StyleSheet.distance_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.distance_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:distance_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.distance_unit[Constants.X]; y:StyleSheet.distance_unit[Constants.Y]; width:StyleSheet.distance_unit[Constants.WIDTH]; height:StyleSheet.distance_unit[Constants.HEIGHT];color:StyleSheet.distance_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.distance_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.distance_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:distance_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.distance_title[Constants.X]; y:StyleSheet.distance_title[Constants.Y]; width:StyleSheet.distance_title[Constants.WIDTH]; height:StyleSheet.distance_title[Constants.HEIGHT];color:StyleSheet.distance_title[Constants.TEXTCOLOR];styleColor:StyleSheet.distance_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.distance_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:distance_title
+            text: Genivi.gettext("Distance")
+        }
+        Text {
+            x:StyleSheet.fuel_value[Constants.X]; y:StyleSheet.fuel_value[Constants.Y]; width:StyleSheet.fuel_value[Constants.WIDTH]; height:StyleSheet.fuel_value[Constants.HEIGHT];color:StyleSheet.fuel_value[Constants.TEXTCOLOR];styleColor:StyleSheet.fuel_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.fuel_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:fuel_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.fuel_unit[Constants.X]; y:StyleSheet.fuel_unit[Constants.Y]; width:StyleSheet.fuel_unit[Constants.WIDTH]; height:StyleSheet.fuel_unit[Constants.HEIGHT];color:StyleSheet.fuel_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.fuel_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.fuel_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:fuel_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.fuel_title[Constants.X]; y:StyleSheet.fuel_title[Constants.Y]; width:StyleSheet.fuel_title[Constants.WIDTH]; height:StyleSheet.fuel_title[Constants.HEIGHT];color:StyleSheet.fuel_title[Constants.TEXTCOLOR];styleColor:StyleSheet.fuel_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.fuel_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:fuel_title
+            text: Genivi.gettext("FuelLevel")
+        }
+        Text {
+            x:StyleSheet.tank_distance_value[Constants.X]; y:StyleSheet.tank_distance_value[Constants.Y]; width:StyleSheet.tank_distance_value[Constants.WIDTH]; height:StyleSheet.tank_distance_value[Constants.HEIGHT];color:StyleSheet.tank_distance_value[Constants.TEXTCOLOR];styleColor:StyleSheet.tank_distance_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.tank_distance_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:tank_distance_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.tank_distance_unit[Constants.X]; y:StyleSheet.tank_distance_unit[Constants.Y]; width:StyleSheet.tank_distance_unit[Constants.WIDTH]; height:StyleSheet.tank_distance_unit[Constants.HEIGHT];color:StyleSheet.tank_distance_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.tank_distance_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.tank_distance_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:tank_distance_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.tank_distance_title[Constants.X]; y:StyleSheet.tank_distance_title[Constants.Y]; width:StyleSheet.tank_distance_title[Constants.WIDTH]; height:StyleSheet.tank_distance_title[Constants.HEIGHT];color:StyleSheet.tank_distance_title[Constants.TEXTCOLOR];styleColor:StyleSheet.tank_distance_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.tank_distance_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:tank_distance_title
+            text: Genivi.gettext("TankDistance")
+        }
+        Text {
+            x:StyleSheet.predictive_tank_distance_value[Constants.X]; y:StyleSheet.predictive_tank_distance_value[Constants.Y]; width:StyleSheet.predictive_tank_distance_value[Constants.WIDTH]; height:StyleSheet.predictive_tank_distance_value[Constants.HEIGHT];color:StyleSheet.predictive_tank_distance_value[Constants.TEXTCOLOR];styleColor:StyleSheet.predictive_tank_distance_value[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.predictive_tank_distance_value[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:predictive_tank_distance_value
+            text: " "
+        }
+        Text {
+            x:StyleSheet.predictive_tank_distance_unit[Constants.X]; y:StyleSheet.predictive_tank_distance_unit[Constants.Y]; width:StyleSheet.predictive_tank_distance_unit[Constants.WIDTH]; height:StyleSheet.predictive_tank_distance_unit[Constants.HEIGHT];color:StyleSheet.predictive_tank_distance_unit[Constants.TEXTCOLOR];styleColor:StyleSheet.predictive_tank_distance_unit[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.predictive_tank_distance_unit[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:predictive_tank_distance_unit
+            text: " "
+        }
+        Text {
+            x:StyleSheet.predictive_tank_distance_title[Constants.X]; y:StyleSheet.predictive_tank_distance_title[Constants.Y]; width:StyleSheet.predictive_tank_distance_title[Constants.WIDTH]; height:StyleSheet.predictive_tank_distance_title[Constants.HEIGHT];color:StyleSheet.predictive_tank_distance_title[Constants.TEXTCOLOR];styleColor:StyleSheet.predictive_tank_distance_title[Constants.STYLECOLOR]; font.pixelSize:StyleSheet.predictive_tank_distance_title[Constants.PIXELSIZE];
+            visible: false
+            style: Text.Sunken;
+            smooth: true
+            id:predictive_tank_distance_title
+            text: Genivi.gettext("PredictiveTankDistance")
+        }
+
+        StdButton { source:StyleSheet.reset[Constants.SOURCE]; x:StyleSheet.reset[Constants.X]; y:StyleSheet.reset[Constants.Y]; width:StyleSheet.reset[Constants.WIDTH]; height:StyleSheet.reset[Constants.HEIGHT];textColor:StyleSheet.resetText[Constants.TEXTCOLOR]; pixelSize:StyleSheet.resetText[Constants.PIXELSIZE];
+            visible: false;
+            id:reset; text: Genivi.gettext("Reset"); explode:false; disabled:false; next:select_trip1; prev:back;
+            onClicked:{
+		if (Genivi.tripMode == "TRIP_NUMBER1") {
+            Genivi.fuelstopadvisor_ResetTripData(dbusIf,0);
+		}
+		if (Genivi.tripMode == "TRIP_NUMBER2") {
+            Genivi.fuelstopadvisor_ResetTripData(dbusIf,1);
+		}
+    		updateTripMode();
+            }
+        }
+        StdButton { source:StyleSheet.select_trip1[Constants.SOURCE]; x:StyleSheet.select_trip1[Constants.X]; y:StyleSheet.select_trip1[Constants.Y]; width:StyleSheet.select_trip1[Constants.WIDTH]; height:StyleSheet.select_trip1[Constants.HEIGHT];
+            visible: false;
+            id:select_trip1; explode:false; disabled:false; next:select_trip2; prev:reset;
+            onClicked:{
+                Genivi.tripMode="TRIP_NUMBER1";
+                updateTripMode();
+            }
+        }
+        StdButton { source:StyleSheet.select_trip2[Constants.SOURCE]; x:StyleSheet.select_trip2[Constants.X]; y:StyleSheet.select_trip2[Constants.Y]; width:StyleSheet.select_trip2[Constants.WIDTH]; height:StyleSheet.select_trip2[Constants.HEIGHT];
+            visible: false;
+            id:select_trip2; explode:false; disabled:false; next:select_instant; prev:select_trip1;
+            onClicked:{
+                Genivi.tripMode="TRIP_NUMBER2";
+                updateTripMode();
+            }
+        }
+        StdButton { source:StyleSheet.select_instant[Constants.SOURCE]; x:StyleSheet.select_instant[Constants.X]; y:StyleSheet.select_instant[Constants.Y]; width:StyleSheet.select_instant[Constants.WIDTH]; height:StyleSheet.select_instant[Constants.HEIGHT];
+            visible: false;
+            id:select_instant; explode:false; disabled:false; next:back; prev:select_trip2;
+            onClicked:{
+                Genivi.tripMode="TRIP_INSTANT";
+                updateTripMode();
+            }
+        }
+        StdButton { source:StyleSheet.back[Constants.SOURCE]; x:StyleSheet.back[Constants.X]; y:StyleSheet.back[Constants.Y]; width:StyleSheet.back[Constants.WIDTH]; height:StyleSheet.back[Constants.HEIGHT];textColor:StyleSheet.backText[Constants.TEXTCOLOR]; pixelSize:StyleSheet.backText[Constants.PIXELSIZE];
+            id:back; text: Genivi.gettext("Back"); explode:false; disabled:false; next:reset; prev:select_instant;
+            onClicked:{leave(); leaveMenu();}
+        }
+    }
+    Component.onCompleted: {
+        connectSignals();
+        setUnits();
+        updateTripMode();
+    }
+}
diff --git a/src/hmi/qml/navigation.qmlproject b/src/hmi/qml/navigation.qmlproject
new file mode 100644
index 0000000..9989d01
--- /dev/null
+++ b/src/hmi/qml/navigation.qmlproject
@@ -0,0 +1,21 @@
+/* File generated by Qt Creator, version 2.7.0 */
+
+import QmlProject 1.1
+
+Project {
+    mainFile: "NavigationApp.qml"
+    
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+        filter: "NavigationApp*.qml"
+    }
+    JavaScriptFiles {
+        directory: "./Core"
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ "../exampleplugin" ]
+}