> 2.- About package. the right one for image controls is 
> "org.apache.royale.jewel.beads.controls.image"


I don’t see anything specific to Jewel here, so I think this belongs in Basic.


> On Jun 27, 2020, at 9:36 PM, Carlos Rovira <[email protected]> wrote:
> 
> Hi Maria Jose,
> 
> Thanks for the contribution!. Some points:
> 
> 1.- About the name: In Jewel the we don't suffix it with "Bead", to make 
> names less verbose since is extendin IBead, so we know it is a bead.
> Apart from that I see more descriptive "ErrorImage" or maybe it's just me? 
> Since "AlternativeImage" seems to me a bead that could switch the current 
> imagen with another alternative one, and not specifically one that is a 
> replacement when we get a load error.
> 2.- About package. the right one for image controls is 
> "org.apache.royale.jewel.beads.controls.image"
> 3.- property could be just "src", since the name of the bead class already 
> give context.(so both the image control and the bead will have "src" property 
> what seems to me more coherent for naming.
> 
> Apart from that, if you tried your code and worked you can submit it. As well 
> if you want you can add a TDJ example in the image page and I can prepare an 
> official image for jewel error image placeholder. This last one as you wish, 
> if you don't have time, I can add it myself as I merge your PR
> 
> thanks!
> 
> Carlos
> 
> 
> El vie., 26 jun. 2020 a las 22:05, Maria Jose Esteve (<[email protected] 
> <mailto:[email protected]>>) escribió:
> 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] <mailto:[email protected]>> 
> Enviado el: miércoles, 17 de junio de 2020 16:54
> Para: [email protected] <mailto:[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 <http://about.me/carlosrovira>
>  
> 
>  
> 
> 
> 
> -- 
> Carlos Rovira
> http://about.me/carlosrovira <http://about.me/carlosrovira>
> 

Reply via email to