Hello,
I've had a bit of time and implemented "something akin to a bead" 😝. In the end
I have called it AlternativeImageBead
As you see?
package xxx.html.beads {
import org.apache.royale.core.IBead;
import org.apache.royale.core.IStrand;
import org.apache.royale.events.Event;
COMPILE::JS {
import org.apache.royale.core.WrappedHTMLElement;
}
import org.apache.royale.core.IRenderedObject;
public class AlternativeImageBead implements IBead {
protected var _strand:IStrand;
public function AlternativeImageBead() {
}
/**
* @copy org.apache.royale.core.IBead#strand
*
* @langversion 3.0
* @playerversion Flash 10.2
* @playerversion AIR 2.6
* @productversion Royale 0.9.8
*/
public function set strand(value:IStrand):void {
_strand = value;
COMPILE::JS {
(_strand as IRenderedObject).element.addEventListener('error',
errorHandler);
}
}
private var _altSrc:String;
public function get altSrc():String {
return _altSrc;
}
public function set altSrc(value:String):void {
_altSrc = value;
}
COMPILE::JS
private function errorHandler(event:Event):void {
var imgEle:HTMLImageElement = hostElement as HTMLImageElement;
if (imgEle.src != _altSrc)
{
imgEle.src = _altSrc;
}
}
COMPILE::JS
protected function get hostElement():WrappedHTMLElement
{
return (_strand as IRenderedObject).element;
}
}
}
What would you change?
Hiedra
De: Yishay Weiss <[email protected]>
Enviado el: miércoles, 17 de junio de 2020 16:54
Para: [email protected]
Asunto: RE: Show an alternate image when the original is not found
Great. If it’s simpler for you, try first to make it work in your application
source, and then if you need help integrating it in the framework, you can ask
for our help here.
From: Maria Jose Esteve<mailto:[email protected]>
Sent: Wednesday, June 17, 2020 5:41 PM
To: [email protected]<mailto:[email protected]>
Subject: RE: Show an alternate image when the original is not found
I will try and tell you. 😝
Thanks to both of you.
Hiedra.
De: Carlos Rovira <[email protected]<mailto:[email protected]>>
Enviado el: miércoles, 17 de junio de 2020 15:48
Para: [email protected]<mailto:[email protected]>
Asunto: Re: Show an alternate image when the original is not found
Hi Maria Jose,
it'd be good to have such bead as Yishay comment. Please try to make it work
and report. If that works add a PR
thanks!
El mié., 17 jun. 2020 a las 14:22, Yishay Weiss
(<[email protected]<mailto:[email protected]>>) escribió:
Looking at your solution I would create a bead for image. Something like (not
tested, needs work):
package {
Class ImageAvatarBead implements IBead {
…
private var _avatarSrc:String;
private var _strand:IStrand;
public function set avatarUrl(value:String):void
{
_avatarUrl = value;
}
public function set strand(value:IStrand):void
{
_strand = value;
(value as IRenderedObject).element.addEventListener(‘error’,
errorHandler);
}
private function errorHandler(event:Event):void
{
If ((_strand as IRenderedObject).element.src != _avatarSrc)
{
(_strand as IRenderedObject).element.src =
_avatarSrc;
}
}
}
If you can make this work create a pull request for Royale that would be great.
Thanks.
From: Maria Jose Esteve<mailto:[email protected]>
Sent: Wednesday, June 17, 2020 2:24 PM
To: [email protected]<mailto:[email protected]>
Subject: Show an alternate image when the original is not found
Hi,
When you have to put an image that may or may not exist, how do you do it so
that it shows an alternative image?
We have not found a way to configure this exception in the jewel image control
and we have solved it with an html injection directly:
<j:Label multiline="true" width="117" height="117"
click="onChangeImage()" visible="{personalModel.avatarImageModel.fileData ==
null}">
<j:html>
<![CDATA[<img style="border-radius: 50%; width: 100%;
height: 100%;" class="jewel image image-roundBorder-body"
onerror="if (this.src != 'assets/avatarD.png') this.src
= 'assets/avatarD.png';"
src="{personalModel.selectedItem.avatar}"/>]]>
</j:html>
</j:Label>
But I don't like this solution very much and if there was another way to do it,
I would prefer to change it.
Any comments will be welcome.
Thank you.
Hiedra.
--
Carlos Rovira
http://about.me/carlosrovira
