3 files changed, 119 insertions, 5 deletions
diff --git a/qml/pages/AddWidget.qml b/qml/pages/AddWidget.qml
new file mode 100644
index 0000000..50bf63d
--- /dev/null
+++ b/qml/pages/AddWidget.qml
@@ -0,0 +1,36 @@
+import QtQuick 2.0
+import Sailfish.Silica 1.0
+import com.javispedro.salmeta 1.0
+
+Page {
+	id: page
+
+	property int addToPage
+	property int addToPos
+
+	SilicaListView {
+		id: allWidgetsListView
+		anchors.fill: parent
+
+		model: allWidgets
+
+		header: PageHeader {
+			title: "Add widget"
+		}
+
+		delegate : BackgroundItem {
+			contentHeight: Theme.itemSizeMedium
+
+			Label {
+				text: url
+				truncationMode: TruncationMode.Elide
+				color: highlighted ? Theme.highlightColor : Theme.primaryColor
+			}
+
+			onClicked: {
+				curWidgets.addWidget(url, addToPage, addToPos, size);
+				pageStack.pop();
+			}
+		}
+	}
+}
diff --git a/qml/pages/FirstPage.qml b/qml/pages/MainPage.qml
index b86029e..5448754 100644
--- a/qml/pages/FirstPage.qml
+++ b/qml/pages/MainPage.qml
@@ -2,14 +2,13 @@ import QtQuick 2.0
 import Sailfish.Silica 1.0
 import Sailfish.Bluetooth 1.0
 import org.nemomobile.configuration 1.0
-import com.javispedro.salmeta 1.0
 
 Page {
 	id: page
 
 	ConfigurationValue {
 		id: deviceAddress
-		key: settingsPrefix + "/address"
+		key: curSettingsPrefix + "/address"
 		defaultValue: "Select"
 	}
 
@@ -46,7 +45,7 @@ Page {
 					var dialog = pageStack.push("Sailfish.Bluetooth.BluetoothDevicePickerDialog");
 
 					dialog.selectedDeviceChanged.connect(function() {
-						if (dialog.selectedDevice != "") {
+						if (dialog.selectedDevice !== "") {
 							deviceAddress.value = dialog.selectedDevice
 						}
 					});
@@ -57,10 +56,44 @@ Page {
 				text: qsTr("Widgets");
 			}
 
-			WatchView {
-				anchors.horizontalCenter: parent.horizontalCenter
+			Item {
 				width: 96 * 4
 				height: 96 * 4
+				anchors.horizontalCenter: parent.horizontalCenter
+
+				WatchView {
+					id: watchView
+					anchors.centerIn: parent
+					scale: 4
+				}
+			}
+
+			Row {
+				anchors.horizontalCenter: parent.horizontalCenter
+				spacing: 8
+
+				Repeater {
+					model: 4
+
+					Rectangle {
+						// TODO These should be GlassItem.
+						width: 16
+						height: 16
+						radius: 8
+
+						color: "white"
+						opacity: watchView.curPage == index ? 0.9 : 0.3
+					}
+				}
+			}
+
+			SectionHeader {
+				text: qsTr("Notifications");
+			}
+
+			Label {
+				x: Theme.paddingLarge
+				text: "TODO"
 			}
 		}
 	}
diff --git a/qml/pages/WatchView.qml b/qml/pages/WatchView.qml
new file mode 100644
index 0000000..e738f4e
--- /dev/null
+++ b/qml/pages/WatchView.qml
@@ -0,0 +1,45 @@
+import QtQuick 2.0
+import "../watch"
+
+Flickable {
+	id: watchView
+	width: 96
+	height: 96
+	clip: true
+	flickableDirection: Flickable.HorizontalFlick
+
+	property int curPage: 0
+
+	WidgetView {
+		id: widgetView
+		model: curWidgets
+		editMode: true
+		onEmptyWidgetClicked: {
+			pageStack.push(Qt.resolvedUrl("AddWidget.qml"), {
+							   'addToPage': page,
+							   'addToPos': pos
+						   });
+		}
+	}
+
+	contentWidth: widgetView.width
+	contentHeight: widgetView.height
+
+	NumberAnimation {
+		id: pivotAnim
+		targets: watchView
+		property: "contentX"
+		to: curPage * watchView.width
+		duration: 100
+		easing.type: Easing.InOutQuad
+	}
+
+	onMovementStarted: {
+		pivotAnim.stop()
+	}
+
+	onMovementEnded: {
+		curPage = Math.round(watchView.contentX / watchView.width)
+		pivotAnim.start()
+	}
+}