import QtQuick 2.0
import Sailfish.Silica 1.0
import Sailfish.Bluetooth 1.0
import org.nemomobile.configuration 1.0

Page {
	id: page

	ConfigurationValue {
		id: deviceAddress
		key: curSettingsPrefix + "/address"
		defaultValue: "Select"
	}

	SilicaFlickable {
		anchors.fill: parent

		PullDownMenu {
			MenuItem {
				text: qsTr("Not done yet")
			}
		}

		contentHeight: column.height

		Column {
			id: column
			width: page.width
			spacing: Theme.paddingLarge

			PageHeader {
				title: "Salmeta"
			}

			SectionHeader {
				text: qsTr("Device settings");
			}

			ValueButton {
				x: Theme.paddingLarge
				label: "Device"
				value: deviceAddress.value

				onClicked: {
					var dialog = pageStack.push("Sailfish.Bluetooth.BluetoothDevicePickerDialog");

					dialog.selectedDeviceChanged.connect(function() {
						if (dialog.selectedDevice !== "") {
							deviceAddress.value = dialog.selectedDevice
						}
					});
				}
			}

			SectionHeader {
				text: qsTr("Widgets");
			}

			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"
			}
		}
	}
}