diff options
Diffstat (limited to 'apps/weather_status/src')
| -rw-r--r-- | apps/weather_status/src/App.vue | 552 | ||||
| -rw-r--r-- | apps/weather_status/src/services/weatherStatusService.js | 80 | ||||
| -rw-r--r-- | apps/weather_status/src/weather-status.js | 22 |
3 files changed, 314 insertions, 340 deletions
diff --git a/apps/weather_status/src/App.vue b/apps/weather_status/src/App.vue index 6fcc764ac97..34dc8e90efa 100644 --- a/apps/weather_status/src/App.vue +++ b/apps/weather_status/src/App.vue @@ -1,173 +1,263 @@ <!-- - - @copyright Copyright (c) 2020 Julien Veyssier <eneiluj@posteo.net> - - @author Julien Veyssier <eneiluj@posteo.net> - - - - @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/>. - - - --> + - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors + - SPDX-License-Identifier: AGPL-3.0-or-later +--> <template> - <li :class="{ inline }"> - <div id="weather-status-menu-item"> - <Actions - class="weather-status-menu-item__subheader" - :default-icon="weatherIcon" - :menu-title="visibleMessage"> - <ActionLink v-if="gotWeather" - icon="icon-address" - target="_blank" - :href="weatherLinkTarget" - :close-after-click="true"> - {{ locationText }} - </ActionLink> - <ActionButton v-if="gotWeather" - :icon="addRemoveFavoriteIcon" - @click="onAddRemoveFavoriteClick"> - {{ addRemoveFavoriteText }} - </ActionButton> - <ActionSeparator v-if="address && !errorMessage" /> - <ActionButton - icon="icon-crosshair" - :close-after-click="true" - @click="onBrowserLocationClick"> - {{ t('weather_status', 'Detect location') }} - </ActionButton> - <ActionInput - ref="addressInput" - :disabled="false" - icon="icon-rename" - type="text" - value="" - @submit="onAddressSubmit"> - {{ t('weather_status', 'Set custom address') }} - </ActionInput> - <ActionButton - v-show="favorites.length > 0" - :icon="toggleFavoritesIcon" - @click="showFavorites = !showFavorites"> - {{ t('weather_status', 'Favorites') }} - </ActionButton> - <ActionButton v-for="f in displayedFavorites" - :key="f" - icon="icon-starred" - @click="onFavoriteClick($event, f)"> - {{ f }} - </ActionButton> - </Actions> - </div> - </li> + <div id="weather-status-menu-item"> + <NcActions class="weather-status-menu-item__subheader" + :aria-hidden="true" + :aria-label="currentWeatherMessage" + :menu-name="currentWeatherMessage"> + <template #icon> + <NcLoadingIcon v-if="loading" /> + <img v-else + :src="weatherIconUrl" + alt="" + class="weather-image"> + </template> + <NcActionText v-if="gotWeather" + :aria-hidden="true"> + <template #icon> + <NcLoadingIcon v-if="loading" /> + <div v-else class="weather-action-image-container"> + <img :src="futureWeatherIconUrl" + alt="" + class="weather-image"> + </div> + </template> + {{ forecastMessage }} + </NcActionText> + <NcActionLink v-if="gotWeather" + target="_blank" + :aria-hidden="true" + :href="weatherLinkTarget" + :close-after-click="true"> + <template #icon> + <NcIconSvgWrapper name="MapMarker" + :svg="mapMarkerSvg" + :size="20" /> + </template> + {{ locationText }} + </NcActionLink> + <NcActionButton v-if="gotWeather" + :aria-hidden="true" + @click="onAddRemoveFavoriteClick"> + <template #icon> + <NcIconSvgWrapper name="Star" + :svg="addRemoveFavoriteSvg" + :size="20" + class="favorite-color" /> + </template> + {{ addRemoveFavoriteText }} + </NcActionButton> + <NcActionSeparator v-if="address && !errorMessage" /> + <NcActionButton :close-after-click="true" + :aria-hidden="true" + @click="onBrowserLocationClick"> + <template #icon> + <NcIconSvgWrapper name="Crosshairs" + :svg="crosshairsSvg" + :size="20" /> + </template> + {{ t('weather_status', 'Detect location') }} + </NcActionButton> + <NcActionInput ref="addressInput" + :label="t('weather_status', 'Set custom address')" + :disabled="false" + icon="icon-rename" + :aria-hidden="true" + type="text" + value="" + @submit="onAddressSubmit" /> + <template v-if="favorites.length > 0"> + <NcActionCaption :name="t('weather_status', 'Favorites')" /> + <NcActionButton v-for="favorite in favorites" + :key="favorite" + :aria-hidden="true" + @click="onFavoriteClick($event, favorite)"> + <template #icon> + <NcIconSvgWrapper name="Star" + :svg="starSvg" + :size="20" + :class="{'favorite-color': address === favorite}" /> + </template> + {{ favorite }} + </NcActionButton> + </template> + </NcActions> + </div> </template> <script> import { showError } from '@nextcloud/dialogs' import moment from '@nextcloud/moment' import { getLocale } from '@nextcloud/l10n' -import Actions from '@nextcloud/vue/dist/Components/Actions' -import ActionButton from '@nextcloud/vue/dist/Components/ActionButton' -import ActionInput from '@nextcloud/vue/dist/Components/ActionInput' -import ActionLink from '@nextcloud/vue/dist/Components/ActionLink' -import ActionSeparator from '@nextcloud/vue/dist/Components/ActionSeparator' -import * as network from './services/weatherStatusService' +import { imagePath } from '@nextcloud/router' +import NcActions from '@nextcloud/vue/components/NcActions' +import NcActionButton from '@nextcloud/vue/components/NcActionButton' +import NcActionCaption from '@nextcloud/vue/components/NcActionCaption' +import NcActionInput from '@nextcloud/vue/components/NcActionInput' +import NcActionLink from '@nextcloud/vue/components/NcActionLink' +import NcActionSeparator from '@nextcloud/vue/components/NcActionSeparator' +import NcActionText from '@nextcloud/vue/components/NcActionText' +import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon' +import NcIconSvgWrapper from '@nextcloud/vue/components/NcIconSvgWrapper' +import * as network from './services/weatherStatusService.js' +import crosshairsSvg from '@mdi/svg/svg/crosshairs.svg?raw' +import mapMarkerSvg from '@mdi/svg/svg/map-marker.svg?raw' +import starSvg from '@mdi/svg/svg/star.svg?raw' +import starOutlineSvg from '@mdi/svg/svg/star-outline.svg?raw' const MODE_BROWSER_LOCATION = 1 const MODE_MANUAL_LOCATION = 2 const weatherOptions = { clearsky_day: { - icon: 'icon-clearsky-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Clear sky at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} clear sky later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} clear sky', { temperature, unit }), }, clearsky_night: { - icon: 'icon-clearsky-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Clear sky at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} clear sky later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} clear sky', { temperature, unit }), }, cloudy: { - icon: 'icon-cloudy', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Cloudy at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} cloudy later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} cloudy', { temperature, unit }), + }, + snowandthunder: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow and thunder later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow and thunder', { temperature, unit }), + }, + snowshowersandthunder_day: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers and thunder later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers and thunder', { temperature, unit }), + }, + snowshowersandthunder_night: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers and thunder later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers and thunder', { temperature, unit }), + }, + snowshowersandthunder_polartwilight: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers, thunder and polar twilight later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers, thunder and polar twilight', { temperature, unit }), + }, + snowshowers_day: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers', { temperature, unit }), + }, + snowshowers_night: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers', { temperature, unit }), + }, + snowshowers_polartwilight: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow showers and polar twilight later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow showers and polar twilight', { temperature, unit }), + }, + snow: { + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} snow later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} snow', { temperature, unit }), }, fair_day: { - icon: 'icon-fair-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Fair day at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} fair weather later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} fair weather', { temperature, unit }), }, fair_night: { - icon: 'icon-fair-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Fair night at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} fair weather later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} fair weather', { temperature, unit }), }, partlycloudy_day: { - icon: 'icon-partlycloudy-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Partly cloudy at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} partly cloudy later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} partly cloudy', { temperature, unit }), }, partlycloudy_night: { - icon: 'icon-partlycloudy-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Partly cloudy at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} partly cloudy later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} partly cloudy', { temperature, unit }), }, fog: { - icon: 'icon-fog', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Foggy at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} foggy later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} foggy', { temperature, unit }), }, lightrain: { - icon: 'icon-lightrain', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Light rain at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} light rainfall later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} light rainfall', { temperature, unit }), }, rain: { - icon: 'icon-rain', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Rain at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} rainfall later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} rainfall', { temperature, unit }), }, heavyrain: { - icon: 'icon-heavyrain', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Heavy rain at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} heavy rainfall later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} heavy rainfall', { temperature, unit }), }, rainshowers_day: { - icon: 'icon-rainshowers-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} rainfall showers', { temperature, unit }), }, rainshowers_night: { - icon: 'icon-rainshowers-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} rainfall showers', { temperature, unit }), }, lightrainshowers_day: { - icon: 'icon-light-rainshowers-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Light rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} light rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} light rainfall showers', { temperature, unit }), }, lightrainshowers_night: { - icon: 'icon-light-rainshowers-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Light rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} light rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} light rainfall showers', { temperature, unit }), }, heavyrainshowers_day: { - icon: 'icon-heavy-rainshowers-day', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Heavy rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} heavy rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} heavy rainfall showers', { temperature, unit }), }, heavyrainshowers_night: { - icon: 'icon-heavy-rainshowers-night', - text: (temperature, unit, time) => t('weather_status', '{temperature} {unit} Heavy rain showers at {time}', { temperature, unit, time }), + text: (temperature, unit, later = false) => later + ? t('weather_status', '{temperature} {unit} heavy rainfall showers later today', { temperature, unit }) + : t('weather_status', '{temperature} {unit} heavy rainfall showers', { temperature, unit }), }, } export default { name: 'App', components: { - Actions, ActionButton, ActionInput, ActionLink, ActionSeparator, - }, - props: { - inline: { - type: Boolean, - default: false, - }, + NcActions, + NcActionButton, + NcActionCaption, + NcActionInput, + NcActionLink, + NcActionSeparator, + NcActionText, + NcLoadingIcon, + NcIconSvgWrapper, }, data() { return { + crosshairsSvg, + mapMarkerSvg, + starSvg, + starOutlineSvg, locale: getLocale(), loading: true, errorMessage: '', @@ -175,10 +265,11 @@ export default { address: null, lat: null, lon: null, + // how many hours ahead do we want to see the forecast? + offset: 5, forecasts: [], loop: null, favorites: [], - showFavorites: false, } }, computed: { @@ -191,46 +282,47 @@ export default { locationText() { return t('weather_status', 'More weather for {adr}', { adr: this.address }) }, - sixHoursTempForecast() { - return this.forecasts.length > 5 ? this.forecasts[5].data.instant.details.air_temperature : '' + temperature() { + return this.getTemperature(this.forecasts, 0) }, - sixHoursWeatherForecast() { - return this.forecasts.length > 5 ? this.forecasts[5].data.next_1_hours.summary.symbol_code : '' + futureTemperature() { + return this.getTemperature(this.forecasts, this.offset) }, - sixHoursFormattedTime() { - if (this.forecasts.length > 5) { - const date = moment(this.forecasts[5].time) - return date.format('LT') - } - return '' + weatherCode() { + return this.getWeatherCode(this.forecasts, 0) }, - weatherIcon() { - if (this.loading) { - return 'icon-loading-small' - } else { - return this.sixHoursWeatherForecast && this.sixHoursWeatherForecast in weatherOptions - ? weatherOptions[this.sixHoursWeatherForecast].icon - : 'icon-fair-day' - } + futureWeatherCode() { + return this.getWeatherCode(this.forecasts, this.offset) + }, + weatherIconUrl() { + return this.getWeatherIconUrl(this.weatherCode) + }, + futureWeatherIconUrl() { + return this.getWeatherIconUrl(this.futureWeatherCode) }, /** * The message displayed in the top right corner * - * @returns {String} + * @return {string} */ - visibleMessage() { + currentWeatherMessage() { if (this.loading) { return t('weather_status', 'Loading weather') } else if (this.errorMessage) { return this.errorMessage + } else if (this.gotWeather) { + return this.getWeatherMessage(this.weatherCode, this.temperature) } else { - return this.sixHoursWeatherForecast && this.sixHoursWeatherForecast in weatherOptions - ? weatherOptions[this.sixHoursWeatherForecast].text( - this.getLocalizedTemperature(this.sixHoursTempForecast), - this.temperatureUnit, - this.sixHoursFormattedTime, - ) - : t('weather_status', 'Set location for weather') + return t('weather_status', 'Set location for weather') + } + }, + forecastMessage() { + if (this.loading) { + return t('weather_status', 'Loading weather') + } else if (this.gotWeather) { + return this.getWeatherMessage(this.futureWeatherCode, this.futureTemperature, true) + } else { + return t('weather_status', 'Set location for weather') } }, weatherLinkTarget() { @@ -239,10 +331,10 @@ export default { gotWeather() { return this.address && !this.errorMessage }, - addRemoveFavoriteIcon() { + addRemoveFavoriteSvg() { return this.currentAddressIsFavorite - ? 'icon-starred' - : 'icon-star' + ? starSvg + : starOutlineSvg }, addRemoveFavoriteText() { return this.currentAddressIsFavorite @@ -254,16 +346,6 @@ export default { return f === this.address }) }, - toggleFavoritesIcon() { - return this.showFavorites - ? 'icon-triangle-s' - : 'icon-triangle-e' - }, - displayedFavorites() { - return this.showFavorites - ? this.favorites - : [] - }, }, mounted() { this.initWeatherStatus() @@ -424,7 +506,7 @@ export default { }, getLocalizedTemperature(celcius) { return this.useFahrenheitLocale - ? ((celcius * (9 / 5)) + 32).toFixed(1) + ? (celcius * (9 / 5)) + 32 : celcius }, onAddRemoveFavoriteClick() { @@ -452,135 +534,49 @@ export default { this.setAddress(favAddress) } }, + formatTime(time) { + return moment(time).format('LT') + }, + getTemperature(forecasts, offset = 0) { + return forecasts.length > offset ? forecasts[offset].data.instant.details.air_temperature : '' + }, + getWeatherCode(forecasts, offset = 0) { + return forecasts.length > offset ? forecasts[offset].data.next_1_hours.summary.symbol_code : '' + }, + getWeatherIconUrl(weatherCode) { + // those icons were obtained there: https://github.com/metno/weathericons/tree/main/weather/svg + return (weatherCode && weatherCode in weatherOptions) + ? imagePath('weather_status', 'met.no.icons/' + weatherCode + '.svg') + : imagePath('weather_status', 'met.no.icons/fair_day.svg') + }, + getWeatherMessage(weatherCode, temperature, later = false) { + return weatherCode && weatherCode in weatherOptions + ? weatherOptions[weatherCode].text( + Math.round(this.getLocalizedTemperature(temperature)), + this.temperatureUnit, + later, + ) + : t('weather_status', 'Unknown weather code') + }, }, } </script> <style lang="scss"> -.icon-weather-status { - background-image: url('./../img/app-dark.svg'); -} -body.theme--dark .icon-weather-status { - background-image: url('./../img/app.svg'); +.weather-action-image-container { + width: var(--default-clickable-area); + height: var(--default-clickable-area); + display: flex; + align-items: center; + justify-content: center; } -.icon-clearsky-day { - background-image: url('./../img/sun.svg'); -} -.icon-clearsky-night { - background-image: url('./../img/moon.svg'); -} -.icon-cloudy { - background-image: url('./../img/cloud-cloud.svg'); -} -.icon-fair-day { - background-image: url('./../img/sun-small-cloud.svg'); -} -.icon-fair-night { - background-image: url('./../img/moon-small-cloud.svg'); -} -.icon-partlycloudy-day { - background-image: url('./../img/sun-cloud.svg'); -} -.icon-partlycloudy-night { - background-image: url('./../img/moon-cloud.svg'); -} -.icon-fog { - background-image: url('./../img/fog.svg'); -} -.icon-lightrain { - background-image: url('./../img/light-rain.svg'); -} -.icon-rain { - background-image: url('./../img/rain.svg'); -} -.icon-heavyrain { - background-image: url('./../img/heavy-rain.svg'); -} -.icon-light-rainshowers-day { - background-image: url('./../img/sun-cloud-light-rain.svg'); -} -.icon-light-rainshowers-night { - background-image: url('./../img/moon-cloud-light-rain.svg'); -} -.icon-rainshowers-day { - background-image: url('./../img/sun-cloud-rain.svg'); -} -.icon-rainshowers-night { - background-image: url('./../img/moon-cloud-rain.svg'); -} -.icon-heavy-rainshowers-day { - background-image: url('./../img/sun-cloud-heavy-rain.svg'); -} -.icon-heavy-rainshowers-night { - background-image: url('./../img/moon-cloud-heavy-rain.svg'); -} -.icon-crosshair { - background-color: var(--color-main-text); - padding: 0 !important; - mask: url(./../img/cross.svg) no-repeat; - mask-size: 18px 18px; - mask-position: center; - -webkit-mask: url(./../img/cross.svg) no-repeat; - -webkit-mask-size: 18px 18px; - -webkit-mask-position: center; - min-width: 44px !important; - min-height: 44px !important; -} - -li:not(.inline) .weather-status-menu-item { - &__header { - display: block; - align-items: center; - color: var(--color-main-text); - padding: 10px 12px 5px 12px; - box-sizing: border-box; - opacity: 1; - white-space: nowrap; - width: 100%; - text-align: center; - max-width: 250px; - text-overflow: ellipsis; - min-width: 175px; - } - - &__subheader { - width: 100%; - - .trigger > .icon { - background-color: var(--color-main-background); - background-size: 16px; - border: 0; - border-radius: 0; - font-weight: normal; - padding-left: 40px; - - &:hover, - &:focus { - box-shadow: inset 4px 0 var(--color-primary-element); - } - } - } -} - -.inline .weather-status-menu-item__subheader { - width: 100%; - .trigger > .icon { - background-size: 16px; - border: 0; - border-radius: var(--border-radius-pill); - font-weight: normal; - padding-left: 40px; - - &.icon-loading-small { - &::after { - left: 21px; - } - } - } +.weather-image { + width: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline)); } -li { - list-style-type: none; +// Set color to primary element for current / active favorite address +.favorite-color { + color: var(--color-favorite); } </style> diff --git a/apps/weather_status/src/services/weatherStatusService.js b/apps/weather_status/src/services/weatherStatusService.js index 32a81bd6108..3725f536d32 100644 --- a/apps/weather_status/src/services/weatherStatusService.js +++ b/apps/weather_status/src/services/weatherStatusService.js @@ -1,36 +1,20 @@ /** - * @copyright Copyright (c) 2020, Julien Veyssier - * - * @author Julien Veyssier <eneiluj@posteo.net> - * - * @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/>. - * + * SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later */ + import HttpClient from '@nextcloud/axios' import { generateOcsUrl } from '@nextcloud/router' /** * * - * @param {String} lat the latitude - * @param {String} lon the longitude - * @returns {Promise<Object>} + * @param {string} lat the latitude + * @param {string} lon the longitude + * @return {Promise<object>} */ -const setLocation = async(lat, lon) => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'location' +const setLocation = async (lat, lon) => { + const url = generateOcsUrl('apps/weather_status/api/v1/location') const response = await HttpClient.put(url, { address: '', lat, @@ -42,11 +26,11 @@ const setLocation = async(lat, lon) => { /** * - * @param {String} address The location - * @returns {Promise<Object>} + * @param {string} address The location + * @return {Promise<object>} */ -const setAddress = async(address) => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'location' +const setAddress = async (address) => { + const url = generateOcsUrl('apps/weather_status/api/v1/location') const response = await HttpClient.put(url, { address, lat: null, @@ -58,11 +42,11 @@ const setAddress = async(address) => { /** * - * @param {String} mode can be 1 browser or 2 custom - * @returns {Promise<Object>} + * @param {string} mode can be 1 browser or 2 custom + * @return {Promise<object>} */ -const setMode = async(mode) => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'mode' +const setMode = async (mode) => { + const url = generateOcsUrl('apps/weather_status/api/v1/mode') const response = await HttpClient.put(url, { mode, }) @@ -72,10 +56,10 @@ const setMode = async(mode) => { /** * - * @returns {Promise<Object>} + * @return {Promise<object>} */ -const usePersonalAddress = async() => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'use-personal' +const usePersonalAddress = async () => { + const url = generateOcsUrl('apps/weather_status/api/v1/use-personal') const response = await HttpClient.put(url) return response.data.ocs.data @@ -84,10 +68,10 @@ const usePersonalAddress = async() => { /** * Fetches the location information for current user * - * @returns {Promise<Object>} + * @return {Promise<object>} */ -const getLocation = async() => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'location' +const getLocation = async () => { + const url = generateOcsUrl('apps/weather_status/api/v1/location') const response = await HttpClient.get(url) return response.data.ocs.data @@ -96,11 +80,10 @@ const getLocation = async() => { /** * Fetches the weather forecast * - * @param {String} address The location - * @returns {Promise<Object>} + * @return {Promise<object>} */ -const fetchForecast = async() => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'forecast' +const fetchForecast = async () => { + const url = generateOcsUrl('apps/weather_status/api/v1/forecast') const response = await HttpClient.get(url) return response.data.ocs.data @@ -109,11 +92,10 @@ const fetchForecast = async() => { /** * Fetches the location favorites * - * @param {String} address The location - * @returns {Promise<Object>} + * @return {Promise<object>} */ -const getFavorites = async() => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'favorites' +const getFavorites = async () => { + const url = generateOcsUrl('apps/weather_status/api/v1/favorites') const response = await HttpClient.get(url) return response.data.ocs.data @@ -122,10 +104,10 @@ const getFavorites = async() => { /** * * @param {Array} favorites List of favorite addresses - * @returns {Promise<Object>} + * @return {Promise<object>} */ -const saveFavorites = async(favorites) => { - const url = generateOcsUrl('apps/weather_status/api/v1', 2) + 'favorites' +const saveFavorites = async (favorites) => { + const url = generateOcsUrl('apps/weather_status/api/v1/favorites') const response = await HttpClient.put(url, { favorites, }) diff --git a/apps/weather_status/src/weather-status.js b/apps/weather_status/src/weather-status.js index 0e7c5690b90..45c73b87e4a 100644 --- a/apps/weather_status/src/weather-status.js +++ b/apps/weather_status/src/weather-status.js @@ -1,14 +1,14 @@ +/** + * SPDX-FileCopyrightText: 2016 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +import { getCSPNonce } from '@nextcloud/auth' import Vue from 'vue' -import { getRequestToken } from '@nextcloud/auth' -import { generateUrl } from '@nextcloud/router' -import App from './App' +import App from './App.vue' // eslint-disable-next-line camelcase -__webpack_nonce__ = btoa(getRequestToken()) - -// Correct the root of the app for chunk loading -// eslint-disable-next-line -__webpack_public_path__ = generateUrl('/apps/weather_status/js/') +__webpack_nonce__ = getCSPNonce() Vue.prototype.t = t @@ -19,10 +19,6 @@ document.addEventListener('DOMContentLoaded', function() { OCA.Dashboard.registerStatus('weather', (el) => { const Dashboard = Vue.extend(App) - return new Dashboard({ - propsData: { - inline: true, - }, - }).$mount(el) + return new Dashboard().$mount(el) }) }) |