...
), \r\nwhen option $thumbnailnavigatoroptions.$autocenter set to 0, it should be specified in pixel (like
)");
// }
// }
//});
$jssor$.$csswidth(_slidescontainer, slidescontainerwidth);
$jssor$.$cssheight(_slidescontainer, slidescontainerheight);
var slideitemelmts = [];
$jssor$.$each(items, function (item, index) {
var navigationitem = new navigationitem(item, index);
var navigationitemwrapper = navigationitem.$wrapper;
var columnindex = math.floor(index / _lanes);
var laneindex = index % _lanes;
$jssor$.$cssleft(navigationitemwrapper, (_prototypewidth + _spacingx) * laneindex * (1 - horizontal));
$jssor$.$csstop(navigationitemwrapper, (_prototypeheight + _spacingy) * laneindex * horizontal);
if (!slideitemelmts[columnindex]) {
slideitemelmts[columnindex] = $jssor$.$creatediv();
$jssor$.$appendchild(_slidescontainer, slideitemelmts[columnindex]);
}
$jssor$.$appendchild(slideitemelmts[columnindex], navigationitemwrapper);
_navigationitems.push(navigationitem);
});
var thumbnailslideroptions = $jssor$.$extend({
$hwa: false,
$autoplay: false,
$naviquitdrag: false,
$slidewidth: slidewidth,
$slideheight: slideheight,
$slidespacing: _spacingx * horizontal + _spacingy * (1 - horizontal),
$mindragoffsettoslide: 12,
$slideduration: 200,
$pauseonhover: 1,
$playorientation: _options.$orientation,
$dragorientation: _options.$disabledrag ? 0 : _options.$orientation
}, _options);
_slider = new $jssorslider$(elmt, thumbnailslideroptions);
_initialized = true;
}
//_self.$triggerevent($jssornavigatorevents$.$reset);
};
//jssorthumbnailnavigator constructor
{
_self.$options = _options = $jssor$.$extend({
$spacingx: 3,
$spacingy: 3,
$displaypieces: 1,
$orientation: 1,
$autocenter: 3,
$actionmode: 1
}, options);
//sodo statement for development time intellisence only
$jssordebug$.$execute(function () {
_options = $jssor$.$extend({
$lanes: undefined,
$width: undefined,
$height: undefined
}, _options);
});
_width = $jssor$.$csswidth(elmt);
_height = $jssor$.$cssheight(elmt);
$jssordebug$.$execute(function () {
if (!_width)
$jssordebug$.$fail("width of 'thumbnavigator' container not specified.");
if (!_height)
$jssordebug$.$fail("height of 'thumbnavigator' container not specified.");
});
_slidescontainer = $jssor$.$findchild(elmt, "slides", true);
_thumbnailprototype = $jssor$.$findchild(_slidescontainer, "prototype");
$jssordebug$.$execute(function () {
if (!_thumbnailprototype)
$jssordebug$.$fail("prototype of 'thumbnavigator' not defined.");
});
_prototypewidth = $jssor$.$csswidth(_thumbnailprototype);
_prototypeheight = $jssor$.$cssheight(_thumbnailprototype);
$jssor$.$removechild(_slidescontainer, _thumbnailprototype);
_lanes = _options.$lanes || 1;
_spacingx = _options.$spacingx;
_spacingy = _options.$spacingy;
_displaypieces = _options.$displaypieces;
}
};
//$jssorcaptionsliderbase$
function $jssorcaptionsliderbase$() {
$jssoranimator$.call(this, 0, 0);
this.$revert = $jssor$.$emptyfunction;
}
var $jssorcaptionslider$ = window.$jssorcaptionslider$ = function (container, captionslideoptions, playin) {
$jssordebug$.$execute(function () {
if (!captionslideoptions.$captiontransitions) {
$jssordebug$.$error("'$captionslideroptions' option error, '$captionslideroptions.$captiontransitions' not specified.");
}
//else if (!$jssor$.$isarray(captionslideoptions.$captiontransitions)) {
// $jssordebug$.$error("'$captionslideroptions' option error, '$captionslideroptions.$captiontransitions' is not an array.");
//}
});
var _self = this;
var _immediateoutcaptionhanger;
var _playmode = playin ? captionslideoptions.$playinmode : captionslideoptions.$playoutmode;
var _captiontransitions = captionslideoptions.$captiontransitions;
var _captiontuningfetcher = { $transition: "t", $delay: "d", $duration: "du", x: "x", y: "y", $rotate: "r", $zoom: "z", $opacity: "f", $begintime: "b" };
var _captiontuningtransfer = {
$default: function (value, tuningvalue) {
if (!isnan(tuningvalue.$value))
value = tuningvalue.$value;
else
value *= tuningvalue.$percent;
return value;
},
$opacity: function (value, tuningvalue) {
return this.$default(value - 1, tuningvalue);
}
};
_captiontuningtransfer.$zoom = _captiontuningtransfer.$opacity;
$jssoranimator$.call(_self, 0, 0);
function getcaptionitems(element, level) {
var itemstoplay = [];
var lasttransitionname;
var namedtransitions = [];
var namedtransitionorders = [];
//$jssordebug$.$execute(function () {
// var debuginfoelement = $jssor$.$getelement("debuginfo");
// if (debuginfoelement && playin) {
// var text = $jssor.$innerhtml(debuginfoelement) + "
";
// $jssor$.$innerhtml(debuginfoelement, text);
// }
//});
function fetchrawtransition(captionelmt, index) {
var rawtransition = {};
$jssor$.$each(_captiontuningfetcher, function (fetchattribute, fetchproperty) {
var attributevalue = $jssor$.$attributeex(captionelmt, fetchattribute + (index || ""));
if (attributevalue) {
var propertyvalue = {};
if (fetchattribute == "t") {
//if (($jssor$.$isbrowserchrome() || $jssor$.$isbrowsersafari() || $jssor$.$isbrowserfirefox()) && attributevalue == "*") {
// attributevalue = math.floor(math.random() * captionslideoptions.$captiontransitions.length);
// $jssor$.$attribute(captionelmt, fetchattribute + (index || ""), attributevalue);
//}
propertyvalue.$value = attributevalue;
}
else if (attributevalue.indexof("%") + 1)
propertyvalue.$percent = $jssor$.$parsefloat(attributevalue) / 100;
else
propertyvalue.$value = $jssor$.$parsefloat(attributevalue);
rawtransition[fetchproperty] = propertyvalue;
}
});
return rawtransition;
}
function getrandomtransition() {
return _captiontransitions[math.floor(math.random() * _captiontransitions.length)];
}
function evaluatecaptiontransition(transitionname) {
var transition;
if (transitionname == "*") {
transition = getrandomtransition();
}
else if (transitionname) {
//indexed transition allowed, just the same as named transition
var temptransition = _captiontransitions[$jssor$.$parseint(transitionname)] || _captiontransitions[transitionname];
if ($jssor$.$isarray(temptransition)) {
if (transitionname != lasttransitionname) {
lasttransitionname = transitionname;
namedtransitionorders[transitionname] = 0;
namedtransitions[transitionname] = temptransition[math.floor(math.random() * temptransition.length)];
}
else {
namedtransitionorders[transitionname]++;
}
temptransition = namedtransitions[transitionname];
if ($jssor$.$isarray(temptransition)) {
temptransition = temptransition.length && temptransition[namedtransitionorders[transitionname] % temptransition.length];
if ($jssor$.$isarray(temptransition)) {
//got transition from array level 3, random for all captions
temptransition = temptransition[math.floor(math.random() * temptransition.length)];
}
//else {
// //got transition from array level 2, in sequence for all adjacent captions with same name specified
// transition = temptransition;
//}
}
//else {
// //got transition from array level 1, random but same for all adjacent captions with same name specified
// transition = temptransition;
//}
}
//else {
// //got transition directly from a simple transition object
// transition = temptransition;
//}
transition = temptransition;
if ($jssor$.$isstring(transition))
transition = evaluatecaptiontransition(transition);
}
return transition;
}
var captionelmts = $jssor$.$children(element);
$jssor$.$each(captionelmts, function (captionelmt, i) {
var transitionswithtuning = [];
transitionswithtuning.$elmt = captionelmt;
var iscaption = $jssor$.$attributeex(captionelmt, "u") == "caption";
$jssor$.$each(playin ? [0, 3] : [2], function (j, k) {
if (iscaption) {
var transition;
var rawtransition;
if (j != 2 || !$jssor$.$attributeex(captionelmt, "t3")) {
rawtransition = fetchrawtransition(captionelmt, j);
if (j == 2 && !rawtransition.$transition) {
rawtransition.$delay = rawtransition.$delay || { $value: 0 };
rawtransition = $jssor$.$extend(fetchrawtransition(captionelmt, 0), rawtransition);
}
}
if (rawtransition && rawtransition.$transition) {
transition = evaluatecaptiontransition(rawtransition.$transition.$value);
if (transition) {
//var transitionwithtuning = $jssor$.$extend({ $delay: 0, $scalehorizontal: 1, $scalevertical: 1 }, transition);
var transitionwithtuning = $jssor$.$extend({ $delay: 0 }, transition);
$jssor$.$each(rawtransition, function (rawpropertyvalue, propertyname) {
var tuningpropertyvalue = (_captiontuningtransfer[propertyname] || _captiontuningtransfer.$default).apply(_captiontuningtransfer, [transitionwithtuning[propertyname], rawtransition[propertyname]]);
if (!isnan(tuningpropertyvalue))
transitionwithtuning[propertyname] = tuningpropertyvalue;
});
if (!k) {
if (rawtransition.$begintime)
transitionwithtuning.$begintime = rawtransition.$begintime.$value || 0;
else if ((_playmode) & 2)
transitionwithtuning.$begintime = 0;
}
}
}
transitionswithtuning.push(transitionwithtuning);
}
if ((level % 2) && !k) {
//transitionswithtuning.$children = getcaptionitems(captionelmt, lasttransitionname, [].concat(namedtransitions), [].concat(namedtransitionorders), level + 1);
transitionswithtuning.$children = getcaptionitems(captionelmt, level + 1);
}
});
itemstoplay.push(transitionswithtuning);
});
return itemstoplay;
}
function createanimator(item, transition, immediateout) {
var animatoroptions = {
$easing: transition.$easing,
$round: transition.$round,
$during: transition.$during,
$reverse: playin && !immediateout,
$optimize: true
};
$jssordebug$.$execute(function () {
animatoroptions.$captionanimator = true;
});
var captionitem = item;
var captionparent = $jssor$.$parentnode(item);
var captionitemwidth = $jssor$.$csswidth(captionitem);
var captionitemheight = $jssor$.$cssheight(captionitem);
var captionparentwidth = $jssor$.$csswidth(captionparent);
var captionparentheight = $jssor$.$cssheight(captionparent);
var tostyles = {};
var fromstyles = {};
var scaleclip = transition.$scaleclip || 1;
//opacity
if (transition.$opacity) {
tostyles.$opacity = 2 - transition.$opacity;
}
animatoroptions.$originalwidth = captionitemwidth;
animatoroptions.$originalheight = captionitemheight;
//transform
if (transition.$zoom || transition.$rotate) {
tostyles.$zoom = transition.$zoom ? transition.$zoom - 1 : 1;
if ($jssor$.$isbrowserie9earlier() || $jssor$.$isbrowseropera())
tostyles.$zoom = math.min(tostyles.$zoom, 2);
fromstyles.$zoom = 1;
var rotate = transition.$rotate || 0;
tostyles.$rotate = rotate * 360;
fromstyles.$rotate = 0;
}
//clip
else if (transition.$clip) {
var fromstyleclip = { $top: 0, $right: captionitemwidth, $bottom: captionitemheight, $left: 0 };
var tostyleclip = $jssor$.$extend({}, fromstyleclip);
var blockoffset = tostyleclip.$offset = {};
var topbenchmark = transition.$clip & 4;
var bottombenchmark = transition.$clip & 8;
var leftbenchmark = transition.$clip & 1;
var rightbenchmark = transition.$clip & 2;
if (topbenchmark && bottombenchmark) {
blockoffset.$top = captionitemheight / 2 * scaleclip;
blockoffset.$bottom = -blockoffset.$top;
}
else if (topbenchmark)
blockoffset.$bottom = -captionitemheight * scaleclip;
else if (bottombenchmark)
blockoffset.$top = captionitemheight * scaleclip;
if (leftbenchmark && rightbenchmark) {
blockoffset.$left = captionitemwidth / 2 * scaleclip;
blockoffset.$right = -blockoffset.$left;
}
else if (leftbenchmark)
blockoffset.$right = -captionitemwidth * scaleclip;
else if (rightbenchmark)
blockoffset.$left = captionitemwidth * scaleclip;
animatoroptions.$move = transition.$move;
tostyles.$clip = tostyleclip;
fromstyles.$clip = fromstyleclip;
}
//fly
{
var toleft = 0;
var totop = 0;
if (transition.x)
toleft -= captionparentwidth * transition.x;
if (transition.y)
totop -= captionparentheight * transition.y;
if (toleft || totop || animatoroptions.$move) {
tostyles.$left = toleft + $jssor$.$cssleft(captionitem);
tostyles.$top = totop + $jssor$.$csstop(captionitem);
}
}
//duration
var duration = transition.$duration;
fromstyles = $jssor$.$extend(fromstyles, $jssor$.$getstyles(captionitem, tostyles));
animatoroptions.$setter = $jssor$.$stylesetterex();
return new $jssoranimator$(transition.$delay, duration, animatoroptions, captionitem, fromstyles, tostyles);
}
function createanimators(streamlinelength, captionitems) {
$jssor$.$each(captionitems, function (captionitem, i) {
$jssordebug$.$execute(function () {
if (captionitem.length) {
var top = $jssor$.$csstop(captionitem.$elmt);
var left = $jssor$.$cssleft(captionitem.$elmt);
var width = $jssor$.$csswidth(captionitem.$elmt);
var height = $jssor$.$cssheight(captionitem.$elmt);
var error = null;
if (isnan(top))
error = "style 'top' for caption not specified. please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
else if (isnan(left))
error = "style 'left' not specified. please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
else if (isnan(width))
error = "style 'width' not specified. please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
else if (isnan(height))
error = "style 'height' not specified. please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
if (error)
$jssordebug$.$error("caption " + (i + 1) + " definition error, \r\n" + error + "\r\n" + captionitem.$elmt.outerhtml);
}
});
var animator;
var captionelmt = captionitem.$elmt;
var transition = captionitem[0];
var transition3 = captionitem[1];
if (transition) {
animator = createanimator(captionelmt, transition);
streamlinelength = animator.$locate(transition.$begintime == undefined ? streamlinelength : transition.$begintime, 1);
}
streamlinelength = createanimators(streamlinelength, captionitem.$children);
if (transition3) {
var animator3 = createanimator(captionelmt, transition3, 1);
animator3.$locate(streamlinelength, 1);
_self.$combine(animator3);
_immediateoutcaptionhanger.$combine(animator3);
}
if (animator)
_self.$combine(animator);
});
return streamlinelength;
}
_self.$revert = function () {
_self.$gotoposition(_self.$getposition_outerend() * (playin || 0));
_immediateoutcaptionhanger.$gotobegin();
};
//constructor
{
_immediateoutcaptionhanger = new $jssoranimator$(0, 0);
//var streamlinelength = 0;
//var captionitems = getcaptionitems(container, null, [], [], 1);
createanimators(0, _playmode ? getcaptionitems(container, 1) : []);
}
};
//event table
//$evt_click = 21; function(slideindex[, event])
//$evt_drag_start = 22; function(position[, virtualposition, event])
//$evt_drag_end = 23; function(position, startposition[, virtualposition, virtualstartposition, event])
//$evt_swipe_start = 24; function(position[, virtualposition])
//$evt_swipe_end = 25; function(position[, virtualposition])
//$evt_load_start = 26; function(slideindex)
//$evt_load_end = 27; function(slideindex)
//$evt_position_change = 202; function(position, fromposition[, virtualposition, virtualfromposition])
//$evt_park = 203; function(slideindex, fromindex)
//$evt_progress_change = 208; function(slideindex, progress[, progressbegin, idlebegin, idleend, progressend])
//$evt_state_change = 209; function(slideindex, progress[, progressbegin, idlebegin, idleend, progressend])
//$evt_rollback_start = 210; function(slideindex, progress[, progressbegin, idlebegin, idleend, progressend])
//$evt_rollback_end = 211; function(slideindex, progress[, progressbegin, idlebegin, idleend, progressend])
//$evt_slideshow_start = 206; function(slideindex[, progressbegin, slideshowbegin, slideshowend, progressend])
//$evt_slideshow_end = 207; function(slideindex[, progressbegin, slideshowbegin, slideshowend, progressend])
//http://www./development/reference-api.html