Visual Console Refactor: fixed the visual console background url

Former-commit-id: b211220f599e14c3e1cb24e7a2840a14f134e395
This commit is contained in:
Alejandro Gallardo Escobar 2019-04-12 09:14:44 +02:00
parent 3928a5a523
commit cbd2b2a50a
2 changed files with 39 additions and 5 deletions

View File

@ -83,11 +83,12 @@ final class Container extends Model
'id' => (int) $data['id'],
'name' => $data['name'],
'groupId' => $this->extractGroupId($data),
'backgroundURL' => $this->extractBackgroundUrl($data),
'backgroundImage' => $this->extractBackgroundImage($data),
'backgroundColor' => $this->extractBackgroundColor($data),
'isFavorite' => $this->extractFavorite($data),
'width' => (int) $data['width'],
'height' => (int) $data['height'],
'backgroundURL' => $this->extractBackgroundUrl($data),
];
}
@ -118,6 +119,24 @@ final class Container extends Model
}
/**
* Extract a image name value.
*
* @param array $data Unknown input data structure.
*
* @return mixed String representing the image name (not empty) or null.
*/
private function extractBackgroundImage(array $data)
{
$backgroundImage = static::notEmptyStringOr(
static::issetInArray($data, ['background', 'backgroundURL']),
null
);
return ($backgroundImage === 'None.png') ? null : $backgroundImage;
}
/**
* Extract a image url value.
*
@ -127,10 +146,21 @@ final class Container extends Model
*/
private function extractBackgroundUrl(array $data)
{
return static::notEmptyStringOr(
static::issetInArray($data, ['background', 'backgroundURL']),
$backgroundUrl = static::notEmptyStringOr(
static::issetInArray($data, ['backgroundURL']),
null
);
if ($backgroundUrl !== null) {
return $backgroundUrl;
}
$backgroundImage = static::extractBackgroundImage($data);
if ($backgroundImage === null) {
return null;
}
return 'images/console/background/'.$backgroundImage;
}

View File

@ -349,7 +349,9 @@ export default class VisualConsole {
public render(prevProps: VisualConsoleProps | null = null): void {
if (prevProps) {
if (prevProps.backgroundURL !== this.props.backgroundURL) {
this.containerRef.style.backgroundImage = this.props.backgroundURL;
this.containerRef.style.backgroundImage = `url(${
this.props.backgroundURL
})`;
}
if (prevProps.backgroundColor !== this.props.backgroundColor) {
this.containerRef.style.backgroundColor = this.props.backgroundColor;
@ -358,7 +360,9 @@ export default class VisualConsole {
this.resizeElement(this.props.width, this.props.height);
}
} else {
this.containerRef.style.backgroundImage = this.props.backgroundURL;
this.containerRef.style.backgroundImage = `url(${
this.props.backgroundURL
})`;
this.containerRef.style.backgroundColor = this.props.backgroundColor;
this.resizeElement(this.props.width, this.props.height);
}