mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #7426 from nextcloud/Abijeet-master 

Allows adding of hex color to the theme-color
This commit is contained in:
Morris Jobke 2017-12-08 23:49:52 +01:00 committed by GitHub
parent 3f34861d58 81f34e224c
commit 79ed0d105d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 39 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/theming/js/settings-admin.js
View File

@ -206,7 +206,11 @@ $(document).ready(function () {
});
$('#theming-color').change(function (e) {
setThemingValue('color', '#' + $(this).val());
var color = $(this).val();
if (color.indexOf('#') !== 0) {
color = '#' + color;
}
setThemingValue('color', color);
});
$('.theme-undo').click(function (e) {

2
apps/theming/templates/settings-admin.php
View File

@ -62,7 +62,7 @@ style('theming', 'settings-admin');
<div>
<label>
<span><?php p($l->t('Color')) ?></span>
<input id="theming-color" type="text" class="jscolor" maxlength="6" value="<?php p($_['color']) ?>" />
<input id="theming-color" type="text" class="jscolor" data-jscolor="{hash:true}" maxlength="7" value="<?php p($_['color']) ?>" />
<div data-setting="color" data-toggle="tooltip" data-original-title="<?php p($l->t('Reset to default')); ?>" class="theme-undo icon icon-history"></div>
</label>
</div>

12
tests/acceptance/features/app-theming.feature
View File

@ -5,19 +5,19 @@ Feature: app-theming
And I visit the settings page
And I open the "Theming" section
And I see that the color selector in the Theming app has loaded
And I see that the header color is "0082C9"
When I set the "Color" parameter in the Theming app to "C9C9C9"
And I see that the header color is "#0082C9"
When I set the "Color" parameter in the Theming app to "#C9C9C9"
Then I see that the parameters in the Theming app are eventually saved
And I see that the header color is "C9C9C9"
And I see that the header color is "#C9C9C9"
Scenario: resetting the color updates the header color
Given I am logged in as the admin
And I visit the settings page
And I open the "Theming" section
And I see that the color selector in the Theming app has loaded
And I set the "Color" parameter in the Theming app to "C9C9C9"
And I set the "Color" parameter in the Theming app to "#C9C9C9"
And I see that the parameters in the Theming app are eventually saved
And I see that the header color is "C9C9C9"
And I see that the header color is "#C9C9C9"
When I reset the "Color" parameter in the Theming app to its default value
Then I see that the parameters in the Theming app are eventually saved
And I see that the header color is "0082C9"
And I see that the header color is "#0082C9"

50
tests/acceptance/features/bootstrap/ThemingAppContext.php
View File

@ -84,24 +84,23 @@ class ThemingAppContext implements Context, ActorAwareInterface {
* @Then I see that the color selector in the Theming app has loaded
*/
public function iSeeThatTheColorSelectorInTheThemingAppHasLoaded() {
// When the color selector is loaded it removes the leading '#' from the
// value property of the input field object it is linked to, and changes
// the background color of the input field to that value. The only way
// to know that the color selector has loaded is to look for any of
// those changes.
// Checking if the color selector has loaded by getting the background color
// of the input element. If the value present in the element matches the
// background of the input element, it means the color element has been
// initialized.
PHPUnit_Framework_Assert::assertTrue($this->actor->find(self::inputFieldFor("Color"), 10)->isVisible());
$actor = $this->actor;
$colorSelectorLoadedCallback = function() use($actor) {
$colorSelectorValue = $actor->getSession()->evaluateScript("return $('#theming-color')[0].value;");
if ($colorSelectorValue[0] === '#') {
return false;
$colorSelectorValue = $this->getRGBArray($actor->getSession()->evaluateScript("return $('#theming-color')[0].value;"));
$inputBgColor = $this->getRGBArray($actor->getSession()->evaluateScript("return $('#theming-color').css('background-color');"));
if ($colorSelectorValue == $inputBgColor) {
return true;
}
return true;
return false;
};
if (!Utils::waitFor($colorSelectorLoadedCallback, $timeout = 10 * $this->actor->getFindTimeoutMultiplier(), $timeoutStep = 1)) {
@ -109,24 +108,29 @@ class ThemingAppContext implements Context, ActorAwareInterface {
}
}
private function getRGBArray ($color) {
if (preg_match("/rgb\(\s*(\d+),\s*(\d+),\s*(\d+)\)/", $color, $matches)) {
// Already an RGB (R, G, B) color
// Convert from "rgb(R, G, B)" string to RGB array
$tmpColor = array_splice($matches, 1);
} else if ($color[0] === '#') {
$color = substr($color, 1);
// HEX Color, convert to RGB array.
$tmpColor = sscanf($color, "%02X%02X%02X");
} else {
PHPUnit_Framework_Assert::fail("The acceptance test does not know how to handle the color string : '$color'. "
. "Please provide # before HEX colors in your features.");
}
return $tmpColor;
}
/**
* @Then I see that the header color is :color
*/
public function iSeeThatTheHeaderColorIs($color) {
$headerColor = $this->actor->getSession()->evaluateScript("return $('#header').css('background-color');");
if ($headerColor[0] === '#') {
$headerColor = substr($headerColor, 1);
} else if (preg_match("/rgb\(\s*(\d+),\s*(\d+),\s*(\d+)\)/", $headerColor, $matches)) {
// Convert from hex string to RGB array
$color = sscanf($color, "%02X%02X%02X");
// Convert from "rgb(R, G, B)" string to RGB array
$headerColor = array_splice($matches, 1);
} else {
PHPUnit_Framework_Assert::fail("The acceptance test does not know how to handle the color string returned by the browser: $headerColor");
}
$headerColor = $this->getRGBArray($headerColor);
$color = $this->getRGBArray($color);
PHPUnit_Framework_Assert::assertEquals($color, $headerColor);
}