Team:CPU CHINA/static/js/9-645e4c5e-chunk-js

(window["webpackJsonpcpu-igem2020"]=window["webpackJsonpcpu-igem2020"]||[]).push([[9],{262:function(e,t,a){"use strict";a.r(t),a.d(t,"default",function(){return d});var i=a(10),o=a(12),r=a(17),s=a(18),n=a(19),c=a(0),m=a.n(c),l=(a(294),a(31)),g=a(7),d=function(e){function t(){var e,a;Object(i.a)(this,t);for(var o=arguments.length,n=new Array(o),c=0;c<o;c++)n[c]=arguments[c];return(a=Object(r.a)(this,(e=Object(s.a)(t)).call.apply(e,[this].concat(n)))).isImgLoaded=!1,a.isTbImgLoaded=!1,a.$cover=void 0,a.$coverTxtContainer=void 0,a.$coverBg=void 0,a.$img=void 0,a.$tbImg=void 0,a.state={stage:0},a.resizeCoverImg=function(){if(a.isImgLoaded||a.isTbImgLoaded){var e=a.$coverBg.clientWidth,t=a.$coverBg.clientHeight;a.isImgLoaded&&i(a.$img),a.isTbImgLoaded&&i(a.$tbImg)}function i(a){var i=a.naturalWidth,o=a.naturalHeight;if(i/o>e/t){var r=i/o*t;a.style.height="100%",a.style.width=r+"px",a.style.top="0",a.style.left=(e-r)/2+"px"}else{var s=o/i*e;a.style.width="100%",a.style.height=s+"px",a.style.top=(t-s)/2+"px",a.style.left="0"}}},a.onImgLoad=function(){a.isImgLoaded=!0,a.resizeCoverImg(),a.setState({stage:a.isTbImgLoaded?2:0})},a.onTbImgLoad=function(){a.isTbImgLoaded=!0,a.resizeCoverImg(),a.setState({stage:a.isImgLoaded?2:1})},a.parallaxScrolling=function(){var e=a.$cover.getBoundingClientRect(),t=e.top;if(!(e.bottom<=18)){var i=18-t;a.$coverBg.style.transform="translateY("+i/2+"px)",a.$coverTxtContainer.style.transform="translateY("+i/3+"px)"}},a}return Object(n.a)(t,e),Object(o.a)(t,[{key:"render",value:function(){var e=this,t=this.state.stage,a=Object(g.e)({cover:"cover",coverBg:"cover-bg",tbImg:["cover-tb-img",t>0&&"show"],img:["cover-img",t>1&&"show"],mask:"mask",coverTxtContainer:"cover-txt-container",coverTxt:"cover-txt"});return m.a.createElement("div",{className:a.cover,ref:function(t){return e.$cover=t}},m.a.createElement("figure",{className:a.coverBg,ref:function(t){return e.$coverBg=t}},m.a.createElement("img",{className:a.tbImg,ref:function(t){return e.$tbImg=t},src:this.props.tbimgUrl,alt:"The cover of this page."}),m.a.createElement("img",{className:a.img,ref:function(t){return e.$img=t},src:this.props.imgUrl,alt:"The cover of this page."}),m.a.createElement("div",{className:a.mask})),m.a.createElement("div",{className:a.coverTxtContainer,ref:function(t){return e.$coverTxtContainer=t}},m.a.createElement("div",{className:a.coverTxt},m.a.createElement("div",{className:"mask"}),m.a.createElement("span",{className:"txt"},this.props.title))))}},{key:"componentDidMount",value:function(){window.addEventListener("resize",this.resizeCoverImg),l.a.on("scroll",this.parallaxScrolling),this.$img.addEventListener("load",this.onImgLoad),this.$img.complete&&this.onImgLoad(),this.$tbImg.addEventListener("load",this.onTbImgLoad),this.$tbImg.complete&&this.onTbImgLoad()}},{key:"componentWillUnmount",value:function(){window.removeEventListener("resize",this.resizeCoverImg),l.a.removeListener("scroll",this.parallaxScrolling)}},{key:"UNSAFE_componentWillUpdate",value:function(e){e.imgUrl!==this.props.imgUrl&&(this.isImgLoaded=!1),e.tbimgUrl!==this.props.tbimgUrl&&(this.isTbImgLoaded=!1);var t=this.isTbImgLoaded?this.isImgLoaded?2:1:0;this.state.stage!==t&&this.setState({stage:t})}}]),t}(m.a.Component)},294:function(e,t,a){}}]); //# sourceMappingURL=../9-645e4c5e-chunk.js.map?action=raw&ctype=text/javascript