weather rendering in metawatchwatchlets

18 files changed, 169 insertions, 43 deletions

diff --git a/metawatchwatchlets/ChatBubble.qml b/metawatchwatchlets/ChatBubble.qml
new file mode 100644
index 0000000..ba69e64
--- /dev/null
+++ b/metawatchwatchlets/ChatBubble.qml
@@ -0,0 +1,37 @@
+import QtQuick 1.0
+
+Item {
+	id: container
+	height: bubble.height + 4
+
+	default property alias children: childContainer.children
+
+	Image {
+		anchors {
+			top: parent.top; left: parent.left;
+			leftMargin: 18;
+		}
+		source: "bubble_tip.png"
+		z: 1
+	}
+
+	BorderImage {
+		id: bubble
+		anchors {
+			top: parent.top; left: parent.left; right: parent.right;
+			topMargin: 8;
+		}
+		border { left: 16; top: 16; right: 16; bottom: 16; }
+		height: childContainer.height + 16
+		source: "bubble.png"
+		Item {
+			id: childContainer
+			height: childrenRect.height
+			anchors {
+				top: parent.top; left: parent.left; right: parent.right;
+				margins: 16 / 2
+			}
+		}
+	}
+}
+
diff --git a/metawatchwatchlets/idle_border.png b/metawatchwatchlets/idle-border.png
index 7879647..7879647 100644
--- a/metawatchwatchlets/idle_border.png
+++ b/metawatchwatchlets/idle-border.png
diff --git a/metawatchwatchlets/idle_call.png b/metawatchwatchlets/idle-call.png
index 872f681..872f681 100644
--- a/metawatchwatchlets/idle_call.png
+++ b/metawatchwatchlets/idle-call.png
diff --git a/metawatchwatchlets/idle_mail.png b/metawatchwatchlets/idle-mail.png
index 6afaaaa..6afaaaa 100644
--- a/metawatchwatchlets/idle_mail.png
+++ b/metawatchwatchlets/idle-mail.png
diff --git a/metawatchwatchlets/idle_msg.png b/metawatchwatchlets/idle-msg.png
index b3bbd6b..b3bbd6b 100644
--- a/metawatchwatchlets/idle_msg.png
+++ b/metawatchwatchlets/idle-msg.png
diff --git a/metawatchwatchlets/metawatch-digital-notification.qml b/metawatchwatchlets/metawatch-digital-notification.qml
index 72f7bc9..dad8cca 100644
--- a/metawatchwatchlets/metawatch-digital-notification.qml
+++ b/metawatchwatchlets/metawatch-digital-notification.qml
@@ -11,64 +11,87 @@ MWPage {
 		id: title
 	}
 
