fix #7281 - fix column resizing for merged cells
[roojs1] / ux / Lightbox.js
index b6b677d..46273de 100644 (file)
@@ -86,7 +86,8 @@ Roo.apply(Roo.ux.Lightbox.prototype,
     
     
     /**
-     * List of images
+     * Array of images Roo.Elements (which should be images)
+     * properties can be 
      */
     imageArray: false,
     
@@ -113,8 +114,8 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         this.resizeSpeed  = Math.min(this.resizeSpeed, 10);
         this.resizeSpeed  = Math.max(this.resizeSpeed, 1);
         
-           this.resizeDuration = this.animate ? ((11 - this.resizeSpeed) * 0.15) : 0;
-           this.overlayDuration = this.animate ? 0.2 : 0;  // shadow fade in/out duration
+       this.resizeDuration = this.animate ? ((11 - this.resizeSpeed) * 0.15) : 0;
+       this.overlayDuration = this.animate ? 0.2 : 0;  // shadow fade in/out duration
 
         // When Lightbox starts it will resize itself from 250 by 250 to the current image dimension.
         // If animations are turned off, it will be hidden as to prevent a flicker of a
@@ -311,7 +312,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
                 position: 'absolute',
                 top: '0px',
                 width: '100%',
-                'z-index': '90'
+                'z-index': '40999'
             }
         });
     },
@@ -356,8 +357,12 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         // stretch overlay to fill page and fade in
         //var arrayPageSize = this.getPageSize();
         
-        this.overlay.setHeight(Roo.lib.Dom.getDocumentHeight()) ;
-        this.overlay.setWidth(Roo.lib.Dom.getDocumentWidth());
+        this.onResize();
+       if (!this.resizer) {
+           this.resizer = Roo.EventManager.onWindowResize(this.onResize, this, true);;
+       }
+        
+       
         this.overlay.fadeIn({
                 endOpacity: this.overlayOpacity, 
                 easing: 'easeOut',
@@ -365,7 +370,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         });
          
         //this.imageArray = [];
-        var imageNum = 0;       
+        var imageNum = -1;       
         
         if (imageLink) {
             imageLink = Roo.get(imageLink);
@@ -376,8 +381,13 @@ Roo.apply(Roo.ux.Lightbox.prototype,
                     imageNum = i;
                 }
             });
+           if (imageNum < 0) {
+               
+               this.imageArray.push(imageLink);
+               imageNum = this.imageArray.length-1;
+           }
         }
-        
+         
         // let's assume the constructor sorts out the list of images..
         /*
         if ((imageLink.rel == 'lightbox')){
@@ -398,13 +408,13 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         // weird.. why / 10?
         
         //var lightboxTop = s.top + (Roo.lib.Dom.getViewHeight() / 10);
-        var lightboxTop = (Roo.lib.Dom.getViewHeight() / 10);
-        var lightboxLeft = s.left
+        var lightboxTop = (Roo.lib.Dom.getViewHeight() / 10) + document.body.scrollTop;
+        var lightboxLeft = s.left;
         this.lightbox.setStyle({ 
             top: lightboxTop + 'px', 
             left: lightboxLeft + 'px' ,
-            zIndex : 1000
-        })
+            zIndex : 41000
+        });
         //console.log("show lightbox");
         this.lightbox.show();
         
@@ -412,6 +422,11 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         this.changeImage(imageNum);
     },
 
+    onResize : function()
+    {
+       this.overlay.setHeight(Roo.lib.Dom.getDocumentHeight()) ;
+        this.overlay.setWidth(Roo.lib.Dom.getDocumentWidth());
+    },
     //
     //  changeImage()
     //  Hide most elements and preload image in preparation for resizing image container.
@@ -423,7 +438,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         // hide elements during transition
         if (this.animate) {
             this.loading.setStyle({
-                zIndex :1200
+                zIndex : 41200
             });
             this.loading.show();
             this.loadinglink.setX( (Roo.lib.Dom.getViewWidth() / 2) - 16);
@@ -444,13 +459,15 @@ Roo.apply(Roo.ux.Lightbox.prototype,
 
         imgPreloader.on('load', function() {
             
-            this.lightboximage.dom.src = this.imageArray[this.activeImage].href || 
+            this.lightboximage.dom.src = this.imageArray[this.activeImage].srcfull  ||  this.imageArray[this.activeImage].href || 
                 this.imageArray[this.activeImage].dom.href || this.imageArray[this.activeImage].dom.src;
             
-            this.resizeImageContainer(this.imageArray[this.activeImage].dom.lwidth || imgPreloader.getWidth(), this.imageArray[this.activeImage].dom.lheight || imgPreloader.getHeight());
+            this.resizeImageContainer(this.imageArray[this.activeImage].dom.lwidth || imgPreloader.getWidth(),
+                                     this.imageArray[this.activeImage].dom.lheight || imgPreloader.getHeight());
             imgPreloader.remove();
         }, this);
-        imgPreloader.dom.src = this.imageArray[this.activeImage].href || 
+       Roo.log(this.imageArray[this.activeImage]);
+        imgPreloader.dom.src = this.imageArray[this.activeImage].srcfull || this.imageArray[this.activeImage].href || 
             this.imageArray[this.activeImage].dom.href ||  this.imageArray[this.activeImage].dom.src;
     },
 
@@ -482,8 +499,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         
         var widthNew  =  imgWidth  + bs;
         var heightNew =  imgHeight + bs;
-        Roo.log(widthNew);
-        Roo.log(ww);
+        
         if (widthNew > ww || heightNew > wh) {
             // bigger than window.
             // scale here... - bit nasty..
@@ -516,7 +532,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
             'easeOut', // easing
             'run' // effect
         
-        )        
+        );  
        
         
         // if new and old image are same size and no scaling transition is necessary, 
@@ -524,7 +540,9 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         var timeout = 0;
         if ((hDiff == 0) && (wDiff == 0)){
             timeout = 100;
-            if (Roo.isIE) timeout = 250;   
+            if (Roo.isIE) {
+               timeout = 250;
+           }
         }
 
         (function(){
@@ -572,7 +590,7 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         // if image is part of set display 'Image x of x' 
         if (this.imageArray.length > 1){
             this.numberdisplay.update(
-                this.labelImage + ' ' + (this.activeImage + 1) + ' ' + this.labelOf + '  ' + this.imageArray.length)
+                this.labelImage + ' ' + (this.activeImage + 1) + ' ' + this.labelOf + '  ' + this.imageArray.length);
             this.numberdisplay.show();
         }
         var _this = this;
@@ -601,10 +619,14 @@ Roo.apply(Roo.ux.Lightbox.prototype,
         this.hovernav.show();               
 
         // if not first image in set, display prev image button
-        if (this.activeImage > 0) this.prevlink.show();
+        if (this.activeImage > 0) {
+           this.prevlink.show();
+       }
 
         // if not last image in set, display next image button
-        if (this.activeImage < (this.imageArray.length - 1)) this.nextlink.show();
+        if (this.activeImage < (this.imageArray.length - 1)) {
+           this.nextlink.show();
+       }
         
         this.enableKeyboardNav();
     },