Flesh out UI, provide journey data model

[harbour-pedalo.git] / qml / pages / AddJourney.qml

diff --git a/qml/pages/AddJourney.qml b/qml/pages/AddJourney.qml
new file mode 100644 (file)
index 0000000..b0d8170
--- /dev/null
+++ b/qml/pages/AddJourney.qml
@@ -0,0 +1,126 @@
+import QtQuick 2.0
+import Sailfish.Silica 1.0
+
+Dialog {
+    id: addJourneyDialog
+    canAccept: true
+    property string title: "Add journey"
+
+    // The effective value will be restricted by ApplicationWindow.allowedOrientations
+    allowedOrientations: Orientation.All
+
+    SilicaFlickable {
+        id: addJourneyView
+        anchors.fill: parent
+        contentHeight: addJourneyColumn.implicitHeight
+
+        VerticalScrollDecorator {}
+
+        Column {
+            id: addJourneyColumn
+            spacing: Theme.paddingMedium
+            width: parent.width
+
+            DialogHeader {
+                title: addJourneyDialog.title
+            }
+
+            ValueButton {
+                id: startDate
+                function openDateDialog() {
+                    var dialog = pageStack.push("Sailfish.Silica.DatePickerDialog", {
+                                    date: value
+                                 })
+
+                    dialog.accepted.connect(function() {
+                        value = dialog.dateText
+                        selectedDate = dialog.date
+                    })
+                }
+
+                label: "Date"
+                value: Qt.formatDate(new Date(), 'd MMM yyyy')
+                width: parent.width
+                onClicked: openDateDialog()
+            }
+
+            ValueButton {
+                id: startTime
+                property date time: new Date()
+                label: qsTr("Start time")
+                value: Qt.formatTime(time, 'hh:mm')
+                width: parent.width
+                onClicked: {
+                    console.log("Hours: " + time.getHours())
+                    console.log("Mins: " + time.getMinutes())
+                    var dialog = pageStack.push("Sailfish.Silica.TimePickerDialog", { hour: time.getHours(), minute: time.getMinutes()})
+                    dialog.accepted.connect(function() {
+                        time = new Date(0, 0, 0, dialog.hour, dialog.minute)
+                    })
+                }
+                onTimeChanged: {
+                    value = Qt.formatTime(time, 'hh:mm')
+                    endTime.time = new Date(0, 0, 0, startTime.time.getHours() + durationTime.duration.getHours(), startTime.time.getMinutes() + durationTime.duration.getMinutes())
+                }
+            }
+
+            ValueButton {
+                id: endTime
+                property date time: new Date()
+                label: qsTr("End time")
+                value: Qt.formatTime(time, 'hh:mm')
+                width: parent.width
+                onClicked: {
+                    var dialog = pageStack.push("Sailfish.Silica.TimePickerDialog", { hour: time.getHours(), minute: time.getMinutes()})
+                    dialog.accepted.connect(function() {
+                        time = new Date(0, 0, 0, dialog.hour, dialog.minute)
+                    })
+                }
+                onTimeChanged: {
+                    value = Qt.formatTime(time, 'hh:mm')
+                    durationTime.duration = new Date(0, 0, 0, endTime.time.getHours() - startTime.time.getHours(), endTime.time.getMinutes() - startTime.time.getMinutes())
+                }
+            }
+
+            ValueButton {
+                id: durationTime
+                property date duration: new Date(0, 0, 0, 0, 0)
+                label: qsTr("Duration")
+                value: Qt.formatTime(duration, 'hh:mm')
+                width: parent.width
+                onClicked: {
+                    var dialog = pageStack.push("Sailfish.Silica.TimePickerDialog", { hour: duration.getHours(), minute: duration.getMinutes()})
+                    dialog.accepted.connect(function() {
+                        duration = new Date(0, 0, 0, dialog.hour, dialog.minute)
+                    })
+                }
+                onDurationChanged: {
+                    value = Qt.formatTime(duration, 'hh:mm')
+                    endTime.time = new Date(0, 0, 0, startTime.time.getHours() + durationTime.duration.getHours(), startTime.time.getMinutes() + durationTime.duration.getMinutes())
+                }
+            }
+
+            TextField {
+                id: faster
+                width: parent.width
+                inputMethodHints: Qt.ImhDigitsOnly
+                label: qsTr("Cycles which you overtook")
+                placeholderText: label
+                horizontalAlignment: TextInput.AlignLeft
+                EnterKey.iconSource: "image://theme/icon-m-enter-next"
+                EnterKey.onClicked: slower.focus = true
+            }
+
+            TextField {
+                id: slower
+                width: parent.width
+                inputMethodHints: Qt.ImhDigitsOnly
+                label: qsTr("Cycles which overtook you")
+                placeholderText: label
+                horizontalAlignment: TextInput.AlignLeft
+                EnterKey.iconSource: "image://theme/icon-m-enter-next"
+                EnterKey.onClicked: addJourneyDialog.accept()
+            }
+        }
+    }
+}