1(this["webpackJsonpsyn-dof-website"]=this["webpackJsonpsyn-dof-website"]||[]).push([[0],[,,,,,,,,,,function(e,t,a){e.exports=a.p+"static/media/teaser-splash.f4be8393.jpg"},function(e,t,a){e.exports=a.p+"static/media/paper.459f4fa0.jpg"},function(e,t,a){e.exports=a.p+"static/media/6644.cfb73c1a.png"},function(e,t,a){e.exports=a.p+"static/media/1597.396cb7d6.png"},function(e,t,a){e.exports=a.p+"static/media/1812.7ac413ba.png"},function(e,t,a){e.exports=a.p+"static/media/2111.2415a0c1.png"},function(e,t,a){e.exports=a.p+"static/media/2332.2bc6dfba.png"},function(e,t,a){e.exports=a.p+"static/media/3001.b0c6fc74.png"},function(e,t,a){e.exports=a.p+"static/media/2368.2c45b585.png"},function(e,t,a){e.exports=a.p+"static/media/1618.baf5e03c.png"},function(e,t,a){e.exports=a.p+"static/media/2288.23fc0f73.png"},function(e,t,a){e.exports=a.p+"static/media/1622.88655be0.png"},function(e,t,a){e.exports=a.p+"static/media/2242.9e4461c1.png"},function(e,t,a){e.exports=a.p+"static/media/6475.e7775965.png"},function(e,t,a){e.exports=a.p+"static/media/6354.453159c1.png"},function(e,t,a){e.exports=a.p+"static/media/2482.a7b06d27.png"},function(e,t,a){e.exports=a.p+"static/media/0192.7e3b53a0.png"},function(e,t,a){e.exports=a.p+"static/media/12-s.559dc5a9.jpg"},function(e,t,a){e.exports=a.p+"static/media/12-l.f5c0cfb4.jpg"},function(e,t,a){e.exports=a.p+"static/media/52-s.f2aba3bb.jpg"},function(e,t,a){e.exports=a.p+"static/media/52-l.4ccb9ec6.jpg"},function(e,t,a){e.exports=a.p+"static/media/115-s.88d87b21.jpg"},function(e,t,a){e.exports=a.p+"static/media/115-l.94d96f4f.jpg"},function(e,t,a){e.exports=a.p+"static/media/526-s.d3f9c86f.jpg"},function(e,t,a){e.exports=a.p+"static/media/526-l.3b28311b.jpg"},function(e,t,a){e.exports=a.p+"static/media/end.36c5c3e3.jpg"},function(e,t,a){e.exports=a.p+"static/media/1701-s.b8fe2007.jpg"},function(e,t,a){e.exports=a.p+"static/media/1701-l1.2aae6937.jpg"},function(e,t,a){e.exports=a.p+"static/media/1701-l2.6f88e903.jpg"},function(e,t,a){e.exports=a.p+"static/media/1067-s.104490c1.jpg"},function(e,t,a){e.exports=a.p+"static/media/1067-l1.68c3382a.jpg"},function(e,t,a){e.exports=a.p+"static/media/1067-l2.57db942f.jpg"},function(e,t,a){e.exports=a.p+"static/media/0020-s.f975d7aa.jpg"},function(e,t,a){e.exports=a.p+"static/media/0020-l1.470d078e.jpg"},function(e,t,a){e.exports=a.p+"static/media/0020-l2.399cbf35.jpg"},function(e,t,a){e.exports=a.p+"static/media/1054-s.677a4702.jpg"},function(e,t,a){e.exports=a.p+"static/media/1054-l1.53b8a151.jpg"},function(e,t,a){e.exports=a.p+"static/media/1054-l2.dbe7c4cd.jpg"},function(e,t,a){e.exports=a.p+"static/media/end.113df01f.jpg"},function(e,t,a){e.exports=a.p+"static/media/58-s.ae3a3744.jpg"},function(e,t,a){e.exports=a.p+"static/media/58-m.dfb7d702.jpg"},function(e,t,a){e.exports=a.p+"static/media/58-l.2738c234.jpg"},function(e,t,a){e.exports=a.p+"static/media/116-s.c306b9b9.jpg"},function(e,t,a){e.exports=a.p+"static/media/116-m.33cf4018.jpg"},function(e,t,a){e.exports=a.p+"static/media/116-l.66434427.jpg"},function(e,t,a){e.exports=a.p+"static/media/180-s.c9a93efe.jpg"},function(e,t,a){e.exports=a.p+"static/media/180-m.359e427c.jpg"},function(e,t,a){e.exports=a.p+"static/media/180-l.f937524d.jpg"},function(e,t,a){e.exports=a.p+"static/media/309-s.e4317806.jpg"},function(e,t,a){e.exports=a.p+"static/media/309-m.859753d0.jpg"},function(e,t,a){e.exports=a.p+"static/media/309-l.c3d62249.jpg"},function(e,t,a){e.exports=a.p+"static/media/end.2951231c.jpg"},function(e,t,a){e.exports=a(80)},,,,,,function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){e.exports=a.p+"static/media/5030.b38dad52.png"},function(e,t,a){e.exports=a.p+"static/media/6338.6202697e.png"},function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){},function(e,t,a){"use strict";a.r(t);var n=a(0),s=a.n(n),r=a(8),o=a.n(r),c=a(9),l=a.n(c),i=(a(68),a(1)),m=a(2),d=a(4),u=a(3),p=a(5),f=(a(69),a(6)),h=(a(70),function(e){var t,a=e.name,n=e.link;return s.a.createElement("div",{className:"contrib-names__name"},s.a.createElement("a",{href:n,target:"_blank",style:(t={},Object(f.a)(t,"text-decoration","none"),Object(f.a)(t,"color","#aaaaaa"),t)},a))}),b=function(e){var t=e.name;return s.a.createElement("div",{className:"contrib-locations__name"},t)},v=function(){var e;return s.a.createElement("header",{className:"header margin"},s.a.createElement("div",{className:"fixed-header"},s.a.createElement("h1",null,s.a.createElement("a",{href:"https://people.eecs.berkeley.edu/~cecilia77/#research"},"Back to research"))),s.a.createElement("div",{className:"header-title"}
1,"Synthetic Defocus and Look-Ahead Autofocus ",s.a.createElement("br",null)," for Casual Videography"),s.a.createElement("div",{className:"header-contrib"},s.a.createElement("div",{className:"contrib-names"},s.a.createElement(h,{name:"Xuaner Zhang",link:"https://people.eecs.berkeley.edu/~cecilia77/"}),s.a.createElement(h,{name:"Kevin Matzen*",link:"https://research.fb.com/people/matzen-kevin/"}),s.a.createElement(h,{name:"Vivien Nguyen",link:"https://viviehn.github.io"}),s.a.createElement(h,{name:"Dillon Yao",link:"https://yaoius.github.io"}),s.a.createElement(h,{name:"You Zhang\u2020",link:"https://vimeo.com/231404372"}),s.a.createElement(h,{name:"Ren Ng",link:"https://www2.eecs.berkeley.edu/Faculty/Homepages/yirenng.html"})),s.a.createElement("div",{className:"contrib-locations"},s.a.createElement(b,{name:"EECS, UC Berkeley"}),s.a.createElement(b,{name:"Facebook Research*"}),s.a.createElement(b,{name:"Independent Filmmaker\u2020"})),s.a.createElement("p",null),s.a.createElement("div",{className:"contrib-locations__name"},s.a.createElement("i",null,s.a.createElement("a",{href:"https://s2019.siggraph.org",target:"_blank",style:(e={},Object(f.a)(e,"text-decoration","none"),Object(f.a)(e,"color","#aaaaaa"),e)},"SIGGRAPH 2019")))))},g=(a(71),a(10)),E=a.n(g),y=a(11),x=a.n(y),w=function(e){return function(){document.getElementById(e).scrollIntoView({block:"start",inline:"nearest",behavior:"smooth"})}},k=function(){return s.a.createElement("div",{className:"teaser"},s.a.createElement("div",{className:"teaser-splash card"},s.a.createElement("img",{alt:"teaser-splash",src:E.a})),s.a.createElement("div",{className:"teaser-toc"},s.a.createElement("span",{onClick:w("st-paper")},"Paper"),s.a.createElement("span",{onClick:w("st-renderer")},"Renderer"),s.a.createElement("span",{onClick:w("st-results")},"Results"),s.a.createElement("span",{onClick:w("st-dataset")},"Dataset")),s.a.createElement("div",{id:"st-paper",className:"resources"},s.a.createElement("div",{className:"paper-container"},s.a.createElement("div",{className:"paper card"},s.a.createElement("img",{alt:"paper-cover",src:x.a})),s.a.createElement("a",{target:"_blank",rel:"noopener noreferrer",href:"https://dl.acm.org/citation.cfm?id=3323015"},"Paper")),s.a.createElement("div",{className:"video"},s.a.createElement("div",{className:"video-container"},s.a.createElement("iframe",{title:"overview-video",src:"https://www.youtube.com/embed/5XM_rw0HnAc",width:"360",height:"288"})),s.a.createElement("a",{target:"_blank",rel:"noopener noreferrer",href:"https://youtu.be/5XM_rw0HnAc"},"Demo Video")),s.a.createElement("div",{className:"video"},s.a.createElement("div",{className:"video-container"},s.a.createElement("iframe",{title:"SIGGRAPH-presentation",src:"https://youtube.com/embed/j5UIxaCX9T0",width:"360",height:"288"})),s.a.createElement("a",{target:"_blank",rel:"noopener noreferrer",href:"https://youtu.be/j5UIxaCX9T0"},"SIGGRAPH Presentation Recording"))))},N=(a(72),function(){return s.a.createElement("div",{className:"spinner"},s.a.createElement("div",{className:"rect1"}),s.a.createElement("div",{className:"rect2"}),s.a.createElement("div",{className:"rect3"}),s.a.createElement("div",{className:"rect4"}),s.a.createElement("div",{className:"rect5"}))}),j=(a(73),function(e){function t(e){var a;Object(i.a)(this,t),(a=Object(d.a)(this,Object(u.a)(t).call(this,e))).onReady=function(e){if(!(++a.ready<a.videos.length)){var t=!0,n=!1,s=void 0;try{for(var r,o=a.videos[Symbol.iterator]();!(t=(r=o.next()).done);t=!0){var c=r.value;c.removeEventListener("error",a.onError),c.removeEventListener("canplaythrough",a.onReady),c.addEventListener("ended",a.onEnded)}}catch(l){n=!0,s=l}finally{try{t||null==o.return||o.return()}finally{if(n)throw s}}a.setState({ready:!0},(function(){a.props.vertical&&a.captionEl.current&&(a.setCaptionSize(),window.addEventListener("resize",a.onResize)),a.props.noAutoplay||window.setTimeout((function(){return a.onPlay()}),200)}))}},a.onResize=function(e){a.setCaptionSize()},a.onError=function(e){a.setState({error:e})},a.onClick=function(e){var t=e.target;t.controls||(a.onPause(),a.setFullscreen(t))},a.onTogglePlayback=function(e){a.state.playing?a.onPause():a.onPlay()},a.setFullscreen=function(e){e.controls=!0,e.currentTime=0,e.muted=a.props.mute,e.width=e.videoWidth,e.height=e.videoHeight,e.removeEventListener("ended",a.onEnded),e.classList.add("video-fs"),a.fsLayer.current.classList.add("active"),a.fsVideo=e},a.onExitFullscreen=function(e){var t=a.fsVideo;t.pause(),t.loop=!1,t===a.vidRefs[0].current?t.muted=a.props.mute:t.muted=!0,t.width=a.props.width||400,t.removeAttribute("height"),t.removeAttribute("controls"),t.addEventListener("ended",a.onEnded),t.classList.remove("video-fs"),a.fsLayer.current.classList.remove("active"),a.sync(0)},a.onPlay=function(e){if(e||!a.state.playing){var t=!0,n=!1,s=void 0;try{for(var r,o=a.videos[Symbol.iterator]();!(t=(r=o.next()).done);t=!0){r.value.play()}}catch(c){n=!0,s=c}finally{try{t||null==o.return||o.return()}finally{if(n)throw s}}a.setState({playing:!0})}},a.onPause=function(){if(a.state.playing){var e=!0,t=!1,n=void 0;try{for(var s,r=a.videos[Symbol.iterator]();!(e=(s=r.next()).done);e=!0){s.value.pause()}}catch(o){t=!0,n=o}finally{try{e||null==r.return||r.return()}finally{if(t)throw n}}a.sync(),a.setState({playing:!1})}},a.onEnded=function(e){a.sync(0),a.onPlay(!0)},a.sync=function(e){var t=void 0!==e?e:a.videos[0].currentTime,n=!0,s=!1,r=void 0;try{for(var o,c=a.videos[Symbol.iterator]();!(n=(o=c.next()).done);
1n=!0){o.value.currentTime=t}}catch(l){s=!0,r=l}finally{try{n||null==c.return||c.return()}finally{if(s)throw r}}},a.state={ready:!1,playing:!1,error:null};var n=e.sources.length;for(a.vidRefs=[];n--;)a.vidRefs[n]=s.a.createRef();return a.captionEl=s.a.createRef(),a.fsLayer=s.a.createRef(),a.fsVideo=null,a.processingReset=!1,a.ready=0,a}return Object(p.a)(t,e),Object(m.a)(t,[{key:"componentDidMount",value:function(){this.videos=this.vidRefs.map((function(e){return e.current}));var e=!0,t=!1,a=void 0;try{for(var n,s=this.videos[Symbol.iterator]();!(e=(n=s.next()).done);e=!0){var r=n.value;r.addEventListener("error",this.onError),r.addEventListener("canplaythrough",this.onReady)}}catch(o){t=!0,a=o}finally{try{e||null==s.return||s.return()}finally{if(t)throw a}}}},{key:"componentWillUnmount",value:function(){window.removeEventListener("resize",this.onResize)}},{key:"setCaptionSize",value:function(){var e=this.props.sources.length*this.props.width+48,t=(window.innerWidth-e)/2;this.captionEl.current.style.maxWidth="".concat(t,"px")}},{key:"render",value:function(){var e=this,t=this.props,a=t.name,n=t.sources,r=t.labels,o=t.mute,c=t.vertical,l=t.width,i=void 0===l?400:l,m=t.close,d=t.caption;return s.a.createElement("div",{className:"video-compare-container"},s.a.createElement("div",{className:"fs-layer",ref:this.fsLayer},s.a.createElement("span",{className:"close",onClick:this.onExitFullscreen},s.a.createElement("ion-icon",{name:"close"}))),s.a.createElement("div",{className:"video-compare ".concat(c?"vertical":"")},n.map((function(t,n){return s.a.createElement("div",{className:"video-compare__video",key:"".concat(a,"-").concat(n)},s.a.createElement("div",{className:"label"},r[n]),s.a.createElement("video",{src:t,width:i,ref:e.vidRefs[n],onClick:e.onClick,muted:0!==n||o}))})),!this.state.ready&&(this.state.error?s.a.createElement("div",{className:"error"},s.a.createElement("div",{className:"error-message"},s.a.createElement("span",{className:"warning-icon"},s.a.createElement("ion-icon",{name:"information-circle"})),"A video file could not be loaded")):s.a.createElement("div",{className:"loading"},s.a.createElement(N,null)))),this.state.ready&&d&&s.a.createElement("div",{className:c?"caption vertical":"caption",ref:this.captionEl},s.a.createElement("div",{className:"caption-text"},d)),s.a.createElement("div",{className:"controls"},s.a.createElement("span",{onClick:this.onTogglePlayback},s.a.createElement("ion-icon",{name:this.state.playing?"pause":"play"})),m&&s.a.createElement("span",{className:"close",onClick:m},s.a.createElement("ion-icon",{name:"close"}))))}}]),t}(s.a.Component)),L=["https://dl.dropboxusercontent.com/s/l58zz44yg1weiu6/1776_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/j5q0ibcz9u7fbej/1776_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/j8sbdinz1r5z3zn/1776_temp.mp4?dl=0"],_=["https://dl.dropboxusercontent.com/s/7w7pjauzzwsiehr/1992_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/w4cq12dlozjkeqo/1992_no_s.mp4?dl=0","https://dl.dropboxusercontent.com/s/ukegqhvdyv25ca1/1992_s.mp4?dl=0"],R=function(e){return s.a.createElement("div",{id:"st-renderer",className:"body-top"},s.a.createElement("div",{className:"row"},s.a.createElement("h2",{className:"indent"},s.a.createElement("center",null,"Temporal Consistency")),s.a.createElement(j,{name:"tc",sources:L,height:400,width:212.5,vertical:!0,noAutoplay:!0,mute:!0,labels:["input","w/o consistency","w/ consistency"]})),s.a.createElement("div",{className:"row"},s.a.createElement("h2",{className:"indent"},s.a.createElement("center",null,"High Dynamic Range (HDR) Recovery")),s.a.createElement(j,{name:"hdr",sources:_,heigh:212.5,width:400,noAutoplay:!0,mute:!0,labels:["input","w/o HDR","w/ HDR"]})))},A=function(e){return s.a.createElement("div",{className:"gallery-border",onClick:e.onSelect},s.a.createElement("div",{className:"gallery-content__item"},s.a.createElement("img",{src:e.item.thumbnail}),s.a.createElement("div",{className:"label"},e.item.label)))},O=function(e){return s.a.createElement("div",{className:"gallery"},s.a.createElement("div",{className:"gallery-content"},e.items.map((function(t,a){return s.a.createElement(A,{key:"gallery-".concat(a),item:t,onSelect:function(){return e.onSelect(t)}})}))))},C=a(12),S={results:[{label:"Market Comparison",thumbnail:a.n(C).a,sublabels:["Input","LAAF Autofocus","Olympus E-M 1 Mark II Autofocus"],sources:["https://dl.dropboxusercontent.com/s/dfyz23sfb4r5qr4/6644_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/antytair6kdqsbj/6644_market.mp4?dl=0","https://dl.dropboxusercontent.com/s/9bugu2ty242ysqp/6644_anno.mp4?dl=0"],caption:"State-of-the-art camera autofocus suffers from inaccurate and delayed focus, while LAAF is able to set accurate focus in a timely manner."}]},z=a(13),F=a.n(z),M=a(14),q=a.n(M),H=a(15),I=a.n(H),D=a(16),W=a.n(D),B=["In
1put","Foreground Focus","Background Focus"],T={results:[{label:"Flower-1",thumbnail:F.a,sublabels:B,sources:["https://dl.dropboxusercontent.com/s/6o7f3su7vbtqufm/input.mp4?dl=0","https://dl.dropboxusercontent.com/s/hq0iwecmcua16vu/focus_optical.mp4?dl=0","https://dl.dropboxusercontent.com/s/affxe30xydzj2ly/focus_back.mp4?dl=0"],width:212.5,vertical:!0},{label:"Beach",thumbnail:W.a,sublabels:B,sources:["https://dl.dropboxusercontent.com/s/vw50slatpr6mbz7/input.mp4?dl=0","https://dl.dropboxusercontent.com/s/45kvira86ba6n7t/focus_front.mp4?dl=0","https://dl.dropboxusercontent.com/s/m0ussxnwha8f66p/focus_back.mp4?dl=0"]},{label:"Fruit",thumbnail:I.a,sublabels:B,sources:["https://dl.dropboxusercontent.com/s/a42nbffw4edhfk6/input.mp4?dl=0","https://dl.dropboxusercontent.com/s/fzcnquxy6kouzvm/focus_front.mp4?dl=0","https://dl.dropboxusercontent.com/s/2v6ihrurk8gzir9/focus_back.mp4?dl=0"]},{label:"Flower-2",thumbnail:q.a,sublabels:B,sources:["https://dl.dropboxusercontent.com/s/xlqu6bddluy2lgx/input.mp4?dl=0","https://dl.dropboxusercontent.com/s/glupeqnjs4bz6ea/focus_front.mp4?dl=0","https://dl.dropboxusercontent.com/s/b6ilzic1fp2mzib/focus_back.mp4?dl=0"],width:212.5,vertical:!0}]},P=a(17),G=a.n(P),U=(a(74),a(18)),X=a.n(U),$=a(19),V=a.n($),K=a(20),Z=a.n(K),J=a(21),Y=a.n(J),Q=a(22),ee=a.n(Q),te=(a(75),a(23)),ae=a.n(te),ne=a(24),se=a.n(ne),re=a(25),oe=a.n(re),ce=a(26),le=a.n(ce),ie=a(27),me=a.n(ie),de=a(28),ue=a.n(de),pe=a(29),fe=a.n(pe),he=a(30),be=a.n(he),ve=a(31),ge=a.n(ve),Ee=a(32),ye=a.n(Ee),xe=a(33),we=a.n(xe),ke=a(34),Ne=a.n(ke),je=a(35),Le=a.n(je),_e=a(36),Re=a.n(_e),Ae=a(37),Oe=a.n(Ae),Ce=a(38),Se=a.n(Ce),ze=a(39),Fe=a.n(ze),Me=a(40),qe=a.n(Me),He=a(41),Ie=a.n(He),De=a(42),We=a.n(De),Be=a(43),Te=a.n(Be),Pe=a(44),Ge=a.n(Pe),Ue=a(45),Xe=a.n(Ue),$e=a(46),Ve=a.n($e),Ke=a(47),Ze=a.n(Ke),Je=a(48),Ye=a.n(Je),Qe=a(49),et=a.n(Qe),tt=a(50),at=a.n(tt),nt=a(51),st=a.n(nt),rt=a(52),ot=a.n(rt),ct=a(53),lt=a.n(ct),it=a(54),mt=a.n(it),dt=a(55),ut=a.n(dt),pt=a(56),ft=a.n(pt),ht=a(57),bt=a.n(ht),vt=a(58),gt=a.n(vt),Et=a(59),yt=a.n(Et),xt=a(60),wt=a.n(xt),kt=a(61),Nt=a.n(kt),jt={results:{results:[{label:"GUI -- Mom Biking",thumbnail:le.a,sources:["https://dl.dropboxusercontent.com/s/1dsu3gbsuf3y92i/0192_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/yywhyzsya0vog0q/0192_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/ddd037tc6whnwfp/0192_anno.mp4?dl=0"],caption:"With LAAF, focus accurately shifts to Mom right before she starts biking down the hill.",mute:!0},{label:"GUI -- Mango Tart",thumbnail:se.a,sources:["https://dl.dropboxusercontent.com/s/crlwu9wiyaroltn/6354_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/ru6dp5b2ezk87ez/6354_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/rypv4gxv0kprm5i/6354_anno.mp4?dl=0"],caption:"With LAAF, focus accurately shifts back and forth between the face and the mango tart. Focus is tracked sharp at the face regardless of motion."},{label:"GUI -- Succulent",thumbnail:V.a,sources:["https://dl.dropboxusercontent.com/s/0invw4ean9voewf/1618_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/zmidvvo8ksm1rcq/1618_opt.mp4?dl=0","https://dl.dropboxusercontent.com/s/s3ibqsg9ensdp7n/1618_auto.mp4?dl=0"],width:212.5,mute:!0,vertical:!0,caption:"With LAAF, focus can shift away from the succulent when the face is in frame."},{label:"GUI -- Colorful Girls",thumbnail:Y.a,sources:["https://dl.dropboxusercontent.com/s/z8nfh6kx1kvblqn/1622_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/m8i29odi6i6vo83/1622_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/5100wusya2t9e59/1622_anno.mp4?dl=0"],caption:"With LAAF, focus can be set to user preferred region -- the background dancing girls."},{label:"Audio -- Spider",thumbnail:G.a,sources:["https://dl.dropboxusercontent.com/s/pltykr9k18kpnsu/3001_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/d81n3vlbyentj39/3001_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/wnrjv8w9954178e/3001_anno.mp4?dl=0"],mute:!0,caption:"With LAAF, focus is always set to the active speaker right before he/she is about to speak."},{label:"Action -- Kiss",thumbnail:X.a,sources:["https://dl.dropboxusercontent.com/s/4tjch546l7bf00v/2368_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/p3wzqjxcnzm32id/2368_opt.mp4?dl=0","https://dl.dropboxusercontent.com/s/8zm807mnbfuz2k2/2368_auto.mp4?dl=0"],mute:!0,caption:"With LAAF, focus is set right before the moment of
1kiss."},{label:"Action -- Kid Sliding",thumbnail:Z.a,sources:["https://dl.dropboxusercontent.com/s/up8nf6jfgfzewhb/2288_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/uqwxw1bml7putt0/2288_opt.mp4?dl=0","https://dl.dropboxusercontent.com/s/0yobbavebj2qx3i/2288_auto.mp4?dl=0"],mute:!0,caption:"With LAAF, focus is set to the child who climbs and slides down the hill, rather than the foreground bush."},{label:"Action -- Pikachu",thumbnail:ee.a,sources:["https://dl.dropboxusercontent.com/s/s8ap573lotk2ahe/2242_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/hr1lvaxl77mutal/2242_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/ioytjhuxykw888f/2242_anno.mp4?dl=0"],mute:!0},{label:"Auto -- Food",thumbnail:ae.a,sources:["https://dl.dropboxusercontent.com/s/smmb1wa93f0zmk4/6475_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/j1mxtajco21zbxx/6475_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/lsqh4jt167qwuu1/6475_anno.mp4?dl=0"],caption:"With LAAF, focus is set to the food and accurately tracks the food."},{label:"Auto -- Running",thumbnail:oe.a,sources:["https://dl.dropboxusercontent.com/s/qyyhpje014dpcrm/2482_in.mp4?dl=0","https://dl.dropboxusercontent.com/s/ig2t9eokxhwqj48/2482_naive.mp4?dl=0","https://dl.dropboxusercontent.com/s/jqursoddyvcqc2q/2482_anno.mp4?dl=0"],caption:"With LAAF, focus is set to the moment the child runs into the frame."}],market:S.results,render:T.results},dataset:{pairs:{members:[{label:"12",sources:[me.a,ue.a]},{label:"52",sources:[fe.a,be.a]},{label:"115",sources:[ge.a,ye.a]},{label:"526",sources:[we.a,Ne.a]}],teaser:Le.a},focal:{members:[{label:"1701",sources:[Re.a,Oe.a,Se.a]},{label:"1067",sources:[Fe.a,qe.a,Ie.a]},{label:"0020",sources:[We.a,Te.a,Ge.a]},{label:"1054",sources:[Xe.a,Ve.a,Ze.a]}],teaser:Ye.a},aperture:{members:[{label:"58",sources:[et.a,at.a,st.a]},{label:"116",sources:[ot.a,lt.a,mt.a]},{label:"180",sources:[ut.a,ft.a,bt.a]},{label:"309",sources:[gt.a,yt.a,wt.a]}],teaser:Nt.a}}},Lt=(a(76),["Input","Na\xefve Autofocus","LAAF Autofocus"]),_t=function(e){function t(e){var a;return Object(i.a)(this,t),(a=Object(d.a)(this,Object(u.a)(t).call(this,e))).onSelect=function(e){document.body.classList.add("no-scroll"),a.setState({viewing:e},(function(){window.setTimeout((function(){a.contentBox.current.style.opacity="1"}),200)}))},a.onExit=function(){a.contentBox.current.style.opacity="0",window.setTimeout((function(){a.setState({viewing:null}),document.body.classList.remove("no-scroll")}),300)},a.state={viewing:null},a.contentBox=s.a.createRef(),a}return Object(p.a)(t,e),Object(m.a)(t,[{key:"render",value:function(){var e=this.state.viewing;return s.a.createElement("div",{id:"st-results",className:"body-results"},s.a.createElement("div",{className:"body-results__header"},s.a.createElement("h1",null,"Results"),s.a.createElement("p",null,s.a.createElement("b",null," 'GUI'"),": LAAF - GUI Human Select |",s.a.createElement("b",null," 'Action, Audio'"),": LAAF - AI Scene-Specific | ",s.a.createElement("br",null),s.a.createElement("b",null," 'Auto'"),": LAAF - Data-driven CNN")),s.a.createElement(O,{items:jt.results.results,onSelect:this.onSelect}),e&&s.a.createElement("div",{className:"result-viewer",ref:this.contentBox},s.a.createElement("div",{className:"dimmer"}),s.a.createElement("div",{className:"content-container"},s.a.createElement("div",{className:"content"},s.a.createElement(j,Object.assign({key:e.label,name:e.label},e,{labels:e.sublabels||Lt,close:this.onExit}))))),s.a.createElement("p",null,s.a.createElement("b",null," Market Comparison"),": Compare with Olympus E-M 1 Mark II"),s.a.createElement(O,{items:jt.results.market,onSelect:this.onSelect}),s.a.createElement("p",null,s.a.createElement("b",null," Additional Refocusable Video Rendering")),s.a.createElement(O,{items:jt.results.render,onSelect:this.onSelect}))}}]),t}(s.a.Component),Rt=(a(77),function(e){function t(e){var a;return Object(i.a)(this,t),(a=Object(d.a)(this,Object(u.a)(t).call(this,e))).onMouseMove=function(e){a.setOffset(e.offsetX)},a.onMouseLeave=function(e){e.offsetX<0?a.setOffset(0):e.offsetX>a.$.current.offsetWidth&&a.setOffset(a.$.current.offsetWidth)},a.setOffset=function(e){a.left.current.style.width="".concat(e,"px")},a.$=s.a.createRef(),a.left=s.a.createRef(),a}
1return Object(p.a)(t,e),Object(m.a)(t,[{key:"componentDidMount",value:function(){this.$.current.addEventListener("mousemove",this.onMouseMove),this.$.current.addEventListener("mouseleave",this.onMouseLeave)}},{key:"componentWillUnmount",value:function(){this.$.current.removeEventListener("mousemove",this.onMouseMove),this.$.current.removeEventListener("mouseleave",this.onMouseLeave)}},{key:"render",value:function(){var e=this.props,t=e.sources,a=e.name,n="".concat(300,"px");return s.a.createElement("div",{className:"image-slide-pair"},s.a.createElement("div",{className:"slider",ref:this.$},s.a.createElement("div",{className:"slider-left",style:{width:n},ref:this.left},s.a.createElement("img",{alt:"".concat(a,"-small-ap"),src:t[0],width:600,height:318.75})),s.a.createElement("div",{className:"slider-right"},s.a.createElement("img",{alt:"".concat(a,"-large-ap"),src:t[1],width:600,height:318.75}))),s.a.createElement("div",{className:"labels"},s.a.createElement("div",{className:"labels-left"},"small aperture"),s.a.createElement("div",{className:"labels-right"},"large aperture")))}}]),t}(s.a.Component)),At=(a(78),function(e){function t(e){var a;return Object(i.a)(this,t),(a=Object(d.a)(this,Object(u.a)(t).call(this,e))).onHandleClickLeft=function(e){document.body.style.cursor="grab",a.dragOffset=e.offsetX,window.addEventListener("mousemove",a.onDragLeft),window.addEventListener("mouseup",a.onHandleReleaseLeft)},a.onHandleReleaseLeft=function(e){document.body.style.cursor="default",a.dragOffset=0,window.removeEventListener("mousemove",a.onDragLeft),window.removeEventListener("mouseup",a.onHandleReleaseLeft)},a.onHandleClickRight=function(e){document.body.style.cursor="grab",a.dragOffset=e.offsetX,window.addEventListener("mousemove",a.onDragRight),window.addEventListener("mouseup",a.onHandleReleaseRight)},a.onHandleReleaseRight=function(e){document.body.style.cursor="default",a.dragOffset=0,window.removeEventListener("mousemove",a.onDragRight),window.removeEventListener("mouseup",a.onHandleReleaseRight)},a.onDragLeft=function(e){var t=a.controls.current.getBoundingClientRect().left,n=t+a.mid.current.offsetWidth,s=e.clientX-a.dragOffset;s<t?s=t:s>=n&&(s=n-1),s-=t,a.handleLeft.current.style.left="".concat(s,"px"),a.handleLeftExt.current.style.left="".concat(s,"px"),a.left.current.style.width="".concat(s,"px")},a.onDragRight=function(e){var t=a.handleLeft.current.getBoundingClientRect().left,n=a.controls.current.getBoundingClientRect(),s=n.left,r=n.right,o=e.clientX-a.dragOffset;o<t?o=t:o>=r-23&&(o=r-24),o-=s,a.handleRight.current.style.left="".concat(o,"px"),a.mid.current.style.width="".concat(o,"px")},a.left=s.a.createRef(),a.mid=s.a.createRef(),a.controls=s.a.createRef(),a.handleLeft=s.a.createRef(),a.handleRight=s.a.createRef(),a.handleLeftExt=s.a.createRef(),a.dragOffset=0,a}return Object(p.a)(t,e),Object(m.a)(t,[{key:"componentDidMount",value:function(){this.handleLeft.current.addEventListener("mousedown",this.onHandleClickLeft),this.handleRight.current.addEventListener("mousedown",this.onHandleClickRight)}},{key:"componentWillUnmount",value:function(){this.handleLeft.current.removeEventListener("mousedown",this.onHandleClickLeft),this.handleRight.current.removeEventListener("mousedown",this.onHandleClickRight)}},{key:"render",value:function(){var e=this.props,t=e.sources,a=e.property,n=e.labels,r=e.name,o=Math.floor(200);return s.a.createElement("div",{className:"image-slide-trip"},s.a.createElement("div",{className:"controls",ref:this.controls},s.a.createElement("div",{className:"control-l"},s.a.createElement("div",{className:"handle",style:{left:"".concat(o,"px")},ref:this.handleLeft},s.a.createElement("ion-icon",{name:"reorder"}))),s.a.createElement("div",{className:"control-r"},s.a.createElement("div",{className:"handle",style:{left:"".concat(2*o,"px")},ref:this.handleRight},s.a.createElement("ion-icon",{name:"reorder"}))),s.a.createElement("div",{className:"control-l-ext",style:{left:"".concat(o,"px")},ref:this.handleLeftExt})),s.a.createElement("div",{className:"slider"},s.a.createElement("div",{className:"slider-left",style:{width:"".concat(o,"px")},ref:this.left},s.a.createElement("img",{alt:"".concat(r,"-small-").concat(a),src:t[0],width:600,height:318.75})),s.a.createElement("div",{className:"slider-mid",style:{width:"".concat(2*o,"px")},ref:this.mid},s.a.createElement("img",{alt:"".concat(r,"-med-").concat(a),src:t[1],width:600,height:318.75})),s.a.createElement("div",{className:"slider-right"},s.a.createElement("img",{alt:"".concat(r,"-large-").concat(a),src:t[2],width:600,height:318.75}))),s.a.createElement("div",{className:"labels"},s.a.createElement("div",{className:"label-l"},n[0]),s.a.createElement("div",{className:"label-m"},n[1]),s.a.createElement("div",{className:"label-r"},n[2])))}}]),t}(s.a.Component)),Ot=function(e){return s.a.createElement("div",{className:"strip-member",onClick:e.onSelect},s.a.createElement("img",{src:e.m.sources[0]}))},Ct=function(e){function t(e){var a;return Object(i.a)(this,t),(a=Object(d.a)(this,Object(u.a)(t).call(this,e))).onSelect=function(e){a.setState({viewing:e},(function(){window.setTimeout((function(){a.contentBox.current.style.opacity="1"}),200)}))},a.onExit=function(e){e.preventDefault(),a.contentBox.current.style.opacity="0",window.setTimeout((function(){a.setState({viewing:null})}),300)},a.state={viewing:null},a.contentBox=s.a.createRef(),a}return Object(p.a)(t,e),Object(m.a)(t,[{key:"render",value:function(){var e=this,t=this.props,a=t.label,n=t.members,r=t.type,o=t.teaser,c=t.labels,l=this.state.viewing,i="pairs"===r?Rt:At;return s.a.createElement("div",{className:"strip"},s.a.createElement("div",{className:"strip-members"},s.a.createElement("div",{className:"strip-label"},a),n.map((function(t){return s.a.createElement(Ot,{key:t.label,m:t,onSelect:function(){return e.onSelect(t)}})})),s.a.createElement("div",{className:"strip-member-last"},s.a.createElement("img",{src:o}))),l&&s.a.createElement("div",{className:"result-viewer",ref:this.contentBox},s.a.createElement("div",{className:"dimmer"}),s.a.createElement("div",{className:"content"},s.a.createElement(i,Object.assign({key:l.label},l,{labels:c})),s.a.createElement("div",{className:"control"},s.a.createElement("span",{className:"control-text",onClick:this.onExit},"exit")))))}}]),t}(s.a.Component),St=(a(79),jt.dataset),zt=St.pairs,Ft=St.aperture,Mt=St.focal,qt=function(e){return s.a.createElement("div",{id:"st-dataset",className:"dataset"},s.a.createElement("div",{className:"dataset-header"},s.a.createElement("div",{className:"dataset-header__right"},s.a.createElement("h1",null,"Aperture Dataset"),s.a.createElement("p",null,"We release this new aperture dataset of 1278 image pairs and 607 image triplets with ground truth shallow DOF images (a few examples are shown below). The dataset can be found",s.a.createElement("a",{href:"https://drive.google.com/open?id=1ZLwY6OjXjwadwULloGB_SVqGGm88DyWy",target:"_blank",style:{color:"#aaaaaa"}}," here"),". 'f22' contains the small aperture image used as input in our model. 'f2' is the ground truth large aperture image. 'f8' contains the corresponding medium-aperture image that is used for triplet training. These images have been processed with slight resampling for alignment purpose. If you want to retrieve the orgiinal raw format (TIFF) coming out of the camera, please contact the authors via email. Note that a set of images with faces are not made public for privacy issues."))),s.a.createElement("div",{className:"dataset-body"},s.a.createElement("div",{className:"row"},s.a.createElement(Ct,{label:"Aperture Pairs",type:"pairs",members:zt.members,teaser:zt.teaser})),s.a.createElement("div",{className:"row"},s.a.createElement(Ct,{label:"Aperture Triplets",type:"triplets",members:Ft.members,teaser:Ft.teaser,labels:["small A","medium A","large A"]})),s.a.createElement("div",{className:"row"},s.a.createElement(Ct,{label:"Focal Triplets",type:"triplets",members:Mt.members,teaser:Mt.teaser,labels:["all focused","near focus","far focus"]}
1))))},Ht=function(e){function t(){return Object(i.a)(this,t),Object(d.a)(this,Object(u.a)(t).apply(this,arguments))}return Object(p.a)(t,e),Object(m.a)(t,[{key:"render",value:function(){return s.a.createElement("div",{className:"app"},s.a.createElement(v,null),s.a.createElement(k,null),s.a.createElement(R,null),s.a.createElement(_t,null),s.a.createElement(qt,null))}}]),t}(n.Component);Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));l.a.polyfill(),o.a.render(s.a.createElement(Ht,null),document.getElementById("root")),"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}],[[62,1,2]]]); 2//# sourceMappingURL=main.e8eae865.chunk.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.