display: 'none'\r
}).injectInside(this.container);\r
\r
+ /*\r
if($type(images) == 'string' && !this.options.thumbnails){\r
var imageList = [];\r
$$('.'+images).each(function(el){\r
}\r
\r
}else{\r
+ */\r
this.images = images;\r
+ /*\r
}\r
+ */\r
\r
this.loading = new Element('div').addClass(this.options.loadingCls).setStyles({\r
position: 'absolute',\r
this.stopped = true;\r
this.started = false;\r
this.animating = false;\r
+ window.addEvent('resize', this.reshow.bind(this));\r
+ window.addEvent('scroll', this.reshow.bind(this));\r
},\r
\r
load: function(){\r
$clear(this.timer);\r
this.loading.setStyle('display','block');\r
this.image++;\r
- var img = this.images[this.image];\r
+ var i;\r
+ var width;\r
+ var height;\r
+ var img;\r
+ for (i=0;i<this.images[this.image].length;i++) {\r
+ width = this.images[this.image][i][0];\r
+ height = this.images[this.image][i][1];\r
+ img = this.images[this.image][i][2];\r
+ if (width >= this.width || height >= this.height) {\r
+ break;\r
+ }\r
+ }\r
+ /* alert('req1 image '+img); */\r
delete this.imageObj;\r
\r
doLoad = true;\r
this.imagesHolder.getElements('img').each(function(el){\r
- var src = this.images[this.image];\r
+ var src = this.images[this.image][i][2];\r
+ /* alert('req2 image '+src); */\r
if(el.src == src){\r
this.imageObj = el;\r
doLoad = false;\r
if(doLoad){\r
this.add = true;\r
this.imageObj = new Asset.image(img, {onload: this.show.bind(this)});\r
+ this.imageObj.set('width', width).set('height', height);\r
}\r
\r
},\r
\r
+ restyle: function(imgobj){\r
+ var width = imgobj.get('width');\r
+ var height = imgobj.get('height');\r
+ var vfactor = this.width/width;\r
+ var hfactor = this.height/height;\r
+ var factor = 1;\r
+ if (vfactor < factor) { factor = vfactor; }\r
+ if (hfactor < factor) { factor = hfactor; }\r
+ factor *= .95;\r
+ height = Math.round(height * factor);\r
+ width = Math.round(width * factor);\r
+ var topoff = (this.height - height)/2;\r
+ var leftoff = (this.width - width)/2;\r
+ /* alert('dim: '+width+'x'+height+'+'+leftoff+'+'+topoff); */\r
+ imgobj.setStyles({\r
+ position: 'absolute',\r
+ top: topoff,\r
+ left: leftoff,\r
+ width: width,\r
+ height: height,\r
+ });\r
+ },\r
+\r
show: function(add){\r
\r
+ this.restyle(this.imageObj);\r
+ var oimg = this.oldImage.getElement('img');\r
+ if (oimg) {\r
+ this.restyle(oimg);\r
+ }\r
+\r
if(this.add){\r
this.imageObj.injectInside(this.imagesHolder);\r
}\r
var obj = this.imageObj.clone();\r
obj.injectInside(this.newImage);\r
}\r
+\r
this.imageLoaded = this.image;\r
this.loading.setStyle('display','none');\r
- if(this.options.thumbnails){\r
- \r
- if(this.options.backgroundSlider){\r
- var elT = this.thumbnailImages[this.image];\r
- this.bgSlider.move(elT);\r
- this.bgSlider.setStart(elT);\r
- }else{\r
- this.thumbnails.each(function(el,i){\r
- el.removeClass(this.options.thumbnailCls);\r
- if(i == this.image){\r
- el.addClass(this.options.thumbnailCls);\r
- }\r
- },this);\r
- }\r
- }\r
this.effect();\r
},\r
\r
},\r
\r
play: function(num){\r
+ this.position();\r
if(this.stopped){\r
if(num > -1){this.image = num-1};\r
if(this.image < this.images.length){\r
$clear(this.timer);\r
this.stopped = true;\r
},\r
+\r
+ quit: function(){\r
+ this.stop();\r
+ /* does not work */\r
+ var oimg = this.oldImage.getElement('img');\r
+ if (oimg) {\r
+ oimg.dispose();\r
+ delete oimg;\r
+ }\r
+ },\r
\r
next: function(wait){\r
var doNext = true;\r
\r
setup: function(dir){\r
if(dir == 'top'){\r
- this.top = -this.container.getStyle('height').toInt();\r
+ this.top = -this.height;\r
this.left = 0;\r
- this.topOut = this.container.getStyle('height').toInt();\r
+ this.topOut = this.height;\r
this.leftOut = 0;\r
\r
}else if(dir == 'right'){\r
this.top = 0;\r
- this.left = this.container.getStyle('width').toInt();\r
+ this.left = this.width;\r
this.topOut = 0;\r
- this.leftOut = -this.container.getStyle('width').toInt();\r
+ this.leftOut = -this.width;\r
\r
}else if(dir == 'bottom'){\r
- this.top = this.container.getStyle('height').toInt();\r
+ this.top = this.height;\r
this.left = 0;\r
- this.topOut = -this.container.getStyle('height').toInt();\r
+ this.topOut = -this.height;\r
this.leftOut = 0;\r
\r
}else if(dir == 'left'){\r
this.top = 0;\r
- this.left = -this.container.getStyle('width').toInt();\r
+ this.left = -this.width;\r
this.topOut = 0;\r
- this.leftOut = this.container.getStyle('width').toInt();\r
+ this.leftOut = this.width;\r
\r
}else{\r
this.top = 0;\r
\r
resetAnimation: function(){\r
this.animating = false;\r
- }\r
+ },\r
+\r
+ position: function(){\r
+ var myCoords = this.container.getCoordinates();\r
+ this.width = myCoords.width;\r
+ this.height = myCoords.height;\r
+ /*\r
+ this.width = this.container.getStyle('width').toInt();\r
+ this.height = this.container.getStyle('height').toInt();\r
+ */\r
+ /* alert('container dim: '+this.width+'x'+this.height); */\r
+ },\r
+\r
+ reshow: function(){\r
+ this.position();\r
+ this.image--;\r
+ this.load();\r
+ },\r
\r
});\r
slideShow.implement(new Options);\r
projects / mkgallery.git / blobdiff