Merge branch 'dmytro/welcome_page_update' of ssh://git.openpilot.org/OpenPilot into pt/CC3D_Release

ground/openpilotgcs/src/plugins/welcome/qml/CommunityPanel.qml

@@ -2,7 +2,8 @@
 import QtQuick 1.1
 
 Item {
-    width: background.sourceSize.width
+    property alias sourceSize: background.sourceSize
+    width: sourceSize.width
     height: 300
 
     BorderImage {

ground/openpilotgcs/src/plugins/welcome/qml/NewsPanel.qml

@@ -28,6 +28,10 @@ Item {
         clip: true
     }
 
+    ScrollDecorator {
+        flickableItem: view
+    }
+
     XmlListModel {
         id: xmlModel
         source: "http://www.openpilot.org/feed/"

ground/openpilotgcs/src/plugins/welcome/qml/ScrollDecorator.qml

@@ -0,0 +1,37 @@
+import QtQuick 1.1
+
+Rectangle {
+    id: scrollDecorator
+
+    property Flickable flickableItem: null
+
+    Loader {
+        sourceComponent: scrollDecorator.flickableItem ? scrollBar : undefined
+    }
+
+    Component {
+        id: scrollBar
+        Rectangle {
+            property Flickable flickable: scrollDecorator.flickableItem
+
+            parent: flickable
+            anchors.right: parent.right
+
+            smooth: true
+            radius: 2
+            color: "gray"
+            border.color: "lightgray"
+            border.width: 1.0
+            opacity: flickable.moving ? 0.8 : 0.4
+
+            Behavior on opacity {
+                NumberAnimation { duration: 500 }
+            }
+
+            width: 4
+            height: flickable.height * (flickable.height / flickable.contentHeight)
+            y: flickable.height * (flickable.contentY / flickable.contentHeight)
+            visible: flickable.height < flickable.contentHeight
+        }
+    }
+}

ground/openpilotgcs/src/plugins/welcome/qml/WelcomePageButton.qml

@@ -3,8 +3,9 @@ import QtQuick 1.1
 
 Item {
     id: welcomeButton
-    width: 116
+    width: Math.max(116, icon.width)
     height: 116
+    z: 0
 
     property string baseIconName
     property alias label : labelText.text
@@ -26,17 +27,21 @@ Item {
 
     Image {
         id: labelImage
-        source: "images/button-label.png"
+        property bool displayBelowButton: false
+        source: displayBelowButton ? "images/button-label-bottom.png" : "images/button-label.png"
         opacity: 0
+        visible: labelText.text.length > 0 //don't show label bg without text
+
 
         anchors.horizontalCenter: parent.horizontalCenter
-        anchors.bottom: hoveredIcon.top
-        anchors.bottomMargin: -8
+        y: displayBelowButton ? parent.height-8 : -height+8
 
         Text {
             id: labelText
-            anchors.baseline: parent.verticalCenter
-            anchors.baselineOffset: -4
+            anchors.baseline: parent.bottom
+            //text baseline depends on label image orientation,
+            //0.3 and 0.55 constants have to be adjusted when button-label.png is modified
+            anchors.baselineOffset: labelImage.displayBelowButton ? -parent.height*0.3 : -parent.height*0.55
             anchors.horizontalCenter: parent.horizontalCenter
 
             font {
@@ -49,8 +54,16 @@ Item {
 
     states: State {
         name: "hovered"
+        //update the tooltip position before it's displayed,
+        //since we don't have a property to bind directly
+        StateChangeScript {
+            name: "updateLabelPosition"
+            script: labelImage.displayBelowButton = welcomeButton.mapToItem(null,0,0).y < labelImage.height
+        }
         PropertyChanges { target: hoveredIcon; opacity: 1.0 }
         PropertyChanges { target: labelImage; opacity: 1.0 }
+        //raise this button, so tooltip is not obscured by the next items in the grid
+        PropertyChanges { target: welcomeButton; z: 1 }
     }
 
     transitions: Transition {

ground/openpilotgcs/src/plugins/welcome/qml/main.qml

@@ -25,6 +25,29 @@ Rectangle {
     }
 
     Column {
+        id: wizarButtonsColumn
+
+        anchors {
+            top: parent.top
+            right: parent.right
+            margins: 8
+        }
+        spacing: 8
+
+        WelcomePageButton {
+            baseIconName: "bttn-vehwizard"
+            onClicked: welcomePlugin.openPage("VehWizard")
+        }
+
+        WelcomePageButton {
+            baseIconName: "bttn-txwizard"
+            onClicked: welcomePlugin.openPage("TxWizard")
+        }
+    }
+
+
+    Column {
+        id: buttonsGrid
         anchors.horizontalCenter: parent.horizontalCenter
         // distribute a vertical space between the icons blocks an community widget as:
         // top - 48% - Icons - 27% - CommunityWidget - 25% - bottom
@@ -33,13 +56,20 @@ Rectangle {
         spacing: (parent.height - buttons.height - communityPanel.height) * 0.27
 
         Row {
-            anchors.horizontalCenter: parent.horizontalCenter
+            //if the buttons grid overlaps vertically with the wizard buttons,
+            //move it left to use only the space left to wizard buttons
+            property real availableWidth: buttonsGrid.y > wizarButtonsColumn.y+wizarButtonsColumn.height ?
+                                           container.width : wizarButtonsColumn.x
+            x: (availableWidth-width)/2
             spacing: 16
 
             Image {
                 source: "images/welcome-op-logo.png"
                 anchors.verticalCenter: parent.verticalCenter
                 anchors.verticalCenterOffset: -2 //it looks better aligned to icons grid
+
+                //hide the logo on the very small screen to fit the buttons
+                visible: parent.availableWidth > width + parent.spacing + buttons.width
             }
 
             Grid {
@@ -89,6 +119,8 @@ Rectangle {
         CommunityPanel {
             id: communityPanel
             anchors.horizontalCenter: parent.horizontalCenter
+            width: Math.min(sourceSize.width, container.width)
+            height: Math.min(300, container.height*0.5)
         }
     }
 }

ground/openpilotgcs/src/plugins/welcome/welcome.qrc

@@ -5,9 +5,11 @@
         <file>qml/SitesPanel.qml</file>
         <file>qml/WelcomePageButton.qml</file>
         <file>qml/NewsPanel.qml</file>
+        <file>qml/ScrollDecorator.qml</file>
         <file>qml/images/welcome-news-bg.png</file>
         <file>qml/images/welcome-op-logo.png</file>
         <file>qml/images/button-label.png</file>
+        <file>qml/images/button-label-bottom.png</file>
         <file>qml/images/welcome-op-bg.png</file>
         <file>qml/images/welcome-bg.png</file>
         <file>qml/images/flightdata-on.png</file>
@@ -24,5 +26,9 @@
         <file>qml/images/scopes-off.png</file>
         <file>qml/images/system-on.png</file>
         <file>qml/images/system-off.png</file>
+        <file>qml/images/bttn-txwizard-on.png</file>
+        <file>qml/images/bttn-txwizard-off.png</file>
+        <file>qml/images/bttn-vehwizard-on.png</file>
+        <file>qml/images/bttn-vehwizard-off.png</file>
     </qresource>
 </RCC>