Allow to set a custom background
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
parent
1e043d5a24
commit
4ec0afd0e7
|
|
@ -28,5 +28,7 @@ return [
|
|||
'routes' => [
|
||||
['name' => 'dashboard#index', 'url' => '/', 'verb' => 'GET'],
|
||||
['name' => 'dashboard#updateLayout', 'url' => '/layout', 'verb' => 'POST'],
|
||||
['name' => 'dashboard#getBackground', 'url' => '/background', 'verb' => 'GET'],
|
||||
['name' => 'dashboard#setBackground', 'url' => '/background', 'verb' => 'POST'],
|
||||
]
|
||||
];
|
||||
|
|
|
|||
|
|
@ -26,9 +26,12 @@ declare(strict_types=1);
|
|||
|
||||
namespace OCA\Dashboard\Controller;
|
||||
|
||||
use OCA\Dashboard\Service\BackgroundService;
|
||||
use OCA\Files\Event\LoadSidebar;
|
||||
use OCA\Viewer\Event\LoadViewer;
|
||||
use OCP\AppFramework\Controller;
|
||||
use OCP\AppFramework\Http;
|
||||
use OCP\AppFramework\Http\FileDisplayResponse;
|
||||
use OCP\AppFramework\Http\JSONResponse;
|
||||
use OCP\AppFramework\Http\TemplateResponse;
|
||||
use OCP\Dashboard\IManager;
|
||||
|
|
@ -51,6 +54,10 @@ class DashboardController extends Controller {
|
|||
private $config;
|
||||
/** @var string */
|
||||
private $userId;
|
||||
/**
|
||||
* @var BackgroundService
|
||||
*/
|
||||
private $backgroundService;
|
||||
|
||||
public function __construct(
|
||||
string $appName,
|
||||
|
|
@ -59,6 +66,7 @@ class DashboardController extends Controller {
|
|||
IEventDispatcher $eventDispatcher,
|
||||
IManager $dashboardManager,
|
||||
IConfig $config,
|
||||
BackgroundService $backgroundService,
|
||||
$userId
|
||||
) {
|
||||
parent::__construct($appName, $request);
|
||||
|
|
@ -67,6 +75,7 @@ class DashboardController extends Controller {
|
|||
$this->eventDispatcher = $eventDispatcher;
|
||||
$this->dashboardManager = $dashboardManager;
|
||||
$this->config = $config;
|
||||
$this->backgroundService = $backgroundService;
|
||||
$this->userId = $userId;
|
||||
}
|
||||
|
||||
|
|
@ -95,6 +104,7 @@ class DashboardController extends Controller {
|
|||
$this->inititalStateService->provideInitialState('dashboard', 'panels', $widgets);
|
||||
$this->inititalStateService->provideInitialState('dashboard', 'layout', $userLayout);
|
||||
$this->inititalStateService->provideInitialState('dashboard', 'firstRun', $this->config->getUserValue($this->userId, 'dashboard', 'firstRun', '1') === '1');
|
||||
$this->inititalStateService->provideInitialState('dashboard', 'shippedBackgrounds', BackgroundService::SHIPPED_BACKGROUNDS);
|
||||
$this->config->setUserValue($this->userId, 'dashboard', 'firstRun', '0');
|
||||
|
||||
return new TemplateResponse('dashboard', 'index');
|
||||
|
|
@ -109,4 +119,30 @@ class DashboardController extends Controller {
|
|||
$this->config->setUserValue($this->userId, 'dashboard', 'layout', $layout);
|
||||
return new JSONResponse(['layout' => $layout]);
|
||||
}
|
||||
|
||||
/**
|
||||
* @NoAdminRequired
|
||||
*/
|
||||
public function setBackground($path = null, $url = null): JSONResponse {
|
||||
// FIXME: store current version of the background and return the result
|
||||
// FIXME: handle shipped backgrounds avoid file duplication
|
||||
// FIXME: allow to reset to default ones
|
||||
if ($path !== null) {
|
||||
$this->backgroundService->setFileBackground($path);
|
||||
}
|
||||
if ($url !== null) {
|
||||
$this->backgroundService->setUrlBackground($url);
|
||||
}
|
||||
return new JSONResponse([]);
|
||||
}
|
||||
|
||||
/**
|
||||
* @NoAdminRequired
|
||||
* @NoCSRFRequired
|
||||
*/
|
||||
public function getBackground(): FileDisplayResponse {
|
||||
$file = $this->backgroundService->getBackground();
|
||||
$response = new FileDisplayResponse($file, Http::STATUS_OK, ['Content-Type' => $file->getMimeType()]);
|
||||
return $response;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,63 @@
|
|||
<?php
|
||||
/**
|
||||
* @copyright Copyright (c) 2020 Julius Härtl <jus@bitgrid.net>
|
||||
*
|
||||
* @author Julius Härtl <jus@bitgrid.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/>.
|
||||
*
|
||||
*/
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
|
||||
namespace OCA\Dashboard\Controller;
|
||||
|
||||
use OCP\AppFramework\Http\JSONResponse;
|
||||
use OCP\AppFramework\OCSController;
|
||||
use OCP\IConfig;
|
||||
use OCP\IRequest;
|
||||
|
||||
class LayoutApiController extends OCSController {
|
||||
|
||||
/** @var IConfig */
|
||||
private $config;
|
||||
/** @var string */
|
||||
private $userId;
|
||||
|
||||
public function __construct(
|
||||
string $appName,
|
||||
IRequest $request,
|
||||
IConfig $config,
|
||||
$userId
|
||||
) {
|
||||
parent::__construct($appName, $request);
|
||||
|
||||
$this->config = $config;
|
||||
$this->userId = $userId;
|
||||
}
|
||||
|
||||
/**
|
||||
* @NoAdminRequired
|
||||
*
|
||||
* @param string $layout
|
||||
* @return JSONResponse
|
||||
*/
|
||||
public function create(string $layout): JSONResponse {
|
||||
$this->config->setUserValue($this->userId, 'dashboard', 'layout', $layout);
|
||||
return new JSONResponse(['layout' => $layout]);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
<?php
|
||||
/**
|
||||
* @copyright Copyright (c) 2020 Julius Härtl <jus@bitgrid.net>
|
||||
*
|
||||
* @author Julius Härtl <jus@bitgrid.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/>.
|
||||
*
|
||||
*/
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
|
||||
namespace OCA\Dashboard\Service;
|
||||
|
||||
|
||||
use OCP\Files\File;
|
||||
use OCP\Files\IAppData;
|
||||
use OCP\Files\IRootFolder;
|
||||
use OCP\Files\NotFoundException;
|
||||
use OCP\Files\SimpleFS\ISimpleFile;
|
||||
|
||||
class BackgroundService {
|
||||
|
||||
const SHIPPED_BACKGROUNDS = [
|
||||
'anatoly-mikhaltsov-butterfly-wing-scale-5k.jpg',
|
||||
'bernie-cetonia-aurata-take-off-composition-8k.jpg',
|
||||
'eduardo-neves-pedra-azul-5k.jpg',
|
||||
'europeanspaceagency-baltic-blooms-6k.jpg',
|
||||
'europeanspaceagency-barents-bloom-2k.jpg',
|
||||
'europeanspaceagency-colourful-queensland-6k.jpg',
|
||||
'europeanspaceagency-namib-desert-6k.jpg',
|
||||
'europeanspaceagency-peruvian-andes-6k.jpg',
|
||||
'flickr-148302424@N05-36591009215.jpg',
|
||||
'flickr-andymag-26451722126.jpg',
|
||||
'flickr-angietrenz-24259359268.jpg',
|
||||
'flickr-coconut-cove-mixed-2k.jpg',
|
||||
'flickr-dejankrsmanovic-42971456774.jpg',
|
||||
'flickr-paszczak000-8715851521.jpg',
|
||||
'flickr-xomeox-sewage-3k.jpg',
|
||||
'flickr-zalexandra-7948897538.jpg',
|
||||
'hannes-fritz-flippity-floppity-4k.jpg',
|
||||
'hannes-fritz-parkour-4k.jpg',
|
||||
'hannes-fritz-roulette-4k.jpg',
|
||||
'hannes-fritz-sea-spray-6k.jpg',
|
||||
'insa-wulf-radial-4k.jpg',
|
||||
'microcosmos-lab-microcrystals-5k.jpg',
|
||||
'nasa-goddard-antarctica-melts-6k.jpg',
|
||||
'nasa-goddard-iceberg-greenland-4k.jpg',
|
||||
'pexels-snapwire-forest-4k-cc0.jpg',
|
||||
'yana-sichikova-sergey-ovachev-stone-flower-2k.jpg',
|
||||
];
|
||||
|
||||
public function __construct(IRootFolder $rootFolder, IAppData $appData, $userId) {
|
||||
$this->userFolder = $rootFolder->getUserFolder($userId);
|
||||
try {
|
||||
$this->dashboardUserFolder = $appData->getFolder($userId);
|
||||
} catch (NotFoundException $e) {
|
||||
$this->dashboardUserFolder = $appData->newFolder($userId);
|
||||
}
|
||||
}
|
||||
|
||||
public function setFileBackground($path) {
|
||||
$file = $this->userFolder->get($path);
|
||||
$newFile = $this->dashboardUserFolder->newFile('background.jpg', $file->fopen('r'));
|
||||
}
|
||||
|
||||
public function setUrlBackground($url) {
|
||||
if (substr($url, 0, 1) === '/') {
|
||||
$url = \OC::$server->getURLGenerator()->getAbsoluteURL($url);
|
||||
}
|
||||
|
||||
$client = \OC::$server->getHTTPClientService()->newClient();
|
||||
$response = $client->get($url);
|
||||
$content = $response->getBody();
|
||||
$newFile = $this->dashboardUserFolder->newFile('background.jpg', $content);
|
||||
}
|
||||
|
||||
/**
|
||||
* @throws NotFoundException
|
||||
*/
|
||||
public function getBackground(): ISimpleFile {
|
||||
return $this->dashboardUserFolder->getFile('background.jpg');
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -53,6 +53,9 @@
|
|||
|
||||
<a :href="appStoreUrl" class="button">{{ t('dashboard', 'Get more widgets from the app store') }}</a>
|
||||
|
||||
<h3>{{ t('dashboard', 'Change the background image') }}</h3>
|
||||
<BackgroundSettings @updateBackground="updateBackground" />
|
||||
|
||||
<h3>{{ t('dashboard', 'Credits') }}</h3>
|
||||
<p>{{ t('dashboard', 'Photos') }}: <a href="https://www.flickr.com/photos/paszczak000/8715851521/" target="_blank" rel="noopener">Clouds (Kamil Porembiński)</a>, <a href="https://www.flickr.com/photos/148302424@N05/36591009215/" target="_blank" rel="noopener">Un beau soir dété (Tanguy Domenge)</a>.</p>
|
||||
</div>
|
||||
|
|
@ -69,15 +72,19 @@ import Draggable from 'vuedraggable'
|
|||
import axios from '@nextcloud/axios'
|
||||
import { generateUrl, generateFilePath } from '@nextcloud/router'
|
||||
import isMobile from './mixins/isMobile'
|
||||
import BackgroundSettings from './components/BackgroundSettings'
|
||||
|
||||
const panels = loadState('dashboard', 'panels')
|
||||
const firstRun = loadState('dashboard', 'firstRun')
|
||||
|
||||
const prefixWithBaseUrl = (url) => generateFilePath('dashboard', '', 'img/') + url
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
Modal,
|
||||
Draggable,
|
||||
BackgroundSettings,
|
||||
},
|
||||
mixins: [
|
||||
isMobile,
|
||||
|
|
@ -96,11 +103,14 @@ export default {
|
|||
modal: false,
|
||||
appStoreUrl: generateUrl('/settings/apps/dashboard'),
|
||||
statuses: {},
|
||||
backgroundTime: Date.now(),
|
||||
defaultBackground: window.OCA.Accessibility.theme === 'dark' ? prefixWithBaseUrl('flickr-148302424@N05-36591009215.jpg?v=1') : prefixWithBaseUrl('flickr-paszczak000-8715851521.jpg?v=1'),
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
backgroundImage() {
|
||||
const prefixWithBaseUrl = (url) => generateFilePath('dashboard', '', 'img/') + url
|
||||
// FIXME: make this dependent if the default is set or not
|
||||
return generateUrl('/apps/dashboard/background') + '?v=' + this.backgroundTime
|
||||
if (window.OCA.Accessibility.theme === 'dark') {
|
||||
return !isMobile ? prefixWithBaseUrl('flickr-148302424@N05-36591009215.jpg?v=1') : prefixWithBaseUrl('flickr-148302424@N05-36591009215-mobile.jpg?v=1')
|
||||
}
|
||||
|
|
@ -244,6 +254,9 @@ export default {
|
|||
this.firstRun = false
|
||||
}, 1000)
|
||||
},
|
||||
updateBackground(date) {
|
||||
this.backgroundTime = date
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -411,6 +424,8 @@ export default {
|
|||
.modal__content {
|
||||
width: 30vw;
|
||||
margin: 20px;
|
||||
max-height: 70vh;
|
||||
overflow: auto;
|
||||
ol {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,127 @@
|
|||
<!--
|
||||
- @copyright Copyright (c) 2020 Julius Härtl <jus@bitgrid.net>
|
||||
-
|
||||
- @author Julius Härtl <jus@bitgrid.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/>.
|
||||
-
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="background-selector">
|
||||
<div v-if="loading">Loading</div>
|
||||
<div v-for="background in shippedBackgrounds"
|
||||
:key="background"
|
||||
class="background"
|
||||
@click="setUrl(background)">
|
||||
<img :src="background">
|
||||
</div>
|
||||
<div class="background" @click="pickFile">
|
||||
<a>
|
||||
{{ t('dashboard', 'Pick an image from your files') }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from '@nextcloud/axios'
|
||||
import { generateUrl, generateFilePath } from '@nextcloud/router'
|
||||
import { loadState } from '@nextcloud/initial-state'
|
||||
|
||||
const prefixWithBaseUrl = (url) => generateFilePath('dashboard', '', 'img/') + url
|
||||
const shippedBackgroundList = loadState('dashboard', 'shippedBackgrounds')
|
||||
|
||||
export default {
|
||||
name: 'BackgroundSettings',
|
||||
data() {
|
||||
return {
|
||||
backgroundImage: generateUrl('/apps/dashboard/background') + '?v=' + Date.now(),
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
shippedBackgrounds() {
|
||||
return shippedBackgroundList.map((item) => {
|
||||
return prefixWithBaseUrl(item)
|
||||
})
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async update() {
|
||||
const date = Date.now()
|
||||
this.backgroundImage = generateUrl('/apps/dashboard/background') + '?v=' + date
|
||||
const image = new Image()
|
||||
image.onload = () => {
|
||||
this.$emit('updateBackground', date)
|
||||
this.loading = false
|
||||
}
|
||||
image.src = this.backgroundImage
|
||||
},
|
||||
setDefault() {
|
||||
console.debug('SetDefault')
|
||||
this.update()
|
||||
},
|
||||
async setUrl(url) {
|
||||
this.loading = true
|
||||
console.debug('SetUrl ' + url)
|
||||
await axios.post(generateUrl('/apps/dashboard/background'), { url })
|
||||
this.update()
|
||||
},
|
||||
async setFile(path) {
|
||||
this.loading = true
|
||||
console.debug('SetFile ' + path)
|
||||
await axios.post(generateUrl('/apps/dashboard/background'), { path })
|
||||
this.update()
|
||||
},
|
||||
pickFile() {
|
||||
window.OC.dialogs.filepicker(t('dashboard', 'Insert from {productName}', { productName: OC.theme.name }), (path, type) => {
|
||||
if (type === OC.dialogs.FILEPICKER_TYPE_CHOOSE) {
|
||||
this.setFile(path)
|
||||
}
|
||||
}, false, ['image/png', 'image/gif', 'image/jpeg', 'image/svg'], true, OC.dialogs.FILEPICKER_TYPE_CHOOSE)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.background-selector {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.background {
|
||||
width: 140px;
|
||||
padding: 15px;
|
||||
border-radius: var(--border-radius);
|
||||
text-align: center;
|
||||
|
||||
&.current {
|
||||
background-image: var(--color-background-dark);
|
||||
}
|
||||
|
||||
& img {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-background-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue