????
Your IP : 216.73.216.152
/* ========================================================================
* VC: carousel.js v0.4.5
* Fork Bootstrap: carousel.js v3.0.0
* http://twbs.github.com/bootstrap/javascript.html#carousel
* ========================================================================
* Copyright 2012 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ======================================================================== */
;
(function ( $ ) {
"use strict";
// CAROUSEL CLASS DEFINITION
// =========================
function Carousel( element, options ) {
this.$element = $( element )
this.$indicators = this.$element.find( '.vc_carousel-indicators' )
this.options = options
this.paused =
this.sliding =
this.interval =
this.$active =
this.$items = null
'hover' === this.options.pause && this.$element
.on( 'mouseenter', $.proxy( this.pause, this ) )
.on( 'mouseleave', $.proxy( this.cycle, this ) )
this._build() // new
}
Carousel.DEFAULTS = {
mode: 'horizontal'
, partial: false
, interval: 5000
, pause: 'hover'
, wrap: false
, autoHeight: false
, perView: 1
}
Carousel.prototype.cycle = function ( e ) {
e || (this.paused = false)
this.interval && clearInterval( this.interval )
this.options.interval
&& ! this.paused
&& (this.interval = setInterval( $.proxy( this.next, this ), this.options.interval ))
this.touch_start_position = 0;
return this
}
Carousel.prototype.getActiveIndex = function () {
this.$active = this.$element.find( '.vc_item.vc_active' )
if ( ! this.$active.length ) {
this.$active = this.$element.find( '.vc_item:first' ).addClass( 'vc_active' )
}
this.$items = this.$active.parent().children()
return this.$items.index( this.$active )
}
Carousel.prototype.showHideControl = function ( index ) {
if ( 'undefined' === typeof(index) ) {
var index = this.getActiveIndex()
}
this.$left_control[ 0 === index ? 'hide' : 'show' ]()
this.$right_control[ index === this.items_count - 1 ? 'hide' : 'show' ]()
}
Carousel.prototype.to = function ( pos ) {
var that = this
var activeIndex = this.getActiveIndex()
if ( pos > (this.$items.length - 1) || 0 > pos ) {
return
}
if ( this.sliding ) {
return this.$element.one( 'slid', function () {
that.to( pos )
} )
}
if ( activeIndex == pos ) {
return this.pause().cycle()
}
return this.slide( pos > activeIndex ? 'next' : 'prev', $( this.$items[ pos ] ) )
}
Carousel.prototype.pause = function ( e ) {
e || (this.paused = true)
if ( this.$element.find( '.vc_right.vc_carousel-control, .vc_left.vc_carousel-control' ).length && $.support.transition.end ) {
this.$element.trigger( $.support.transition.end )
this.cycle( true )
}
this.interval = clearInterval( this.interval )
return this
}
Carousel.prototype.next = function () {
if ( this.sliding ) {
return
}
return this.slide( 'next' )
}
Carousel.prototype.prev = function () {
if ( this.sliding ) {
return
}
return this.slide( 'prev' )
}
Carousel.prototype.slide = function ( type, next ) {
var $active = this.$element.find( '.vc_item.vc_active' )
var $next = next || $active[ type ]()
var isCycling = this.interval
var direction = 'next' === type ? 'vc_left' : 'vc_right'
var fallback = 'next' === type ? 'first' : 'last'
var that = this
if ( ! $next.length ) {
if ( ! this.options.wrap ) {
this.returnSwipedSlide()
return
}
$next = this.$element.find( '.vc_item' )[ fallback ]()
}
this.sliding = true
isCycling && this.pause()
var e = $.Event( 'slide.vc.carousel', { relatedTarget: $next[ 0 ], direction: direction } )
if ( $next.hasClass( 'vc_active' ) ) {
return
}
if ( this.$indicators.length ) {
this.$indicators.find( '.vc_active' ).removeClass( 'vc_active' )
this.$indicators.find( '.vc_partial' ).removeClass( 'vc_partial' )
this.$element.one( 'slid', function () {
var index = that.getActiveIndex(),
$nextIndicator = $( that.$indicators.children().slice( index,
that.getActiveIndex() + that.options.perView ) )
$nextIndicator && $nextIndicator.addClass( 'vc_active' )
that.options.partial && $nextIndicator && (index + 1 < that.items_count ? $nextIndicator.last().next().addClass( 'vc_partial' ) : $nextIndicator.first().prev().addClass( 'vc_partial' ))
! that.options.wrap && that.showHideControl( index )
} )
}
this.current_index = $next.index()
if ( this.current_index > this.items_count ) {
this.current_index = 0
} else if ( 0 > this.current_index ) {
this.current_index = this.items_count - 1
}
if ( this.options.autoHeight ) {
this.current_pos_value = - 1 * this._step * this.current_index
} else {
this.current_pos_value = - 1 * $next.position()[ this.animation_position ]
}
if ( this.options.partial && this.current_index >= this.items_count - 1 ) {
this.current_pos_value += this._step * (1 - this.partial_part)
}
if ( $.support.transition && this.$element.hasClass( 'vc_slide' ) ) {
this.$element.trigger( e )
if ( e.isDefaultPrevented() ) {
return
}
this.$slideline_inner
.addClass( 'vc_transition' )
.css( this.animation_position, this.current_pos_value + that.pos_units )
if ( ! this.options.autoHeight ) {
this.recalculateSlidelineHeight( $next.height(), true )
}
this.$slideline_inner.one( $.support.transition.end, function () {
$next.addClass( 'vc_active' )
$active.removeClass( 'vc_active' )
that.$slideline_inner.removeClass( [
type,
'vc_transition'
].join( ' ' ) )
that.sliding = false
that.removeSwipeAnimationSpeed()
setTimeout( function () {
that.$element.trigger( 'slid' )
}, 0 )
} ).emulateTransitionEnd( this.transition_speed )
} else {
this.$element.trigger( e )
if ( e.isDefaultPrevented() ) {
return
}
$active.removeClass( 'vc_active' )
$next.addClass( 'vc_active' )
this.sliding = false
this.$slideline_inner.css( this.animation_position, this.current_pos_value + that.pos_units )
}
isCycling && this.cycle()
return this
}
Carousel.prototype.setSwipeAnimationSpeed = function () {
this.$slideline_inner.addClass( 'vc_swipe-transition' )
}
Carousel.prototype.removeSwipeAnimationSpeed = function () {
this.$slideline_inner.removeClass( 'vc_swipe-transition' )
}
/**
* Velocity
* @param {Number} delta_time
* @param {Number} delta_x
* @param {Number} delta_y
* @returns {Object} velocity
*/
Carousel.prototype.velocity = function ( time, x ) {
return {
x: Math.abs( x / time ) || 0
}
}
Carousel.prototype.recalculateSlidelineHeight = function ( height, animate ) {
if ( true === animate ) {
this.$slideline.animate( { height: height } )
} else {
this.$slideline.height( height )
}
}
/**
* Change layout size after resizing of window.
*/
Carousel.prototype.resizeAction = function () {
var max_height = 0,
new_slideline_height = 0
if ( 'horizontal' === this.options.mode ) {
this.el_effect_size = this.$element.width() * ( this.options.partial ? this.partial_part : 1 )
this.$slideline.width( this.items_count * this.el_effect_size )
}
if ( this.options.autoHeight ) {
this.$items.height( 'auto' )
this.$items.each( function () {
var item_height = $( this ).height()
if ( item_height > max_height ) {
max_height = item_height
}
} )
this.$items.height( max_height )
} else {
this.recalculateSlidelineHeight( this.$active.height() )
}
if ( 'vertical' === this.options.mode ) {
this._step = this.$active.height()
new_slideline_height = this.$active.height() * this.options.perView * (this.options.partial ? (1 + 1 - this.partial_part) : 1)
this.recalculateSlidelineHeight( new_slideline_height, false )
this.$slideline_inner.css( { top: - 1 * this.$active.position().top } )
this.el_effect_size = this._step
}
}
Carousel.prototype.returnSwipedSlide = function () {
var params = {}
params[ this.animation_position ] = this.current_pos_value + this.pos_units
this.$slideline_inner.animate( params )
}
Carousel.prototype._build = function () {
var el = this.$element.get( 0 ),
_touch_start_position = false,
_touch_start_time = 0,
_pos_before_touch = 0,
_diff = 0,
_moved = false,
that = this,
mode = this.options.mode
this.getActiveIndex()
this.el_width = 0
this.items_count = this.$items.length
this.$slideline = this.$element.find( '.vc_carousel-slideline' )
this.$slideline_inner = this.$slideline.find( '> div' )
this.slideline_inner = this.$slideline_inner.get( 0 )
this.partial_part = 0.8
this._slide_width = 0
this.swipe_velocity = 0.7
this.current_pos_value = 0
this.current_index = 0 // TODO: default start position by options
this.el_effect_size = 0
this.transition_speed = 600
this.$left_control = this.$element.find( '.vc_left.vc_carousel-control' )
this.$right_control = this.$element.find( '.vc_right.vc_carousel-control' )
// Enable autoHeight if partial
if ( this.options.partial ) {
this.options.autoHeight = true
}
// Add Css classes for perView > 1
if ( 1 < this.options.perView ) {
this.$element.addClass( 'vc_per-view-more vc_per-view-' + this.options.perView )
}
if ( 'horizontal' === mode ) {
this.pos_units = '%'
this._step = 100.00 / this.items_count / this.options.perView
this.animation_position = 'left'
this.$items.width( this._step + this.pos_units )
this.touch_direction = 'pageX'
} else {
this.pos_units = 'px'
this.animation_position = 'top'
this.touch_direction = 'pageY'
this.$element.addClass( 'vc_carousel_vertical' )
}
// Hide first control if this.current_index === 0
! that.options.wrap && this.showHideControl()
// Add partial css class if partial
if ( this.options.partial ) {
this.$element.addClass( 'vc_partial' )
}
// Set indicator
if ( this.$indicators.length ) {
var $active_indecators = that.$indicators.children()
.slice( this.current_index, this.current_index + this.options.perView )
.addClass( 'vc_active' )
this.options.partial && $active_indecators.last().next().addClass( 'vc_partial' )
}
$( window ).resize( this.resizeAction.bind( this ) );
this.resizeAction()
el.addEventListener( "touchstart", function ( e ) {
_touch_start_position = parseFloat( e[ that.touch_direction ] )
_touch_start_time = e.timeStamp
_pos_before_touch = that.$slideline_inner.position()[ that.animation_position ]
}.bind( this ), false )
el.addEventListener( 'touchmove', function ( e ) {
_diff = parseFloat( e[ that.touch_direction ] ) - _touch_start_position
_moved = 0 < Math.abs( _diff )
if ( ! _moved ) {
return true
}
e.preventDefault()
that.slideline_inner.style[ that.animation_position ] = (_pos_before_touch + _diff) + 'px'
}, false )
el.addEventListener( 'touchend', function ( e ) {
var time, part, velocity
if ( _moved ) {
time = (e.timeStamp - _touch_start_time) / 1000
part = _diff / that.el_effect_size
velocity = that.velocity( time, part )
if ( (velocity.x > that.swipe_velocity && 0 > part) || part <= - 0.7 ) {
that.setSwipeAnimationSpeed()
that.next()
} else if ( velocity.x > that.swipe_velocity || 0.7 <= part ) {
that.setSwipeAnimationSpeed()
that.prev()
} else {
that.returnSwipedSlide()
}
_moved = false
}
}, false )
this.$element.addClass( 'vc_build' )
return this
}
// CAROUSEL PLUGIN DEFINITION
// ==========================
var old = $.fn.carousel
$.fn.carousel = function ( option, value ) {
return this.each( function () {
var $this = $( this )
var data = $this.data( 'vc.carousel' )
var options = $.extend( {}, Carousel.DEFAULTS, $this.data(), 'object' === typeof(option) && option )
var action = 'string' === typeof(option) ? option : options.slide
if ( ! data ) {
$this.data( 'vc.carousel', (data = new Carousel( this, options )) )
}
if ( 'number' === typeof(option) ) {
data.to( option )
} else if ( action ) {
data[ action ]( value )
} else if ( options.interval ) {
data.pause().cycle()
}
} )
}
$.fn.carousel.Constructor = Carousel
// CAROUSEL NO CONFLICT
// ====================
$.fn.carousel.noConflict = function () {
$.fn.carousel = old
return this
}
// CAROUSEL DATA-API
// =================
$( document ).off( 'click.vc.carousel.data-api' ).on( 'click.vc.carousel.data-api',
'[data-slide], [data-slide-to]',
function ( e ) {
var $this = $( this ), href
var $target = $( $this.attr( 'data-target' ) || (href = $this.attr( 'href' )) && href.replace( /.*(?=#[^\s]+$)/,
'' ) ) //strip for ie7
var options = $.extend( {}, $target.data(), $this.data() )
var slideIndex = $this.attr( 'data-slide-to' )
if ( slideIndex ) {
options.interval = false
}
$target.carousel( options )
if ( slideIndex = $this.attr( 'data-slide-to' ) ) {
$target.data( 'vc.carousel' ).to( slideIndex )
}
e.preventDefault()
} )
$( window ).on( 'load', function () {
$( '[data-ride="vc_carousel"]' ).each( function () {
var $carousel = $( this )
$carousel.carousel( $carousel.data() )
} )
} )
})( window.jQuery );