Add dashboard widget (#76)

Add weather dashboard widget
2019-11-22 13:37:19 +01:00 · 2019-11-22 13:37:19 +01:00 · 80a75d9809
parent 7482037e89
commit 80a75d9809
6 changed files with 379 additions and 0 deletions
--- a/appinfo/info.xml
+++ b/appinfo/info.xml
@ -20,4 +20,7 @@
    <settings>
        <admin>OCA\Weather\Settings\AdminSettings</admin>
    </settings>
+    <dashboard>
+        <widget>OCA\Weather\Widgets\DefaultWidget</widget>
+    </dashboard>
 </info>
--- a/css/widget.css
+++ b/css/widget.css
@ -0,0 +1,47 @@
+.icon-weather {
+	background-image: url('../img/app-dark.svg');
+}
+.icon-weather-light {
+	background-image: url('../img/app.svg');
+}
+
+.weatherWidgetContents {
+	margin: 0 44px;
+}
+
+.weatherWidgetContents h3.locationValue {
+	text-align: left;
+}
+
+.weatherWidgetContents .weatherWidgetList {
+	display: flex;
+	padding: 0;
+	flex-wrap: wrap;
+}
+
+.weatherWidgetContents .weatherWidgetList .measurement,
+.weatherWidgetContents .weatherWidgetList .value {
+	flex: 1 1 50%;
+	text-align: left;
+	min-width: 80px;
+}
+
+.weatherWidgetContents .weatherWidgetList .measurement {
+	font-weight: bold;
+}
+
+.weatherWidgetContents .weaterWidgetList .measurement::after {
+	content:":";
+}
+
+.weatherWidgetContents .info {
+	position: absolute;
+	bottom: 11px;
+	left: 0;
+	margin: 22px;
+}
+
+.weatherWidgetContents .info.error {
+	color: red;
+	color: var(--color-error);
+}
--- a/img/app-dark.svg
+++ b/img/app-dark.svg
@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   id="Layer_1"
+   x="0px"
+   y="0px"
+   width="32px"
+   height="32px"
+   viewBox="0 0 32 32"
+   enable-background="new 0 0 32 32"
+   xml:space="preserve"><metadata
+     id="metadata8"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata>
+     <g
+     id="layer1"
+     style="display:inline"><g
+       id="g4349"
+       style="fill:#000000;fill-opacity:1"
+       transform="matrix(1.1903068,0,0,1.1903068,-2.816759,-2.3667145)"><circle
+         r="7.4333339"
+         cy="15.566668"
+         cx="15.733334"
+         id="path4195"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197"
+         d="m 13.4,6.7 4.866667,0 -2.473718,-4.4227241 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3"
+         d="m 20.733778,23.806787 -4.806182,0.764873 3.138076,3.978976 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-6"
+         d="m 23.890718,19.760651 -2.891058,3.914869 5.027273,0.637412 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-6-7"
+         d="m 25.112667,14.565563 -0.909031,4.781012 4.806945,-1.604072 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-6-7-5"
+         d="m 23.027612,9.5835333 1.932472,4.4665387 3.076826,-4.026525 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-6-7-5-3"
+         d="m 18.639696,6.774351 4.114051,2.5998079 0.271487,-5.0602428 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-5"
+         d="m 15.483345,24.558675 -4.721035,-1.181629 1.325855,4.891 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-5-6"
+         d="M 10.485285,23.163173 7.2630918,19.515996 5.5864487,24.298113 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-5-6-2"
+         d="M 6.9873601,19.276312 6.7732509,14.414359 2.4636401,17.08026 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-5-6-2-9"
+         d="M 6.8803634,13.939504 8.6508057,9.4062961 3.6312081,10.101577 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /><path
+         id="path4197-3-5-6-2-9-1"
+         d="M 8.9216018,9.2344138 13.100504,6.7401755 8.7096644,4.2102933 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /></g></g></svg>
--- a/js/widget.js
+++ b/js/widget.js
@ -0,0 +1,78 @@
+/**
+ *
+ * @copyright Copyright (c) 2019, Balint Erdosi (erdosib@gmail.com)
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+/** global: OCA */
+/** global: net */
+
+(function () {
+
+	/**
+	 * @constructs Weather
+	 */
+	var Weather = function() {
+	}
+
+	Weather.prototype.divWeather = null;
+	Weather.prototype.init = function() {
+		this.getWeather();
+
+	}
+
+	Weather.prototype.getWeather = function() {
+		var request = {
+			widget: "weather",
+			request: "getWeather"
+		};
+
+		net.requestWidget(request, this.updateWeather);
+	}
+
+	Weather.prototype.updateWeather = function(result) {
+		var divWeather = document.querySelector("#widget-weather");
+		var divInfo = divWeather.querySelector(".info");
+		var temperatureRepresentationLookup = {
+			"kelvin":  "°K",
+			"imperial":"°F",
+			"metric":  "°C"
+		}
+		if (result.value.error) {
+			divInfo.classList.add("error");
+			divInfo.innerHTML = "Failed to update: " + result.value.error;
+			return;
+		}
+		try {
+			divInfo.classList.remove("error");
+			divInfo.innerHTML = "";
+			divWeather.querySelector(".locationValue").innerHTML = result.value.location;
+			divWeather.querySelector(".temperatureValue").innerHTML = result.value.temperature;
+			divWeather.querySelector(".temperatureRepresentation").innerHTML = temperatureRepresentationLookup[result.value.metric]|| "ERROR";
+			divWeather.querySelector(".weatherValue").innerHTML = result.value.weather;
+			divWeather.querySelector(".humidityValue").innerHTML = result.value.humidity;
+			divWeather.querySelector(".windValue").innerHTML = result.value.wind;
+		} catch (e) {
+			divInfo.classList.add("error");
+			divInfo.innerHTML = "Failed to update some data.";
+		}
+	}
+
+	OCA.DashBoard.Weather = Weather;
+	OCA.DashBoard.weather = new Weather();
+})()
--- a/lib/Widgets/DefaultWidget.php
+++ b/lib/Widgets/DefaultWidget.php
@ -0,0 +1,167 @@
+<?php
+/**
+ *
+ * @copyright Copyright (c) 2019, Balint Erdosi (erdosib@gmail.com)
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+namespace OCA\Weather\Widgets;
+
+use \OCP\AppFramework\App;
+use \OCP\AppFramework\Http;
+
+use \OCP\IContainer;
+
+use OCP\Dashboard\Model\WidgetSetup;
+use OCP\Dashboard\Model\WidgetTemplate;
+use OCP\Dashboard\IDashboardWidget;
+use OCP\Dashboard\Model\IWidgetRequest;
+use OCP\Dashboard\Model\IWidgetConfig;
+
+use \OCA\Weather\AppInfo\Application;
+use \OCA\Weather\Controller\WeatherController;
+
+use \OCP\IL10N;
+use \OCP\ILogger;
+
+class DefaultWidget implements IDashboardWidget {
+	
+	const WIDGET_ID = 'weather';
+
+
+	/** @var IL19N */
+	private $l10n;
+	private $logger;
+
+
+	/**
+	 * DefaultWidget constructor
+	 * @param IL10N $l10n
+	 */
+	public function __construct(ILogger $logger, IL10N $l10n) {
+		$this->l10n = $l10n;
+		$this->logger = $logger;
+	}
+	
+	/**
+	 * @return string
+	 */
+	public function getId(): string {
+		return self::WIDGET_ID;
+	}
+	
+	/**
+	 * @return string
+	 */
+	public function getName(): string {
+		return $this->l10n->t('Weather');
+	}
+
+	/**
+	 * @return string
+	 */
+	public function getDescription(): string {
+		return $this->l10n->t('Watch the weather directly on your Nextcloud.');
+	}
+
+	/**
+	 * @return WidgetTemplate
+	 */
+	public function getWidgetTemplate(): WidgetTemplate {
+		$template = new WidgetTemplate();
+		$template->addCss('widget')
+				 ->addJs('widget')
+				 ->setIcon('icon-weather')
+				 ->setContent('widget')
+				 ->setInitFunction('OCA.DashBoard.weather.getWeather');
+		return $template;
+	}
+
+	/**
+	 * @return WidgetTemplate
+	 */
+	public function getWidgetSetup(): WidgetSetup {
+		$setup = new WidgetSetup();
+		$setup->addSize(WidgetSetup::SIZE_TYPE_MIN, 2, 1);
+		$setup->addSize(WidgetSetup::SIZE_TYPE_MAX, 4, 5);
+		$setup->addSize(WidgetSetup::SIZE_TYPE_DEFAULT, 2, 3);
+		$setup->addDelayedJob('OCA.DashBoard.weather.getWeather', 600);
+		return $setup;
+	}
+
+	/**
+	 * @param IWidgetConfig $settings
+	 */
+	public function loadWidget(IWidgetConfig $settings) {
+
+	}
+
+	/**
+	 * @param IWidgetRequest $request
+	 */
+	public function requestWidget(IWidgetRequest $request) {
+		if ($request->getRequest() === 'getWeather') {
+			$app = new Application();
+			$container = $app->getContainer();
+			$weatherController = $container->query('OCA\Weather\Controller\WeatherController');
+			$cityController = $container->query('OCA\Weather\Controller\CityController');
+			$settingsController = $container->query('OCA\Weather\Controller\SettingsController');
+
+			$allCities = json_decode($cityController->getAll()->render(), true);
+
+			if (count($allCities) == 0) {
+				$request->addResult('error',  $this->l10n->t('Please make sure you select cities in the Weather app.'));
+				return;
+			}
+
+			$homeCityId = $allCities['home'];
+			$homeCityArray = array_filter(
+				$allCities['cities'],
+				function($city) use ($homeCityId) { 
+					return $city['id'] === $homeCityId; 
+				}
+			);
+
+			if (count($homeCityArray) != 1) {
+				$request->addResult('error',  $this->l10n->t('Please make sure you select a home city in the Weather app.'));
+				return;
+			}
+
+			$homeCity = array_pop($homeCityArray)['name'];
+
+			$resultJSONResponse = $weatherController->get($homeCity);
+			if ($resultJSONResponse->getStatus() != Http::STATUS_OK) {
+				$request->addResult('error',  $this->l10n->t('Failed to get city weather informations. Please contact your administrator'));
+				return;
+			}
+
+			$result = json_decode($resultJSONResponse->render(), true);
+			$metric = json_decode($settingsController->metricGet()->render(), true)['metric'];
+
+			$request->addResult('location', $homeCity);
+			$request->addResult('temperature', $result['main']['temp']);
+			$request->addResult('metric', $metric);
+			$request->addResult('weather', $result['weather'][0]['description']);
+			$request->addResult('humidity', $result['main']['humidity']);
+			$request->addResult('wind', $result['wind']['speed']);
+		}
+	}
+
+
+}
+?>
--- a/templates/widget.php
+++ b/templates/widget.php
@ -0,0 +1,21 @@
+<?php
+
+?>
+
+<div id="widget-weather" class="weatherWidgetContents">
+	<h3 class="locationValue"></h3>
+	<div class="info"><?php p($l->t('Updating widget…')); ?></div>
+	<dl class="weatherWidgetList">
+		<dt class="measurement"><?php p($l->t('Temperature')); ?></dt>
+		<dd class="value"><span class="temperatureValue"></span>&nbsp;<span class="temperatureRepresentation"></span></dd>
+
+		<dt class="measurement"><?php p($l->t('Cloudiness')); ?></dt>
+		<dd class="value"><span class="weatherValue"></span></dd>
+		
+		<dt class="measurement"><?php p($l->t('Humidity')); ?></dt>
+		<dd class="value"><span class="humidityValue"></span>&nbsp;%</dd>
+		
+		<dt class="measurement"><?php p($l->t('Wind')); ?></dt>
+		<dd class="value"><span class="windValue"></span>&nbsp;m/s</dd>
+	</dl>
+</div>