From cc3e52c69df762f743d4e5ea5387e0960c649928 Mon Sep 17 00:00:00 2001 From: Fabio Manganiello Date: Thu, 26 Nov 2020 00:26:10 +0100 Subject: [PATCH] Migrated ImageCarousel widget --- .../backend/http/app/routes/resources.py | 4 +- .../widgets/Calendar/Index.vue | 0 .../widgets/DateTime/Index.vue | 2 +- .../widgets/DateTimeWeather/Index.vue | 18 +- .../widgets/ImageCarousel/Index.vue | 292 ++++++++++++++++++ .../{ => components}/widgets/Music/Index.vue | 0 .../src/{ => components}/widgets/Row.vue | 7 +- .../widgets/Weather/Index.vue | 35 ++- .../src/{ => components}/widgets/Widget.vue | 24 +- .../http/webapp/src/views/Dashboard.vue | 7 +- 10 files changed, 353 insertions(+), 36 deletions(-) rename platypush/backend/http/webapp/src/{ => components}/widgets/Calendar/Index.vue (100%) rename platypush/backend/http/webapp/src/{ => components}/widgets/DateTime/Index.vue (98%) rename platypush/backend/http/webapp/src/{ => components}/widgets/DateTimeWeather/Index.vue (90%) create mode 100644 platypush/backend/http/webapp/src/components/widgets/ImageCarousel/Index.vue rename platypush/backend/http/webapp/src/{ => components}/widgets/Music/Index.vue (100%) rename platypush/backend/http/webapp/src/{ => components}/widgets/Row.vue (83%) rename platypush/backend/http/webapp/src/{ => components}/widgets/Weather/Index.vue (75%) rename platypush/backend/http/webapp/src/{ => components}/widgets/Widget.vue (62%) diff --git a/platypush/backend/http/app/routes/resources.py b/platypush/backend/http/app/routes/resources.py index 83d3b65425..e5803ca85e 100644 --- a/platypush/backend/http/app/routes/resources.py +++ b/platypush/backend/http/app/routes/resources.py @@ -4,7 +4,7 @@ import re from flask import Blueprint, abort, send_from_directory from platypush.config import Config -from platypush.backend.http.app import template_folder, static_folder +from platypush.backend.http.app import template_folder img_folder = os.path.join(template_folder, 'img') @@ -24,7 +24,6 @@ __routes__ = [ def resources_path(path): """ Custom static resources """ path_tokens = path.split('/') - filename = path_tokens.pop(-1) http_conf = Config.get('backend.http') resource_dirs = http_conf.get('resource_dirs', {}) @@ -61,6 +60,7 @@ def serve_favicon(): """ favicon.ico icon """ return send_from_directory(template_folder, 'favicon.ico') + @img.route('/img/', methods=['GET']) def imgpath(path): """ Default static images """ diff --git a/platypush/backend/http/webapp/src/widgets/Calendar/Index.vue b/platypush/backend/http/webapp/src/components/widgets/Calendar/Index.vue similarity index 100% rename from platypush/backend/http/webapp/src/widgets/Calendar/Index.vue rename to platypush/backend/http/webapp/src/components/widgets/Calendar/Index.vue diff --git a/platypush/backend/http/webapp/src/widgets/DateTime/Index.vue b/platypush/backend/http/webapp/src/components/widgets/DateTime/Index.vue similarity index 98% rename from platypush/backend/http/webapp/src/widgets/DateTime/Index.vue rename to platypush/backend/http/webapp/src/components/widgets/DateTime/Index.vue index 6be4d955a1..335aaa6668 100644 --- a/platypush/backend/http/webapp/src/widgets/DateTime/Index.vue +++ b/platypush/backend/http/webapp/src/components/widgets/DateTime/Index.vue @@ -68,7 +68,7 @@ export default { + + diff --git a/platypush/backend/http/webapp/src/widgets/Music/Index.vue b/platypush/backend/http/webapp/src/components/widgets/Music/Index.vue similarity index 100% rename from platypush/backend/http/webapp/src/widgets/Music/Index.vue rename to platypush/backend/http/webapp/src/components/widgets/Music/Index.vue diff --git a/platypush/backend/http/webapp/src/widgets/Row.vue b/platypush/backend/http/webapp/src/components/widgets/Row.vue similarity index 83% rename from platypush/backend/http/webapp/src/widgets/Row.vue rename to platypush/backend/http/webapp/src/components/widgets/Row.vue index b16eadc5f5..e67c14c215 100644 --- a/platypush/backend/http/webapp/src/widgets/Row.vue +++ b/platypush/backend/http/webapp/src/components/widgets/Row.vue @@ -31,8 +31,13 @@ export default { } - diff --git a/platypush/backend/http/webapp/src/widgets/Weather/Index.vue b/platypush/backend/http/webapp/src/components/widgets/Weather/Index.vue similarity index 75% rename from platypush/backend/http/webapp/src/widgets/Weather/Index.vue rename to platypush/backend/http/webapp/src/components/widgets/Weather/Index.vue index 8a9ceef21d..0a52f22b60 100644 --- a/platypush/backend/http/webapp/src/widgets/Weather/Index.vue +++ b/platypush/backend/http/webapp/src/components/widgets/Weather/Index.vue @@ -3,8 +3,9 @@

- - + + {{ Math.round(parseFloat(weather.temperature)) + '°' }}

@@ -28,7 +29,7 @@ export default { // Otherwise, it will be a static image. animate: { required: false, - default: false, + default: true, }, // Size of the weather icon in pixels. @@ -38,12 +39,30 @@ export default { default: 50, }, + // Icon color. + iconColor: { + type: String, + required: false, + }, + + // If false then the weather icon won't be displayed. + showIcon: { + required: false, + default: true, + }, + // If false then the weather summary won't be displayed. showSummary: { required: false, default: true, }, + // If false then the temperature won't be displayed. + showTemperature: { + required: false, + default: true, + }, + // Refresh interval in seconds. refreshSeconds: { type: Number, @@ -64,6 +83,14 @@ export default { _showSummary() { return this.parseBoolean(this.showSummary) }, + + _showIcon() { + return this.parseBoolean(this.showIcon) + }, + + _showTemperature() { + return this.parseBoolean(this.showTemperature) + }, }, methods: { @@ -102,8 +129,8 @@ export default { h1 { display: flex; - align-items: center; justify-content: center; + align-items: center; } .temperature { diff --git a/platypush/backend/http/webapp/src/widgets/Widget.vue b/platypush/backend/http/webapp/src/components/widgets/Widget.vue similarity index 62% rename from platypush/backend/http/webapp/src/widgets/Widget.vue rename to platypush/backend/http/webapp/src/components/widgets/Widget.vue index b325dfac94..8404df4e40 100644 --- a/platypush/backend/http/webapp/src/widgets/Widget.vue +++ b/platypush/backend/http/webapp/src/components/widgets/Widget.vue @@ -25,13 +25,7 @@ export default { computed: { classes() { - let classes = ['widget', 'column'] - if (this.class && this.class.length) - classes = classes.concat(this.class.split(' ')) - else - classes = classes.concat('col-3') - - return classes + return (this.class && this.class.length ? this.class.split(' ') : ['col-3']).concat(['widget', 'column']) }, }, } @@ -39,9 +33,9 @@ export default { \ No newline at end of file + diff --git a/platypush/backend/http/webapp/src/views/Dashboard.vue b/platypush/backend/http/webapp/src/views/Dashboard.vue index 61f24bffc3..b8a5f32f95 100644 --- a/platypush/backend/http/webapp/src/views/Dashboard.vue +++ b/platypush/backend/http/webapp/src/views/Dashboard.vue @@ -16,8 +16,8 @@ import { defineAsyncComponent } from 'vue' import Utils from '@/Utils' import Loading from "@/components/Loading"; -import Row from "@/widgets/Row"; -import Widget from "@/widgets/Widget"; +import Row from "@/components/widgets/Row"; +import Widget from "@/components/widgets/Widget"; export default { name: 'Dashboard', @@ -60,7 +60,7 @@ export default { class: row.attributes.class ? row.attributes.class.nodeValue : undefined, widgets: [...row.children].map((el) => { const component = defineAsyncComponent( - () => import(`@/widgets/${el.nodeName}/Index`) + () => import(`@/components/widgets/${el.nodeName}/Index`) ) const style = el.attributes.style ? el.attributes.style.nodeValue : undefined @@ -120,6 +120,7 @@ export default { width: 100%; height: 100%; display: flex; + flex-direction: column; margin: 0; padding: 1em 1em 0 1em; background: $dashboard-bg;