プロジェクト

全般

プロフィール

ファイル » BigPicture.min.js

添付ファイルプレビューのためのJS - netazone, 2019-09-14 10:52

 
1
!function(){var r,e,a,i,p,c,l,s,f,n,d,u,b,o,g,m,h,x,v,y,w,_,k,S,A,E,M,z,I,C,T,D,L,O=window,N=[],V={},q=document,B="appendChild",P="createElement",G="removeChild",R="innerHTML",H="pointer-events:auto",X="clientHeight",F="clientWidth",U="addEventListener",W=O.setTimeout,Y=O.clearTimeout;function $(){var t=r.getBoundingClientRect();return"transform:translate3D("+(t.left-(a[F]-t.width)/2)+"px, "+(t.top-(a[X]-t.height)/2)+"px, 0) scale3D("+r[F]/i[F]+", "+r[X]/i[X]+", 0)"}function j(t){var o,r=C.length-1;if(!b){if(0<t?I===r&&(o=!0):0===I&&(o=!0),o)return et(p,""),void W(et,9,p,"animation:"+(0<t?"bpl":"bpf")+" .3s;transition:transform .35s");if([(I=Math.max(0,Math.min(I+t,r)))-1,I,I+1].forEach(function(t){if(t=Math.max(0,Math.min(t,r)),!V[t]){var o=C[t].src,n=q[P]("IMG");n[U]("load",tt.bind(null,o)),n.src=o,V[t]=n}}),V[I].complete)return J(t);b=!0,et(g,"opacity:.4;"),a[B](g),V[I].onload=function(){w&&J(t)},V[I].onerror=function(){C[I]={error:"Error loading image"},w&&J(t)}}}function J(t){b&&(a[G](g),b=!1);var o=C[I];if(o.error)alert(o.error);else{var n=a.querySelector("img:last-of-type");et(p=i=V[I],"animation:"+(0<t?"bpfl":"bpfr")+" .35s;transition:transform .35s"),et(n,"animation:"+(0<t?"bpfol":"bpfor")+" .35s both"),a[B](p),o.el&&(r=o.el)}T[R]=I+1+"/"+C.length,Z(C[I].caption),E&&E([p,C[I]])}function K(t){~[1,4].indexOf(i.readyState)?(ot(),W(function(){i.play()},99)):i.error?ot(t):o=W(K,35,t)}function Q(t){L.noLoader||(t&&et(g,"top:"+r.offsetTop+"px;left:"+r.offsetLeft+"px;height:"+r[X]+"px;width:"+r[F]+"px"),r.parentElement[t?B:G](g),b=t)}function Z(t){t&&(h[R]=t),et(m,"opacity:"+(t?"1;"+H:"0"))}function tt(t){~N.indexOf(t)||N.push(t)}function ot(t){if(b&&Q(),S&&S(),"string"==typeof t)return rt(),L.onError?L.onError():alert("Error: The requested "+t+" could not be loaded.");k&&tt(n),et(i,$()),et(a,"opacity:1;"+H),A=W(A,410),y=!0,w=!!C,W(function(){et(i,"transition:transform .35s;transform:none"),x&&W(Z,250,x)},60)}function nt(t){var o=t.target,n=[m,v,c,l,h,z,M,g];o&&o.blur(),_||~n.indexOf(o)||(i.style.cssText+=$(),et(a,H),W(rt,350),Y(A),_=!(y=!1))}function rt(){if(q.body[G](a),a[G](i),et(a,""),(i===s?f:i).removeAttribute("src"),Z(!1),w){for(var t=a.querySelectorAll("img"),o=0;o<t.length;o++)a[G](t[o]);b&&a[G](g),a[G](T),w=C=!1,V={},D||a[G](M),D||a[G](z),p.onload=ot,p.onerror=ot.bind(null,"image")}L.onClose&&L.onClose(),_=b=!1}function et(t,o){t.style.cssText=o}O.BigPicture=function(t){e||function(){var r;function t(t){var o=q[P]("button");return o.className=t,o[R]='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path d="M28 24L47 5a3 3 0 1 0-4-4L24 20 5 1a3 3 0 1 0-4 4l19 19L1 43a3 3 0 1 0 4 4l19-19 19 19a3 3 0 0 0 4 0v-4L28 24z"/></svg>',o}function o(o,t){var n=q[P]("button");return n.className="bp-lr",n[R]='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" height="70" fill="#fff"><path d="M88.6 121.3c.8.8 1.8 1.2 2.9 1.2s2.1-.4 2.9-1.2a4.1 4.1 0 0 0 0-5.8l-51-51 51-51a4.1 4.1 0 0 0-5.8-5.8l-54 53.9a4.1 4.1 0 0 0 0 5.8l54 53.9z"/></svg>',et(n,t),n.onclick=function(t){t.stopPropagation(),j(o)},n}var n=q[P]("STYLE");n[R]="#bp_caption,#bp_container{bottom:0;left:0;right:0;position:fixed;opacity:0}#bp_container>*,#bp_loader{position:absolute;right:0;z-index:10}#bp_container,#bp_caption,#bp_container svg{pointer-events:none}#bp_container{top:0;z-index:9999;background:rgba(0,0,0,.7);opacity:0;transition:opacity .35s}#bp_loader{top:0;left:0;bottom:0;display:flex;margin:0;cursor:wait;z-index:9;background:0 0}#bp_loader svg{width:50%;max-width:300px;max-height:50%;margin:auto;animation:bpturn 1s infinite linear}#bp_aud,#bp_container img,#bp_sv,#bp_vid{user-select:none;max-height:96%;max-width:96%;top:0;bottom:0;left:0;margin:auto;box-shadow:0 0 3em rgba(0,0,0,.4);z-index:-1}#bp_sv{height:0;padding-bottom:54%;background-color:#000;width:96%}#bp_caption{font-size:.9em;padding:1.3em;background:rgba(15,15,15,.94);color:#fff;text-align:center;transition:opacity .3s}#bp_aud{width:650px;top:calc(50% - 20px);bottom:auto;box-shadow:none}#bp_count{left:0;right:auto;padding:14px;color:rgba(255,255,255,.7);font-size:22px;cursor:default}#bp_container button{position:absolute;border:0;outline:0;background:0 0;cursor:pointer;transition:all .1s}#bp_container>.bp-x{height:41px;width:41px;border-radius:100%;top:8px;right:14px;opacity:.8;line-height:1}#bp_container>.bp-x:focus,#bp_container>.bp-x:hover{background:rgba(255,255,255,.2)}.bp-x svg,.bp-xc svg{height:21px;width:20px;fill:#fff;vertical-align:top;}.bp-xc svg{width:16px}#bp_container .bp-xc{left:2%;bottom:100%;padding:9px 20px 7px;background:#d04444;border-radius:2px 2px 0 0;opacity:.85}#bp_container .bp-xc:focus,#bp_container .bp-xc:hover{opacity:1}.bp-lr{top:50%;top:calc(50% - 130px);padding:99px 0;width:6%;background:0 0;border:0;opacity:.4;transition:opacity .1s}.bp-lr:focus,.bp-lr:hover{opacity:.8}@keyframes bpf{50%{transform:translatex(15px)}100%{transform:none}}@keyframes bpl{50%{transform:translatex(-15px)}100%{transform:none}}@keyframes bpfl{0%{opacity:0;transform:translatex(70px)}100%{opacity:1;transform:none}}@keyframes bpfr{0%{opacity:0;transform:translatex(-70px)}100%{opacity:1;transform:none}}@keyframes bpfol{0%{opacity:1;transform:none}100%{opacity:0;transform:translatex(-70px)}}@keyframes bpfor{0%{opacity:1;transform:none}100%{opacity:0;transform:translatex(70px)}}@keyframes bpturn{0%{transform:none}100%{transform:rotate(360deg)}}@media (max-width:600px){.bp-lr{font-size:15vw}}@media (min-aspect-ratio:9/5){#bp_sv{height:98%;width:170.6vh;padding:0}}",q.head[B](n),(a=q[P]("DIV")).id="bp_container",a.onclick=nt,d=t("bp-x"),a[B](d),"ontouchstart"in O&&(D=!0,a.ontouchstart=function(t){r=t.changedTouches[0].pageX},a.ontouchmove=function(t){t.preventDefault()},a.ontouchend=function(t){if(w){var o=t.changedTouches[0],n=o.pageX-r;n<-30&&j(1),30<n&&j(-1)}});p=q[P]("IMG"),(c=q[P]("VIDEO")).id="bp_vid",c.setAttribute("playsinline",!0),c.controls=!0,c.loop=!0,(l=q[P]("audio")).id="bp_aud",l.controls=!0,l.loop=!0,(T=q[P]("span")).id="bp_count",(m=q[P]("DIV")).id="bp_caption",(v=t("bp-xc")).onclick=Z.bind(null,!1),m[B](v),h=q[P]("SPAN"),m[B](h),a[B](m),M=o(1,"transform:scalex(-1)"),z=o(-1,"left:0;right:auto"),(g=q[P]("DIV")).id="bp_loader",g[R]='<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 32 32" fill="#fff" opacity=".8"><path d="M16 0a16 16 0 0 0 0 32 16 16 0 0 0 0-32m0 4a12 12 0 0 1 0 24 12 12 0 0 1 0-24" fill="#000" opacity=".5"/><path d="M16 0a16 16 0 0 1 16 16h-4A12 12 0 0 0 16 4z"/></svg>',(s=q[P]("DIV")).id="bp_sv",(f=q[P]("IFRAME")).setAttribute("allowfullscreen",!0),f.allow="autoplay; fullscreen",f.onload=ot,et(f,"border:0;position:absolute;height:100%;width:100%;left:0;top:0"),s[B](f),p.onload=ot,p.onerror=ot.bind(null,"image"),O[U]("resize",function(){w||b&&Q(!0)}),q[U]("keyup",function(t){var o=t.keyCode;27===o&&y&&nt(a),w&&(39===o&&j(1),37===o&&j(-1),38===o&&j(10),40===o&&j(-10))}),q[U]("keydown",function(t){w&&~[37,38,39,40].indexOf(t.keyCode)&&t.preventDefault()}),q[U]("focus",function(t){y&&!a.contains(t.target)&&(t.stopPropagation(),d.focus())},!0),e=!0}(),b&&(Y(o),rt()),u=(L=t).ytSrc||t.vimeoSrc,S=t.animationStart,A=t.animationEnd,E=t.onChangeImage,r=t.el,k=!1,x=r.getAttribute("data-caption"),t.gallery?function(t){if(Array.isArray(t))x=(C=t)[I=0].caption;else{var o=(C=[].slice.call("string"==typeof t?q.querySelectorAll(t+" [data-bp]"):t)).indexOf(r);I=-1!==o?o:0,C=C.map(function(t){return{el:t,src:t.getAttribute("data-bp"),caption:t.getAttribute("data-caption")}})}k=!0,n=C[I].src,~N.indexOf(n)||Q(!0),1<C.length?(a[B](T),T[R]=I+1+"/"+C.length,D||(a[B](M),a[B](z))):C=!1;(i=p).src=n}(t.gallery):u||t.iframeSrc?(Q(!0),i=s,function(){var t,o="https://",n="autoplay=1";L.ytSrc?t=o+"www.youtube.com/embed/"+u+"?html5=1&rel=0&playsinline=1&"+n:L.vimeoSrc?t=o+"player.vimeo.com/video/"+u+"?"+n:L.iframeSrc&&(t=L.iframeSrc);f.src=t}()):t.imgSrc?(k=!0,n=t.imgSrc,~N.indexOf(n)||Q(!0),(i=p).src=n):t.audio?(Q(!0),(i=l).src=t.audio,K("audio file")):t.vidSrc?(Q(!0),function(t){Array.isArray(t)?(i=c.cloneNode(),t.forEach(function(t){var o=q[P]("SOURCE");o.src=t,o.type="video/"+t.match(/.(\w+)$/)[1],i[B](o)})):(i=c).src=t}(t.vidSrc),K("video")):(i=p).src="IMG"===r.tagName?r.src:O.getComputedStyle(r).backgroundImage.replace(/^url|[(|)|'|"]/g,""),a[B](i),q.body[B](a)}}();
(1-1/4)