Merge pull request #25458 from nextcloud/backport/23588/stable20

[stable20] Override default dashboard background with theming one

apps/dashboard/lib/Controller/DashboardController.php

@@ -35,6 +35,7 @@
 use OCP\AppFramework\Http\JSONResponse;
 use OCP\AppFramework\Http\NotFoundResponse;
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\App\IAppManager;
 use OCP\Dashboard\IManager;
 use OCP\Dashboard\IWidget;
 use OCP\Dashboard\RegisterWidgetEvent;
@@ -49,6 +50,8 @@ class DashboardController extends Controller {
 	private $inititalStateService;
 	/** @var IEventDispatcher */
 	private $eventDispatcher;
+	/** @var IAppManager */
+	private $appManager;
 	/** @var IManager */
 	private $dashboardManager;
 	/** @var IConfig */
@@ -65,6 +68,7 @@ public function __construct(
 		IRequest $request,
 		IInitialStateService $initialStateService,
 		IEventDispatcher $eventDispatcher,
+		IAppManager $appManager,
 		IManager $dashboardManager,
 		IConfig $config,
 		BackgroundService $backgroundService,
@@ -74,6 +78,7 @@ public function __construct(
 
 		$this->inititalStateService = $initialStateService;
 		$this->eventDispatcher = $eventDispatcher;
+		$this->appManager = $appManager;
 		$this->dashboardManager = $dashboardManager;
 		$this->config = $config;
 		$this->backgroundService = $backgroundService;
@@ -109,6 +114,11 @@ public function index(): TemplateResponse {
 		// It does not matter if some statuses are missing from the array, missing ones are considered enabled
 		$statuses = ($statuses && count($statuses) > 0) ? $statuses : ['weather' => true];
 
+		// if theming app is enabled and wants to override default, we pass it
+		$themingDefaultBackground = $this->appManager->isEnabledForUser('theming')
+			? $this->config->getAppValue('theming', 'backgroundMime', '')
+			: '';
+		$this->inititalStateService->provideInitialState('dashboard', 'themingDefaultBackground', $themingDefaultBackground);
 		$this->inititalStateService->provideInitialState('dashboard', 'panels', $widgets);
 		$this->inititalStateService->provideInitialState('dashboard', 'statuses', $statuses);
 		$this->inititalStateService->provideInitialState('dashboard', 'layout', $userLayout);

apps/dashboard/src/App.vue

@@ -68,7 +68,9 @@
 				<a v-if="isAdmin" :href="appStoreUrl" class="button">{{ t('dashboard', 'Get more widgets from the app store') }}</a>
 
 				<h3>{{ t('dashboard', 'Change background image') }}</h3>
-				<BackgroundSettings :background="background" @update:background="updateBackground" />
+				<BackgroundSettings :background="background"
+					:theming-default-background="themingDefaultBackground"
+					@update:background="updateBackground" />
 
 				<h3>{{ t('dashboard', 'Weather service') }}</h3>
 				<p>
@@ -93,11 +95,11 @@ import { generateUrl } from '@nextcloud/router'
 import isMobile from './mixins/isMobile'
 import BackgroundSettings from './components/BackgroundSettings'
 import getBackgroundUrl from './helpers/getBackgroundUrl'
-import prefixWithBaseUrl from './helpers/prefixWithBaseUrl'
 
 const panels = loadState('dashboard', 'panels')
 const firstRun = loadState('dashboard', 'firstRun')
 const background = loadState('dashboard', 'background')
+const themingDefaultBackground = loadState('dashboard', 'themingDefaultBackground')
 const version = loadState('dashboard', 'version')
 const shippedBackgroundList = loadState('dashboard', 'shippedBackgrounds')
 const statusInfo = {
@@ -140,16 +142,17 @@ export default {
 			appStoreUrl: generateUrl('/settings/apps/dashboard'),
 			statuses: {},
 			background,
+			themingDefaultBackground,
 			version,
-			defaultBackground: window.OCA.Accessibility?.theme === 'dark' ? prefixWithBaseUrl('flickr-148302424@N05-36591009215.jpg?v=1') : prefixWithBaseUrl('flickr-paszczak000-8715851521.jpg?v=1'),
 		}
 	},
 	computed: {
 		backgroundImage() {
-			return getBackgroundUrl(this.background, this.version)
+			return getBackgroundUrl(this.background, this.version, this.themingDefaultBackground)
 		},
 		backgroundStyle() {
-			if (this.background.match(/#[0-9A-Fa-f]{6}/g)) {
+			if ((this.background === 'default' && this.themingDefaultBackground === 'backgroundColor')
+				|| this.background.match(/#[0-9A-Fa-f]{6}/g)) {
 				return null
 			}
 			return {

apps/dashboard/src/components/BackgroundSettings.vue

@@ -66,6 +66,10 @@ export default {
 			type: String,
 			default: 'default',
 		},
+		themingDefaultBackground: {
+			type: String,
+			default: '',
+		},
 	},
 	data() {
 		return {
@@ -88,8 +92,8 @@ export default {
 	methods: {
 		async update(data) {
 			const background = data.type === 'custom' || data.type === 'default' ? data.type : data.value
-			this.backgroundImage = getBackgroundUrl(background, data.version)
-			if (data.type === 'color') {
+			this.backgroundImage = getBackgroundUrl(background, data.version, this.themingDefaultBackground)
+			if (data.type === 'color' || (data.type === 'default' && this.themingDefaultBackground === 'backgroundColor')) {
 				this.$emit('update:background', data)
 				this.loading = false
 				return

apps/dashboard/src/helpers/getBackgroundUrl.js

@@ -23,8 +23,11 @@
 import { generateUrl } from '@nextcloud/router'
 import prefixWithBaseUrl from './prefixWithBaseUrl'
 
-export default (background, time = 0) => {
+export default (background, time = 0, themingDefaultBackground = '') => {
 	if (background === 'default') {
+		if (themingDefaultBackground && themingDefaultBackground !== 'backgroundColor') {
+			return generateUrl('/apps/theming/image/background') + '?v=' + window.OCA.Theming.cacheBuster
+		}
 		if (window.OCA.Accessibility?.theme === 'dark') {
 			return prefixWithBaseUrl('eduardo-neves-pedra-azul.jpg')
 		}

apps/theming/lib/Capabilities.php

@@ -69,7 +69,7 @@ public function __construct(ThemingDefaults $theming, Util $util, IURLGenerator
 	 * @return array
 	 */
 	public function getCapabilities() {
-		$backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime', false);
+		$backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime', '');
 		$color = $this->theming->getColorPrimary();
 		return [
 			'theming' => [
@@ -82,10 +82,10 @@ public function getCapabilities() {
 				'color-element-bright' => $this->util->elementColor($color),
 				'color-element-dark' => $this->util->elementColor($color, false),
 				'logo' => $this->url->getAbsoluteURL($this->theming->getLogo()),
-				'background' => $backgroundLogo === 'backgroundColor' || ($backgroundLogo === false && $this->theming->getColorPrimary() !== '#0082c9') ?
+				'background' => $backgroundLogo === 'backgroundColor' || ($backgroundLogo === '' && $this->theming->getColorPrimary() !== '#0082c9') ?
 					$this->theming->getColorPrimary() :
 					$this->url->getAbsoluteURL($this->theming->getBackground()),
-				'background-plain' => $backgroundLogo === 'backgroundColor' || ($backgroundLogo === false && $this->theming->getColorPrimary() !== '#0082c9'),
+				'background-plain' => $backgroundLogo === 'backgroundColor' || ($backgroundLogo === '' && $this->theming->getColorPrimary() !== '#0082c9'),
 				'background-default' => !$this->util->isBackgroundThemed(),
 				'logoheader' => $this->url->getAbsoluteURL($this->theming->getLogo()),
 				'favicon' => $this->url->getAbsoluteURL($this->theming->getLogo()),

apps/theming/lib/ImageManager.php

@@ -41,7 +41,7 @@
 
 class ImageManager {
 
-	/** @var IConfig */
+/** @var IConfig */
 	private $config;
 	/** @var IAppData */
 	private $appData;
@@ -57,12 +57,12 @@ class ImageManager {
 	private $tempManager;
 
 	public function __construct(IConfig $config,
-								IAppData $appData,
-								IURLGenerator $urlGenerator,
-								ICacheFactory $cacheFactory,
-								ILogger $logger,
-								ITempManager $tempManager
-	) {
+							IAppData $appData,
+							IURLGenerator $urlGenerator,
+							ICacheFactory $cacheFactory,
+							ILogger $logger,
+							ITempManager $tempManager
+) {
 		$this->config = $config;
 		$this->appData = $appData;
 		$this->urlGenerator = $urlGenerator;
@@ -80,13 +80,13 @@ public function getImageUrl(string $key, bool $useSvg = true): string {
 		}
 
 		switch ($key) {
-			case 'logo':
-			case 'logoheader':
-			case 'favicon':
-				return $this->urlGenerator->imagePath('core', 'logo/logo.png') . '?v=' . $cacheBusterCounter;
-			case 'background':
-				return $this->urlGenerator->imagePath('core', 'background.png') . '?v=' . $cacheBusterCounter;
-		}
+		case 'logo':
+		case 'logoheader':
+		case 'favicon':
+			return $this->urlGenerator->imagePath('core', 'logo/logo.png') . '?v=' . $cacheBusterCounter;
+		case 'background':
+			return $this->urlGenerator->imagePath('core', 'background.png') . '?v=' . $cacheBusterCounter;
+	}
 	}
 
 	public function getImageUrlAbsolute(string $key, bool $useSvg = true): string {
@@ -102,9 +102,9 @@ public function getImageUrlAbsolute(string $key, bool $useSvg = true): string {
 	 */
 	public function getImage(string $key, bool $useSvg = true): ISimpleFile {
 		$pngFile = null;
-		$logo = $this->config->getAppValue('theming', $key . 'Mime', false);
+		$logo = $this->config->getAppValue('theming', $key . 'Mime', '');
 		$folder = $this->appData->getFolder('images');
-		if ($logo === false || !$folder->fileExists($key)) {
+		if ($logo === '' || !$folder->fileExists($key)) {
 			throw new NotFoundException();
 		}
 		if (!$useSvg && $this->shouldReplaceIcons()) {

apps/theming/lib/Service/JSDataService.php

@@ -59,7 +59,7 @@ public function jsonSerialize() {
 			'imprintUrl' => $this->themingDefaults->getImprintUrl(),
 			'privacyUrl' => $this->themingDefaults->getPrivacyUrl(),
 			'inverted' => $this->util->invertTextColor($this->themingDefaults->getColorPrimary()),
-			'cacheBuster' => $this->appConfig->getAppValue(Application::class, 'cachebuster', '0'),
+			'cacheBuster' => $this->appConfig->getAppValue(Application::APP_ID, 'cachebuster', '0'),
 		];
 	}
 }

apps/theming/lib/ThemingDefaults.php

@@ -223,7 +223,7 @@ public function getColorPrimary() {
 	 * @return string
 	 */
 	public function getLogo($useSvg = true): string {
-		$logo = $this->config->getAppValue('theming', 'logoMime', false);
+		$logo = $this->config->getAppValue('theming', 'logoMime', '');
 
 		// short cut to avoid setting up the filesystem just to check if the logo is there
 		//
@@ -310,13 +310,13 @@ public function getScssVariables() {
 		$variables['image-login-background'] = "url('".$this->imageManager->getImageUrl('background')."')";
 		$variables['image-login-plain'] = 'false';
 
-		if ($this->config->getAppValue('theming', 'color', null) !== null) {
+		if ($this->config->getAppValue('theming', 'color', '') !== '') {
 			$variables['color-primary'] = $this->getColorPrimary();
 			$variables['color-primary-text'] = $this->getTextColorPrimary();
 			$variables['color-primary-element'] = $this->util->elementColor($this->getColorPrimary());
 		}
 
-		if ($this->config->getAppValue('theming', 'backgroundMime', null) === 'backgroundColor') {
+		if ($this->config->getAppValue('theming', 'backgroundMime', '') === 'backgroundColor') {
 			$variables['image-login-plain'] = 'true';
 		}
 

apps/theming/lib/Util.php

@@ -249,7 +249,7 @@ public function isAlreadyThemed() {
 	}
 
 	public function isBackgroundThemed() {
-		$backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime',false);
+		$backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime', '');
 
 		$backgroundExists = true;
 		try {