Ext.namespace('Kwc.Abstract.Image');
Kwc.Abstract.Image.CropWindow = Ext.extend(Ext.Window, {
    cropData: null,
    imageUrl: '',
    resizable: false,
    title: 'Image Crop Utility',
    width: 660,
    height: 510,
    modal: true,
    preserveRatio: false,

    initComponent: function() {
        this.fbar = {
            xtype: 'toolbar',
            items: [
                {
                    xtype: 'button',
                    text: 'cancel',
                    itemId: 'cancelButton'
                },
                {
                    xtype: 'button',
                    text: 'save',
                    itemId: 'saveButton'
                }
            ]
        };

        Kwc.Abstract.Image.CropWindow.superclass.initComponent.call(this);

        var imgLoad = new Image();
        imgLoad.onerror = (function() {
            //TODO implement user-error-notification
            //TODO implement mask while loading
        }).bind(this);//TODO change to createDelegate
        imgLoad.onload = (function(){
            this.setSize(imgLoad.width+14, imgLoad.height + 69);
            var cropWidth, cropHeight, cropX = 0, cropY = 0;
            if (this.cropData) {
                cropX = this.cropData.x;
                cropY = this.cropData.y;
                cropWidth = this.cropData.width;
                cropHeight = this.cropData.height;
            } else {
                cropWidth = imgLoad.width;
                cropHeight = imgLoad.height;

                if (this.preserveRatio) {
                    if (cropHeight / this.outHeight > cropWidth / this.outWidth) {
                        // orientate on width
                        cropHeight = this.outHeight * cropWidth / this.outWidth;
                        cropY = (imgLoad.height - cropHeight)/2;
                    } else {
                        // orientate on height
                        cropWidth = this.outWidth * cropHeight / this.outHeight;
                        cropX = (imgLoad.width - cropWidth)/2;
                    }
                }
            }

            this.cropData = {
                x: cropX,
                y: cropY,
                width: cropWidth,
                height: cropHeight
            };
            var crop = new Kwc.Abstract.Image.CropImage({
                src: this.imageUrl,
                preserveRatio: this.preserveRatio,
                width: imgLoad.width,
                height: imgLoad.height,
                cropWidth: cropWidth,
                cropHeight: cropHeight,
                cropX: cropX,
                cropY: cropY
            });

            crop.on('changeCrop', function(foo,x) {
                this.fireEvent('changeCrop', foo, x);
                this.cropData = x;
            }, this);
            this.add(crop);
            this.doLayout();
        }).bind(this);//TODO change to createDelegate
        imgLoad.src = this.imageUrl;
    }
});

Ext.reg('kwc.image.cropwindow', Kwc.Abstract.Image.CropWindow);

@@ -761,24 +761,229 @@
 all(this);%0A%0A
+        var me = this; //Using var me because it's not possible to use scope another way%0A        // tried to capsule imgLoad in Ext.get()-Element and work with on('load', function , scope) but didn't work%0A
         var 
@@ -1160,51 +1160,9 @@
   %7D)
-.bind(this);//TODO change to createDelegate
+;
 %0A   
@@ -1208,20 +1208,18 @@
         
-this
+me
 .setSize
@@ -1336,20 +1336,18 @@
     if (
-this
+me
 .cropDat
@@ -1375,20 +1375,18 @@
 cropX = 
-this
+me
 .cropDat
@@ -1414,20 +1414,18 @@
 cropY = 
-this
+me
 .cropDat
@@ -1457,20 +1457,18 @@
 Width = 
-this
+me
 .cropDat
@@ -1505,20 +1505,18 @@
 eight = 
-this
+me
 .cropDat
@@ -1655,20 +1655,18 @@
     if (
-this
+me
 .preserv
@@ -1704,36 +1704,34 @@
 f (cropHeight / 
-this
+me
 .outHeight %3E cro
@@ -1731,36 +1731,34 @@
 t %3E cropWidth / 
-this
+me
 .outWidth) %7B%0A   
@@ -1837,20 +1837,18 @@
 eight = 
-this
+me
 .outHeig
@@ -1864,20 +1864,18 @@
 Width / 
-this
+me
 .outWidt
@@ -2054,20 +2054,18 @@
 Width = 
-this
+me
 .outWidt
@@ -2081,20 +2081,18 @@
 eight / 
-this
+me
 .outHeig
@@ -2217,36 +2217,34 @@
  %7D%0A%0A            
-this
+me
 .cropData = %7B%0A  
@@ -2456,20 +2456,18 @@
    src: 
-this
+me
 .imageUr
@@ -2500,20 +2500,18 @@
 eRatio: 
-this
+me
 .preserv
@@ -2818,20 +2818,18 @@
         
-this
+me
 .fireEve
@@ -2870,20 +2870,18 @@
         
-this
+me
 .cropDat
@@ -2902,20 +2902,18 @@
      %7D, 
-this
+me
 );%0A     
@@ -2919,20 +2919,18 @@
         
-this
+me
 .add(cro
@@ -2945,20 +2945,18 @@
         
-this
+me
 .doLayou
@@ -2974,51 +2974,9 @@
   %7D)
-.bind(this);//TODO change to createDelegate
+;
 %0A   
@@ -2994,20 +2994,18 @@
 d.src = 
-this
+me
 .imageUr

Use fix in javascript to make crop work in ie8