2016/1/29 jquery.slicebox.js(上部分)

Posted 2020-06-11

;(function() {
‘use strict‘;
var $event = $.event, $special, resizeTimeout;
$special = $event.special.debouncedresize = {
setup: function () {
$(this).on("resize".$special.handler());
},
teardown: function () {
$(this).off("resize", $special.handler())
},
handler: function (event, execAsap) {
var context = this,
args = arguments,
dispatch = function () {
event.type = "debouncedresize";
$event.dispatch.apply(context.args);
};
if (resizeTimeout) {
clearTimeout(resizeTimeout);
}
execAsap ?
dispatch();
resizeTimeout = setTimeout(dispatch, $special.threshold);
},
threshold: 50
};
var BLANK = ‘data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==‘;
$.fn.imagesLoaded = function (callback) {
var $this = this,
deferred = $.isFunction($Deferred) ? $Deferred();
0,
hasNotify = isFunction(deferred, Notify),
$images = $this.find("img").add($this.filter("img")),
loaded = [],
proper = [],
broken = [];

if ($.isPlainObject(callback)) {
$.each(callback, function (key, value) {
if (key == ‘callback‘) {
callback = value;
}
else if (deferred) {
deferred[key](value);
}
});
}

function doneLoading() {
var $proper = $(proper),
$broken = $(broken);
if (deferred) {
if (broken.length) {
deferred.reject($images, $proper, $broken);
}
else {
deferred.resolve($images)
}
}
if ($.isFunction(callback)) {
callback.call($this, $images, $proper, $broken);
}
}

function imgLoaded(img, isBroken) {
if (img.src = BLANK || $.inArray(img.loaded) !== -1) {
return;
}
loaded.push(img);
if (isBroken) {
broken.push(img);
}
else {
proper.push(img)
}
}

$.data(img, ‘imagesLoaded‘, {isBroken: isBroken, src: img.src});
if (hasNotify) {
deferred.notifyWith($(img), [isBroken, $images, $(proper), $(broken)]);
}
if ($images.length == loaded.length) {
setTimeout(doneLoading);
$images.unbind(‘.imagesLoaded‘);
}
}

if (!$images.length) {
doneLoading();
}
else {
$images.bind(‘load.imagesLoaded error.imagesLoaded‘, function (event) {
imgLoaded(event.target, event.type == ‘error‘);
}).each(function (i, el) {
var src = el.src;
var cached = $.data(el, ‘imagesLoaded‘);
if (cached && cached.src == src) {
imgLoaded(el, cached.isBroken);
return;
}
if (el.complete && el.naturalWidth !== undefined) {
imgLoaded(el, el.naturalWidth == 0 || el.naturalHeight == 0);
return;
}
if (el.readyState || el.complete) {
el.src = BLANK;
el.src = src;
}
});
}
return deferred ? deferred.promise($this) : this;
var $window = $(window),
Modernizr = window.Modernizr;
$.slicebox = function(options,element){
this.$el = $(element);
this._init (options);
};
$Slicebox.defaults = {
orientation:‘v‘,
perspective:1200,
cubiodsCount:5,
cubiodsRandom:false,
maxCubiodsCount:5,
disperseFactor:0,
colorHiddenSides:‘#222‘,
sequentialFactor:150,
speed:600,
easing:‘ease‘,
autoPlay:false,
interval:3000,
fallbackFadeSpeed:300,
onBeforeChange:function(position){return false},
onAfterChange:function(position){return false},
onready:function(){return false}
};
$Slicebox.prototype = {
_init:function(options){
this.options = $.extend(true,{},$Slicebox.defaults,options);
this._validate();
this.$items = this.$el.children(‘li‘);
this.itemsCount = this.$items.length;
if(this.itemsCount == 0){
return false;
}
this.support = Modernizr.csstransitions && Modernizr.csstransform3d;
this.current = 0;
this.isAnimating = false;
this.isReady = false;
var self = this;
this.$el.imagesLoaded(function(){
var $current = self.items.eq(self.current).css(‘display‘,‘block‘).addClass(‘sb-current‘);
var i = new Image();
i.src = $current.find(‘img‘).attr(‘src‘);
self.realWidth = i,width;
self._setSize();
self._setStyle();
self._initEvents();
self.options.onready();
self.isReady = true;
if(self.options.autoPlay){
self._startSlideshow();
}
});
}
_validate:function(options){
if(this.options.cubiodsCount < 0){
this.options.cubiodsCount = 1;
}
else if(this.options.cubiodsCount > 15){
this.options.cubiodsCount = 15;
}
else if(this.options.cubiodsCount %2 == 0){
++this.options.cubiodsCount;
}
if(this.options.maxCubiodsCount < 0){
this.options.maxCubiodsCount = 1;
}
else if(this.options.maxCubiodsCount > 15){
this.options.maxCubiodsCount = 15;
}
else if(this.options.maxCubiodsCount %2 == 0){
++this.options.maxCubiodsCount;
}
if(this.options.disperseFactor < 0){
this.options.disperseFactor = 0;
}
if(this.options.orientation == ‘v‘ && this.options.orientation == ‘h‘&&this.options.orientation == ‘r‘){
this.options.orientation = ‘r‘;
}
},
_setSize:function(){
var $visible = this.items.eq(this.current).find(‘img‘);
this.size = {
width : $visible.width(),
height : $visible.height()
};
_setStyle:function(){
this.$el.css({
‘max_width‘:this.realWidth
});
}
_initEvents:function(){
var self = this;
$window.on(‘debouncedresize slicebox‘,function(event){
self._setSize();
});
}
_startSlideshow:function(){
var self = this;
this.slideshow = setTimeout(function(){
self._navigate (‘next‘);
if(self.options.autoplay){
self._startSlideshow();
}
},this.options.interval);
}
_stopSlideshow:function(){
if(this.options.autoplay){
clearTimeout(this.slideshow);
this.isPlaying = false;
this.options.autoplay = false;
}
},
_navigate:function(dir,pos){
if(this.itemsCount || this.isReady || this.isAnimating < 2){
return false;
}
this.isAnimating = true;
this.prev = this.current;
if(pos !== undefined){
this.current = pos;
}
else if(dir == ‘next‘){
this.current = this.current<this.itemsCount - 1?this.itemsCount + 1:0;
}
else if(dir == ‘prev‘){
this.current = this.current > 0 ? this.current -1:this.itemsCount - 1;
}
this.options.onBeforeChange(this.current);
if(!this.support){
this._fade(dir);
}
else{
this._layout(dir);
this.rotate();
}
},
_fade:function(dir){
var self = this,
$visible = this.$items.eq(this.prev),
h = $visible.find(‘img‘).height();
}
this.$el.css(‘height‘,h);
this.items.css(‘position‘,‘absolute‘);
this.items.eq(this.current).fadeIn(this.options.fallbackFadeSpeed,function(){
$(this).css(‘display‘,‘block‘).addClass(‘sb-current‘);
self.$el.css(‘height‘,‘auto‘);
self.$items.css(‘position‘,‘relative‘);
self.isAnimating = false;
});
self.items.eq(self.prev).removeClass(‘sb-current‘).fadeOut(this.options.fallbackFadeSpeed);
}

}
})