Updates inverted logo handling to work like the app icons

Signed-off-by: Michael Weimann <mail@michael-weimann.eu>
This commit is contained in:
Michael Weimann 2018-08-28 18:21:17 +02:00 committed by Roeland Jago Douma
parent d855c38e07
commit c7e81e17c8
No known key found for this signature in database
GPG Key ID: F941078878347C0C
5 changed files with 27 additions and 162 deletions

View File

@ -7,6 +7,17 @@
@return (0.2126 * $-local-red + 0.7152 * $-local-green + 0.0722 * $-local-blue) / 255;
}
$has-custom-logo: variable_exists('theming-logo-mime') and $theming-logo-mime != '';
$invert: luma($color-primary) > 0.6;
@if ($has-custom-logo == false) {
@if ($invert) {
$image-logo: url('../../../../svg/core/logo/logo/000000?v=1');
} @else {
$image-logo: url('../../../../svg/core/logo/logo/ffffff?v=1');
}
}
.nc-theming-main-background {
background-color: $color-primary;
}
@ -19,7 +30,7 @@
color: $color-primary-text;
}
@if (luma($color-primary) > 0.6) {
@if ($invert) {
#appmenu:not(.inverted) svg {
filter: invert(1);
}
@ -104,7 +115,8 @@
}
/* override styles for login screen in guest.css */
@if variable_exists('theming-logo-mime') and $theming-logo-mime != '' {
@if ($has-custom-logo) {
// custom logo
#theming-preview-logo,
#header .logo {
background-size: contain;
@ -113,6 +125,14 @@
#body-login #header .logo {
margin-bottom: 22px;
}
} @else {
// default logo
@if ($invert) {
#theming-preview-logo,
#header .logo {
opacity: .6;
}
}
}
@if variable_exists('theming-background-mime') and $theming-background-mime != '' {
@ -157,7 +177,7 @@ input.primary,
color: $color-primary-text;
}
@if (luma($color-primary) > 0.6) {
@if ($invert) {
#body-login #submit-wrapper .icon-confirm-white {
background-image: url('../../../core/img/actions/confirm.svg');
}

View File

@ -80,9 +80,6 @@ class ImageManager {
}
switch ($key) {
case 'logo-blue':
// the blue logo is only available as svg
return $this->urlGenerator->getAbsoluteURL('svg/core/logo/logo/0082C9') . '?v=' . $cacheBusterCounter;
case 'logo':
case 'logoheader':
case 'favicon':

View File

@ -33,7 +33,6 @@
namespace OCA\Theming;
use OCP\App\AppPathNotFoundException;
use OCP\App\IAppManager;
use OCP\Files\NotFoundException;
@ -275,7 +274,7 @@ class ThemingDefaults extends \OC_Defaults {
'theming-favicon-mime' => "'" . $this->config->getAppValue('theming', 'faviconMime') . "'"
];
$variables['image-logo'] = "url('". $this->getLogoUrl() ."')";
$variables['image-logo'] = "url('".$this->imageManager->getImageUrl('logo')."')";
$variables['image-logoheader'] = "'".$this->imageManager->getImageUrl('logoheader')."'";
$variables['image-favicon'] = "'".$this->imageManager->getImageUrl('favicon')."'";
$variables['image-login-background'] = "url('".$this->imageManager->getImageUrl('background')."')";
@ -300,24 +299,6 @@ class ThemingDefaults extends \OC_Defaults {
return $variables;
}
/**
* Returns the logo url.
* If there is a custom logo, it just returns it.
* For the default logo it returns the white or blue one depending on the color luminance.
*
* @return string
*/
private function getLogoUrl() {
$logoMime = $this->config->getAppValue('theming', 'logoMime');
$primaryColor = $this->getColorPrimary();
$luminance = $this->util->calculateLuminance($primaryColor);
if ($logoMime === '' & $luminance > 0.8) {
return $this->imageManager->getImageUrl('logo-blue', true);
} else {
return $this->imageManager->getImageUrl('logo', true);
}
}
/**
* Check if the image should be replaced by the theming app
* and return the new image location then

View File

@ -632,66 +632,6 @@ class ThemingDefaultsTest extends TestCase {
$this->assertEquals(['foo'=>'bar'], $this->template->getScssVariables());
}
/**
* Provides test data for the get logo scss variable test.
*
* @return array
*/
public function provideTestGetImageLogoScssVariableTestData(): array {
return [
// default logo
['', '#000000', 0.0, 'logo'],
['', '#cccccc', 0.8, 'logo'],
['', '#dddddd', 0.81, 'logo-blue'],
['', '#ffffff', 1.0, 'logo-blue'],
// custom logo
['image/png', '#000000', 0.0, 'logo'],
['image/png', '#cccccc', 0.8, 'logo'],
['image/png', '#dddddd', 0.81, 'logo'],
['image/png', '#ffffff', 1.0, 'logo'],
];
}
/**
* Tests chat the logo url scss variable has the expected value
* depending on color and custom logo presence.
*
* @dataProvider provideTestGetImageLogoScssVariableTestData
* @param string $themingLogoMime The custom logo mime type
* @param string $primaryColor The primary theme color
* @param float $luminance The calculated luminance
* @param string $expected The expected requested logo
* @return void
*/
public function testGetImageLogoScssVariable(
string $themingLogoMime,
string $primaryColor,
float $luminance,
string $expected
) {
$this->config->expects($this->at(5))
->method('getAppValue')
->with('theming', 'logoMime')
->willReturn($themingLogoMime);
$this->config->expects($this->at(6))
->method('getAppValue')
->with('theming', 'color', $this->defaults->getColorPrimary())
->willReturn($primaryColor);
$this->util
->method('calculateLuminance')
->with($primaryColor)
->willReturn($luminance);
$this->imageManager->expects($this->at(0))
->method('getImageUrl')
->with($expected)
->willReturn('custom-logo?v=0');
$this->template->getScssVariables();
}
public function testGetScssVariables() {
$this->config->expects($this->at(0))->method('getAppValue')->with('theming', 'cachebuster', '0')->willReturn('0');
$this->config->expects($this->at(1))->method('getAppValue')->with('theming', 'logoMime', false)->willReturn('jpeg');
@ -699,13 +639,10 @@ class ThemingDefaultsTest extends TestCase {
$this->config->expects($this->at(3))->method('getAppValue')->with('theming', 'logoheaderMime', false)->willReturn('jpeg');
$this->config->expects($this->at(4))->method('getAppValue')->with('theming', 'faviconMime', false)->willReturn('jpeg');
$this->config->expects($this->at(5))->method('getAppValue')->with('theming', 'logoMime', false)->willReturn('jpeg');
$this->config->expects($this->at(5))->method('getAppValue')->with('theming', 'color', null)->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(6))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(7))->method('getAppValue')->with('theming', 'color', null)->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(7))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(8))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(9))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
$this->config->expects($this->at(10))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
$this->util->expects($this->any())->method('invertTextColor')->with($this->defaults->getColorPrimary())->willReturn(false);
$this->util->expects($this->any())->method('elementColor')->with($this->defaults->getColorPrimary())->willReturn('#aaaaaa');

View File

@ -1,71 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
height="128"
width="256"
viewBox="0 0 256 128"
id="svg10"
sodipodi:docname="logo.svg"
inkscape:version="0.92.3 (2405546, 2018-03-11)">
<metadata
id="metadata16">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs14" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1053"
id="namedview12"
showgrid="false"
inkscape:zoom="1.4296875"
inkscape:cx="128"
inkscape:cy="91.978142"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="svg10" />
<g
stroke="#fff"
stroke-width="22"
fill="none"
id="g8">
<circle
cy="64"
cx="40"
r="26"
id="circle2" />
<circle
cy="64"
cx="216"
r="26"
id="circle4" />
<circle
cy="64"
cx="128"
r="46"
id="circle6" />
</g>
</svg>
<svg width="256" height="128" version="1.1" viewBox="0 0 256 128" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="#fff" stroke-width="22"><circle cx="40" cy="64" r="26"/><circle cx="216" cy="64" r="26"/><circle cx="128" cy="64" r="46"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 257 B