{"version":3,"sources":["components/activity/newyear-2019/common/system-bullet-screen/index.js"],"names":["SystemBulletScreen","count","state","showNotices","initializeSwiper","_this","swiper","Swiper","allowTouchMove","direction","loop","on","init","Array","from","this","slides","forEach","item","querySelector","addEventListener","transitionEnd","slideChangeTransitionEnd","slideHorizontal","el","previousIndex","style","transition","transform","activeIndex","content","contentWidth","offsetWidth","wrapperWidth","clientWidth","setTimeout","len","props","bullets","length","sysNotice","height","destroyed","slideNext","removeSystemNotices","e","persist","target","setState","destroy","id","onTransitionEnd","ref","className","src","alt","map","index","key","Component"],"mappings":"0LAKMA,G,2NAEJC,MAAQ,E,EAGRC,MAAQ,CACNC,aAAa,G,EAWfC,iBAAmB,WACjB,IAAMC,EAAK,eACX,EAAKC,OAAS,IAAIC,IAAO,sCAAuC,CAC9DC,gBAAgB,EAChBC,UAAW,WACXC,MAAM,EACNC,GAAI,CACFC,KADE,WAEAC,MAAMC,KAAKC,KAAKC,QAAQC,SAAQ,SAACC,GAC/BA,EACGC,cAAc,QACdC,iBAAiB,gBAAiBf,EAAMgB,mBAG/CC,yBARE,WASAjB,EAAMkB,gBAAgBR,OAExBM,cAXE,WAYA,IAAMG,EAAKT,KAAKC,OAAOD,KAAKU,eAAeN,cAAc,QACzDK,EAAGE,MAAMC,WAAa,QACtBH,EAAGE,MAAME,UAAY,0B,EAM7BL,gBAAkB,SAACjB,GACjB,IAAIkB,EAAKlB,EAAOU,OAAOV,EAAOuB,aAC5BC,EAAUN,EAAGL,cAAc,QAC3BY,EAAeD,EAAQE,YACvBC,EAAeT,EAAGU,YAIpB,GAAIH,EAAeE,EACjBH,EAAQJ,MAAMC,WAAd,oBAAwCI,EAH/B,OAGT,YACAI,YAAW,WACTL,EAAQJ,MAAME,UAAd,wBACIG,EAAeE,GAAgB,GADnC,aAGC,SACE,CAAC,IAEAG,EAAuB,EADT,EAAKC,MAAjBC,QACYC,OACpBJ,YAAW,aACH,EAAKlC,QAAUmC,IACnB,EAAKI,UAAUd,MAAMe,OAArB,OAEFnC,IAAWA,EAAOoC,WAAapC,EAAOqC,cACrC,O,EAIPtB,cAAgB,WAAO,IAGfe,EAAuB,EAFT,EAAKC,MAAjBC,QAEYC,SACd,EAAKtC,QAAUmC,EACnBD,YAAW,WACT,EAAKK,UAAUd,MAAMe,OAArB,QACC,KAEHN,YAAW,WACT,EAAK7B,QAAU,EAAKA,OAAOqC,cAC1B,M,EAIPC,oBAAsB,SAACC,GACrBA,EAAEC,UACED,EAAEE,SAAW,EAAKP,WACpB,EAAKQ,SAAS,CACZ7C,aAAa,K,kEA/EjBY,KAAKX,qB,6CAILW,KAAKT,QAAUS,KAAKT,OAAO2C,Y,+BAgFnB,IAAD,OACCX,EAAYvB,KAAKsB,MAAjBC,QACR,OACEvB,KAAKb,MAAMC,aACT,yBACE+C,GAAG,uBACHC,gBAAiBpC,KAAK6B,oBACtBQ,IAAK,SAAC5B,GAAD,OAAS,EAAKgB,UAAYhB,IAE/B,yBACE6B,UAAU,SACVC,IAAI,mFACJC,IAAI,KAEN,yBAAKF,UAAU,sCACb,wBAAIA,UAAU,kBACXf,GAAWA,EAAQC,OAChBD,EAAQkB,KAAI,SAACtC,EAAMuC,GACjB,OACE,wBAAIJ,UAAU,eAAeK,IAAKD,GAChC,8BAAOvC,OAIb,Y,GAtHeyC,cA+HlB3D,a","file":"mrstaticjs/system-notices.13eb9936.chunk.js","sourcesContent":["import React, { Component } from \"react\"\nimport Swiper from \"swiper\"\nimport \"swiper/dist/css/swiper.min.css\"\nimport \"./system-bullet-screen.scss\"\n\nclass SystemBulletScreen extends Component {\n swiper\n count = 0\n sysNotice\n\n state = {\n showNotices: true,\n }\n\n componentDidMount() {\n this.initializeSwiper()\n }\n\n componentWillUnmount() {\n this.swiper && this.swiper.destroy()\n }\n\n initializeSwiper = () => {\n const _this = this\n this.swiper = new Swiper(\".sys-bullet-screen-swiper-container\", {\n allowTouchMove: false,\n direction: \"vertical\",\n loop: true,\n on: {\n init() {\n Array.from(this.slides).forEach((item) => {\n item\n .querySelector(\"span\")\n .addEventListener(\"transitionend\", _this.transitionEnd)\n })\n },\n slideChangeTransitionEnd() {\n _this.slideHorizontal(this)\n },\n transitionEnd() {\n const el = this.slides[this.previousIndex].querySelector(\"span\")\n el.style.transition = \"unset\"\n el.style.transform = \"translate3d(0,0,0)\"\n },\n },\n })\n }\n\n slideHorizontal = (swiper) => {\n let el = swiper.slides[swiper.activeIndex],\n content = el.querySelector(\"span\"),\n contentWidth = content.offsetWidth,\n wrapperWidth = el.clientWidth\n\n const co = 131.25\n\n if (contentWidth > wrapperWidth) {\n content.style.transition = `transform ${contentWidth / co}s linear`\n setTimeout(() => {\n content.style.transform = `translate3d(${\n -(contentWidth - wrapperWidth) - 10\n }px,0,0)`\n }, 1000)\n } else {\n const { bullets } = this.props\n const len = bullets.length * 3\n setTimeout(() => {\n if (++this.count === len) {\n this.sysNotice.style.height = `0px`\n }\n swiper && !swiper.destroyed && swiper.slideNext()\n }, 3000)\n }\n }\n\n transitionEnd = () => {\n const { bullets } = this.props\n\n const len = bullets.length * 3\n if (++this.count === len) {\n setTimeout(() => {\n this.sysNotice.style.height = `0px`\n }, 2000)\n } else {\n setTimeout(() => {\n this.swiper && this.swiper.slideNext()\n }, 1000)\n }\n }\n\n removeSystemNotices = (e) => {\n e.persist()\n if (e.target === this.sysNotice) {\n this.setState({\n showNotices: false,\n })\n }\n }\n\n render() {\n const { bullets } = this.props\n return (\n this.state.showNotices && (\n <div\n id=\"system-bullet-screen\"\n onTransitionEnd={this.removeSystemNotices}\n ref={(el) => (this.sysNotice = el)}\n >\n <img\n className=\"avatar\"\n src=\"https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/system-notice-icon.png\"\n alt=\"\"\n />\n <div className=\"sys-bullet-screen-swiper-container\">\n <ul className=\"swiper-wrapper\">\n {bullets && bullets.length\n ? bullets.map((item, index) => {\n return (\n <li className=\"swiper-slide\" key={index}>\n <span>{item}</span>\n </li>\n )\n })\n : null}\n </ul>\n </div>\n </div>\n )\n )\n }\n}\n\nexport default SystemBulletScreen\n"],"sourceRoot":""}
