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 if(isThumb && setSlidesToShow >= $(slick.$slides).length) { 111 $this.addClass('slick-transform-off'); 112 } 113 }); 114 115 if (setInEffect && setOutEffect) { 116 $this.on('init', function(event, slick) { 117 $(slick.$slides).addClass('single-slide'); 118 }); 119 } 120 121 if (pagiHelper) { 122 $this.on('init', function(event, slick) { 123 var $pagination = $this.find('.js-pagination'); 124 125 if (!$pagination.length) return; 126 127 $pagination.append('<span class="u-dots-helper"></span>'); 128 }); 129 } 130 131 if (isThumb) { 132 $('#' + id).on('click', '.slick-slide', function(e) { 133 e.stopPropagation(); 134 135 //Variables 136 var i = $(this).data('slick-index'); 137 138 if ($('#' + id).slick('slickCurrentSlide') !== i) { 139 $('#' + id).slick('slickGoTo', i); 140 } 141 }); 142 } 143 144 $this.on('init', function(event, slider) { 145 var $pagination = $this.find('.js-pagination'); 146 147 if (!$pagination.length) return; 148 149 $($pagination[0].children[0]).addClass('slick-current'); 150 }); 151 152 $this.on('init', function(event, slick) { 153 var slide = $(slick.$slides)[0], 154 animatedElements = $(slide).find('[data-scs-animation-in]'); 155 156 $(animatedElements).each(function() { 157 var animationIn = $(this).data('scs-animation-in'); 158 159 $(this).addClass('animated ' + animationIn).css('opacity', 1); 160 }); 161 }); 162 163 if (numberedPaging) { 164 $this.on('init', function(event, slick) { 165 $(numberedPaging).text('1' + '/' + slick.slideCount); 166 }); 167 } 168 169 $this.slick({ 170 autoplay: setAutoplay ? true : false, 171 autoplaySpeed: setSpeed ? setSpeed : 3000, 172 173 cssEase: setAnimation ? setAnimation : 'ease', 174 easing: setEasing ? setEasing : 'linear', 175 fade: setFade ? true : false, 176 177 infinite: setInfinite ? true : false, 178 initialSlide: setInitialSlide ? setInitialSlide - 1 : 0, 179 slidesToShow: setSlidesToShow ? setSlidesToShow : 1, 180 slidesToScroll: setSlidesToScroll ? setSlidesToScroll : 1, 181 centerMode: setCenterMode ? true : false,
182 variableWidth: setVariableWidth ? true : false, 183 pauseOnHover: setPauseOnHover ? true : false, 184 rows: setSlidesRows ? setSlidesRows : 1, 185 vertical: setVertical ? true : false, 186 verticalSwiping: setVertical ? true : false, 187 rtl: setRtl ? true : false, 188 centerPadding: setCenterPadding ? setCenterPadding : 0, 189 focusOnSelect: setFocusOnSelect ? true : false, 190 lazyLoad: setLazyLoad ? setLazyLoad : false, 191 192 asNavFor: target ? target : false, 193 prevArrow: arrowsClasses ? $prevMarkup : false, 194 nextArrow: arrowsClasses ? $nextMarkup : false, 195 dots: pagiClasses ? true : false, 196 dotsClass: 'js-pagination ' + pagiClasses, 197 adaptiveHeight: !!isAdaptiveHeight, 198 customPaging: function(slider, i) { 199 var title = $(slider.$slides[i]).data('title'); 200 201 if (title && $pagiIcons) { 202 return '<span>' + title + '</span>' + $pagiIcons; 203 } else if ($pagiIcons) { 204 return '<span></span>' + $pagiIcons; 205 } else if (title && setDataTitlePosition) { 206 return '<span>' + title + '</span>'; 207 } else if (title && !setDataTitlePosition) { 208 return '<span></span>' + '<strong class="u-dot-title">' + title + '</strong>'; 209 } else { 210 return '<span></span>'; 211 } 212 }, 213 responsive: setResponsive 214 }); 215 216 $this.on('beforeChange', function(event, slider, currentSlide, nextSlide) { 217 var nxtSlide = $(slider.$slides)[nextSlide], 218 slide = $(slider.$slides)[currentSlide], 219 $pagination = $this.find('.js-pagination'), 220 animatedElements = $(nxtSlide).find('[data-scs-animation-in]'), 221 otherElements = $(slide).find('[data-scs-animation-in]'); 222 223 $(otherElements).each(function() { 224 var animationIn = $(this).data('scs-animation-in'); 225 226 $(this).removeClass('animated ' + animationIn); 227 }); 228 229 $(animatedElements).each(function() { 230 $(this).css('opacity', 0); 231 }); 232 233 if (!$pagination.length) return; 234 235 if (currentSlide > nextSlide) { 236 $($pagination[0].children).removeClass('slick-active-right'); 237 238 $($pagination[0].children[nextSlide]).addClass('slick-active-right'); 239 } else { 240 $($pagination[0].children).removeClass('slick-active-right'); 241 } 242 243 $($pagination[0].children).removeClass('slick-current'); 244 245 setTimeout(function() { 246 $($pagination[0].children[nextSlide]).addClass('slick-current'); 247 }, .25); 248 }); 249 250 if (numberedPaging) { 251 $this.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 252 var i = (nextSlide ? nextSlide : 0) + 1; 253 254 $(numberedPaging).text(i + '/' + slick.slideCount); 255 }); 256 } 257 258 $this.on('afterChange', function(event, slick, currentSlide, nextSlide) { 259 var slide = $(slick.$slides)[currentSlide], 260 animatedElements = $(slide).find('[data-scs-animation-in]'); 261 262 $(animatedElements).each(function() { 263 var animationIn = $(this).data('scs-animation-in'), 264 animationDelay = $(this).data('scs-animation-delay'), 265 animationDuration = $(this).data('scs-animation-duration'); 266 267 console.log(animationDuration); 268 269 $(this).css({ 270 'animation-delay': animationDelay + 'ms', 271 'animation-duration': animationDuration + 'ms' 272 }); 273 274 $(this).addClass('animated ' + animationIn).css('opacity', 1); 275 }); 276 }); 277 278 if (setInEffect && setOutEffect) { 279 $this.on('afterChange', function(event, slick, currentSlide, nextSlide) { 280 $(slick.$slides).removeClass('animated set-position ' + setInEffect + ' ' + setOutEffect); 281 }); 282 283 $this.on('beforeChange', function(event, slick, currentSlide) { 284 $(slick.$slides[currentSlide]).addClass('animated ' + setOutEffect); 285 }); 286 287 $this.on('setPosition', function(event, slick) { 288 $(slick.$slides[slick.currentSlide]).addClass('animated set-position ' + setInEffect); 289 }); 290 } 291 292 //Actions 293 collection = collection.add($this); 294 }); 295 }, 296 297 /** 298 * Implementation of video support. 299 * 300 * @param jQuery carousel 301 * @param String videoSupport 302 * 303 * @return undefined 304 */ 305 videoSupport: function(carousel) { 306 if (!carousel.length) return; 307 308 carousel.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 309 var slideType = $(slick.$slides[currentSlide]).data('slide-type'), 310 player = $(slick.$slides[currentSlide]).find('iframe').get(0), 311 command; 312 313 if (slideType == 'vimeo') { 314 command = { 315 "method": "pause", 316 "value": "true" 317 } 318 } else if (slideType == 'youtube') { 319 command = { 320 "event": "command", 321 "func": "pauseVideo" 322 } 323 } else { 324 return false;
325 } 326 327 if (player != undefined) { 328 player.contentWindow.postMessage(JSON.stringify(command), '*'); 329 } 330 }); 331 }, 332 333 /** 334 * Implementation of text animation. 335 * 336 * @param jQuery carousel 337 * @param String textAnimationSelector 338 * 339 * @requires charming.js, anime.js, textfx.js 340 * 341 * @return undefined 342 */ 343 initTextAnimation: function(carousel, textAnimationSelector) { 344 if (!window.TextFx || !window.anime || !carousel.length) return; 345 346 var $text = carousel.find(textAnimationSelector); 347 348 if (!$text.length) return; 349 350 $text.each(function(i, el) { 351 var $this = $(el); 352 353 if (!$this.data('TextFx')) { 354 $this.data('TextFx', new TextFx($this.get(0))); 355 } 356 }); 357 358 359 carousel.on('beforeChange', function(event, slick, currentSlide, nextSlide) { 360 var targets = slick.$slider 361 .find('.slick-track') 362 .children(); 363 364 var currentTarget = targets.eq(currentSlide), 365 nextTarget = targets.eq(nextSlide); 366 367 currentTarget = currentTarget.find(textAnimationSelector); 368 nextTarget = nextTarget.find(textAnimationSelector); 369 370 if (currentTarget.length) { 371 currentTarget.data('TextFx').hide(currentTarget.data('effect') ? currentTarget.data('effect') : 'fx1'); 372 } 373 374 if (nextTarget.length) { 375 nextTarget.data('TextFx').show(nextTarget.data('effect') ? nextTarget.data('effect') : 'fx1'); 376 } 377 }); 378 } 379 } 380})(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.