Rejig navigation

This change streamlines the navigation across the pages to be in line
with the stackview organization. The top bar becomes a static element
with the title and a button that either opens the preferences or shows
the back arrow.

This makes it a bit more efficient, since we load the title bar only
one, and there are no strange animations in the title. The stackview
gets the role of content container, the "chrome" around it is laid out
in main.qml.

Most of the churn in this patch comes from moving large blocks of code
between files with different indentation levels.

Signed-off-by: Sebastian Kügler <sebas@kde.org>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

1 files changed, 36 insertions, 29 deletions

diff --git a/qt-mobile/qml/TopBar.qml b/qt-mobile/qml/TopBar.qml
index 552159d53..eb7403f9b 100644
--- a/qt-mobile/qml/TopBar.qml
+++ b/qt-mobile/qml/TopBar.qml
@@ -8,33 +8,52 @@ import QtQuick.Window 2.2
 import org.subsurfacedivelog.mobile 1.0
 
 Rectangle {
-	id: topBar
+	id: topPart
+
+	property bool goBack: (stackView.depth > 1)
+
 	color: theme.accentColor
+	Layout.minimumHeight: units.gridUnit * 2 + units.smallSpacing * 2
 	Layout.fillWidth: true
 	Layout.margins: 0
-	Layout.minimumHeight: prefsButton.height + units.smallSpacing * 2
 	RowLayout {
-		anchors.bottom: topBar.bottom
+		anchors.bottom: topPart.bottom
 		anchors.bottomMargin: units.smallSpacing
-		anchors.left: topBar.left
+		anchors.left: topPart.left
 		anchors.leftMargin: units.smallSpacing
-		anchors.right: topBar.right
+		anchors.right: topPart.right
 		anchors.rightMargin: units.smallSpacing
+		Image {
+			source: "qrc:/qml/subsurface-mobile-icon.png"
+			Layout.maximumWidth: units.gridUnit * 2
+			Layout.preferredWidth: units.gridUnit * 2
+			Layout.preferredHeight: units.gridUnit * 2
+		}
+		Text {
+			text: qsTr("Subsurface")
+			font.pointSize: units.fontMetrics.font.pointSize * 2
+			Layout.fillWidth: false
+			color: theme.accentTextColor
+		}
+		Item {
+			Layout.fillWidth: true
+		}
 		Button {
-			id: backButton
-			Layout.maximumHeight: prefsButton.height
-			Layout.minimumHeight: prefsButton.height
+			id: prefsButton
+			// Display back arrow or menu button
+			text: topPart.goBack ? "\u2190" : "\u22ee"
+			anchors.right: parent.right
 			Layout.preferredWidth: units.gridUnit * 2
-			text: "\u2190"
+			Layout.preferredHeight: parent.height
 			style: ButtonStyle {
 				background: Rectangle {
-					color: theme.accentColor
 					implicitWidth: units.gridUnit * 2
+					color: theme.accentColor
 				}
 				label: Text {
 					id: txt
 					color: theme.accentTextColor
-					font.pointSize: 18
+					font.pointSize: units.fontMetrics.font.pointSize * 2
 					font.bold: true
 					text: control.text
 					horizontalAlignment: Text.AlignHCenter
@@ -42,26 +61,14 @@ Rectangle {
 				}
 			}
 			onClicked: {
-				if (stackView.currentItem.objectName == "DiveDetails")
-				{
-				manager.commitChanges(
-							dive_id,
-							suit,
-							buddy,
-							divemaster,
-							notes
-							)
+				if (topPart.goBack) {
+					stackView.pop()
+				} else {
+					prefsMenu.popup()
 				}
-				stackView.pop();
 			}
 		}
-		Text {
-			text: qsTr("Subsurface mobile")
-			font.pointSize: 18
-			color: theme.accentTextColor
-			anchors.left: backButton.right
-			anchors.leftMargin: units.smallSpacing
-			//horizontalAlignment: Text.AlignHCenter
-		}
+
 	}
+
 }