-
Notifications
You must be signed in to change notification settings - Fork 0
/
443.5ea2e6fcb640571c15fb.js
1 lines (1 loc) · 12.3 KB
/
443.5ea2e6fcb640571c15fb.js
1
(self.webpackChunkmuzli_colors=self.webpackChunkmuzli_colors||[]).push([[443],{6443:(t,n,e)=>{"use strict";e.r(n),e.d(n,{LandingModule:()=>b});var o=e(8583),i=e(4152),a=e(2023),s=e(6766),c=e(639),g=e(9075),r=e(7354);const l=["imageElement"],p=["canvasElement"],h=[{path:"",component:(()=>{class t{constructor(t,n,e,o,i){this.router=t,this.title=n,this.trackingService=e,this.headerService=o,this.utils=i,this.backgroundCDNDomain="https://files.muzli.space/",this.backgroundImages=[{cdn:"bg_1.jpg",link:"https://www.behance.net/gallery/72207463/Illustrations-2018"},{cdn:"bg_2.jpg",link:"https://www.behance.net/gallery/65687821/Various-illustration-2018"},{cdn:"bg_3.jpg",link:"https://500px.com/photo/283531165/little-miss-sassy-pants-by-lisa-holloway"},{cdn:"bg_4.jpeg",link:"https://unsplash.com/photos/MxCjXK3qlvQ"},{cdn:"bg_5.jpeg",link:"https://unsplash.com/photos/LgKzepKFWlE"},{cdn:"bg_6.jpeg",link:"https://unsplash.com/photos/cO5-QcKIR9o"},{cdn:"bg_7.jpeg",link:"https://unsplash.com/photos/phL5D_w848M"},{cdn:"bg_8.jpeg",link:"https://unsplash.com/photos/4sw0XzyS0lM"},{cdn:"bg_9.jpeg",link:"https://unsplash.com/photos/p4NO3i9r5es"},{cdn:"bg_10.png",link:"https://dribbble.com/shots/5462510-Dashboard-HD2"},{cdn:"bg_11.jpg",link:"https://www.outlineartists.com/lauren-rolwing"},{cdn:"bg_12.jpeg",link:"https://unsplash.com/photos/83N2SjI-iE8"},{cdn:"bg_13.jpg",link:"https://www.behance.net/gallery/72797939/An-Anthology-Vol2"},{cdn:"bg_14.png",link:"https://www.behance.net/gallery/72761991/Tryggd"},{cdn:"bg_15.jpg",link:"https://unsplash.com/photos/Uy9Bh-kmt3s"},{cdn:"bg_16.jpg",link:"https://www.artstation.com/artwork/QZ3RL"},{cdn:"bg_17.jpg",link:"https://www.behance.net/gallery/69081333/b-b-Magazine-no1"},{cdn:"bg_18.jpg",link:"https://unsplash.com/photos/kJFzlWhFlnE"},{cdn:"bg_19.jpg",link:"https://www.behance.net/gallery/73667037/Country-Living-Room"},{cdn:"bg_20.jpg",link:"https://unsplash.com/photos/FQhYGMZ_H_4"},{cdn:"bg_21.jpg",link:"https://www.artstation.com/artwork/V99q8"},{cdn:"bg_22.jpg",link:"https://unsplash.com/photos/favQn8WgRyk"},{cdn:"bg_23.jpg",link:"https://www.behance.net/gallery/72250123/Paint-me-up"},{cdn:"bg_24.jpg",link:"https://unsplash.com/photos/dxk6tMxNkJY"},{cdn:"bg_25.jpg",link:"https://unsplash.com/photos/F-B7kWlkxDQ"},{cdn:"bg_26.jpg",link:"https://www.behance.net/gallery/29956627/By-the-Sea-Campaign"},{cdn:"bg_27.jpg",link:"https://unsplash.com/photos/erESYSKW2ms"},{cdn:"bg_28.jpg",link:"https://www.artstation.com/artwork/aRRr32"},{cdn:"bg_29.jpg",link:"https://unsplash.com/photos/JGYU58CbT-g"},{cdn:"bg_30.gif",link:"https://www.behance.net/gallery/73388793/Nivea-MicellAIR"},{cdn:"bg_31.png",link:"https://www.behance.net/gallery/70593013/Luxury-Concept-World-Concierge-Boutique"},{cdn:"bg2_1.jpg",link:"https://www.behance.net/gallery/65124013/Stories-about-death?tracking_source=for_you_galleries"},{cdn:"bg2_2.jpg",link:"https://www.behance.net/gallery/79960317/Panthero?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_3.jpg",link:"https://www.behance.net/gallery/80894611/Architectural-Explorations?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_4.jpg",link:"https://www.behance.net/gallery/80828265/Enjoy-Life?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_5.jpg",link:"https://www.behance.net/gallery/75808333/Randomix-5?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_6.jpg",link:"https://www.behance.net/gallery/80481841/BRANDING-O-Japthai-Restaurant-Street-Lounge?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_7.jpg",link:"https://www.behance.net/gallery/78549019/TWINS-LM-CHABOT?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_8.jpg",link:"https://www.behance.net/gallery/78353929/APP-STORE?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_9.jpg",link:"https://www.behance.net/gallery/76643265/Escaping-Reality-Vol-IVXX?tracking_source=best_of_behance_big_covers"},{cdn:"bg2_10.jpg",link:"https://www.behance.net/gallery/76762823/Ellington?tracking_source=curated_galleries_list"},{cdn:"bg2_11.jpg",link:"https://www.artstation.com/artwork/xzePdY"},{cdn:"bg2_12.jpg",link:"https://www.artstation.com/artwork/bamaLg"},{cdn:"bg2_13.jpg",link:"https://www.artstation.com/artwork/rRZGbO"},{cdn:"bg2_14.jpg",link:"https://www.artstation.com/artwork/qAORqz"},{cdn:"bg2_15.jpg",link:"https://www.artstation.com/artwork/mqW6Ne"},{cdn:"bg2_16.jpg",link:"https://www.artstation.com/artwork/oOQ1rJ"},{cdn:"bg2_17.jpg",link:"https://www.artstation.com/artwork/gJV6wP"},{cdn:"bg2_18.jpg",link:"https://www.artstation.com/artwork/6Ybo0"},{cdn:"bg2_19.jpg",link:"https://www.artstation.com/artwork/mq1v81"},{cdn:"bg2_20.jpg",link:"https://www.artstation.com/artwork/xz2134"},{cdn:"bg2_21.jpg",link:"https://unsplash.com/photos/EK1vH8JhI_4"},{cdn:"bg2_22.jpg",link:"https://unsplash.com/photos/IsAq-hI1HAo"},{cdn:"bg2_23.jpg",link:"https://unsplash.com/photos/8nAvFWUig3c"},{cdn:"bg2_24.jpg",link:"https://unsplash.com/photos/Z9BRZxOIF5o"},{cdn:"bg2_25.jpg",link:"https://unsplash.com/photos/YVmNMemO4E0"},{cdn:"bg2_26.jpg",link:"https://unsplash.com/photos/F9nmj3CRvAM"},{cdn:"bg2_27.jpg",link:"https://unsplash.com/photos/S2Q5mdOrrVc"},{cdn:"bg2_28.jpg",link:"https://unsplash.com/photos/uLkq8BJu8FU"},{cdn:"bg2_29.jpg",link:"https://unsplash.com/photos/bOKIptPzdPk"},{cdn:"bg2_30.jpg",link:"https://unsplash.com/photos/iUHd5H6NWH0"},{cdn:"bg2_31.jpg",link:"https://ello.co/abdohassan/post/vamovrhyi3yhurhf4cz9lw"},{cdn:"bg2_32.jpg",link:"https://ello.co/abdohassan/post/vamovrhyi3yhurhf4cz9lw"},{cdn:"bg2_33.jpg",link:"https://ello.co/ellodesign/post/xnnsx48vsmpagv9ngkloaa"}],this.componentToHex=function(t){var n=t.toString(16);return 1==n.length?"0"+n:n},this.rgbToHex=function(t,n,e){return"#"+this.componentToHex(t)+this.componentToHex(n)+this.componentToHex(e)},this.useCanvas=function(t,n,e){return this.isCanvasGenerated||(t.width=n.width,t.height=n.height,this.drawImageProp(t.getContext("2d"),n),this.isCanvasGenerated=!0),e()},this.randomizeBackground=function(t){t&&(t.preventDefault(),t.stopPropagation(),this.trackingService.trackEvent("landing","randomize"));let n=this.backgroundImages.length;this.backgroundIndex=Math.floor(Math.random()*n),this.isCanvasGenerated=!1},this.pickColor=function(t){t&&this.trackingService.trackEvent("landing","pick color");let n,e,o=this,i=this.canvasElement.nativeElement;t.offsetX?(n=t.offsetX,e=t.offsetY):t.layerX&&(n=t.layerX,e=t.layerY),this.useCanvas(i,this.imageElement.nativeElement,function(){let t=i.getContext("2d").getImageData(n,e,1,1).data,a=o.rgbToHex(t[0],t[1],t[2]);o.router.navigate(["/","search",a])})}}drawImageProp(t,n,e,o,i,a,s,c){2===arguments.length&&(e=o=0,i=t.canvas.width,a=t.canvas.height),(s="number"==typeof s?s:.5)<0&&(s=0),(c="number"==typeof c?c:.5)<0&&(c=0),s>1&&(s=1),c>1&&(c=1);var g,r,l,p,h=n.naturalWidth,d=n.naturalHeight,b=Math.min(i/h,a/d),m=h*b,_=d*b,w=1;m<i&&(w=i/m),Math.abs(w-1)<1e-14&&_<a&&(w=a/_),(g=(h-(l=h/((m*=w)/i)))*s)<0&&(g=0),(r=(d-(p=d/((_*=w)/a)))*c)<0&&(r=0),l>h&&(l=h),p>d&&(p=d),t.drawImage(n,g,r,l,p,e,o,i,a)}ngOnInit(){let t,n,e=this,o=this.imageElement.nativeElement,i=this.canvasElement.nativeElement;window.scrollTo(0,0),this.randomizeBackground(),this.title.setTitle("Search by Muzli"),o.addEventListener("load",function(a){e.colorTracked&&o.removeEventListener("mousemove",e.colorTracked),e.useCanvas(i,o,function(){e.colorTracked=o.addEventListener("mousemove",function(a){a.offsetX?(t=a.offsetX,n=a.offsetY):a.layerX&&(t=a.layerX,n=a.layerY);let s=i.getContext("2d").getImageData(t,n,1,1).data,c=e.rgbToHex(s[0],s[1],s[2]).slice(1);o.style.cursor=`url("data:image/svg+xml,%3Csvg version='1.1' baseProfile='full' width='32px' height='32px' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle stroke='%23FFFFFF' stroke-width='3' fill='%23${c}' stroke-linejoin='square' fill-rule='evenodd' shape-rendering='optimizeQuality' cx='16' cy='16' r='13'%3E%3C/circle%3E%3C/svg%3E") 16 16, pointer`})})})}ngOnDestroy(){this.imageElement.nativeElement.removeEventListener("mousemove",this.colorTracked)}}return t.\u0275fac=function(n){return new(n||t)(c.Y36(i.F0),c.Y36(g.Dx),c.Y36(a.e),c.Y36(r.r),c.Y36(s.F))},t.\u0275cmp=c.Xpm({type:t,selectors:[["app-landing"]],viewQuery:function(t,n){if(1&t&&(c.Gf(l,7),c.Gf(p,7)),2&t){let t;c.iGM(t=c.CRH())&&(n.imageElement=t.first),c.iGM(t=c.CRH())&&(n.canvasElement=t.first)}},decls:15,vars:3,consts:[[1,"wrapper"],[1,"content"],[1,"images"],["crossorigin","anonymous",1,"image",3,"src","click"],["imageElement",""],[2,"display","none"],["canvasElement",""],[1,"credits"],["target","_blank",3,"href"],[1,"cta"],["href","",3,"click"]],template:function(t,n){1&t&&(c.TgZ(0,"main"),c.TgZ(1,"div",0),c.TgZ(2,"div",1),c.TgZ(3,"div",2),c.TgZ(4,"img",3,4),c.NdJ("click",function(t){return n.pickColor(t)}),c.qZA(),c._UZ(6,"canvas",5,6),c.qZA(),c.TgZ(8,"div",7),c._uU(9," Via "),c.TgZ(10,"a",8),c._uU(11),c.qZA(),c.qZA(),c.TgZ(12,"div",9),c.TgZ(13,"a",10),c.NdJ("click",function(t){return n.randomizeBackground(t)}),c._uU(14,"Random Photo"),c.qZA(),c.qZA(),c.qZA(),c.qZA(),c.qZA()),2&t&&(c.xp6(4),c.s9C("src",n.backgroundCDNDomain+n.backgroundImages[n.backgroundIndex].cdn,c.LSH),c.xp6(6),c.s9C("href",n.backgroundImages[n.backgroundIndex].link,c.LSH),c.xp6(1),c.Oqu(n.utils.getHostname(n.backgroundImages[n.backgroundIndex].link)))},styles:['main[_ngcontent-%COMP%]{position:relative;display:block;text-align:center;min-height:100%;padding:0;box-sizing:border-box;align-items:center}main[_ngcontent-%COMP%] .mobile-cta[_ngcontent-%COMP%]{display:none}main[_ngcontent-%COMP%] .wrapper[_ngcontent-%COMP%]{position:relative;white-space:nowrap;display:inline-block;margin:0 auto}main[_ngcontent-%COMP%] .test[_ngcontent-%COMP%]{width:100px;height:100px;background:#fff;position:absolute;left:200px;top:200px}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%]{position:relative;background:#fff;padding:0;box-sizing:border-box;margin:0;width:100vw;height:calc(100vh)}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%]:before{content:"";position:absolute;left:0;bottom:0;top:0;right:0;pointer-events:none;background:#0000004d}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%] .image[_ngcontent-%COMP%]{width:100%;height:100%;object-fit:cover}main[_ngcontent-%COMP%] .credits[_ngcontent-%COMP%]{position:absolute;left:0;bottom:0;color:#fff;font-size:12px;padding:20px}main[_ngcontent-%COMP%] .credits[_ngcontent-%COMP%] a[_ngcontent-%COMP%]{color:#fff}main[_ngcontent-%COMP%] .cta[_ngcontent-%COMP%]{position:absolute;right:0;bottom:0}main[_ngcontent-%COMP%] .cta[_ngcontent-%COMP%] a[_ngcontent-%COMP%]{height:30px;line-height:30px;padding:0 15px;text-align:center;text-decoration:none;display:inline-block;float:right;letter-spacing:.9px;background:#fff3;color:#fff;margin:20px;font-size:12px;border-radius:2px;transition:all .15s ease-in}main[_ngcontent-%COMP%] .cta[_ngcontent-%COMP%] a[_ngcontent-%COMP%]:hover{background:#ffffff80}main[_ngcontent-%COMP%] .ph[_ngcontent-%COMP%]{position:absolute;right:0;bottom:0;color:#fff;font-size:12px;margin:40px}@media (max-width:840px){main[_ngcontent-%COMP%]{height:100vh}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%]{padding:0}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%]:before{left:0;bottom:0;top:0;right:0}main[_ngcontent-%COMP%] .images[_ngcontent-%COMP%] .image[_ngcontent-%COMP%]{pointer-events:none}main[_ngcontent-%COMP%] .mobile-cta[_ngcontent-%COMP%]{display:block;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10;width:100%}main[_ngcontent-%COMP%] .mobile-cta[_ngcontent-%COMP%] h1[_ngcontent-%COMP%]{padding:0 20%;box-sizing:border-box;white-space:normal;width:100%}main[_ngcontent-%COMP%] .camera[_ngcontent-%COMP%]{margin:0 auto;display:block;font-size:26px;border-radius:50%;cursor:pointer;width:25vw;height:25vw;background:#fff;color:#616368;line-height:26vw;text-decoration:none;border:2px solid #e5e5e5;position:relative}main[_ngcontent-%COMP%] .camera[_ngcontent-%COMP%]:before{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px;border-radius:50%;background:#fff;z-index:-1}main[_ngcontent-%COMP%] .credits[_ngcontent-%COMP%]{padding:20px}main[_ngcontent-%COMP%] .cta[_ngcontent-%COMP%]{right:0;bottom:0}}']}),t})()}];let d=(()=>{class t{}return t.\u0275fac=function(n){return new(n||t)},t.\u0275mod=c.oAB({type:t}),t.\u0275inj=c.cJS({imports:[[i.Bz.forChild(h)],i.Bz]}),t})(),b=(()=>{class t{}return t.\u0275fac=function(n){return new(n||t)},t.\u0275mod=c.oAB({type:t}),t.\u0275inj=c.cJS({imports:[[d,o.ez]]}),t})()}}]);