1/** 2 * Carousel wrapper. 3 * 4 * @author Htmlstream 5 * @version 1.0 6 * @requires 7 * 8 */ 9; 10(function($) { 11 'use strict'; 12 13 $.HSCore.components.HSCarousel = { 14 /** 15 * 16 * 17 * @var Object _baseConfig 18 */ 19 _baseConfig: { 20 autoplay: false, 21 infinite: true 22 }, 23 24 /** 25 * 26 * 27 * @var jQuery pageCollection 28 */ 29 pageCollection: $(), 30 31 /** 32 * Initialization of Carousel wrapper. 33 * 34 * @param String selector (optional) 35 * @param Object config (optional) 36 * 37 * @return jQuery pageCollection - collection of initialized items. 38 */ 39 init: function(selector, config) { 40 this.collection = selector && $(selector).length ? $(selector) : $(); 41 if (!$(selector).length) return; 42 43 this.config = config && $.isPlainObject(config) ? 44 $.extend({}, this._baseConfig, config) : this._baseConfig; 45 46 this.config.itemSelector = selector; 47 48 this.initCarousel(); 49 50 return this.pageCollection; 51 }, 52 53 initCarousel: function() { 54 //Variables 55 var $self = this, 56 config = $self.config, 57 collection = $self.pageCollection; 58 59 //Actions 60 this.collection.each(function(i, el) { 61 //Variables 62 var $this = $(el), 63 id = $this.attr('id'), 64 65 //Markup elements 66 target = $this.data('nav-for'), 67 isThumb = $this.data('is-thumbs'), 68 arrowsClasses = $this.data('arrows-classes'), 69 arrowLeftClasses = $this.data('arrow-left-classes'), 70 arrowRightClasses = $this.data('arrow-right-classes'), 71 pagiClasses = $this.data('pagi-classes'), 72 pagiHelper = $this.data('pagi-helper'), 73 $pagiIcons = $this.data('pagi-icons'), 74 $prevMarkup = '<div class="js-prev ' + arrowsClasses + ' ' + arrowLeftClasses + '"></div>', 75 $nextMarkup = '<div class="js-next ' + arrowsClasses + ' ' + arrowRightClasses + '"></div>', 76 77 //Setters 78 setSlidesToShow = $this.data('slides-show'), 79 setSlidesToScroll = $this.data('slides-scroll'), 80 setAutoplay = $this.data('autoplay'), 81 setAnimation = $this.data('animation'), 82 setEasing = $this.data('easing'), 83 setFade = $this.data('fade'), 84 setSpeed = $this.data('speed'), 85 setSlidesRows = $this.data('rows'), 86 setCenterMode = $this.data('center-mode'), 87 setCenterPadding = $this.data('center-padding'), 88 setPauseOnHover = $this.data('pause-hover'), 89 setVariableWidth = $this.data('variable-width'), 90 setInitialSlide = $this.data('initial-slide'), 91 setVertical = $this.data('vertical'), 92 setRtl = $this.data('rtl'), 93 setInEffect = $this.data('in-effect'), 94 setOutEffect = $this.data('out-effect'), 95 setInfinite = $this.data('infinite'), 96 setDataTitlePosition = $this.data('title-pos-inside'), 97 setFocusOnSelect = $this.data('focus-on-select'), 98 setLazyLoad = $this.data('lazy-load'), 99 isAdaptiveHeight = $this.data('adaptive-height'), 100 numberedPaging = $this.data('numbered-pagination'), 101 setResponsive = JSON.parse(el.getAttribute('data-responsive')); 102 103 if ($this.find('[data-slide-type]').length) { 104 $self.videoSupport($this); 105 } 106 107 $this.on('init', function(event, slick) { 108 $(slick.$slides).css('height', 'auto'); 109 }); 110 111 if (setInEffect && setOutEffect) { 112 $this.on('init', function(event, slick) { 113 $(slick.$slides).addClass('single-slide'); 114 }); 115 } 116 117 if (pagiHelper) { 118 $this.on('init', function(event, slick) { 119 var $pagination = $this.find('.js-pagination'); 120 121 if (!$pagination.length) return; 122 123 $pagination.append('<span class="u-dots-helper"></span>'); 124 }); 125 } 126 127 if (isThumb) { 128 $('#' + id).on('click', '.slick-slide', function(e) { 129 e.stopPropagation(); 130 131 //Variables 132 var i = $(this).data('slick-index'); 133 134 if ($('#' + id).slick('slickCurrentSlide') !== i) { 135 $('#' + id).slick('slickGoTo', i); 136 } 137 }); 138 } 139 140 $this.on('init', function(event, slider) { 141 var $pagination = $this.find('.js-pagination'); 142 143 if (!$pagination.length) return; 144 145 $($pagination[0].children[0]).addClass('slick-current'); 146 }); 147 148 $this.on('init', function(event, slick) { 149 var slide = $(slick.$slides)[0], 150 animatedElements = $(slide).find('[data-scs-animation-in]'); 151 152 $(animatedElements).each(function() { 153 var animationIn = $(this).data('scs-animation-in'); 154 155 $(this).addClass('animated ' + animationIn).css('opacity', 1); 156 }); 157 }); 158 159 if (numberedPaging) { 160 $this.on('init', function(event, slick) { 161 $(numberedPaging).text('1' + '/' + slick.slideCount); 162 }); 163 } 164 165 $this.slick({ 166 autoplay: setAutoplay ? true : false, 167 autoplaySpeed: setSpeed ? setSpeed : 3000, 168 169 cssEase: setAnimation ? setAnimation : 'ease', 170 easing: setEasing ? setEasing : 'linear', 171 fade: setFade ? true : false, 172 173 infinite: setInfinite ? true : false, 174 initialSlide: setInitialSlide ? setInitialSlide - 1 : 0, 175 slidesToShow: setSlidesToShow ? setSlidesToShow : 1, 176 slidesToScroll: setSlidesToScroll ? setSlidesToScroll : 1, 177 centerMode: setCenterMode ? true : false,
178 variableWidth: setVariableWidth ? true : false, 179 pauseOnHover: setPauseOnHover ? true : false, 180 rows: setSlidesRows ? setSlidesRows : 1, 181 vertical: setVertical ? true : false, 182 verticalSwiping: setVertical ? true : false, 183 rtl: setRtl ? true : false, 184 centerPadding: setCenterPadding ? setCenterPadding : 0, 185 focusOnSelect: setFocusOnSelect ? true : false, 186 lazyLoad: setLazyLoad ? setLazyLoad : false, 187 188 asNavFor: target ? target : false, 189 prevArrow: arrowsClasses ? $prevMarkup : false, 190 nextArrow: arrowsClasses ? $nextMarkup : false, 191 dots: pagiClasses ? true : false, 192 dotsClass: 'js-pagination ' + pagiClasses, 193 adaptiveHeight: !!isAdaptiveHeight, 194 customPaging: function(slider, i) { 195 var title = $(slider.$slides[i]).data('title'); 196 197 if (title && $pagiIcons) { 198 return '<span>' + title + '</span>' + $pagiIcons; 199 } else if ($pagiIcons) { 200 return '<span></span>' + $pagiIcons; 201 } else if (title && setDataTitlePosition) { 202 return '<span>' + title + '</span>'; 203 } else if (title && !setDataTitlePosition) { 204 return '<span></span>' + '<strong class="u-dot-title">' + title + '</strong>'; 205 } else { 206 return '<span></span>'; 207 } 208 }, 209 responsive: setResponsive 210 }); 211 212 $this.on('beforeChange', function(event, slider, currentSlide, nextSlide) { 213 var nxtSlide = $(slider.$slides)[nextSlide], 214 slide = $(slider.$slides)[currentSlide], 215 $pagination = $this.find('.js-pagination'), 216 animatedElements = $(nxtSlide).find('[data-scs-animation-in]'), 217 otherElements = $(slide).find('[data-scs-animation-in]'); 218 219 $(otherElements).each(function() { 220 var animationIn = $(this).data('scs-animation-in'); 221 222 $(this).removeClass('animated ' + animationIn); 223 }); 224 225 $(animatedElements).each(function() { 226 $(this).css('opacity', 0); 227 }); 228 229 if (!$pagination.length) return; 230 231 if (currentSlide > nextSlide) { 232 $($pagination[0].children).removeClass('slick-active-right'); 233 234 $($pagination[0].children[nextSlide]).addClass('slick-active-right'); 235 } else { 236 $($pagination[0].children).removeClass('slick-active-right'); 237 } 238 239 $($pagination[0].children).removeClass('slick-current'); 240 241 setTimeout(function() { 242 $($pagination[0].children[nextSlide]).addClass('slick-current'); 243 }, .25); 244 }); 245 246 if (numberedPaging) { 247 $this.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 248 var i = (nextSlide ? nextSlide : 0) + 1; 249 250 $(numberedPaging).text(i + '/' + slick.slideCount); 251 }); 252 } 253 254 $this.on('afterChange', function(event, slick, currentSlide, nextSlide) { 255 var slide = $(slick.$slides)[currentSlide], 256 animatedElements = $(slide).find('[data-scs-animation-in]'); 257 258 $(animatedElements).each(function() { 259 var animationIn = $(this).data('scs-animation-in'), 260 animationDelay = $(this).data('scs-animation-delay'), 261 animationDuration = $(this).data('scs-animation-duration'); 262 263 console.log(animationDuration); 264 265 $(this).css({ 266 'animation-delay': animationDelay + 'ms', 267 'animation-duration': animationDuration + 'ms' 268 }); 269 270 $(this).addClass('animated ' + animationIn).css('opacity', 1); 271 }); 272 }); 273 274 if (setInEffect && setOutEffect) { 275 $this.on('afterChange', function(event, slick, currentSlide, nextSlide) { 276 $(slick.$slides).removeClass('animated set-position ' + setInEffect + ' ' + setOutEffect); 277 }); 278 279 $this.on('beforeChange', function(event, slick, currentSlide) { 280 $(slick.$slides[currentSlide]).addClass('animated ' + setOutEffect); 281 }); 282 283 $this.on('setPosition', function(event, slick) { 284 $(slick.$slides[slick.currentSlide]).addClass('animated set-position ' + setInEffect); 285 }); 286 } 287 288 //Actions 289 collection = collection.add($this); 290 }); 291 }, 292 293 /** 294 * Implementation of video support. 295 * 296 * @param jQuery carousel 297 * @param String videoSupport 298 * 299 * @return undefined 300 */ 301 videoSupport: function(carousel) { 302 if (!carousel.length) return; 303 304 carousel.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 305 var slideType = $(slick.$slides[currentSlide]).data('slide-type'), 306 player = $(slick.$slides[currentSlide]).find('iframe').get(0), 307 command; 308 309 if (slideType == 'vimeo') { 310 command = { 311 "method": "pause", 312 "value": "true" 313 } 314 } else if (slideType == 'youtube') { 315 command = { 316 "event": "command", 317 "func": "pauseVideo" 318 } 319 } else { 320 return false;
321 } 322 323 if (player != undefined) { 324 player.contentWindow.postMessage(JSON.stringify(command), '*'); 325 } 326 }); 327 }, 328 329 /** 330 * Implementation of text animation. 331 * 332 * @param jQuery carousel 333 * @param String textAnimationSelector 334 * 335 * @requires charming.js, anime.js, textfx.js 336 * 337 * @return undefined 338 */ 339 initTextAnimation: function(carousel, textAnimationSelector) { 340 if (!window.TextFx || !window.anime || !carousel.length) return; 341 342 var $text = carousel.find(textAnimationSelector); 343 344 if (!$text.length) return; 345 346 $text.each(function(i, el) { 347 var $this = $(el); 348 349 if (!$this.data('TextFx')) { 350 $this.data('TextFx', new TextFx($this.get(0))); 351 } 352 }); 353 354 355 carousel.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 356 var targets = slick.$slider 357 .find('.slick-track') 358 .children(); 359 360 var currentTarget = targets.eq(currentSlide), 361 nextTarget = targets.eq(nextSlide); 362 363 currentTarget = currentTarget.find(textAnimationSelector); 364 nextTarget = nextTarget.find(textAnimationSelector); 365 366 if (currentTarget.length) { 367 currentTarget.data('TextFx').hide(currentTarget.data('effect') ? currentTarget.data('effect') : 'fx1'); 368 } 369 370 if (nextTarget.length) { 371 nextTarget.data('TextFx').show(nextTarget.data('effect') ? nextTarget.data('effect') : 'fx1'); 372 } 373 }); 374 } 375 } 376})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.