Commit 1dcd3bef authored by Simon Gilli's avatar Simon Gilli Committed by Georg Ringer
Browse files

[BUGFIX] Reintroduce DistributionWelcome image

With the change #82000 the DistributionWelcome image was removed by
accident. This patch adds the image again with a proper fallback to the
Distribution image.

Resolves: #95313
Releases: master
Change-Id: I1bfb281af43e80fa83c72e43aff95dc35fb56f7e
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/71187

Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
Tested-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
Tested-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
Reviewed-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
Reviewed-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
parent 68fdc5f1
......@@ -20,13 +20,15 @@
* This is based on W3C custom elements ("web components") specification, see
* https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements
*/
export class DistribuitionImage extends HTMLElement {
export class DistributionImage extends HTMLElement {
private image: string;
private welcomeImage: string;
private fallback: string;
private imageElement: HTMLImageElement;
public connectedCallback(): void {
this.image = this.getAttribute('image') || '' as string;
this.welcomeImage = this.getAttribute('welcomeImage') || '' as string;
this.fallback = this.getAttribute('fallback') || '' as string;
if (!this.image.length && !this.fallback.length) {
......@@ -46,7 +48,10 @@ export class DistribuitionImage extends HTMLElement {
this.imageElement.setAttribute('title', title)
}
if (this.image.length) {
if (this.welcomeImage.length) {
this.imageElement.addEventListener('error', this.onError);
this.imageElement.setAttribute('src', this.welcomeImage);
} else if (this.image.length) {
this.imageElement.addEventListener('error', this.onError);
this.imageElement.setAttribute('src', this.image);
} else {
......@@ -72,10 +77,12 @@ export class DistribuitionImage extends HTMLElement {
}
private onError = () => {
if (this.fallback.length) {
if (this.image.length && this.imageElement.getAttribute('src') === this.welcomeImage) {
this.imageElement.setAttribute('src', this.image);
} else if (this.fallback.length) {
this.imageElement.setAttribute('src', this.fallback);
}
}
}
window.customElements.define('typo3-extensionmanager-distribution-image', DistribuitionImage);
window.customElements.define('typo3-extensionmanager-distribution-image', DistributionImage);
......@@ -161,6 +161,11 @@ class Extension extends AbstractEntity
*/
protected $distributionImage = '';
/**
* @var string
*/
protected $distributionWelcomeImage = '';
/**
* @var string
*/
......@@ -689,19 +694,23 @@ class Extension extends AbstractEntity
return $dependenciesObject;
}
/**
* @param string $distributionImage
*/
public function setDistributionImage(string $distributionImage): void
public function setDistributionImage(string $imageUrl): void
{
$this->distributionImage = $distributionImage;
$this->distributionImage = $imageUrl;
}
/**
* @return string
*/
public function getDistributionImage(): string
{
return $this->distributionImage;
}
public function setDistributionWelcomeImage(string $imageUrl): void
{
$this->distributionWelcomeImage = $imageUrl;
}
public function getDistributionWelcomeImage(): string
{
return $this->distributionWelcomeImage;
}
}
......@@ -78,7 +78,8 @@ class BulkExtensionRepositoryWriter implements \SplObserver
'serialized_dependencies',
'update_comment',
'documentation_link',
'distribution_image'
'distribution_image',
'distribution_welcome_image',
];
/**
......@@ -238,6 +239,7 @@ class BulkExtensionRepositoryWriter implements \SplObserver
$subject->getUploadcomment() ?: '',
$subject->getDocumentationLink() ?: '',
$subject->getDistributionImage() ?: '',
$subject->getDistributionWelcomeImage() ?: '',
];
++$this->sumRecords;
}
......
......@@ -63,6 +63,7 @@ class ExtensionXmlParser implements \SplSubject
protected int $versionDownloadCounter = 0;
protected string $documentationLink = '';
protected string $distributionImage = '';
protected string $distributionWelcomeImage = '';
public function __construct()
{
......@@ -264,6 +265,11 @@ class ExtensionXmlParser implements \SplSubject
$this->distributionImage = $this->elementData;
}
break;
case 'distributionImageWelcome':
if (preg_match('/^https:\/\/extensions\.typo3\.org[a-zA-Z0-9._\/]+DistributionWelcome\.png$/', $this->elementData)) {
$this->distributionWelcomeImage = $this->elementData;
}
break;
}
}
......@@ -277,7 +283,7 @@ class ExtensionXmlParser implements \SplSubject
// Resetting at least class property "version" is mandatory as we need to do some magic in
// regards to an extension's and version's child node "downloadcounter"
$this->version = $this->authorcompany = $this->authorname = $this->authoremail = $this->category = $this->dependencies = $this->state = '';
$this->description = $this->ownerusername = $this->t3xfilemd5 = $this->title = $this->uploadcomment = $this->documentationLink = $this->distributionImage = '';
$this->description = $this->ownerusername = $this->t3xfilemd5 = $this->title = $this->uploadcomment = $this->documentationLink = $this->distributionImage = $this->distributionWelcomeImage = '';
$this->lastuploaddate = $this->reviewstate = $this->versionDownloadCounter = 0;
if ($resetAll) {
$this->extensionKey = '';
......@@ -476,10 +482,18 @@ class ExtensionXmlParser implements \SplSubject
}
/**
* Returns distribution image.
* Returns distribution image url.
*/
public function getDistributionImage(): string
{
return $this->distributionImage;
}
/**
* Returns distribution welcome image url.
*/
public function getDistributionWelcomeImage(): string
{
return $this->distributionWelcomeImage;
}
}
......@@ -142,6 +142,12 @@ return [
'type' => 'input',
],
],
'distribution_welcome_image' => [
'label' => 'LLL:EXT:extensionmanager/Resources/Private/Language/locallang_db.xlf:tx_extensionmanager_domain_model_extension.distribution_welcome_image',
'config' => [
'type' => 'input',
],
],
'remote' => [
'label' => 'LLL:EXT:extensionmanager/Resources/Private/Language/locallang_db.xlf:tx_extensionmanager_domain_model_extension.remote',
'config' => [
......@@ -151,7 +157,7 @@ return [
]
],
'types' => [
'0' => ['showitem' => 'extensionkey, version, integer_version, title, description, state, category, last_updated, update_comment, author_name, author_email, review_state, md5hash, serialized_dependencies, documentation_link, distribution_image']
'0' => ['showitem' => 'extensionkey, version, integer_version, title, description, state, category, last_updated, update_comment, author_name, author_email, review_state, md5hash, serialized_dependencies, documentation_link, distribution_image, distribution_welcome_image']
],
'palettes' => [
'1' => ['showitem' => '']
......
......@@ -54,6 +54,9 @@
<trans-unit id="tx_extensionmanager_domain_model_extension.distribution_image" resname="tx_extensionmanager_domain_model_extension.distribution_image">
<source>Distribution image URL</source>
</trans-unit>
<trans-unit id="tx_extensionmanager_domain_model_extension.distribution_welcome_image" resname="tx_extensionmanager_domain_model_extension.distribution_welcome_image">
<source>Distribution welcome image URL</source>
</trans-unit>
<trans-unit id="tx_extensionmanager_domain_model_extension.remote" resname="tx_extensionmanager_domain_model_extension.remote">
<source>Remote</source>
</trans-unit>
......
......@@ -5,6 +5,7 @@
<div class="distribution-detail">
<div class="distribution-detail-previewpane">
<typo3-extensionmanager-distribution-image
welcomeImage="{extension.distributionWelcomeImage}"
image="{extension.distributionImage}"
fallback="{f:uri.image(src: 'EXT:extensionmanager/Resources/Public/Images/Distribution.svg')}"
alt="{extension.title}"
......
......@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
define(["require","exports"],(function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.DistribuitionImage=void 0;class i extends HTMLElement{constructor(){super(...arguments),this.onError=()=>{this.fallback.length&&this.imageElement.setAttribute("src",this.fallback)}}connectedCallback(){if(this.image=this.getAttribute("image")||"",this.fallback=this.getAttribute("fallback")||"",!this.image.length&&!this.fallback.length)return;this.attachShadow({mode:"open"}),this.imageElement=document.createElement("img");const t=this.getAttribute("alt")||"";t.length&&this.imageElement.setAttribute("alt",t);const e=this.getAttribute("title")||"";e.length&&this.imageElement.setAttribute("title",e),this.image.length?(this.imageElement.addEventListener("error",this.onError),this.imageElement.setAttribute("src",this.image)):this.imageElement.setAttribute("src",this.fallback);const i=document.createElement("style");i.textContent="\n img {\n display: block;\n width: 300px;\n height: auto;\n }\n ",this.shadowRoot.append(this.imageElement,i)}disconnectedCallback(){this.image.length&&null!==this.imageElement&&this.imageElement.removeEventListener("error",this.onError)}}e.DistribuitionImage=i,window.customElements.define("typo3-extensionmanager-distribution-image",i)}));
\ No newline at end of file
define(["require","exports"],(function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.DistributionImage=void 0;class i extends HTMLElement{constructor(){super(...arguments),this.onError=()=>{this.image.length&&this.imageElement.getAttribute("src")===this.welcomeImage?this.imageElement.setAttribute("src",this.image):this.fallback.length&&this.imageElement.setAttribute("src",this.fallback)}}connectedCallback(){if(this.image=this.getAttribute("image")||"",this.welcomeImage=this.getAttribute("welcomeImage")||"",this.fallback=this.getAttribute("fallback")||"",!this.image.length&&!this.fallback.length)return;this.attachShadow({mode:"open"}),this.imageElement=document.createElement("img");const t=this.getAttribute("alt")||"";t.length&&this.imageElement.setAttribute("alt",t);const e=this.getAttribute("title")||"";e.length&&this.imageElement.setAttribute("title",e),this.welcomeImage.length?(this.imageElement.addEventListener("error",this.onError),this.imageElement.setAttribute("src",this.welcomeImage)):this.image.length?(this.imageElement.addEventListener("error",this.onError),this.imageElement.setAttribute("src",this.image)):this.imageElement.setAttribute("src",this.fallback);const i=document.createElement("style");i.textContent="\n img {\n display: block;\n width: 300px;\n height: auto;\n }\n ",this.shadowRoot.append(this.imageElement,i)}disconnectedCallback(){this.image.length&&null!==this.imageElement&&this.imageElement.removeEventListener("error",this.onError)}}e.DistributionImage=i,window.customElements.define("typo3-extensionmanager-distribution-image",i)}));
\ No newline at end of file
......@@ -215,14 +215,30 @@ class ExtensionTest extends UnitTestCase
*/
public function getDistributionImageTest(): void
{
$distributionImage = 'https://example.org/path/to/image.png';
$imageUrl = 'https://example.org/path/to/image.png';
$extension = new Extension();
$extension->setDistributionImage($distributionImage);
$extension->setDistributionImage($imageUrl);
self::assertEquals(
$distributionImage,
$imageUrl,
$extension->getDistributionImage()
);
}
/**
* @test
*/
public function getDistributionWelcomeImageTest(): void
{
$imageUrl = 'https://example.org/path/to/image.png';
$extension = new Extension();
$extension->setDistributionWelcomeImage($imageUrl);
self::assertEquals(
$imageUrl,
$extension->getDistributionWelcomeImage()
);
}
}
......@@ -27,6 +27,7 @@ CREATE TABLE tx_extensionmanager_domain_model_extension (
lastreviewedversion int(3) NOT NULL default '0',
documentation_link varchar(2048),
distribution_image varchar(255),
distribution_welcome_image varchar(255),
KEY index_extrepo (extension_key,remote),
KEY index_versionrepo (integer_version,remote,extension_key),
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment