N°3791 - Panel: Use style defined in the DM for classes

Note that for now, semantic colors cannot be used directly in a <main_color> or <complementary_color> tag. Only valid CSS color (hexa, hsla, ...)

core/ormStyle.class.inc.php

@@ -11,39 +11,48 @@
  */
 class ormStyle
 {
-	/** @var string */
+	/** @var string|null */
 	protected $sMainColor;
-	/** @var string */
+	/** @var string|null */
 	protected $sComplementaryColor;
-	/** @var string CSS class with color and background-color */
+	/** @var string|null CSS class with color and background-color */
 	protected $sStyleClass;
-	/** @var string CSS class with only color */
+	/** @var string|null CSS class with only color */
 	protected $sAltStyleClass;
-	/** @var string */
+	/** @var string|null */
 	protected $sDecorationClasses;
-	/** @var string Relative path (from current environment) to the icon */
+	/** @var string|null Relative path (from current environment) to the icon */
 	protected $sIcon;
 
 	/**
 	 * ormStyle constructor.
 	 *
-	 * @param string $sStyleClass
+	 * @param string|null $sStyleClass
-	 * @param string $sAltStyleClass
+	 * @param string|null $sAltStyleClass
 	 * @param string|null $sMainColor
 	 * @param string|null $sComplementaryColor
 	 * @param string|null $sDecorationClasses
 	 * @param string|null $sIcon
 	 */
-	public function __construct(string $sStyleClass, string $sAltStyleClass, string $sMainColor = null, string $sComplementaryColor = null, string $sDecorationClasses = null, string $sIcon = null)
+	public function __construct(?string $sStyleClass = null, ?string $sAltStyleClass = null, ?string $sMainColor = null, ?string $sComplementaryColor = null, ?string $sDecorationClasses = null, ?string $sIcon = null)
 	{
-		$this->sMainColor = $sMainColor;
+		$this->SetMainColor($sMainColor);
-		$this->sComplementaryColor = $sComplementaryColor;
+		$this->SetComplementaryColor($sComplementaryColor);
-		$this->sStyleClass = $sStyleClass;
+		$this->SetStyleClass($sStyleClass);
-		$this->sAltStyleClass = $sAltStyleClass;
+		$this->SetAltStyleClass($sAltStyleClass);
-		$this->sDecorationClasses = $sDecorationClasses;
+		$this->SetDecorationClasses($sDecorationClasses);
 		$this->SetIcon($sIcon);
 	}
 
+	/**
+	 * @see static::$sMainColor
+	 * @return bool
+	 */
+	public function HasMainColor(): bool
+	{
+		return strlen($this->sMainColor) > 0;
+	}
+
 	/**
 	 * @return string
 	 */
@@ -59,10 +68,19 @@ class ormStyle
 	 */
 	public function SetMainColor(?string $sMainColor)
 	{
-		$this->sMainColor = $sMainColor;
+		$this->sMainColor = (strlen($sMainColor) === 0) ? null : $sMainColor;
 		return $this;
 	}
 
+	/**
+	 * @see static::$sComplementaryColor
+	 * @return bool
+	 */
+	public function HasComplementaryColor(): bool
+	{
+		return strlen($this->sComplementaryColor) > 0;
+	}
+
 	/**
 	 * @return string
 	 */
@@ -78,14 +96,33 @@ class ormStyle
 	 */
 	public function SetComplementaryColor(?string $sComplementaryColor)
 	{
-		$this->sComplementaryColor = $sComplementaryColor;
+		$this->sComplementaryColor = (strlen($sComplementaryColor) === 0) ? null : $sComplementaryColor;
 		return $this;
 	}
 
+	/**
+	 * @see static::$sMainColor
+	 * @see static::$sComplementaryColor
+	 * @return bool
+	 */
+	public function HasAtLeastOneColor(): bool
+	{
+		return $this->HasMainColor() || $this->HasComplementaryColor();
+	}
+
+	/**
+	 * @see static::$sStyleClass
+	 * @return bool
+	 */
+	public function HasStyleClass(): bool
+	{
+		return strlen($this->sStyleClass) > 0;
+	}
+
 	/**
 	 * @return string
 	 */
-	public function GetStyleClass(): string
+	public function GetStyleClass(): ?string
 	{
 		return $this->sStyleClass;
 	}
@@ -95,16 +132,25 @@ class ormStyle
 	 *
 	 * @return $this
 	 */
-	public function SetStyleClass(string $sStyleClass)
+	public function SetStyleClass(?string $sStyleClass)
 	{
-		$this->sStyleClass = $sStyleClass;
+		$this->sStyleClass = (strlen($sStyleClass) === 0) ? null : $sStyleClass;
 		return $this;
 	}
 
+	/**
+	 * @see static::$sAltStyleClass
+	 * @return bool
+	 */
+	public function HasAltStyleClass(): bool
+	{
+		return strlen($this->sAltStyleClass) > 0;
+	}
+
 	/**
 	 * @return string
 	 */
-	public function GetAltStyleClass(): string
+	public function GetAltStyleClass(): ?string
 	{
 		return $this->sAltStyleClass;
 	}
@@ -114,12 +160,21 @@ class ormStyle
 	 *
 	 * @return $this
 	 */
-	public function SetAltStyleClass(string $sAltStyleClass)
+	public function SetAltStyleClass(?string $sAltStyleClass)
 	{
-		$this->sAltStyleClass = $sAltStyleClass;
+		$this->sAltStyleClass = (strlen($sAltStyleClass) === 0) ? null : $sAltStyleClass;
 		return $this;
 	}
 
+	/**
+	 * @see static::$sDecorationClasses
+	 * @return bool
+	 */
+	public function HasDecorationClasses(): bool
+	{
+		return strlen($this->sDecorationClasses) > 0;
+	}
+
 	/**
 	 * @return string
 	 */
@@ -135,10 +190,19 @@ class ormStyle
 	 */
 	public function SetDecorationClasses(?string $sDecorationClasses)
 	{
-		$this->sDecorationClasses = $sDecorationClasses;
+		$this->sDecorationClasses = (strlen($sDecorationClasses) === 0) ? null : $sDecorationClasses;
 		return $this;
 	}
 
+	/**
+	 * @see static::$sIcon
+	 * @return bool
+	 */
+	public function HasIcon(): bool
+	{
+		return strlen($this->sIcon) > 0;
+	}
+
 	/**
 	 * @param string|null $sIcon
 	 *

setup/compiler.class.inc.php

@@ -2254,10 +2254,6 @@ EOF
 			}
 		}
 
-		// CSS classes representing the element (regular and alternative)
-		$sCssRegularClass = "ibo-dm-$sElementType--$sClass$sCssClassSuffix";
-		$sCssAlternativeClass = "ibo-dm-$sElementType-alt--$sClass$sCssClassSuffix";
-
 		// Retrieve colors (optional depending on the element)
 		if ($sElementType === self::ENUM_STYLE_HOST_ELEMENT_TYPE_CLASS) {
 			$sMainColorForOrm = $this->GetPropString($oNode, 'main_color', null);
@@ -2282,6 +2278,7 @@ EOF
 		}
 		$bHasMainColor = is_null($sMainColorForCss) === false;
 		$bHasComplementaryColor = is_null($sComplementaryColorForCss) === false;
+		$bHasAtLeastOneColor = $bHasMainColor || $bHasComplementaryColor;
 
 		// Optional decoration classes
 		$sDecorationClasses = $this->GetPropString($oNode, 'decoration_classes', null);
@@ -2297,12 +2294,19 @@ EOF
 			$sIconRelPath = "'$sModuleRelDir/$sIconRelPath'";
 		}
 
+		// CSS classes representing the element (regular and alternative)
+		$sCssRegularClass = "ibo-dm-$sElementType--$sClass$sCssClassSuffix";
+		$sCssRegularClassForOrm = $bHasAtLeastOneColor ? "'$sCssRegularClass'" : "null";
+
+		$sCssAlternativeClass = "ibo-dm-$sElementType-alt--$sClass$sCssClassSuffix";
+		$sCssAlternativeClassForOrm = $bHasAtLeastOneColor ? "'$sCssAlternativeClass'" : "null";
+
 		// Generate ormStyle instantiation
-		$aData['orm_style_instantiation'] = "$sOrmStylePrefix new ormStyle('$sCssRegularClass', '$sCssAlternativeClass', $sMainColorForOrm, $sComplementaryColorForOrm, $sDecorationClasses, $sIconRelPath)";
+		$aData['orm_style_instantiation'] = "$sOrmStylePrefix new ormStyle($sCssRegularClassForOrm, $sCssAlternativeClassForOrm, $sMainColorForOrm, $sComplementaryColorForOrm, $sDecorationClasses, $sIconRelPath)";
 
 		// Generate SCSS declaration
 		$sScss = "";
-		if ($bHasMainColor || $bHasComplementaryColor) {
+		if ($bHasAtLeastOneColor) {
 			if ($bHasMainColor) {
 				$sMainColorScssVariableName = "\$$sCssRegularClass--main-color";
 				$sMainColorCssVariableName = "--$sCssRegularClass--main-color";
@@ -2316,9 +2320,6 @@ EOF
 
 				$sCssAlternativeClassComplementaryColorDeclaration = "--ibo-complementary-color: $sMainColorScssVariableName;";
 			} else {
-				$sMainColorScssVariableName = null;
-				$sMainColorCssVariableName = null;
-
 				$sMainColorScssVariableDeclaration = null;
 
 				$sCssRegularClassMainColorDeclaration = null;
@@ -2338,9 +2339,6 @@ EOF
 
 				$sCssAlternativeClassMainColorDeclaration = "--ibo-main-color: $sComplementaryColorScssVariableName;";
 			} else {
-				$sComplementaryColorScssVariableName = null;
-				$sComplementaryColorCssVariableName = null;
-
 				$sComplementaryScssVariableDeclaration = null;
 				$sComplementaryCssVariableDeclaration = null;
 

sources/application/UI/Base/Component/Panel/Panel.php

@@ -434,10 +434,10 @@ class Panel extends UIContentBlock
 	 */
 	public function SetColorFromOrmStyle(ormStyle $oStyle)
 	{
-		if (strlen($oStyle->GetStyleClass()) === 0) {
+		if ($oStyle->HasStyleClass()) {
-			$this->SetColorFromColorSemantic(static::DEFAULT_COLOR_SCHEME);
-		} else {
 			$this->SetCSSColorClass($oStyle->GetStyleClass());
+		} else {
+			$this->SetColorFromColorSemantic(static::DEFAULT_COLOR_SCHEME);
 		}
 
 		return $this;

test/core/MetaModelTest.php

@@ -296,7 +296,8 @@ class MetaModelTest extends ItopDataTestCase
 	public function GetClassStyleProvider()
 	{
 		return [
-			'Organization' => ['Organization', 'ibo-dm-class--Organization', 'ibo-dm-class-alt--Organization', null, 'itop-structure/../../images/icons/icons8-organization.svg'],
+			'Class with no color, only icon' => ['Organization', null, null, null, 'itop-structure/../../images/icons/icons8-organization.svg'],
+			'Class with colors and icon' => ['Contact', 'ibo-dm-class--Contact', 'ibo-dm-class-alt--Contact', null, 'itop-structure/../../images/icons/icons8-customer.svg'],
 		];
 	}
 

test/core/ormStyleTest.php

@@ -21,75 +21,254 @@ class ormStyleTest extends ItopTestCase
 {
 
 	/**
-	 * @param string $sRegularClass
+	 * @param string $sSetterName
-	 * @param string $sAlternativeClass
+	 * @param string $sGetterName
-	 * @param string|null $sMainColor
+	 * @param mixed $expectedAfterInstantiation
-	 * @param string|null $sComplementaryColor
+	 * @param mixed $inputValue
-	 * @param string|null $sDecorationClasses
+	 * @param mixed $expectedValueAfterSetter
-	 * @param string|null $sIconRelPath
 	 *
-	 * @covers       ormStyle::GetStyleClass
-	 * @covers       ormStyle::GetAltStyleClass
 	 * @covers       ormStyle::GetMainColor
-	 * @covers       ormStyle::GetComplementaryColor
-	 * @covers       ormStyle::GetDecorationClasses
-	 * @covers       ormStyle::GetIconAsRelPath
-	 * @covers       ormStyle::SetStyleClass
-	 * @covers       ormStyle::SetAltStyleClass
 	 * @covers       ormStyle::SetMainColor
+	 * @covers       ormStyle::HasMainColor
+	 * @covers       ormStyle::GetComplementaryColor
 	 * @covers       ormStyle::SetComplementaryColor
+	 * @covers       ormStyle::HasComplementaryColor
+	 * @covers       ormStyle::GetStyleClass
+	 * @covers       ormStyle::SetStyleClass
+	 * @covers       ormStyle::HasStyleClass
+	 * @covers       ormStyle::GetAltStyleClass
+	 * @covers       ormStyle::SetAltStyleClass
+	 * @covers       ormStyle::HasAltStyleClass
+	 * @covers       ormStyle::GetDecorationClasses
 	 * @covers       ormStyle::SetDecorationClasses
-	 * @covers       ormStyle::SetIcon
+	 * @covers       ormStyle::HasDecorationClasses
 	 *
 	 * @dataProvider BaseSetsProvider
 	 */
-	public function testNonAlteringMethods(string $sRegularClass, string $sAlternativeClass, ?string $sMainColor, ?string $sComplementaryColor, ?string $sDecorationClasses, ?string $sIconRelPath)
+	public function testPropertiesThatShouldNotBeAnAEmptyString(string $sSetterName, string $sGetterName, $expectedAfterInstantiation, $inputValue, $expectedValueAfterSetter)
 	{
-		$oStyle = new ormStyle($sRegularClass, $sAlternativeClass, $sMainColor, $sComplementaryColor, $sDecorationClasses, $sIconRelPath);
+		$oStyle = new ormStyle();
 
 		// Test getters straight from instantiation
-		$this->assertEquals($sRegularClass, $oStyle->GetStyleClass());
+		// Note: Use of assertTrue instead of assertEquals, otherwise it considers null to be equals to ""
-		$this->assertEquals($sAlternativeClass, $oStyle->GetAltStyleClass());
+		$this->assertTrue($oStyle->$sGetterName() === $expectedAfterInstantiation);
-		$this->assertEquals($sMainColor, $oStyle->GetMainColor());
-		$this->assertEquals($sComplementaryColor, $oStyle->GetComplementaryColor());
-		$this->assertEquals($sDecorationClasses, $oStyle->GetDecorationClasses());
-		$this->assertEquals($sIconRelPath, $oStyle->GetIconAsRelPath());
 
 		// Test that setters don't change passed value
-		$oStyle->SetStyleClass($sRegularClass);
+		$oStyle->$sSetterName($inputValue);
-		$this->assertEquals($sRegularClass, $oStyle->GetStyleClass());
+		// Note: Use of assertTrue instead of assertEquals, otherwise it considers null to be equals to ""
+		$this->assertTrue($oStyle->$sGetterName() === $expectedValueAfterSetter);
+	}
 
-		$oStyle->SetAltStyleClass($sAlternativeClass);
+	public function BaseSetsProvider(): array
-		$this->assertEquals($sAlternativeClass, $oStyle->GetAltStyleClass());
+	{
-
+		return [
-		$oStyle->SetMainColor($sMainColor);
+			'Main color as hexa color' => [
-		$this->assertEquals($sMainColor, $oStyle->GetMainColor());
+				'SetMainColor',
-
+				'GetMainColor',
-		$oStyle->SetComplementaryColor($sComplementaryColor);
+				null,
-		$this->assertEquals($sComplementaryColor, $oStyle->GetComplementaryColor());
+				'#ABCDEF',
-
+				'#ABCDEF',
-		$oStyle->SetDecorationClasses($sDecorationClasses);
+			],
-		$this->assertEquals($sDecorationClasses, $oStyle->GetDecorationClasses());
+			'Main color as empty string' => [
-
+				'SetMainColor',
-		$oStyle->SetIcon($sIconRelPath);
+				'GetMainColor',
-		$this->assertEquals($sIconRelPath, $oStyle->GetIconAsRelPath());
+				null,
+				'',
+				null,
+			],
+			'Main color as null' => [
+				'SetMainColor',
+				'GetMainColor',
+				null,
+				null,
+				null,
+			],
+			'Main color not present' => [
+				'SetMainColor',
+				'HasMainColor',
+				false,
+				null,
+				false,
+			],
+			'Main color present' => [
+				'SetMainColor',
+				'HasMainColor',
+				false,
+				'#ABCDEF',
+				true,
+			],
+			'Complementary color as hexa color' => [
+				'SetComplementaryColor',
+				'GetComplementaryColor',
+				null,
+				'#ABCDEF',
+				'#ABCDEF',
+			],
+			'Complementary color as empty string' => [
+				'SetComplementaryColor',
+				'GetComplementaryColor',
+				null,
+				'',
+				null,
+			],
+			'Complementary color as null' => [
+				'SetComplementaryColor',
+				'GetComplementaryColor',
+				null,
+				null,
+				null,
+			],
+			'Complementary color not present' => [
+				'SetComplementaryColor',
+				'HasComplementaryColor',
+				false,
+				null,
+				false,
+			],
+			'Complementary color present' => [
+				'SetComplementaryColor',
+				'HasComplementaryColor',
+				false,
+				'#ABCDEF',
+				true,
+			],
+			'At least main color present' => [
+				'SetMainColor',
+				'HasAtLeastOneColor',
+				false,
+				'#ABCDEF',
+				true,
+			],
+			'At least complementary color present' => [
+				'SetComplementaryColor',
+				'HasAtLeastOneColor',
+				false,
+				'#ABCDEF',
+				true,
+			],
+			'Style class as CSS class' => [
+				'SetStyleClass',
+				'GetStyleClass',
+				null,
+				'foo-css-class',
+				'foo-css-class',
+			],
+			'Style class as empty string' => [
+				'SetStyleClass',
+				'GetStyleClass',
+				null,
+				'',
+				null,
+			],
+			'Style class as null' => [
+				'SetStyleClass',
+				'GetStyleClass',
+				null,
+				null,
+				null,
+			],
+			'Style class not present' => [
+				'SetStyleClass',
+				'HasComplementaryColor',
+				false,
+				null,
+				false,
+			],
+			'Style class present' => [
+				'SetStyleClass',
+				'HasStyleClass',
+				false,
+				'foo-css-class',
+				true,
+			],
+			'Alt style class as CSS class' => [
+				'SetAltStyleClass',
+				'GetAltStyleClass',
+				null,
+				'foo-css-class',
+				'foo-css-class',
+			],
+			'Alt style class as empty string' => [
+				'SetAltStyleClass',
+				'GetAltStyleClass',
+				null,
+				'',
+				null,
+			],
+			'Alt style class as null' => [
+				'SetAltStyleClass',
+				'GetAltStyleClass',
+				null,
+				null,
+				null,
+			],
+			'Alt style class not present' => [
+				'SetAltStyleClass',
+				'HasAltStyleClass',
+				false,
+				null,
+				false,
+			],
+			'Alt style class present' => [
+				'SetAltStyleClass',
+				'HasAltStyleClass',
+				false,
+				'foo-css-class',
+				true,
+			],
+			'Decoration classes as CSS classes' => [
+				'SetMainColor',
+				'GetMainColor',
+				null,
+				'fas fa-user',
+				'fas fa-user',
+			],
+			'Decoration classes as empty string' => [
+				'SetMainColor',
+				'GetMainColor',
+				null,
+				'',
+				null,
+			],
+			'Decoration classes as null' => [
+				'SetMainColor',
+				'GetMainColor',
+				null,
+				null,
+				null,
+			],
+			'Decoration classes not present' => [
+				'SetDecorationClasses',
+				'HasDecorationClasses',
+				false,
+				null,
+				false,
+			],
+			'Decoration classes present' => [
+				'SetDecorationClasses',
+				'HasDecorationClasses',
+				false,
+				'fas fa-user',
+				true,
+			],
+		];
 	}
 
 	/**
-	 * @param string $sRegularClass
+	 * @param string|null $sRegularClass
-	 * @param string $sAlternativeClass
+	 * @param string|null $sAlternativeClass
 	 * @param string|null $sMainColor
 	 * @param string|null $sComplementaryColor
 	 * @param string|null $sDecorationClasses
 	 * @param string|null $sIconRelPath
 	 *
-	 * @covers ormStyle::GetIconAsAbsUrl
-	 *
-	 * @dataProvider BaseSetsProvider
-	 *
 	 * @throws \Exception
+	 * @covers       ormStyle::GetIconAsAbsUrl
+	 *
+	 * @dataProvider GetIconAsAbsUrlProvider
+	 *
 	 */
-	public function testGetIconAsAbsUrl(string $sRegularClass, string $sAlternativeClass, ?string $sMainColor, ?string $sComplementaryColor, ?string $sDecorationClasses, ?string $sIconRelPath)
+	public function testGetIconAsAbsUrl(?string $sRegularClass, ?string $sAlternativeClass, ?string $sMainColor, ?string $sComplementaryColor, ?string $sDecorationClasses, ?string $sIconRelPath)
 	{
 		$oStyle = new ormStyle($sRegularClass, $sAlternativeClass, $sMainColor, $sComplementaryColor, $sDecorationClasses, $sIconRelPath);
 
@@ -97,7 +276,7 @@ class ormStyleTest extends ItopTestCase
 		$this->assertEquals($sExpectedIconAbsUrl, $oStyle->GetIconAsAbsUrl());
 	}
 
-	public function BaseSetsProvider(): array
+	public function GetIconAsAbsUrlProvider(): array
 	{
 		return [
 			'Complete style with icon from /images folder' => [