image overlap problem

[acarur01]

1. Clear the cache and delete browsing history.

2. Run the following code. We can see the dynamic image is not positioned correctly the first time we load it. It is overlapping the textfield.

NOTE - we can only reproduce within Feature Explorer and not as a standalone.

isc.ClassFactory.defineClass("CwImageItem", "CanvasItem");
 
isc.CwImageItem.addProperties({
    init:function () {
        var canvasProperties = {
                showTitle: this.showTitle,
                src:this.src,
                cwImageID: this.cwImageID,
                width:this.width,
                height:this.height,
                form: this.form,
                autoFit: this.autoFit,
                showRollOver: this.showRollOver,
                showDown: this.showDown,
                //overflow: "visible",
                canFocus: this.canFocus,
                imageType: this.imageType,
                click: this.click,
                cwUserUrl: this.cwUserUrl,
                visibility: this.visibility,
                baseStyle: this.baseStyle,
                auditor: this.auditor,
                prompt: this.prompt,
                hoverStyle: this.hoverStyle,
                hoverWidth: this.hoverWidth,
                $cwname: this.$cwname,
                $cwValidate: this.$cwValidate
            };
       
        if (this.cwSetOverflowVisible)
            canvasProperties.cwOverflowBackup = "visible";
       
        if (this.cwSetOverflowVisible && (this.imageType == null || this.imageType == "normal") && this.src != null) {
            // In Firefox and IE: if "imageType" null or "normal" wait until the image is loaded,
            // and only then set overflow:visible to adjust the image size.
            // Otherwise the image size will not be calculated properly (can be cropped or too big)
            this.canvas = isc.ImgButton.create(canvasProperties);
            try {
                 var imageURL = this.canvas.getImgURL(this.src);
                 var formItem = this;
                 if (window.cwIsCached(imageURL)) {
                   formItem.canvas.setProperty("overflow", "visible");
                 }
                 else {
                     window.cwChacheImage(imageURL, function() {
                         isc.Timer.setTimeout(function () {
                             // check if the item is not hidden: in this case overflow should remain "hidden"
                             if (formItem.visible != false) {
                               formItem.canvas.setProperty("overflow", "visible");
                               formItem.canvas.markForRedraw();
                               formItem.form.markForRedraw();
                             }
                         }, 1);
                     });
                 }
            }
            catch(err) {}
        }
        else {
          if (this.cwSetOverflowVisible)
            canvasProperties.overflow = "visible";
          this.canvas = isc.ImgButton.create(canvasProperties);
        }        return this.Super("init", arguments);
    }
   
});
isc.VStack.create({vPolicy:"fill",hPolicy:"fill", redrawOnResize:true, height:"100%",width:"100%",align:"center",defaultLayoutAlign:"center",members:
    [isc.DynamicForm.create({width:240,numCols:2,colWidths:["90","150"],titleOrientation:"left",margin:0,fields:
        [{title:" ",width:1,height:1,align:"center",showTitle:false,colSpan:"3",_constructor:"CwImageItem",ID:"image1",imageType:"normal",
                                cwSetOverflowVisible:true},
        {title:"<nobr>Username&nbsp;<\/nobr>",width:"*",colSpan:"1",align:"center",required:true,length:25,_constructor:"TextItem"},
        ]})
    ]
});
 
image1.canvas.setProperty("src", "backgrounds/motif.jpg");
isc.FileLoader.cacheFiles("backgrounds/motif.jpg", function(){image1.canvas.adjustForContent(true);}, "image");
image1.canvas.markForRedraw();

[Isomorphic]

This kind of thing (timing for image loading and sizing) needs to be reproduced outside the Feature Explorer, as the special lifecycle of the Feature Explorer can interfere.