")[0]
$(main).append(title);
if (settings.useMiniatures) {
scroller = $("
").css("z-index",50)
.css("visibility","hidden")
.css("overflow","hidden")
.css("width",$(".inlineGaleryContainer").width()+"px")[0];
scrollerInner = $("
")
.css("white-space","nowrap")
.css("position", "absolute")
.addClass("scrollerInner")
.css("background","#ececec")[0];
$(scroller).append(scrollerInner)
$(main).append(scroller);
}
if(settings.useNumerator){
var numeratorOuter=$("
").css("position","absolute").addClass("numeratorOuter");
numerator=$("
").addClass("numerator");
numeratorOuter.append(numerator)
$(main).append(numeratorOuter);
}
$(">*", main).css("position", "absolute")
$("#" + settings.id).show()
}
var lastSignedMiniature=-1
this.loadNext = function() {
imgPtr = imgPtr == 1 ? 0 : 1;
$(":nth-child(" + (imgPtr + 1) + ")", imagesContainer).attr("src",
scope.images[imagesQueuePtr][1])
scope.checkArrows()
if (settings.useMiniatures){
if(lastSignedMiniature>-1){
$(":nth-child(" + (lastSignedMiniature + 1) + ")",scrollerInner).css("border-color","#bcbcbc").css("cursor","pointer")
}
lastSignedMiniature=imagesQueuePtr;
$(":nth-child(" + (imagesQueuePtr + 1) + ")",scrollerInner).css("border-color","red").css("cursor","default")
}
}
this.checkArrows = function() {
if (imagesQueuePtr == 0) {
$(arrowPrev).hide()
} else {
$(arrowPrev).fadeIn()
}
if (imagesQueuePtr == this.images.length - 1) {
$(arrowNext).hide()
} else {
$(arrowNext).fadeIn()
}
}
this.onImageLoaded = function(e) {
$(":nth-child(" + ((imgPtr == 0 ? 1 : 0) + 1) + ")", imagesContainer)
.css("z-index", 2)
.fadeOut();
var imSize=[$(e.target)[0].width,$(e.target)[0].height];
var contSize=[$(main).width(),$(main).height()];
var left=Math.round((contSize[0]-imSize[0])/2)+"px";
var top=Math.round((contSize[1]-imSize[1])/2)+"px";
$(":nth-child(" + (imgPtr + 1) + ")", imagesContainer)
.css("z-index", 3)
.css("left",left)
.css("top",top)
.css("display","none")
.fadeIn();
$(title).hide().text(scope.images[imagesQueuePtr][2]).fadeIn();
scope.setupScroller(e);
if(settings.useNumerator){
numerator.text((imagesQueuePtr+1)+"/"+scope.images.length)
}
}
this.onArrowClick = function(e) {
var dir = 0;
if ($(e.target).hasClass("arrowPrev")) {
dir--;
} else if ($(e.target).hasClass("arrowNext")) {
dir++;
}
imagesQueuePtr += dir
if (imagesQueuePtr < 0) {
imagesQueuePtr = scope.images.length - 1
} else if (imagesQueuePtr == scope.images.length) {
imagesQueuePtr = 0
}
scope.loadNext()
}
this.initializeScroller = function() {
$(scroller).mousemove(scope.onScrollerMouseMove).mouseover(scope.onScrollerOver).mouseout(scope.onScrollerOut);
$(this.images).each(
function(i) {
var img = $("
![]()
")
.css("cursor","pointer")
.css("margin-top",settings.miniaturesSpace+"px")
.css("margin-bottom",settings.miniaturesSpace+"px")
.css("margin-right",(i==(scope.images.length-1)?0:settings.miniaturesSpace)+"px")
.css("border",settings.miniaturesBorder+"px solid #bcbcbc")
.attr("data-index",i)
.load(scope.onMiniatureLoaded)
.bind("click",i,scope.onMiniatureClick)
.mouseover(function(){
if($(this).attr("data-index")!=imagesQueuePtr){
$(this).css("border-color","#6a6a6a")
}
})
.mouseout(function(){
if($(this).attr("data-index")!=imagesQueuePtr){
$(this).css("border-color","#bcbcbc")
}
});
img.attr("src", scope.images[i][0]);
$(scrollerInner).append(img);
})
}
this.onMiniatureClick = function(e) {
if($(e.target).attr("data-index")!=imagesQueuePtr){
imagesQueuePtr=e.data
scope.loadNext();
}
}
this.animateMiniatureSelect=function(){
}
this.onMiniatureLoaded = function(e) {
scope.setupScroller(e);
}
var scrollerSetupCan = {}
this.setupScroller = function(e) {// console.log(e.target)
// $(e.target).unbind("load")
var who;
if ($(e.target).attr("class") == 'centerImage') {
who = "image";
} else {
who = "miniature";
}
if (who == "miniature") {
//Does are all properties set? IE7-8 not know on first loading
if(scrollerSetupCan.miniatureLoaded && scrollerSetupCan.miniatureHeight && scrollerSetupCan.miniatureWidth){
return
}
scrollerSetupCan.miniatureLoaded = true
scrollerSetupCan.miniatureHeight = $(e.target)[0].height;
scrollerSetupCan.miniatureWidth = $(e.target)[0].width;
}
if (who == "image") {
if(scrollerSetupCan.imageLoaded){
return
}
scrollerSetupCan.imageLoaded = true
}
if (scrollerSetupCan.miniatureLoaded && scrollerSetupCan.imageLoaded) {
// console.log(scrollerSetupCan.miniatureHeight)
scrollerSetupCan.yTop = $(".inlineGaleryContainer").height() - scrollerSetupCan.miniatureHeight-2*settings.miniaturesSpace-2*settings.miniaturesBorder;
var showHeight=settings.miniaturesSpace
scrollerSetupCan.yBottom = $(".inlineGaleryContainer").height() - showHeight;
scrollerSetupCan.innerWidth=scrollerSetupCan.miniatureWidth*scope.images.length+settings.miniaturesSpace*(scope.images.length-1)+2*settings.miniaturesBorder*scope.images.length;
//scrollerSetupCan.innerWidth=Math.max(scrollerSetupCan.innerWidth,$(".inlineGaleryContainer").width());
if(scrollerSetupCan.innerWidth<$("#" + settings.id+" .inlineGaleryContainer").width()){
$("#" + settings.id+" .scrollerInner").width($("#" + settings.id+" .inlineGaleryContainer").width())
}
scrollerSetupCan.width=$(".inlineGaleryContainer").width();
scrollerSetupCan.heightTop=scrollerSetupCan.miniatureHeight+2*settings.miniaturesSpace+2*settings.miniaturesBorder
scrollerSetupCan.heightBottom=showHeight
$(scroller).css("top", scrollerSetupCan.yTop + "px").height(scrollerSetupCan.miniatureHeight+2*settings.miniaturesSpace+2*settings.miniaturesBorder)
$(scroller).css("visibility","visible").css("display","none").fadeIn()
//scope.controlTimer("start")
// scope.onScrollerOver()
}
}
/**
* Pokaż
*/
this.onScrollerOver = function() {
$(scroller).stop().animate({"top": scrollerSetupCan.yTop,"height":scrollerSetupCan.heightTop});
//$(scroller).css("top",scrollerSetupCan.yTop)
scope.controlTimer("stop");
scrollerSetupCan.inside = true;
}
this.onScrollerOut = function() {
scope.controlTimer("start");
scrollerSetupCan.inside = false;
}
var timerId;
this.controlTimer=function(action){
switch(action){
case "start":
timerId=setTimeout(scope.onTimerComplete,500);
break;
case "stop":
clearTimeout(timerId);
break;
}
}
this.onTimerComplete=function(){
clearTimeout(timerId);
//$(scroller).css("top",scrollerSetupCan.yBottom)
$(scroller).stop().animate({"top": scrollerSetupCan.yBottom,"height":scrollerSetupCan.heightBottom})
}
this.onScrollerMouseMove = function(e) {
if (!scrollerSetupCan.inside) {
return;
}
// console.log(e.target); image
var xOffset=$(imagesContainer).offset().left;
var mouseX = e.pageX-xOffset;// console.log("mouseX "+mouseX);
var rel=mouseX/ scrollerSetupCan.width;// console.log("rel "+rel);
var percentOver=5
rel=-percentOver/100+rel+rel*2*(percentOver/100);
// console.log("rel "+rel);
var maxOffset=scrollerSetupCan.innerWidth - scrollerSetupCan.width
var xDest = -maxOffset * rel;
if(xDest>0){
xDest=0;
}else if(xDest<-maxOffset){
xDest=-maxOffset;
}
// console.log("xDest "+xDest);
var xCur = $(scrollerInner).offset().left-xOffset;
// console.log("xCur "+xCur);
var xDelayed = xCur - (xCur - xDest) / 20;
// console.log("xDelayed "+xDelayed);
// TODO trzeba zrobic na timerze
$(scrollerInner).css("left", xDest + "px");
}
this.init = function() {
this.buildCollection()
this.createLayout()
settings.useMiniatures && this.initializeScroller()
this.loadNext()
}
this.init();
}