-	Item {
-		id: container
+	MWScrollable {
+		id: scrollable
 		anchors.top: title.bottom
 		anchors.bottom: parent.bottom
 		anchors.left: parent.left
 		anchors.right: parent.right
 
-		Item {
+		Column {
+			id: defaultContainer
+			visible: false
+			width: page.width
+
+			MWLabel {
+				text: curNotification ? curNotification.title : ""
+				font.pixelSize: 16
+				wrapMode: Text.WordWrap
+			}
+			MWLabel {
+				text: curNotification ? curNotification.body : ""
+				wrapMode: Text.WordWrap
+			}
+		}
+
+		Column {
 			id: emailContainer
-			visible: curNotification.type === Notification.EmailNotification
-			anchors.fill: parent
+			visible: false
+			width: page.width
 
+			Image {
+				source: "notification-email.png"
+			}
+			MWLabel {
+				text: curNotification ? curNotification.title : ""
+				font.pixelSize: 16
+				wrapMode: Text.WordWrap
+			}
 			MWLabel {
-				anchors.centerIn: parent
-				text: "Email"
+				text: curNotification ? curNotification.body : ""
+				wrapMode: Text.WordWrap
 			}
 		}
 
-		Item {
+		Column {
 			id: chatContainer
-			visible: curNotification.type === Notification.ImNotification
-			anchors.fill: parent
+			visible: false
+			width: page.width
 
 			MWLabel {
 				id: chatTitle
-				text: curNotification.title
+				font.pixelSize: 16
+				text: curNotification ? curNotification.title : ""
 			}
 
-			Image {
-				x: 20
-				y: chatBubble.y - 8
-				source: "bubble_tip.png"
-				z: 1
-			}
-
-			BorderImage {
-				id: chatBubble
-				anchors {
-					top: chatTitle.bottom; left: parent.left; right: parent.right;
-					leftMargin: 2; topMargin: 8; rightMargin: 2; bottomMargin: 2;
-				}
-				border { left: 16; top: 16; right: 16; bottom: 16; }
-				height: childrenRect.height + 16
-				source: "bubble.png"
-
+			ChatBubble {
+				width: parent.width
 				MWLabel {
-					anchors {
-						top: parent.top; left: parent.left; right: parent.right;
-						margins: 16 / 2
-					}
-					text: curNotification.body
 					width: parent.width
+					text: curNotification ? curNotification.body : ""
 					wrapMode: Text.Wrap
 				}
 			}
 		}
 	}
 
+	states: [
+		State {
+			when: curNotification && curNotification.type === Notification.EmailNotification
+			PropertyChanges { target: emailContainer; visible: true; }
+		},
+		State {
+			when: curNotification && (
+					  curNotification.type === Notification.ImNotification ||
+					  curNotification.type === Notification.SmsNotification ||
+					  curNotification.type === Notification.MmsNotification)
+			PropertyChanges { target: chatContainer; visible: true; }
+		},
+		State {
+			when: curNotification // Any other notification type
+			PropertyChanges { target: defaultContainer; visible: true; }
+		}
+	]
 
 
 	function handlesNotification(notification) {
@@ -78,4 +101,21 @@ MWPage {
 	function openNotification(notification) {
 		curNotification = notification;
 	}
+
+	Connections {
+		target: watch
+		onButtonPressed: {
+			switch (button) {
+			case 1:
+				scrollable.scrollUp();
+				break;
+			case 2:
+				scrollable.scrollDown();
+				break;
+			}
+		}
+		onActiveChanged: {
+			scrollable.scrollTop();
+		}
+	}
 }
diff --git a/metawatchwatchlets/metawatch-digital-watchface.qml b/metawatchwatchlets/metawatch-digital-watchface.qml
index a030bdb..535cbab 100644
--- a/metawatchwatchlets/metawatch-digital-watchface.qml
+++ b/metawatchwatchlets/metawatch-digital-watchface.qml
@@ -17,19 +17,42 @@ MWPage {
 		Image {
 			width: page.width
 			height: 2
-			source: "idle_border.png"
+			source: "idle-border.png"
 		}
 
-		Item {
+		Row {
 			width: page.width
 			height: 30
-			// TODO Weather stuff.
+
+			Text {
+				id: labelForecast
+				width: 36
+				anchors.verticalCenter: parent.verticalCenter
+				font.family: "MetaWatch Small caps 8pt"
+				font.pixelSize: 8
+				wrapMode: Text.Wrap
+			}
+
+			Image {
+				id: iconForecast
+				anchors.verticalCenter: parent.verticalCenter
+				width: 24
+			}
+
+			Text {
+				id: labelTemperature
+				width: 36
+				anchors.verticalCenter: parent.verticalCenter
+				font.family: "MetaWatch Large 16pt"
+				font.pixelSize: 16
+				wrapMode: Text.Wrap
+			}
 		}
 
 		Image {
 			width: page.width
 			height: 2
-			source: "idle_border.png"
+			source: "idle-border.png"
 		}
 
 		Item {
@@ -46,7 +69,7 @@ MWPage {
 				Image {
 					width: 24
 					height: 18
-					source: "idle_call.png"
+					source: "idle-call.png"
 				}
 				Text {
 					id: labelCalls
@@ -61,7 +84,7 @@ MWPage {
 				Image {
 					width: 24
 					height: 18
-					source: "idle_msg.png"
+					source: "idle-msg.png"
 				}
 				Text {
 					id: labelMsgs
@@ -76,7 +99,7 @@ MWPage {
 				Image {
 					width: 24
 					height: 18
-					source: "idle_mail.png"
+					source: "idle-mail.png"
 				}
 				Text {
 					id: labelMails
@@ -89,19 +112,42 @@ MWPage {
 		}
 	}
 
+	function _getImageForWeather(type) {
+		switch (type) {
+		case WeatherNotification.Sunny:
+			return "weather-sunny.png";
+		case WeatherNotification.PartlyCloudy:
+		case WeatherNotification.Cloudy:
+		case WeatherNotification.Fog:
+			return "weather-cloudy.png";
+		case WeatherNotification.Rain:
+			return "weather-rain.png";
+		case WeatherNotification.Thunderstorm:
+			return "weather-thunderstorm.png";
+		case WeatherNotification.Snow:
+			return "weather-snow.png";
+		}
+	}
+
 	function updateUnreadCounts() {
 		labelCalls.text = notifications.fullCountByType(Notification.MissedCallNotification);
 		labelMsgs.text = notifications.fullCountByType(Notification.SmsNotification) +
 				notifications.fullCountByType(Notification.MmsNotification) +
 				notifications.fullCountByType(Notification.ImNotification);
 		labelMails.text = notifications.fullCountByType(Notification.EmailNotification);
-		console.log("unread mails = " + labelMails.text);
 	}
 
 	function updateWeather() {
 		var weather = notifications.getMostRecentByType(Notification.WeatherNotification);
-		if (typeof weather !== "undefined") {
-			// TODO Weather stuff
+		if (weather) {
+			var unit = weather.temperatureUnits == WeatherNotification.Celsius ? "°C" : "°F";
+			labelForecast.text = weather.body
+			labelTemperature.text = weather.temperature + unit
+			iconForecast.source = _getImageForWeather(weather.forecast)
+		} else {
+			labelForecast.text = ""
+			labelTemperature.text = ""
+			iconForecast.source = ""
 		}
 	}
 
diff --git a/metawatchwatchlets/metawatchwatchlets.pro b/metawatchwatchlets/metawatchwatchlets.pro
index af6dcdb..d7ec44e 100644
--- a/metawatchwatchlets/metawatchwatchlets.pro
+++ b/metawatchwatchlets/metawatchwatchlets.pro
@@ -26,3 +26,6 @@ unix:!symbian {
 	}
 	INSTALLS += target qml_files
 }
+
+OTHER_FILES += \
+    ChatBubble.qml
diff --git a/metawatchwatchlets/notification-email.png b/metawatchwatchlets/notification-email.png
new file mode 100644
index 0000000..da7baaf
--- /dev/null
+++ b/metawatchwatchlets/notification-email.png
diff --git a/metawatchwatchlets/notification-message.png b/metawatchwatchlets/notification-message.png
new file mode 100644
index 0000000..babb117
--- /dev/null
+++ b/metawatchwatchlets/notification-message.png
diff --git a/metawatchwatchlets/notification-phone.png b/metawatchwatchlets/notification-phone.png
new file mode 100644
index 0000000..ba2aa40
--- /dev/null
+++ b/metawatchwatchlets/notification-phone.png
diff --git a/metawatchwatchlets/notification-timer.png b/metawatchwatchlets/notification-timer.png
new file mode 100644
index 0000000..56fd1de
--- /dev/null
+++ b/metawatchwatchlets/notification-timer.png
diff --git a/metawatchwatchlets/weather-cloudy.png b/metawatchwatchlets/weather-cloudy.png
new file mode 100644
index 0000000..027d79d
--- /dev/null
+++ b/metawatchwatchlets/weather-cloudy.png
diff --git a/metawatchwatchlets/weather-rain.png b/metawatchwatchlets/weather-rain.png
new file mode 100644
index 0000000..a0e6671
--- /dev/null
+++ b/metawatchwatchlets/weather-rain.png
diff --git a/metawatchwatchlets/weather-snow.png b/metawatchwatchlets/weather-snow.png
new file mode 100644
index 0000000..9c26f88
--- /dev/null
+++ b/metawatchwatchlets/weather-snow.png
diff --git a/metawatchwatchlets/weather-sunny.png b/metawatchwatchlets/weather-sunny.png
new file mode 100644
index 0000000..ede115c
--- /dev/null
+++ b/metawatchwatchlets/weather-sunny.png
diff --git a/metawatchwatchlets/weather-thunderstorm.png b/metawatchwatchlets/weather-thunderstorm.png
new file mode 100644
index 0000000..7f24ce6
--- /dev/null
+++ b/metawatchwatchlets/weather-thunderstorm.png
diff --git a/metawatchwatchlets/weather-wind.png b/metawatchwatchlets/weather-wind.png
new file mode 100644
index 0000000..f303123
--- /dev/null
+++ b/metawatchwatchlets/weather-wind.png