add var for theming images , advanced options (#16815)

add var for theming images , advanced options

apps/theming/css/theming.scss

@@ -153,7 +153,7 @@ $invert: luma($color-primary) > 0.6;
 @if variable_exists('theming-logoheader-mime') and $theming-logoheader-mime != '' {
 	#theming .advanced-option-logoheader .image-preview,
 	body:not(#body-login) #header .logo {
-		background-image: url(#{$image-logoheader});
+		background-image: $image-logoheader;
 	}
 } @else {
 	#theming .advanced-option-favicon .image-preview {
@@ -163,7 +163,7 @@ $invert: luma($color-primary) > 0.6;
 
 @if variable_exists('theming-favicon-mime') and $theming-favicon-mime != '' {
 	#theming .advanced-option-favicon .image-preview {
-		background-image: url(#{$image-favicon});
+		background-image: $image-favicon;
 	}
 } @else {
 	#theming .advanced-option-favicon .image-preview {

apps/theming/lib/Capabilities.php

@@ -83,6 +83,8 @@ class Capabilities implements IPublicCapability {
 					$this->url->getAbsoluteURL($this->theming->getBackground()),
 				'background-plain' => $backgroundLogo === 'backgroundColor',
 				'background-default' => !$this->util->isBackgroundThemed(),
+				'logoheader' => $this->url->getAbsoluteURL($this->theming->getLogo()),
+				'favicon' => $this->url->getAbsoluteURL($this->theming->getLogo()),
 			],
 		];
 	}

apps/theming/lib/ThemingDefaults.php

@@ -287,8 +287,8 @@ class ThemingDefaults extends \OC_Defaults {
 		];
 
 		$variables['image-logo'] = "url('".$this->imageManager->getImageUrl('logo')."')";
-		$variables['image-logoheader'] = "'".$this->imageManager->getImageUrl('logoheader')."'";
-		$variables['image-favicon'] = "'".$this->imageManager->getImageUrl('favicon')."'";
+		$variables['image-logoheader'] = "url('".$this->imageManager->getImageUrl('logoheader')."')";
+		$variables['image-favicon'] = "url('".$this->imageManager->getImageUrl('favicon')."')";
 		$variables['image-login-background'] = "url('".$this->imageManager->getImageUrl('background')."')";
 		$variables['image-login-plain'] = 'false';
 

apps/theming/tests/CapabilitiesTest.php

@@ -78,6 +78,8 @@ class CapabilitiesTest extends TestCase  {
 				'background' => 'http://absolute/background',
 				'background-plain' => false,
 				'background-default' => false,
+				'logoheader' => 'http://absolute/logo',
+				'favicon' => 'http://absolute/logo',
 			]],
 			['name1', 'url2', 'slogan3', '#01e4a0', '#ffffff', 'logo5', 'background6', 'http://localhost/', false, [
 				'name' => 'name1',
@@ -90,6 +92,8 @@ class CapabilitiesTest extends TestCase  {
 				'background' => 'http://localhost/background6',
 				'background-plain' => false,
 				'background-default' => true,
+				'logoheader' => 'http://localhost/logo5',
+				'favicon' => 'http://localhost/logo5',
 			]],
 			['name1', 'url2', 'slogan3', '#000000', '#ffffff', 'logo5', 'backgroundColor', 'http://localhost/', true, [
 				'name' => 'name1',
@@ -102,6 +106,8 @@ class CapabilitiesTest extends TestCase  {
 				'background' => '#000000',
 				'background-plain' => true,
 				'background-default' => false,
+				'logoheader' => 'http://localhost/logo5',
+				'favicon' => 'http://localhost/logo5',
 			]],
 			['name1', 'url2', 'slogan3', '#000000', '#ffffff', 'logo5', 'backgroundColor', 'http://localhost/', false, [
 				'name' => 'name1',
@@ -114,6 +120,8 @@ class CapabilitiesTest extends TestCase  {
 				'background' => '#000000',
 				'background-plain' => true,
 				'background-default' => true,
+				'logoheader' => 'http://localhost/logo5',
+				'favicon' => 'http://localhost/logo5',
 			]],
 		];
 	}
@@ -147,7 +155,7 @@ class CapabilitiesTest extends TestCase  {
 		$this->theming->expects($this->atLeast(1))
 			->method('getColorPrimary')
 			->willReturn($color);
-		$this->theming->expects($this->once())
+		$this->theming->expects($this->exactly(3))
 			->method('getLogo')
 			->willReturn($logo);
 		$this->theming->expects($this->once())
@@ -168,13 +176,13 @@ class CapabilitiesTest extends TestCase  {
 			$this->theming->expects($this->once())
 				->method('getBackground')
 				->willReturn($background);
-			$this->url->expects($this->exactly(2))
+			$this->url->expects($this->exactly(4))
 				->method('getAbsoluteURL')
 				->willReturnCallback(function($url) use($baseUrl) {
 					return $baseUrl . $url;
 				});
 		} else {
-			$this->url->expects($this->once())
+			$this->url->expects($this->exactly(3))
 				->method('getAbsoluteURL')
 				->willReturnCallback(function($url) use($baseUrl) {
 					return $baseUrl . $url;

apps/theming/tests/ThemingDefaultsTest.php

@@ -681,8 +681,8 @@ class ThemingDefaultsTest extends TestCase {
 			'color-primary-element' => '#aaaaaa',
 			'theming-logoheader-mime' => '\'jpeg\'',
 			'theming-favicon-mime' => '\'jpeg\'',
-			'image-logoheader' => '\'custom-logoheader?v=0\'',
-			'image-favicon' => '\'custom-favicon?v=0\'',
+			'image-logoheader' => "url('custom-logoheader?v=0')",
+			'image-favicon' => "url('custom-favicon?v=0')",
 			'has-legal-links' => 'false'
 		];
 		$this->assertEquals($expected, $this->template->getScssVariables());

core/css/css-variables.scss

@@ -27,6 +27,8 @@
 
 	--image-logo: $image-logo;
 	--image-login-background: $image-login-background;
+	--image-logoheader: $image-logoheader;
+	--image-favicon: $image-favicon;
 
 	--color-loading-light: $color-loading-light;
 	--color-loading-dark: $color-loading-dark;

core/css/variables.scss

@@ -65,6 +65,8 @@ $color-text-lighter: nc-lighten($color-main-text, 30%) !default;
 
 $image-logo: url('../img/logo/logo.svg?v=1') !default;
 $image-login-background: url('../img/background.png?v=2') !default;
+$image-logoheader: url('../img/logo/logo.svg?v=1') !default;
+$image-favicon: url('../img/logo/logo.svg?v=1') !default;
 
 $color-loading-light: #ccc !default;
 $color-loading-dark: #444 !default;