testimonial
Version:
JS testimonial slider with AJAX
7 lines • 8.14 kB
JavaScript
/**
* testimonial - JS testimonial slider with AJAX
* @version v2.0.0
* @link http://alekseyleshko.github.io/testimonial.js/
* @license MIT (https://github.com/AlekseyLeshko/testimonial.js/blob/master/LICENSE)
*/
"use strict";var Parser=function(t){this.nodeList=t,this.dataList=[]};Parser.prototype={parse:function(){for(var t=0;t<this.nodeList.length;t++){var e=this.nodeList[t],i=this.parseNode(e);this.dataList.push(i)}return this.dataList},parseNode:function(t){var e={},i=t.querySelector(".author");e.author=this.parseAuthorNode(i);var n=t.querySelector(".company");e.company=this.parseCompanyNode(n);var s=t.querySelector(".quote"),r=s.innerHTML.trim();return e.quote=r,e},parseAuthorNode:function(t){var e=t.querySelector("a"),i=e.innerHTML.trim(),n=this.getAttrHrefOrDefault(e),s=t.querySelector(".avatar"),r=s.getAttribute("src"),a={name:i,url:n,avatar:r};return a},parseCompanyNode:function(t){var e=t.querySelector("a"),i=e.innerHTML.trim(),n=this.getAttrHrefOrDefault(e),s={name:i,url:n};return s},getAttrHrefOrDefault:function(t){var e=t.getAttribute("href");return e||(e="#"),e}};var Testimonial=function(t,e){this.setContainer(t),this.createOptions(e),this.initPlugin()};Testimonial.prototype={start:function(){var t=this;this.timerId=setInterval(function(){t.next()},this.options.timeout)},stop:function(){clearInterval(this.timerId),this.timerId=void 0},next:function(){this.stop(),this.cleanSlideArr(),this.transitionAnimation(),this.isNeedLoadSlide()&&this.loadSlide(),this.isNeedStartSlider()&&this.start()},add:function(t){this.createAndAddSlide(t);var e=this.getLastSlide();this.slideRendering(e),this.resizePluginContainer()},setContainer:function(t){var e=document.querySelectorAll(t)[0];this.container=e},createOptions:function(t){var e=this.getDefaultOptions();this.options=Util.extend(e,t),this.setMinSizePlugin()},initPlugin:function(){this.slideArr=[],this.currentSlideIndex=0,this.initSlideArr(),this.options.autostart&&this.start()},getCurrentSlide:function(){var t=this.slideArr[this.currentSlideIndex];return t},getNextSlide:function(){this.indexing();var t=this.getCurrentSlide();return t},getLastSlide:function(){var t=this.slideArr.length-1,e=this.slideArr[t];return e},transitionAnimation:function(){var t=this.getCurrentSlide(),e=this.getNextSlide();t.animateHide(),e.animateShow();var i=this;setTimeout(function(){i.resizePluginContainer()},101)},isNeedLoadSlide:function(){var t=this.currentSlideIndex<=this.options.slideCount-1;return t},isNeedStartSlider:function(){var t=void 0===this.timerId;return t},isFunction:function(t){var e={};return t&&"[object Function]"===e.toString.call(t)},loadSlide:function(){if(this.isFunction(this.options.getSlide)){var t=this.options.getSlide();this.add(t)}},setMinSizePlugin:function(){this.options.width<this.options.minWidth&&(this.options.width=this.options.minWidth)},cleanSlideArr:function(){if(this.whetherToRemoveSlide()){var t=1;0!==this.currentSlideIndex&&(t=0,this.currentSlideIndex--),this.removeSlide(t)}},whetherToRemoveSlide:function(){var t=this.slideArr.length>this.options.slideCount;return t},removeSlide:function(t){this.slideArr[t].remove();var e=this.slideArr.splice(t,1);delete e[0]},getSlideCount:function(){return this.options.slideCount},setSlideCount:function(t){for(this.options.slideCount=t;this.whetherToRemoveSlide();)this.cleanSlideArr()},getDefaultOptions:function(){var t={height:175,width:700,slideCount:3,timeout:7e3,autostart:!0,indents:25,minWidth:400,getSlide:void 0};return t},slideArrRendering:function(){for(var t=0;t<this.slideArr.length;t++){var e=this.slideArr[t];this.slideRendering(e)}},parseAndCreateSlide:function(){var t=this.parseDomTree();this.createSlides(t)},parseDomTree:function(){var t=Util.extend({},this.container.children);if(this.container.innerHTML="",t.length<=0)return[];var e=new Parser(t),i=e.parse();return i},createSlides:function(t){for(var e=0;e<t.length;e++){var i=t[e];this.createAndAddSlide(i)}},createAndAddSlide:function(t){var e={width:this.options.width},i=new TestimonialSlide(t,e);this.slideArr.push(i)},bindEvents:function(){var t=this.container.querySelectorAll(".next_slide")[0],e=this;t.onclick=function(){e.next()}},resizePluginContainer:function(){if(!(this.slideArr.length<=0)){var t=this.getCurrentSlide(),e=t.height()+this.options.indents;this.container.style.height=e+"px"}},indexing:function(){this.currentSlideIndex++,this.currentSlideIndex===this.slideArr.length&&(this.currentSlideIndex=0)},isNeedHideSlide:function(t){var e=this.slideArr.indexOf(t),i=e!==this.currentSlideIndex;return i},slideRendering:function(t){var e=this.container.querySelectorAll(".main_container")[0];t.renderTo(e),this.isNeedHideSlide(t)&&t.hideSlide()},configContainer:function(){this.container.style.height=this.options.height+"px",this.container.style.width=this.options.width+"px"},createTemplate:function(){this.template=['<div class="main_container" style="width: ','px"></div>','<div class="next_slide"></div>']},renderTemplate:function(){var t=500,e=2*this.options.width+t;this.template.splice(1,0,e);var i=this.template.join("");this.container.innerHTML=i},initSlideArr:function(){this.parseAndCreateSlide(),this.configContainer(),this.createTemplate(),this.renderTemplate(),this.bindEvents(),this.slideArrRendering(),this.resizePluginContainer()}};var TestimonialSlide=function(t,e){this.data=this.createData(t),this.createOptions(e),this.createSlide()};TestimonialSlide.prototype={createData:function(t){var e={author:{name:"",url:"",avatar:""},company:{name:"",url:""},quote:""},i=Util.extend(e,t);return i},createOptions:function(t){var e=this.getDefaultOptions();this.options=Util.extend({},e,t)},getDefaultOptions:function(){var t={width:700,duration:750,distance:250,cssClass:"testimonial_slide",indents:20};return t},setHeightForBlockDiv:function(){var t=this.node.style.height;this.node.querySelectorAll(".block")[0].style.height=t},createSlide:function(){this.createTemplate(),this.renderTemplate()},animateHide:function(){var t="fadeOutRight";this.node.style["z-index"]=2,this.addCssClass(t);var e=this;setTimeout(function(){e.removeCssClass(t),e.hideSlide()},1e3)},animateShow:function(){var t="fadeInLeft";this.node.style["z-index"]=1;var e=this;setTimeout(function(){e.addCssClass(t),e.node.style.display="",setTimeout(function(){e.removeCssClass(t)},1e3)},100)},hideSlide:function(){this.node.style.display="none"},addCssClass:function(t){this.node.classList.add(t)},removeCssClass:function(t){this.node.classList.remove(t)},height:function(){var t=this.node.offsetHeight;return t},remove:function(){this.node.parentNode.removeChild(this.node),delete this.node},createTemplate:function(){var t='<div class="quotation_mark right"></div></div><div class="signature"><div class="author">';t+='― <a target="_blank" href="',this.template=['<div class="content"><div class="text" style="width: ','px;"><div class="quote"><div class="quotation_mark left"></div>',t,'">','</a></div><div class="company"><a target="_blank" href="','">','</a></div></div></div><div class="avatar"><div class="block"><div class="author"><img src="','"></div><div class="helper"></div></div></div></div>']},renderTemplate:function(){var t=this.getDataForTemplate();this.template.splice(1,0,t.main.width),this.template.splice(3,0,t.slide.quote),this.template.splice(5,0,t.slide.author.url),this.template.splice(7,0,t.slide.author.name),this.template.splice(9,0,t.slide.company.url),this.template.splice(11,0,t.slide.company.name),this.template.splice(13,0,t.slide.author.avatar);var e=this.template.join(""),i=document.createElement("div");i.className="testimonial_slide animated",i.style.width=t.slide.width+"px",i.innerHTML=e,this.node=i},getDataForTemplate:function(){var t=180,e=this.options.width-t,i={main:{width:e}};return i.slide=this.data,i.slide.width=this.options.width-this.options.indents,i},renderTo:function(t){t.appendChild(this.node),this.setHeightForBlockDiv()}};var extend=function(t){t=t||{};for(var e=1;e<arguments.length;e++)if(arguments[e])for(var i in arguments[e])arguments[e].hasOwnProperty(i)&&(t[i]=arguments[e][i]);return t},Util={extend:extend};