1// if you want stopped slider - write in console ( window.asproStoriesSliderStopped = true ) and then open popup 2 3$(document).on('touchstart', '.front_stories .item', function(e) { 4 window.touchStoriesX = e.originalEvent.changedTouches[0].clientX; 5 window.touchStoriesY = e.originalEvent.changedTouches[0].clientY; 6 setTimeout( 7 function() { 8 window.touchStoriesX = false; 9 window.touchStoriesY = false; 10 } 11 , 300); 12}); 13 14$(document).on('touchend', '.front_stories .item', function(e) { 15 if(window.touchStoriesX == e.originalEvent.changedTouches[0].clientX && window.touchStoriesY == e.originalEvent.changedTouches[0].clientY) { 16 $(this).trigger('click'); 17 } 18}); 19 20document.addEventListener("keydown", function(e){ 21 if (e.keyCode == 27) { 22 $('.stories-popup').click(); 23 } 24}); 25 26$(document).on('click', '.front_stories .item', function() { 27 28 kit.require('collection'); 29 30 if(!window.asproStoriesLoading) { 31 window.asproStoriesLoading = true; 32 var _this = $(this); 33 var storiesPopupWrapper = $('body > .stories-popup'); 34 if(!storiesPopupWrapper.length) { 35 storiesPopupWrapper = $('<div class="stories-popup"></div>'); 36 } 37 38 var ajaxData = { 39 sectionData: _this.data(), 40 sortData: _this.closest('.front_stories').data(), 41 } 42 $.ajax({ 43 url: arAsproOptions.SITE_DIR + 'ajax/storiesInfo.php', 44 data: ajaxData, 45 dataType: 'json', 46 type: 'POST', 47 success: function(result) { 48 if(result && result.error) { 49 console.log('Fail get stories! Reason: '+result.error); 50 } else if(!result || typeof result != 'object') { 51 console.log('Fail get stories! Reason: result is '+result); 52 } else { 53 var html = generateSectionsHtml(result, _this.data()); 54 if(html) { 55 storiesPopupWrapper.html(html); 56 storiesPopupWrapper.addClass('stories-popup--visible'); 57 $('body').append(storiesPopupWrapper); 58 59 afterShowActions(result); 60 } 61 } 62 window.asproStoriesLoading = false; 63 }, 64 error: function(jqXHR, error, errorThrown) { 65 console.log('Fail get stories! Reason: '+errorThrown); 66 window.asproStoriesLoading = false; 67 } 68 }); 69 } 70}); 71 72$(document).on('click', '.stories-popup__close', function() { 73 var _this = $(this); 74 var popup = _this.parents('.stories-popup'); 75 popup.remove(); 76}); 77 78$(document).on('click', '.stories-popup', function(e) { 79 var _this = $(this); 80 var _target = $(e.target); 81 if(_target.hasClass('stories-popup')) { 82 var popup = _this.closest('.stories-popup'); 83 popup.remove(); 84 } 85}); 86 87$(document).on('click', '.front_stories .top_block a', function(e) { 88 e.preventDefault(); 89 $('.front_stories .item').eq(0).trigger('click'); 90}); 91 92function getSliderSectionsHTML(elementsHTML) { 93 var html = ''; 94 var sectionSliderClass = 'stories-popup__section-slider'; 95 var sectionSliderInnerClass = 'stories-popup__section-slider-inner'; 96 97 html += '<div class="'+sectionSliderClass+'">'; 98 html += '<div class="'+sectionSliderClass+'-loader"><svg width="48" height="48" viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg" version="1.1"><path d="M 150,0 a 150,150 0 0,1 106.066,256.066 l -35.355,-35.355 a -100,-100 0 0,0 -70.711,-170.711 z" fill="#0000001a"><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 150 150" to="360 150 150" begin="0s" dur=".8s" fill="freeze" repeatCount="indefinite"></animateTransform></path></svg></div>'; 99 html += '<div class="'+sectionSliderInnerClass+'">'; 100 html += elementsHTML; 101 html += '</div>'; 102 html += '</div>'; 103 104 return html; 105} 106 107function getSliderElementsHTML(elementsHTML, elementsCount, sectionInfo) { 108 var html = ''; 109 var elementSliderClass = 'stories-popup__element-slider' + (sectionInfo.current ? ' stories-popup__element-slider--active' : ' stories-popup__element-slider--paused'); 110 var elementSliderHeaderClass = 'stories-popup__element-slider-header'; 111 var elementSliderHeaderImgClass = 'stories-popup__element-slider-header-img'; 112 var elementSliderHeaderNameClass = 'stories-popup__element-slider-header-name'; 113 var elementSliderElementsWrapperClass = 'stories-popup__element-slider-elements'; 114 115 var animationDefaultTime = 5; 116 117 var topPanelHtml = ''; 118 var topPanelClass = 'stories-popup__element-slider-panel'; 119 var topPanelElementClass = 'stories-popup__element-slider-panel-element'; 120 topPanelHtml += '<div class="'+topPanelClass+'">'; 121 for(var i = 0;i < elementsCount;i++) { 122 topPanelHtml += '<div class="'+topPanelElementClass + (i == 0 ? ' '+topPanelElementClass+'--active' : '')+'"><div class="'+topPanelElementClass+'-line" style="animation-duration: '+animationDefaultTime+'s;"></div></div>'; 123 } 124 topPanelHtml += '</div>'; 125 126 127 html += '<div class="'+elementSliderClass+'" data-section-id="'+sectionInfo.ID+'">'; 128 129 html += '<div class="'+elementSliderElementsWrapperClass+'">'; 130 html += elementsHTML; 131 html += '</div>'; 132 133 html += topPanelHtml; 134 135 html += '<div class="'+elementSliderHeaderClass+'">'; 136 if (sectionInfo.PICTURE) { 137 var url = ''; 138 try { 139 if(sectionInfo.PICTURE){ 140 url = encodeURI(sectionInfo.PICTURE); 141 } 142 } catch (e) { 143 url = ''; 144 } 145 html += '<div class="'+elementSliderHeaderImgClass+'" style="background: url('+url+') no-repeat center;" ></div>'; 146 } 147 html += '<div class="'+elementSliderHeaderNameClass+'">'+sectionInfo.NAME+'</div>'; 148 html += '</div>'; 149 150 html += '</div>'; 151 152 return html; 153} 154
155function generateElementHtml(elementInfo, elementKey) { 156 var html = ''; 157 var elementWrapperClass = 'stories-popup__element' + (elementKey > 0 ? '' : ' stories-popup__element--active'); 158 var elementImgClass = 'stories-popup__element-image'; 159 var elementButtonClass = 'stories-popup__element-btn'; 160 161 var elementSliderElementsNavWrapperClass = 'stories-popup__element-slider-navs', 162 elementSliderElementsNavPrevClass = 'stories-popup__element-slider-navs-prev', 163 elementSliderElementsNavNextClass = 'stories-popup__element-slider-navs-next'; 164 165 html += '<div class="'+elementWrapperClass+'" data-id="'+elementInfo.ID+'">'; 166 var url = ''; 167 try { 168 if(elementInfo.PREVIEW_PICTURE){ 169 url = encodeURI(elementInfo.PREVIEW_PICTURE); 170 } 171 } catch (e) { 172 url = ''; 173 } 174 var imageBgStyle = ''; 175 if(url){ 176 imageBgStyle = 'background: url('+url+') no-repeat center;'; 177 } 178 if(elementInfo?.VIDEO_FILE_SRC){ 179 html += '<div class="'+elementImgClass+'" style="'+imageBgStyle+'" >' + 180 '<video width="200" height="320" autoplay muted loop playsinline ' + 181 'style="background-image: url(/local/templates/aspro_max/images/loaders/preloader.gif);"' + 182 '>\n' + 183 '<source src="' + elementInfo?.VIDEO_FILE_SRC + '" type="' + elementInfo?.VIDEO_FILE_CONTENT_TYPE + '">' + 184 'Тег video не поддеÑживаеÑÑÑ Ð²Ð°Ñим бÑаÑзеÑом.' + 185 '</video>' + 186 '</div>'; 187 } else { 188 html += '<div class="'+elementImgClass+'" style="'+imageBgStyle+'" ></div>'; 189 } 190 if(elementInfo.PROPERTY_BTN_TEXT_VALUE) { 191 var elementButtonTag = elementInfo.PROPERTY_BTN_LINK_VALUE ? 'a' : 'div'; 192 var elementButtonHref = elementInfo.PROPERTY_BTN_LINK_VALUE ? ' href="'+elementInfo.PROPERTY_BTN_LINK_VALUE+'"' : ''; 193 html += '<'+elementButtonTag+elementButtonHref+' class="btn '+elementButtonClass+' '+elementInfo.PROPERTY_BTN_CLASS_VALUE+'" >'+elementInfo.PROPERTY_BTN_TEXT_VALUE+'</'+elementButtonTag+'>'; 194 } 195 196 html += '<div class="'+elementSliderElementsNavWrapperClass+'">'+ 197 '<div class="'+elementSliderElementsNavPrevClass+'"></div>'+ 198 '<div class="'+elementSliderElementsNavNextClass+'"></div>'+ 199 '</div>' 200 201 html += '</div>'; 202 203 return html; 204} 205 206function afterShowActions(sectionInfo) { 207 // initVideoDuration(sectionInfo); 208 sectionsSliderInit(sectionInfo); 209} 210 211function initVideoDuration(sections) { 212 console.log(sections); 213 214 var storiesPopupWrapper = $('body > .stories-popup'); 215 216 function setVideoDuration(sectionJq, elementJq, video, duration, i) { 217 // var panelElementLineJq = sectionJq 218 // .find('.stories-popup__element-slider-panel-element') 219 // .eq(i) 220 // .find('.stories-popup__element-slider-panel-element-line'); 221 // panelElementLineJq.css('animation-duration', '' + duration + 's'); 222 elementJq.attr({ 223 'data-content-type': 'video', 224 'data-index': i, 225 'data-duration': duration, 226 }); 227 console.log(video.duration); 228 } 229 kit.ready('collection', function(){ 230 var sectionCollection = new kit.Collection(sections); 231 sectionCollection.each(function(section){ 232 var sectionId = section.ID; 233 var elements = section?.CHILDS || []; 234 var elementCollection = new kit.Collection(elements); 235 var sectionJq = storiesPopupWrapper.find('.stories-popup__element-slider[data-section-id="' + sectionId + '"]'); 236 if(!sectionJq.length){ 237 return; 238 } 239 var i = -1; 240 elementCollection.each(function(element){ 241 i++; 242 var elementId = element.ID; 243 var contentType = element?.VIDEO_FILE_CONTENT_TYPE || ''; 244 var fileSrc = element?.VIDEO_FILE_SRC || ''; 245 if(!fileSrc && !contentType) { 246 return; 247 } 248 var elementJq = sectionJq.find('.stories-popup__element[data-id="' + elementId + '"]'); 249 if(!elementJq.length){ 250 return; 251 } 252 var videoJq = elementJq.find('video');
253 if(!videoJq.length){ 254 return; 255 } 256 var video = videoJq[0]; 257 if(video.duration){ 258 setVideoDuration(sectionJq, elementJq, video, video.duration, i); 259 return; 260 } 261 video.addEventListener('onloadedmetadata', function(e) { 262 console.log('onloadedmetadata', e); 263 setVideoDuration(sectionJq, elementJq, video, video.duration, i); 264 }); 265 video.addEventListener('loadedmetadata', function(e) { 266 console.log('loadedmetadata', e); 267 setVideoDuration(sectionJq, elementJq, video, video.duration, i); 268 }); 269 console.log(sectionId, elementId, fileSrc); 270 }); 271 }); 272 }); 273 274} 275 276function sectionsSliderInit(sections) { 277 var index = 0; 278 var activeSectionIndex = 0; 279 for (var key in sections) { 280 if (sections[key].current) { 281 activeSectionIndex = index; 282 break; 283 } 284 index++; 285 } 286 var options = { 287 popup: $('.stories-popup'), 288 activeSlideIndex: activeSectionIndex, 289 activeSlideClass: 'stories-popup__element-slider--active', 290 pausedSlideClass: 'stories-popup__element-slider--paused', 291 slidesSelector: '.stories-popup__element-slider', 292 innerSelector: '> .stories-popup__section-slider-inner', 293 activeElementClass: 'stories-popup__element--active', 294 elementsSelector: '.stories-popup__element', 295 elementNavPrevClass: 'stories-popup__element-slider-navs-prev', 296 elementNavNextClass: 'stories-popup__element-slider-navs-next', 297 elementPanelClass: 'stories-popup__element-slider-panel-element', 298 elementPanelActiveClass: 'stories-popup__element-slider-panel-element--active', 299 elementPanelFinishedClass: 'stories-popup__element-slider-panel-element--finishied', 300 changeSlideTime: 5000, 301 transition: 0.25, 302 activeSlideMargin: 8, 303 dragAmount: 150, 304 mobile: false, 305 breakpoints: { 306 '(max-width: 1025px)': { 307 activeSlideMargin: 4, 308 }, 309 '(max-width: 566px)': { 310 mobile: true, 311 }, 312 } 313 }; 314 InitAsproStoriesSectionSlider($('.stories-popup__section-slider'), options); 315} 316 317function generateSectionsHtml(sections, sectionData) { 318 var html = ''; 319 html += getPopupCloseIcon(); 320 321 var elementsHTML = ''; 322 for (var sectionKey in sections) { 323 var section = sections[sectionKey]; 324 if(section.ID == sectionData.sectionId) { 325 section.current = true; 326 } 327 328 elementsHTML += generateElementsHtml(section); 329 } 330 331 html += getSliderSectionsHTML(elementsHTML); 332 333 return html; 334} 335 336function generateElementsHtml(sectionInfo) { 337 var html = ''; 338 var elementsHTML = ''; 339 340 var elements = sectionInfo.CHILDS; 341 342 var elementsHTML = ''; 343 for (var elementKey in elements) { 344 var element = elements[elementKey]; 345 elementsHTML += generateElementHtml(element, elementKey); 346 } 347 348 html += getSliderElementsHTML(elementsHTML, elements.length, sectionInfo); 349 350 return html; 351} 352 353function getPopupCloseIcon() { 354 var iconClass = 'stories-popup__close'; 355 var icon = '<div class="'+iconClass+'"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L13 13M13 1L1 13" stroke="white" stroke-width="2" stroke-linecap="round"/></svg></div>'; 356 357 return icon; 358} 359 360function InitAsproStoriesSectionSlider(el, options) { 361 el.asproStoriesSectionsSlider(options); 362} 363 364$.fn.asproStoriesSectionsSlider = function( options ){ 365 function _storiesSlider(slider, options) { 366 var _slider = $(slider); 367 368 var responsiveOptions = Object.assign({}, options); 369 for(var width in options.breakpoints) { 370 if(window.matchMedia(width).matches) { 371 responsiveOptions = Object.assign(responsiveOptions, options.breakpoints[width]); 372 } 373 } 374 375 responsiveOptions.setStyles = function() { 376 responsiveOptions.sliderInner.css({ 377 'display': 'flex', 378 'align-items': 'center', 379 'transition': 'margin-left '+ responsiveOptions.transition +'s ease-in-out', 380 'margin-left': responsiveOptions.calculateMargin(responsiveOptions.activeSlideIndex), 381 }); 382 responsiveOptions.slider.css({ 383 'overflow': 'hidden', 384 }); 385 } 386 387 responsiveOptions.getCurrentSizes = function() { 388 responsiveOptions.sliderWidth = responsiveOptions.slider.outerWidth(true); 389 responsiveOptions.sliderHeight = responsiveOptions.slider.outerHeight(true); 390 responsiveOptions.updateSlidesHeight(); 391 } 392 393 responsiveOptions.calculateMargin = function(slideIndex) { 394 responsiveOptions.getCurrentSizes(); 395 if(responsiveOptions.mobile) { 396 responsiveOptions.sliderInnerMargin = -responsiveOptions.slideWidth*(slideIndex + 1) + responsiveOptions.sliderWidth/2 + responsiveOptions.slideWidth/2; 397 } else { 398 responsiveOptions.sliderInnerMargin = -responsiveOptions.slideWidth*(slideIndex + 1) + responsiveOptions.sliderWidth/2 + responsiveOptions.slideWidth/2 - responsiveOptions.sliderWidth/100*responsiveOptions.activeSlideMargin; 399 } 400 401 } 402 403 responsiveOptions.setCenter = function(slideIndex) { 404 responsiveOptions.calculateMargin(slideIndex); 405 responsiveOptions.sliderInner.css({ 406 'margin-left': responsiveOptions.sliderInnerMargin, 407 }); 408 } 409 410 responsiveOptions.closePopup = function() { 411 responsiveOptions.popup.remove(); 412 } 413 414 responsiveOptions.setActive = function(slideIndex) { 415 responsiveOptions.activeSlide.removeClass(responsiveOptions.activeSlideClass).addClass(responsiveOptions.pausedSlideClass); 416 $(responsiveOptions.activeSlide.panelElements[ responsiveOptions.activeElements[responsiveOptions.activeSlideIndex] ]).removeClass(responsiveOptions.elementPanelActiveClass); 417 responsiveOptions.activeSlideIndex = slideIndex; 418 419 responsiveOptions.activeSlide = $(responsiveOptions.slides[responsiveOptions.activeSlideIndex]); 420 responsiveOptions.activeSlide.addClass(responsiveOptions.activeSlideClass).removeClass(responsiveOptions.pausedSlideClass); 421 422 responsiveOptions.activeSlide.elements = null; 423 responsiveOptions.activeSlide.panelElements = null; 424 425 responsiveOptions.updateElementsInfo(responsiveOptions.activeSlide); 426 responsiveOptions.setActiveElement(responsiveOptions.activeSlide, 0); 427 428 responsiveOptions.setCenter(slideIndex); 429 } 430 431 responsiveOptions.updateElementsInfo = function(slide) {
432 if(!slide.elements || !slide.panelElements) { 433 slide.elements = slide.find(responsiveOptions.elementsSelector); 434 slide.panelElements = slide.find('.'+responsiveOptions.elementPanelClass); 435 } 436 if(!responsiveOptions.activeElements[slide.index()]) { 437 responsiveOptions.activeElements[slide.index()] = 0; 438 } 439 } 440 441 responsiveOptions.setNext = function() { 442 if(responsiveOptions.activeSlideIndex + 1 < responsiveOptions.slides.length) { 443 responsiveOptions.setActive(responsiveOptions.activeSlideIndex + 1); 444 } else { 445 responsiveOptions.closePopup(); 446 } 447 } 448 449 responsiveOptions.setPrev = function() { 450 if(responsiveOptions.activeSlideIndex > 0) { 451 responsiveOptions.setActive(responsiveOptions.activeSlideIndex - 1); 452 } 453 } 454 455 responsiveOptions.setNextElement = function() { 456 responsiveOptions.updateElementsInfo(responsiveOptions.activeSlide); 457 responsiveOptions.elementTimerContinue = null; 458 459 if(responsiveOptions.activeElements[responsiveOptions.activeSlideIndex] + 1 < responsiveOptions.activeSlide.elements.length) { 460 responsiveOptions.setActiveElement(responsiveOptions.activeSlide, +1); 461 } else { 462 responsiveOptions.clearSlide(responsiveOptions.activeSlide); 463 responsiveOptions.setNext(); 464 } 465 } 466 467 responsiveOptions.setPrevElement = function() { 468 responsiveOptions.updateElementsInfo(responsiveOptions.activeSlide); 469 470 if(responsiveOptions.activeElements[responsiveOptions.activeSlideIndex] > 0) { 471 responsiveOptions.setActiveElement(responsiveOptions.activeSlide, -1); 472 } else { 473 responsiveOptions.clearSlide(responsiveOptions.activeSlide); 474 responsiveOptions.setPrev(); 475 } 476 } 477 478 responsiveOptions.clearSlide = function(slide) { 479 // slide.elements.removeClass(responsiveOptions.activeElementClass); 480 // slide.panelElements.removeClass(responsiveOptions.elementPanelActiveClass); 481 // slide.panelElements.removeClass(responsiveOptions.elementPanelFinishedClass); 482 } 483 484 responsiveOptions.setActiveElement = function(slide, newActiveIndex) { 485 486 responsiveOptions.slides.find('video').each(function(i, video){ 487 videoOff(video); 488 }); 489 490 if(responsiveOptions.elementTimer) { 491 clearTimeout(responsiveOptions.elementTimer); 492 } 493 494 var oldActive = slide.elements[ responsiveOptions.activeElements[responsiveOptions.activeSlideIndex] ]; 495 var newActive = slide.elements[ responsiveOptions.activeElements[responsiveOptions.activeSlideIndex] + newActiveIndex]; 496 $(oldActive).removeClass(responsiveOptions.activeElementClass); 497 $(newActive).addClass(responsiveOptions.activeElementClass); 498 responsiveOptions.activeElements[slide.index()] += newActiveIndex; 499 500 var videoJq = $(newActive).find('.stories-popup__element-image video'); 501 var video = videoJq && videoJq[0]; 502 var panelElementLineJq, panelElementJq; 503 slide.panelElements.each(function(index, element) { 504 var _this = $(element); 505 if(index < responsiveOptions.activeElements[slide.index()]) { 506 _this.addClass(responsiveOptions.elementPanelFinishedClass); 507 _this.removeClass(responsiveOptions.elementPanelActiveClass); 508 } else if (index == responsiveOptions.activeElements[slide.index()]) { 509 _this.removeClass(responsiveOptions.elementPanelFinishedClass); 510 _this.addClass(responsiveOptions.elementPanelActiveClass); 511 panelElementJq = _this; 512 panelElementLineJq = _this.find('.stories-popup__element-slider-panel-element-line'); 513 } else { 514 _this.removeClass(responsiveOptions.elementPanelActiveClass); 515 _this.removeClass(responsiveOptions.elementPanelFinishedClass); 516 } 517 }); 518 519 function videoOn(video){ 520 console.log('videoOn', video);
521 if(!video){ 522 return; 523 } 524 video.currentTime = 0; 525 if(video.paused){ 526 video.play(); 527 } 528 if(video.muted){ 529 video.muted = false; 530 video.removeAttribute('muted'); 531 } 532 } 533 function videoOff(video){ 534 console.log('videoOff', video); 535 if(!video){ 536 return; 537 } 538 video.currentTime = 0; 539 if(!video.paused){ 540 video.pause(); 541 } 542 if(!video.muted){ 543 video.muted = true; 544 video.setAttribute('muted', ''); 545 } 546 } 547 if(!window.asproStoriesSliderStopped) { 548 console.log('newActiveIndex', newActiveIndex); 549 if(video){ 550 panelElementJq.removeClass(responsiveOptions.elementPanelActiveClass); 551 panelElementJq.removeClass(responsiveOptions.elementPanelFinishedClass); 552 var duration = video.duration; 553 if(duration){ 554 panelElementJq.addClass(responsiveOptions.elementPanelActiveClass); 555 panelElementLineJq.css('animation-duration', '' + duration + 's'); 556 videoOn(video); 557 responsiveOptions.elementTimerStart = Date.now(); 558 responsiveOptions.elementTimer = setTimeout( 559 function() { 560 videoOff(video); 561 responsiveOptions.setNextElement(); 562 } 563 , Math.ceil(duration * 1000)); 564 } else { 565 video.addEventListener('loadedmetadata', function(e) { 566 var duration = video.duration; 567 console.log('setActiveElement loadedmetadata', e, Math.ceil(duration * 1000)); 568 }); 569 var h = function(e) { 570 video.removeEventListener('canplay', h); 571 console.log('canplay'); 572 var duration = video.duration; 573 panelElementJq.addClass(responsiveOptions.elementPanelActiveClass); 574 panelElementLineJq.css('animation-duration', '' + duration + 's'); 575 videoOn(video); 576 responsiveOptions.elementTimerStart = Date.now(); 577 responsiveOptions.elementTimer = setTimeout( 578 function() { 579 videoOff(video); 580 responsiveOptions.setNextElement(); 581 } 582 , Math.ceil(duration * 1000)); 583 }; 584 video.addEventListener('canplay', h); 585 video.addEventListener('load', function(e) { 586 console.log('load'); 587 }); 588 } 589 } else { 590 responsiveOptions.elementTimerStart = Date.now(); 591 responsiveOptions.elementTimer = setTimeout( 592 function() { 593 responsiveOptions.setNextElement(); 594 } 595 , responsiveOptions.changeSlideTime); 596 } 597 } 598 } 599 600 responsiveOptions.pauseSlide = function(slide) { 601 var index = slide.data('index'); 602 index = index ? index : slide.index(); 603 604 slide.addClass(responsiveOptions.pausedSlideClass); 605 responsiveOptions.stoppedSlideIndex = index; 606 if(responsiveOptions.elementTimer) { 607 clearTimeout(responsiveOptions.elementTimer); 608 responsiveOptions.animationTimer = responsiveOptions.elementTimerContinue ? responsiveOptions.elementTimerContinue : responsiveOptions.changeSlideTime; 609 responsiveOptions.elementTimerContinue = responsiveOptions.animationTimer - (Date.now() - responsiveOptions.elementTimerStart); 610 } 611 } 612 613 responsiveOptions.playSlide = function(slide) { 614 var index = slide.data('index'); 615 index = index ? index : slide.index(); 616 617 if( index == responsiveOptions.stoppedSlideIndex ) { 618 slide.removeClass(responsiveOptions.pausedSlideClass); 619 responsiveOptions.stoppedSlideIndex = null; 620 if(!window.asproStoriesSliderStopped) { 621 responsiveOptions.elementTimerStart = Date.now(); 622 responsiveOptions.elementTimer = setTimeout( 623 function() { 624 responsiveOptions.setNextElement(); 625 } 626 , responsiveOptions.elementTimerContinue); 627 } 628 } 629 } 630 631 responsiveOptions.addDragEvents = function() { 632 responsiveOptions.slides.on('touchstart', function(event) { 633 var _this = $(this); 634 var index = _this.data('index'); 635 index = index ? index : _this.index(); 636 637 if(index == responsiveOptions.activeSlideIndex) { 638 if(!responsiveOptions.mobile) { 639 responsiveOptions.touch.posPrev = event.originalEvent.changedTouches[0].pageX; 640 } 641 } 642 }); 643 644 responsiveOptions.slides.on('touchmove', function(event) { 645 var _this = $(this); 646 var index = _this.data('index'); 647 index = index ? index : _this.index(); 648 649 if(index == responsiveOptions.activeSlideIndex) { 650 if(!responsiveOptions.mobile) { 651 responsiveOptions.touch.posCurrent = event.originalEvent.changedTouches[0].pageX - responsiveOptions.touch.posPrev; 652 responsiveOptions.sliderInner.css({ 653 'margin-left': responsiveOptions.sliderInnerMargin + responsiveOptions.touch.posCurrent, 654 }); 655 responsiveOptions.sliderInnerMargin = responsiveOptions.sliderInnerMargin + responsiveOptions.touch.posCurrent; 656 responsiveOptions.touch.posPrev = event.originalEvent.changedTouches[0].pageX; 657 } 658 } 659 }); 660 661 responsiveOptions.slides.on('mousedown', function(event) { 662 var _this = $(this); 663 var index = _this.data('index'); 664 index = index ? index : _this.index(); 665 666 if(index == responsiveOptions.activeSlideIndex) { 667 if(!responsiveOptions.mobile) { 668 var startX = event.pageX; 669 670 671 function moveAt(pageX) { 672 var left = pageX - startX > 0 ? pageX - startX : startX - pageX; 673 var movePercent = left / responsiveOptions.dragAmount; 674 if(pageX - startX > 0 && responsiveOptions.activeSlideIndex > 0 || pageX - startX < 0 && responsiveOptions.activeSlideIndex < responsiveOptions.slides.length) { 675 var dependSlide = pageX - startX > 0 ? _this.prev() : _this.next(); 676 var cssCurrent = { 677 'margin-left': responsiveOptions.activeSlideMargin - responsiveOptions.activeSlideMargin*movePercent + 'vw', 678 'margin-right': responsiveOptions.activeSlideMargin - responsiveOptions.activeSlideMargin*movePercent + 'vw', 679 'transform': 'scale('+ (1 - 0.25*movePercent) +')', 680 }; 681 var cssDepend = { 682 'margin-left': responsiveOptions.activeSlideMargin*movePercent + 'vw', 683 'margin-right': responsiveOptions.activeSlideMargin*movePercent + 'vw', 684 'transform': 'scale('+ (0.75 + 0.25*movePercent) +')', 685 }; 686 687 _this.css(cssCurrent); 688 dependSlide.css(cssDepend); 689 690 console.log(movePercent); 691 } 692 } 693 694 function onMouseMove(event) { 695 moveAt(event.pageX); 696 } 697 698 document.addEventListener('mousemove', onMouseMove); 699 700 $(document).on('mouseup', function() { 701 document.removeEventListener('mousemove', onMouseMove); 702 this.onmouseup = null; 703 }); 704 705 this.ondragstart = function() { 706 return false;
707 }; 708 } 709 } 710 }); 711 } 712 713 responsiveOptions.addEvents = function() { 714 responsiveOptions.slides.on('click', function() { 715 var _this = $(this); 716 var index = _this.data('index'); 717 index = index ? index : _this.index(); 718 719 if(index != responsiveOptions.activeSlideIndex) { 720 responsiveOptions.setActive(index); 721 } 722 }); 723 724 responsiveOptions.slides.swiperight(function() { 725 if(responsiveOptions.mobile) { 726 responsiveOptions.setPrev(); 727 } 728 }); 729 730 responsiveOptions.slides.swipeleft(function() { 731 if(responsiveOptions.mobile) { 732 responsiveOptions.setNext(); 733 } 734 }); 735 736 responsiveOptions.slides.on('taphold', function() { 737 var _this = $(this); 738 responsiveOptions.pauseSlide(_this); 739 }); 740 741 responsiveOptions.slides.on('touchend', function() { 742 var _this = $(this); 743 responsiveOptions.playSlide(_this); 744 }); 745 746 responsiveOptions.slides.on('mousedown', function() { 747 var _this = $(this); 748 var timeout = 1000; 749 responsiveOptions.mousedownTimer = setTimeout( 750 function() { 751 responsiveOptions.mouseHold = true; 752 responsiveOptions.pauseSlide(_this); 753 } 754 , timeout); 755 }); 756 757 responsiveOptions.slides.on('mousemove', function() { 758 if(responsiveOptions.mousedownTimer) { 759 clearTimeout(responsiveOptions.mousedownTimer); 760 responsiveOptions.mouseHold = false; 761 } 762 }); 763 764 responsiveOptions.slides.on('mouseup', function(e) { 765 if(responsiveOptions.mouseHold) { 766 var _this = $(this); 767 responsiveOptions.playSlide(_this); 768 } else { 769 if(responsiveOptions.mousedownTimer) { 770 clearTimeout(responsiveOptions.mousedownTimer); 771 responsiveOptions.mouseHold = false; 772 } 773 } 774 }); 775 776 responsiveOptions.slides.on('click', '.'+responsiveOptions.elementNavPrevClass, function(e) { 777 if(!responsiveOptions.mouseHold) { 778 var _this = $(this); 779 var _thisSlide = _this.closest(responsiveOptions.slidesSelector); 780 var index = _thisSlide.data('index'); 781 index = index ? index : _thisSlide.index(); 782 783 if(index == responsiveOptions.activeSlideIndex) { 784 responsiveOptions.setPrevElement(); 785 e.preventDefault(); 786 e.stopPropagation(); 787 } 788 } else { 789 responsiveOptions.mouseHold = false; 790 } 791 }); 792 793 responsiveOptions.slides.on('click', '.'+responsiveOptions.elementNavNextClass, function(e) { 794 if(!responsiveOptions.mouseHold) { 795 var _this = $(this); 796 var _thisSlide = _this.closest(responsiveOptions.slidesSelector); 797 var index = _thisSlide.data('index'); 798 index = index ? index : _thisSlide.index(); 799 800 if(index == responsiveOptions.activeSlideIndex) { 801 responsiveOptions.setNextElement(); 802 e.preventDefault(); 803 e.stopPropagation(); 804 } 805 } else { 806 responsiveOptions.mouseHold = false; 807 } 808 }); 809 810 // responsiveOptions.addDragEvents(); 811 812 BX.addCustomEvent('onWindowResize', function(eventdata) { 813 try{ 814 responsiveOptions.update(); 815 } 816 catch(e){ 817 console.log(e); 818 } 819 }); 820 } 821 822 responsiveOptions.updateSlidesHeight = function() { 823 if(responsiveOptions.mobile) { 824 responsiveOptions.slideWidth = responsiveOptions.sliderWidth; 825 responsiveOptions.slides.css({ 826 'width': '', 827 }); 828 } else { 829 responsiveOptions.slideWidth = (responsiveOptions.sliderHeight + 80)/1.98; 830 responsiveOptions.slides.css({ 831 'width': responsiveOptions.slideWidth, 832 }); 833 } 834 } 835 836 responsiveOptions.update = function() { 837 var activeSlide = responsiveOptions.activeSlideIndex; 838 responsiveOptions = Object.assign(responsiveOptions, options); 839 for(var width in options.breakpoints) { 840 if(window.matchMedia(width).matches) { 841 responsiveOptions = Object.assign(responsiveOptions, options.breakpoints[width]); 842 } 843 } 844 845 responsiveOptions.activeSlideIndex = activeSlide; 846 responsiveOptions.getCurrentSizes(); 847 responsiveOptions.setCenter(responsiveOptions.activeSlideIndex); 848 } 849 850 responsiveOptions.init = function(_slider) { 851 responsiveOptions.slides = _slider.find(responsiveOptions.slidesSelector); 852 responsiveOptions.activeSlide = $(responsiveOptions.slides[responsiveOptions.activeSlideIndex]); 853 responsiveOptions.sliderInner = _slider.find(responsiveOptions.innerSelector); 854 responsiveOptions.slider = _slider; 855 responsiveOptions.sliderWidth = responsiveOptions.slider.outerWidth(true); 856 responsiveOptions.slides.addClass('swipeignore'); 857 responsiveOptions.touch = {}; 858 responsiveOptions.activeElements = {}; 859 860 responsiveOptions.setStyles(); 861 responsiveOptions.getCurrentSizes(); 862 responsiveOptions.setCenter(responsiveOptions.activeSlideIndex); 863 864 responsiveOptions.updateElementsInfo(responsiveOptions.activeSlide); 865 responsiveOptions.setActiveElement(responsiveOptions.activeSlide, 0); 866 867 responsiveOptions.addEvents(); 868 869 _slider.data('asproStoriesSlider', responsiveOptions); 870 } 871 872 responsiveOptions.init(_slider); 873 setTimeout( 874 function() { 875 responsiveOptions.slider.addClass('aspro_slider_init'); 876 }, 877 responsiveOptions.transition*1000 + 10); 878 879 } 880 881 var el = $(this); 882 883 if(el.hasClass('aspro_slider_init')) 884 return false;
885 886 el.each(function(i, slider){ 887 _storiesSlider(slider, options); 888 }); 889} 890 891kit && kit.loaded(['jqueryLazy'], function(){ 892 var $ = kit.require('jquery'); 893 $('.tab_slider_wrapp.stories video').lazy(); 894});
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.