take care of showing the "loading" animation, at the right place

[mkgallery.git] / include / show.js

diff --git a/include/show.js b/include/show.js
index 806d3c12604c11fe18a5d833a6d06b29b8e73c18..c333249931cf168e53d31d43dad839eef4b2603f 100644 (file)
--- a/include/show.js
+++ b/include/show.js
@@ -72,12 +72,10 @@ var Show = new Class({
 
                this.updatecoords();
                this.prevdisplay = new Element('img').
-                       set('class', 'mainformat').
-                       setProperty('alt', 'Current Image').
-                       setStyle('opacity', 0).
-                       injectInside(this.container.container);
-               this.ondisplay = this.prevdisplay.clone().
-                       injectInside(this.container.container);
+                       setStyle('opacity', 0);
+               this.container.grab(this.prevdisplay);
+               this.ondisplay = this.prevdisplay.clone();
+               this.container.grab(this.ondisplay);
                this.loadingdiv = new Element('div').
                addClass('loading').setStyles({
                        position: 'absolute',
@@ -87,7 +85,8 @@ var Show = new Class({
                        display: 'none',
                        width: this.coords.width,
                        height: this.coords.height,
-               }).injectInside(this.container.container);
+               });
+               this.container.grab(this.loadingdiv);
 
                window.addEvent('resize', this.resizer.bind(this))
        },
@@ -242,18 +241,20 @@ var Show = new Class({
        },
 
        display: function(cachel){
-               var newstyle = this.calcsize(cachel);
-               var newimg = cachel.img.clone();
-               newimg.setStyles(newstyle);
-               newimg.setStyles({
+               var newimg = cachel.img.clone().
+               set('class', 'mainformat').
+               setProperty('alt', 'Current Image').
+               setStyles(this.calcsize(cachel)).
+               setStyles({
                        zIndex: 3,
                        opacity: 0,
                });
-               this.prevdisplay.dispose();
-               this.prevdisplay = this.ondisplay.clone().
-               setStyle('zIndex', 2).injectInside(this.container.container);
-               newimg.replaces(this.ondisplay);
+               this.ondisplay.replaces(this.prevdisplay).
+               setProperty('alt', 'Previous Image').
+               setStyle('zIndex', 2);
+               this.prevdisplay = this.ondisplay;
                this.ondisplay = newimg;
+               this.container.grab(this.ondisplay);
                this.effect();
        },
 
@@ -308,7 +309,11 @@ var Show = new Class({
        },
 
        showloading: function(){
-               this.loadingdiv.setStyle('display', 'block');
+               this.loadingdiv.setStyles({
+                       display: 'block',
+                       width: this.coords.width,
+                       height: this.coords.height,
+               });
        },
 
        hideloading: function(){