├── .gitignore
├── README.md
├── next.config.js
├── out
├── .nojekyll
├── 404.html
├── CNAME
├── _next
│ └── static
│ │ ├── Dtu2mpqkN_HDGESMP8GRp
│ │ ├── _buildManifest.js
│ │ ├── _ssgManifest.js
│ │ └── pages
│ │ │ ├── _app.js
│ │ │ ├── _error.js
│ │ │ └── index.js
│ │ ├── I3sc9yvXmNEiyRia1xqBF
│ │ ├── _buildManifest.js
│ │ ├── _ssgManifest.js
│ │ └── pages
│ │ │ ├── _app.js
│ │ │ ├── _error.js
│ │ │ └── index.js
│ │ ├── Xb5gq41gFk8RNsJSso6aR
│ │ ├── _buildManifest.js
│ │ ├── _ssgManifest.js
│ │ └── pages
│ │ │ ├── _app.js
│ │ │ ├── _error.js
│ │ │ └── index.js
│ │ ├── chunks
│ │ ├── 0.js
│ │ ├── 0.js.map
│ │ ├── 29107295.05fe25a68f82fc1adab1.js
│ │ ├── 2eb27f31521dfddda9f534b3b1ab0a971767a911.4c15662f417aac24ef74.js
│ │ ├── 472baa648e2c22e4e5046b8d88be09319f317e20.4c15662f417aac24ef74.js
│ │ ├── d41241255e92092259dd3e0f5a1a5a5689cf3f8c.4c15662f417aac24ef74.js
│ │ └── framework.c8966c7d8b377309e6b8.js
│ │ ├── development
│ │ ├── _buildManifest.js
│ │ ├── _ssgManifest.js
│ │ ├── dll
│ │ │ ├── dll_88bfe47d29bf84228398.js
│ │ │ └── dll_88bfe47d29bf84228398.js.map
│ │ └── pages
│ │ │ ├── _app.js
│ │ │ ├── _app.js.map
│ │ │ ├── _error.js
│ │ │ ├── _error.js.map
│ │ │ ├── index.js
│ │ │ └── index.js.map
│ │ ├── runtime
│ │ ├── amp.js
│ │ ├── amp.js.map
│ │ ├── main-89c3fa0a1c8f272d65df.js
│ │ ├── main.js
│ │ ├── main.js.map
│ │ ├── polyfills-65ef27f830dcfb7b71e7.js
│ │ ├── polyfills.js
│ │ ├── polyfills.js.map
│ │ ├── webpack-b65cab0b00afd201cbda.js
│ │ ├── webpack.js
│ │ └── webpack.js.map
│ │ └── webpack
│ │ ├── 32888aaf968d44bbb3f8.hot-update.json
│ │ ├── acc7bc2899c194082c33.hot-update.json
│ │ ├── dd1e0e471e3d81a08b0e.hot-update.json
│ │ └── static
│ │ └── development
│ │ └── pages
│ │ ├── index.js.32888aaf968d44bbb3f8.hot-update.js
│ │ ├── index.js.32888aaf968d44bbb3f8.hot-update.js.map
│ │ ├── index.js.acc7bc2899c194082c33.hot-update.js
│ │ └── index.js.acc7bc2899c194082c33.hot-update.js.map
├── collapse.gif
├── collapse.png
├── favicon.png
├── fonts
│ ├── IBMPlexMono-Italic.woff
│ ├── IBMPlexMono-Italic.woff2
│ ├── IBMPlexMono-Regular.woff
│ └── IBMPlexMono-Regular.woff2
├── index.html
├── mrrobot2.jpg
└── veilance-field-photo.jpg
├── package-lock.json
├── package.json
├── pages
└── index.js
└── public
├── collapse.gif
├── collapse.png
├── favicon.png
├── fonts
├── IBMPlexMono-Italic.woff
├── IBMPlexMono-Italic.woff2
├── IBMPlexMono-Regular.woff
└── IBMPlexMono-Regular.woff2
├── mrrobot2.jpg
└── veilance-field-photo.jpg
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # next.js
12 | /.next/
13 |
14 | # production
15 | /build
16 |
17 | # misc
18 | .DS_Store
19 | .env*
20 |
21 | # debug
22 | npm-debug.log*
23 | yarn-debug.log*
24 | yarn-error.log*
25 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Collapse
2 |
3 |
6 |
7 | Collapse an image into itself using ranked superpixels.
8 |
9 | https://collapse.constraint.systems
10 |
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | devIndicators: {
3 | autoPrerender: false,
4 | },
5 | }
6 |
--------------------------------------------------------------------------------
/out/.nojekyll:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/.nojekyll
--------------------------------------------------------------------------------
/out/404.html:
--------------------------------------------------------------------------------
1 |
404
This page could not be found.
--------------------------------------------------------------------------------
/out/CNAME:
--------------------------------------------------------------------------------
1 | collapse.constraint.systems
2 |
--------------------------------------------------------------------------------
/out/_next/static/Dtu2mpqkN_HDGESMP8GRp/_buildManifest.js:
--------------------------------------------------------------------------------
1 | self.__BUILD_MANIFEST = (function(a){return {"/":[a],"/index":[a]}}("static\u002Fchunks\u002F29107295.05fe25a68f82fc1adab1.js"));self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()
--------------------------------------------------------------------------------
/out/_next/static/Dtu2mpqkN_HDGESMP8GRp/_ssgManifest.js:
--------------------------------------------------------------------------------
1 | self.__SSG_MANIFEST=new Set;self.__SSG_MANIFEST_CB&&self.__SSG_MANIFEST_CB()
--------------------------------------------------------------------------------
/out/_next/static/Dtu2mpqkN_HDGESMP8GRp/pages/_app.js:
--------------------------------------------------------------------------------
1 | (window.webpackJsonp=window.webpackJsonp||[]).push([[4],{0:function(n,t,e){e("e9+W"),n.exports=e("nOHt")},B5Ud:function(n,t,e){"use strict";var r=e("lwsE"),u=e("W8MJ"),a=e("a1gu"),o=e("Nsbk"),i=e("7W2i"),p=e("o0o1"),c=e("TqRt");t.__esModule=!0,t.Container=function(n){0;return n.children},t.createUrl=d,t.default=void 0;var s=c(e("q1tI")),l=e("g/15");function f(n){var t,e,r;return p.async((function(u){for(;;)switch(u.prev=u.next){case 0:return t=n.Component,e=n.ctx,u.next=3,p.awrap((0,l.loadGetInitialProps)(t,e));case 3:return r=u.sent,u.abrupt("return",{pageProps:r});case 5:case"end":return u.stop()}}),null,null,null,Promise)}t.AppInitialProps=l.AppInitialProps;var h=function(n){function t(){return r(this,t),a(this,o(t).apply(this,arguments))}return i(t,n),u(t,[{key:"componentDidCatch",value:function(n,t){throw n}},{key:"render",value:function(){var n=this.props,t=n.router,e=n.Component,r=n.pageProps,u=n.__N_SSG,a=n.__N_SSP;return s.default.createElement(e,Object.assign({},r,u||a?{}:{url:d(t)}))}}]),t}(s.default.Component);function d(n){var t=n.pathname,e=n.asPath,r=n.query;return{get query(){return r},get pathname(){return t},get asPath(){return e},back:function(){n.back()},push:function(t,e){return n.push(t,e)},pushTo:function(t,e){var r=e?t:"",u=e||t;return n.push(r,u)},replace:function(t,e){return n.replace(t,e)},replaceTo:function(t,e){var r=e?t:"",u=e||t;return n.replace(r,u)}}}t.default=h,h.origGetInitialProps=f,h.getInitialProps=f},"e9+W":function(n,t,e){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_app",function(){return e("B5Ud")}])}},[[0,0,1,2]]]);
--------------------------------------------------------------------------------
/out/_next/static/Dtu2mpqkN_HDGESMP8GRp/pages/_error.js:
--------------------------------------------------------------------------------
1 | (window.webpackJsonp=window.webpackJsonp||[]).push([[5],{"/0+H":function(e,t,n){"use strict";var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var o=r(n("q1tI")),i=n("lwAK");function u(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.ampFirst,n=void 0!==t&&t,r=e.hybrid,o=void 0!==r&&r,i=e.hasQuery;return n||o&&(void 0!==i&&i)}t.isInAmpMode=u,t.useAmp=function(){return u(o.default.useContext(i.AmpStateContext))}},"/a9y":function(e,t,n){"use strict";var r=n("lwsE"),o=n("W8MJ"),i=n("a1gu"),u=n("Nsbk"),a=n("7W2i"),l=n("TqRt");t.__esModule=!0,t.default=void 0;var c=l(n("q1tI")),f=l(n("8Kt/")),s={400:"Bad Request",404:"This page could not be found",405:"Method Not Allowed",500:"Internal Server Error"},d=function(e){function t(){return r(this,t),i(this,u(t).apply(this,arguments))}return a(t,e),o(t,[{key:"render",value:function(){var e=this.props.statusCode,t=this.props.title||s[e]||"An unexpected error has occurred";return c.default.createElement("div",{style:p.error},c.default.createElement(f.default,null,c.default.createElement("title",null,e,": ",t)),c.default.createElement("div",null,c.default.createElement("style",{dangerouslySetInnerHTML:{__html:"body { margin: 0 }"}}),e?c.default.createElement("h1",{style:p.h1},e):null,c.default.createElement("div",{style:p.desc},c.default.createElement("h2",{style:p.h2},t,"."))))}}],[{key:"getInitialProps",value:function(e){var t=e.res,n=e.err;return{statusCode:t&&t.statusCode?t.statusCode:n?n.statusCode:404}}}]),t}(c.default.Component);t.default=d,d.displayName="ErrorPage";var p={error:{color:"#000",background:"#fff",fontFamily:'-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif',height:"100vh",textAlign:"center",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},desc:{display:"inline-block",textAlign:"left",lineHeight:"49px",height:"49px",verticalAlign:"middle"},h1:{display:"inline-block",borderRight:"1px solid rgba(0, 0, 0,.3)",margin:0,marginRight:"20px",padding:"10px 23px 10px 0",fontSize:"24px",fontWeight:500,verticalAlign:"top"},h2:{fontSize:"14px",fontWeight:"normal",lineHeight:"inherit",margin:0,padding:0}}},"04ac":function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_error",function(){return n("/a9y")}])},"7W2i":function(e,t,n){var r=n("SksO");e.exports=function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&r(e,t)}},"8Kt/":function(e,t,n){"use strict";var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var o=r(n("q1tI")),i=r(n("Xuae")),u=n("lwAK"),a=n("FYa8"),l=n("/0+H");function c(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=[o.default.createElement("meta",{charSet:"utf-8"})];return e||t.push(o.default.createElement("meta",{name:"viewport",content:"width=device-width"})),t}function f(e,t){return"string"===typeof t||"number"===typeof t?e:t.type===o.default.Fragment?e.concat(o.default.Children.toArray(t.props.children).reduce((function(e,t){return"string"===typeof t||"number"===typeof t?e:e.concat(t)}),[])):e.concat(t)}t.defaultHead=c;var s=["name","httpEquiv","charSet","itemProp"];function d(e,t){return e.reduce((function(e,t){var n=o.default.Children.toArray(t.props.children);return e.concat(n)}),[]).reduce(f,[]).reverse().concat(c(t.inAmpMode)).filter(function(){var e=new Set,t=new Set,n=new Set,r={};return function(o){var i=!0;if(o.key&&"number"!==typeof o.key&&o.key.indexOf("$")>0){var u=o.key.slice(o.key.indexOf("$")+1);e.has(u)?i=!1:e.add(u)}switch(o.type){case"title":case"base":t.has(o.type)?i=!1:t.add(o.type);break;case"meta":for(var a=0,l=s.length;a0&&void 0!==arguments[0]?arguments[0]:{},t=e.ampFirst,n=void 0!==t&&t,r=e.hybrid,o=void 0!==r&&r,i=e.hasQuery;return n||o&&(void 0!==i&&i)}t.isInAmpMode=u,t.useAmp=function(){return u(o.default.useContext(i.AmpStateContext))}},"/a9y":function(e,t,n){"use strict";var r=n("lwsE"),o=n("W8MJ"),i=n("a1gu"),u=n("Nsbk"),a=n("7W2i"),l=n("TqRt");t.__esModule=!0,t.default=void 0;var c=l(n("q1tI")),f=l(n("8Kt/")),s={400:"Bad Request",404:"This page could not be found",405:"Method Not Allowed",500:"Internal Server Error"},d=function(e){function t(){return r(this,t),i(this,u(t).apply(this,arguments))}return a(t,e),o(t,[{key:"render",value:function(){var e=this.props.statusCode,t=this.props.title||s[e]||"An unexpected error has occurred";return c.default.createElement("div",{style:p.error},c.default.createElement(f.default,null,c.default.createElement("title",null,e,": ",t)),c.default.createElement("div",null,c.default.createElement("style",{dangerouslySetInnerHTML:{__html:"body { margin: 0 }"}}),e?c.default.createElement("h1",{style:p.h1},e):null,c.default.createElement("div",{style:p.desc},c.default.createElement("h2",{style:p.h2},t,"."))))}}],[{key:"getInitialProps",value:function(e){var t=e.res,n=e.err;return{statusCode:t&&t.statusCode?t.statusCode:n?n.statusCode:404}}}]),t}(c.default.Component);t.default=d,d.displayName="ErrorPage";var p={error:{color:"#000",background:"#fff",fontFamily:'-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif',height:"100vh",textAlign:"center",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},desc:{display:"inline-block",textAlign:"left",lineHeight:"49px",height:"49px",verticalAlign:"middle"},h1:{display:"inline-block",borderRight:"1px solid rgba(0, 0, 0,.3)",margin:0,marginRight:"20px",padding:"10px 23px 10px 0",fontSize:"24px",fontWeight:500,verticalAlign:"top"},h2:{fontSize:"14px",fontWeight:"normal",lineHeight:"inherit",margin:0,padding:0}}},"04ac":function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_error",function(){return n("/a9y")}])},"7W2i":function(e,t,n){var r=n("SksO");e.exports=function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&r(e,t)}},"8Kt/":function(e,t,n){"use strict";var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var o=r(n("q1tI")),i=r(n("Xuae")),u=n("lwAK"),a=n("FYa8"),l=n("/0+H");function c(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=[o.default.createElement("meta",{charSet:"utf-8"})];return e||t.push(o.default.createElement("meta",{name:"viewport",content:"width=device-width"})),t}function f(e,t){return"string"===typeof t||"number"===typeof t?e:t.type===o.default.Fragment?e.concat(o.default.Children.toArray(t.props.children).reduce((function(e,t){return"string"===typeof t||"number"===typeof t?e:e.concat(t)}),[])):e.concat(t)}t.defaultHead=c;var s=["name","httpEquiv","charSet","itemProp"];function d(e,t){return e.reduce((function(e,t){var n=o.default.Children.toArray(t.props.children);return e.concat(n)}),[]).reduce(f,[]).reverse().concat(c(t.inAmpMode)).filter(function(){var e=new Set,t=new Set,n=new Set,r={};return function(o){var i=!0;if(o.key&&"number"!==typeof o.key&&o.key.indexOf("$")>0){var u=o.key.slice(o.key.indexOf("$")+1);e.has(u)?i=!1:e.add(u)}switch(o.type){case"title":case"base":t.has(o.type)?i=!1:t.add(o.type);break;case"meta":for(var a=0,l=s.length;a0&&void 0!==arguments[0]?arguments[0]:{},t=e.ampFirst,n=void 0!==t&&t,r=e.hybrid,o=void 0!==r&&r,i=e.hasQuery;return n||o&&(void 0!==i&&i)}t.isInAmpMode=u,t.useAmp=function(){return u(o.default.useContext(i.AmpStateContext))}},"/a9y":function(e,t,n){"use strict";var r=n("lwsE"),o=n("W8MJ"),i=n("a1gu"),u=n("Nsbk"),a=n("7W2i"),l=n("TqRt");t.__esModule=!0,t.default=void 0;var c=l(n("q1tI")),f=l(n("8Kt/")),s={400:"Bad Request",404:"This page could not be found",405:"Method Not Allowed",500:"Internal Server Error"},d=function(e){function t(){return r(this,t),i(this,u(t).apply(this,arguments))}return a(t,e),o(t,[{key:"render",value:function(){var e=this.props.statusCode,t=this.props.title||s[e]||"An unexpected error has occurred";return c.default.createElement("div",{style:p.error},c.default.createElement(f.default,null,c.default.createElement("title",null,e,": ",t)),c.default.createElement("div",null,c.default.createElement("style",{dangerouslySetInnerHTML:{__html:"body { margin: 0 }"}}),e?c.default.createElement("h1",{style:p.h1},e):null,c.default.createElement("div",{style:p.desc},c.default.createElement("h2",{style:p.h2},t,"."))))}}],[{key:"getInitialProps",value:function(e){var t=e.res,n=e.err;return{statusCode:t&&t.statusCode?t.statusCode:n?n.statusCode:404}}}]),t}(c.default.Component);t.default=d,d.displayName="ErrorPage";var p={error:{color:"#000",background:"#fff",fontFamily:'-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif',height:"100vh",textAlign:"center",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},desc:{display:"inline-block",textAlign:"left",lineHeight:"49px",height:"49px",verticalAlign:"middle"},h1:{display:"inline-block",borderRight:"1px solid rgba(0, 0, 0,.3)",margin:0,marginRight:"20px",padding:"10px 23px 10px 0",fontSize:"24px",fontWeight:500,verticalAlign:"top"},h2:{fontSize:"14px",fontWeight:"normal",lineHeight:"inherit",margin:0,padding:0}}},"04ac":function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_error",function(){return n("/a9y")}])},"7W2i":function(e,t,n){var r=n("SksO");e.exports=function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&r(e,t)}},"8Kt/":function(e,t,n){"use strict";var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var o=r(n("q1tI")),i=r(n("Xuae")),u=n("lwAK"),a=n("FYa8"),l=n("/0+H");function c(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=[o.default.createElement("meta",{charSet:"utf-8"})];return e||t.push(o.default.createElement("meta",{name:"viewport",content:"width=device-width"})),t}function f(e,t){return"string"===typeof t||"number"===typeof t?e:t.type===o.default.Fragment?e.concat(o.default.Children.toArray(t.props.children).reduce((function(e,t){return"string"===typeof t||"number"===typeof t?e:e.concat(t)}),[])):e.concat(t)}t.defaultHead=c;var s=["name","httpEquiv","charSet","itemProp"];function d(e,t){return e.reduce((function(e,t){var n=o.default.Children.toArray(t.props.children);return e.concat(n)}),[]).reduce(f,[]).reverse().concat(c(t.inAmpMode)).filter(function(){var e=new Set,t=new Set,n=new Set,r={};return function(o){var i=!0;if(o.key&&"number"!==typeof o.key&&o.key.indexOf("$")>0){var u=o.key.slice(o.key.indexOf("$")+1);e.has(u)?i=!1:e.add(u)}switch(o.type){case"title":case"base":t.has(o.type)?i=!1:t.add(o.type);break;case"meta":for(var a=0,l=s.length;a>>0,1)},emit:function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),o=1;o0&&t.status>=500)return r();throw new Error("Failed to load static props")}return t.json()}))}().then((function(t){return n?n(t):t})).catch((function(t){throw r||(t.code="PAGE_LOAD_ERROR"),t}))}var g=function(){function t(e,r,n,o){var i=this,c=o.initialProps,s=o.pageLoader,p=o.App,h=o.wrapApp,y=o.Component,g=o.err,b=o.subscription,w=o.isFallback;a(this,t),this.sdc={},this.onPopState=function(t){if(t.state){if((!t.state||!i.isSsr||t.state.as!==i.asPath||u.parse(t.state.url).pathname!==i.pathname)&&(!i._bps||i._bps(t.state))){var e=t.state,r=e.url,n=e.as,o=e.options;0,i.replace(r,n,o)}}else{var a=i.pathname,c=i.query;i.changeState("replaceState",l.formatWithValidation({pathname:a,query:c}),l.getURL())}},this._getStaticData=function(t){var e=d(u.parse(t).pathname);return i.sdc[e]?Promise.resolve(i.sdc[e]):m(e,null,i.isSsr,(function(t){return i.sdc[e]=t}))},this._getServerData=function(t){var e=u.parse(t,!0),r=e.pathname,n=e.query;return m(r=d(r),n,i.isSsr)},this.route=v(e),this.components={},"/_error"!==e&&(this.components[this.route]={Component:y,props:c,err:g,__N_SSG:c&&c.__N_SSG,__N_SSP:c&&c.__N_SSP}),this.components["/_app"]={Component:p},this.events=t.events,this.pageLoader=s,this.pathname=e,this.query=r,this.asPath=f.isDynamicRoute(e)&&__NEXT_DATA__.autoExport?e:n,this.sub=b,this.clc=null,this._wrapApp=h,this.isSsr=!0,this.isFallback=w,this.changeState("replaceState",l.formatWithValidation({pathname:e,query:r}),n),window.addEventListener("popstate",this.onPopState)}return i(t,[{key:"update",value:function(t,e){var r=e.default||e,n=this.components[t];if(!n)throw new Error("Cannot update unavailable route: ".concat(t));var o=Object.assign(Object.assign({},n),{Component:r,__N_SSG:e.__N_SSG,__N_SSP:e.__N_SSP});this.components[t]=o,"/_app"!==t?t===this.route&&this.notify(o):this.notify(this.components[this.route])}},{key:"reload",value:function(){window.location.reload()}},{key:"back",value:function(){window.history.back()}},{key:"push",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("pushState",t,e,r)}},{key:"replace",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("replaceState",t,e,r)}},{key:"change",value:function(e,r,n,o){var a=this;return new Promise((function(i,c){o._h||(a.isSsr=!1),l.ST&&performance.mark("routeChange");var s="object"===typeof r?l.formatWithValidation(r):r,d="object"===typeof n?l.formatWithValidation(n):n;if(a.abortComponentLoad(d),!o._h&&a.onlyAHashChange(d))return a.asPath=d,t.events.emit("hashChangeStart",d),a.changeState(e,s,y(d),o),a.scrollToHash(d),t.events.emit("hashChangeComplete",d),i(!0);var m=u.parse(s,!0),g=m.pathname,b=m.query,w=m.protocol;if(!g||w)return i(!1);a.urlIsNew(d)||(e="replaceState");var _=v(g),x=o.shallow,S=void 0!==x&&x;if(f.isDynamicRoute(_)){var O=u.parse(d).pathname,P=h.getRouteRegex(_),j=p.getRouteMatcher(P)(O);if(j)Object.assign(b,j);else if(Object.keys(P.groups).filter((function(t){return!b[t]})).length>0)return c(new Error("The provided `as` value (".concat(O,") is incompatible with the `href` value (").concat(_,"). ")+"Read more: https://err.sh/zeit/next.js/incompatible-href-as"))}t.events.emit("routeChangeStart",d),a.getRouteInfo(_,g,b,d,S).then((function(r){var n=r.error;if(n&&n.cancelled)return i(!1);if(t.events.emit("beforeHistoryChange",d),a.changeState(e,s,y(d),o),a.set(_,g,b,d,r),n)throw t.events.emit("routeChangeError",n,d),n;return t.events.emit("routeChangeComplete",d),i(!0)}),c)}))}},{key:"changeState",value:function(t,e,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};"pushState"===t&&l.getURL()===r||window.history[t]({url:e,as:r,options:n},"",r)}},{key:"getRouteInfo",value:function(t,e,r,n){var o=this,a=arguments.length>4&&void 0!==arguments[4]&&arguments[4],i=this.components[t];if(a&&i&&this.route===t)return Promise.resolve(i);var c=function t(a,i){return new Promise((function(c){return"PAGE_LOAD_ERROR"===a.code||i?(window.location.href=n,a.cancelled=!0,c({error:a})):a.cancelled?c({error:a}):void c(o.fetchComponent("/_error").then((function(t){var n=t.page,i={Component:n,err:a};return new Promise((function(t){o.getInitialProps(n,{err:a,pathname:e,query:r}).then((function(e){i.props=e,i.error=a,t(i)}),(function(e){console.error("Error in error page `getInitialProps`: ",e),i.error=a,i.props={},t(i)}))}))})).catch((function(e){return t(e,!0)})))}))};return new Promise((function(e,r){if(i)return e(i);o.fetchComponent(t).then((function(t){return e({Component:t.page,__N_SSG:t.mod.__N_SSG,__N_SSP:t.mod.__N_SSP})}),r)})).then((function(a){var i=a.Component,c=a.__N_SSG,u=a.__N_SSP;return o._getData((function(){return c?o._getStaticData(n):u?o._getServerData(n):o.getInitialProps(i,{pathname:e,query:r,asPath:n})})).then((function(e){return a.props=e,o.components[t]=a,a}))})).catch(c)}},{key:"set",value:function(t,e,r,n,o){this.isFallback=!1,this.route=t,this.pathname=e,this.query=r,this.asPath=n,this.notify(o)}},{key:"beforePopState",value:function(t){this._bps=t}},{key:"onlyAHashChange",value:function(t){if(!this.asPath)return!1;var e=this.asPath.split("#"),r=o(e,2),n=r[0],a=r[1],i=t.split("#"),c=o(i,2),u=c[0],s=c[1];return!(!s||n!==u||a!==s)||n===u&&a!==s}},{key:"scrollToHash",value:function(t){var e=t.split("#"),r=o(e,2)[1];if(""!==r){var n=document.getElementById(r);if(n)n.scrollIntoView();else{var a=document.getElementsByName(r)[0];a&&a.scrollIntoView()}}else window.scrollTo(0,0)}},{key:"urlIsNew",value:function(t){return this.asPath!==t}},{key:"prefetch",value:function(t){var e=this,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return new Promise((function(o,a){var i=u.parse(t),c=i.pathname,s=i.protocol;c&&!s&&Promise.all([e.pageLoader.prefetchData(t,r),e.pageLoader[n.priority?"loadPage":"prefetch"](v(c))]).then((function(){return o()}),a)}))}},{key:"fetchComponent",value:function(t){var e,r,o,a;return n.async((function(i){for(;;)switch(i.prev=i.next){case 0:return e=!1,r=this.clc=function(){e=!0},i.next=4,n.awrap(this.pageLoader.loadPage(t));case 4:if(o=i.sent,!e){i.next=9;break}throw(a=new Error('Abort fetching component for route: "'.concat(t,'"'))).cancelled=!0,a;case 9:return r===this.clc&&(this.clc=null),i.abrupt("return",o);case 11:case"end":return i.stop()}}),null,this,null,Promise)}},{key:"_getData",value:function(t){var e=this,r=!1,n=function(){r=!0};return this.clc=n,t().then((function(t){if(n===e.clc&&(e.clc=null),r){var o=new Error("Loading initial props cancelled");throw o.cancelled=!0,o}return t}))}},{key:"getInitialProps",value:function(t,e){var r=this.components["/_app"].Component,n=this._wrapApp(r);return e.AppTree=n,l.loadGetInitialProps(r,{AppTree:n,Component:t,router:this,ctx:e})}},{key:"abortComponentLoad",value:function(e){if(this.clc){var r=new Error("Route Cancelled");r.cancelled=!0,t.events.emit("routeChangeError",r,e),this.clc(),this.clc=null}}},{key:"notify",value:function(t){this.sub(t,this.components["/_app"].Component)}}],[{key:"_rewriteUrlForNextExport",value:function(t){return t}}]),t}();e.default=g,g.events=s.default()},"g/15":function(t,e,r){"use strict";var n=r("o0o1");Object.defineProperty(e,"__esModule",{value:!0});var o=r("QmWs");function a(){var t=window.location,e=t.protocol,r=t.hostname,n=t.port;return"".concat(e,"//").concat(r).concat(n?":"+n:"")}function i(t){return"string"===typeof t?t:t.displayName||t.name||"Unknown"}function c(t){return t.finished||t.headersSent}e.execOnce=function(t){var e=this,r=!1,n=null;return function(){if(!r){r=!0;for(var o=arguments.length,a=new Array(o),i=0;i0&&s>u&&(s=u);for(var l=0;l=0?(f=v.substr(0,d),p=v.substr(d+1)):(f=v,p=""),h=decodeURIComponent(f),y=decodeURIComponent(p),n(i,h)?o(i[h])?i[h].push(y):i[h]=[i[h],y]:i[h]=y}return i};var o=Array.isArray||function(t){return"[object Array]"===Object.prototype.toString.call(t)}},ls82:function(t,e,r){var n=function(t){"use strict";var e,r=Object.prototype,n=r.hasOwnProperty,o="function"===typeof Symbol?Symbol:{},a=o.iterator||"@@iterator",i=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r,n){var o=e&&e.prototype instanceof v?e:v,a=Object.create(o.prototype),i=new k(n||[]);return a._invoke=function(t,e,r){var n=l;return function(o,a){if(n===p)throw new Error("Generator is already running");if(n===h){if("throw"===o)throw a;return C()}for(r.method=o,r.arg=a;;){var i=r.delegate;if(i){var c=O(i,r);if(c){if(c===y)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(n===l)throw n=h,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n=p;var u=s(t,e,r);if("normal"===u.type){if(n=r.done?h:f,u.arg===y)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n=h,r.method="throw",r.arg=u.arg)}}}(t,r,i),a}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(n){return{type:"throw",arg:n}}}t.wrap=u;var l="suspendedStart",f="suspendedYield",p="executing",h="completed",y={};function v(){}function d(){}function m(){}var g={};g[a]=function(){return this};var b=Object.getPrototypeOf,w=b&&b(b(R([])));w&&w!==r&&n.call(w,a)&&(g=w);var _=m.prototype=v.prototype=Object.create(g);function x(t){["next","throw","return"].forEach((function(e){t[e]=function(t){return this._invoke(e,t)}}))}function S(t,e){var r;this._invoke=function(o,a){function i(){return new e((function(r,i){!function r(o,a,i,c){var u=s(t[o],t,a);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"===typeof f&&n.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,i,c)}),(function(t){r("throw",t,i,c)})):e.resolve(f).then((function(t){l.value=t,i(l)}),(function(t){return r("throw",t,i,c)}))}c(u.arg)}(o,a,r,i)}))}return r=r?r.then(i,i):i()}}function O(t,r){var n=t.iterator[r.method];if(n===e){if(r.delegate=null,"throw"===r.method){if(t.iterator.return&&(r.method="return",r.arg=e,O(t,r),"throw"===r.method))return y;r.method="throw",r.arg=new TypeError("The iterator does not provide a 'throw' method")}return y}var o=s(n,t.iterator,r.arg);if("throw"===o.type)return r.method="throw",r.arg=o.arg,r.delegate=null,y;var a=o.arg;return a?a.done?(r[t.resultName]=a.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function P(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function j(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function k(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(P,this),this.reset(!0)}function R(t){if(t){var r=t[a];if(r)return r.call(t);if("function"===typeof t.next)return t;if(!isNaN(t.length)){var o=-1,i=function r(){for(;++o=0;--a){var i=this.tryEntries[a],c=i.completion;if("root"===i.tryLoc)return o("end");if(i.tryLoc<=this.prev){var u=n.call(i,"catchLoc"),s=n.call(i,"finallyLoc");if(u&&s){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),j(r),y}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;j(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:R(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}(t.exports);try{regeneratorRuntime=n}catch(o){Function("r","regeneratorRuntime = r")(n)}},lwsE:function(t,e){t.exports=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}},m0LI:function(t,e){t.exports=function(t,e){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t)){var r=[],n=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!e||r.length!==e);n=!0);}catch(u){o=!0,a=u}finally{try{n||null==c.return||c.return()}finally{if(o)throw a}}return r}}},nOHt:function(t,e,r){"use strict";var n=r("sXyB"),o=r("284h"),a=r("TqRt");e.__esModule=!0,e.useRouter=function(){return i.default.useContext(u.RouterContext)},e.makePublicRouterInstance=function(t){var e=t,r={},n=!0,o=!1,a=void 0;try{for(var i,u=f[Symbol.iterator]();!(n=(i=u.next()).done);n=!0){var s=i.value;"object"!==typeof e[s]?r[s]=e[s]:r[s]=Object.assign({},e[s])}}catch(l){o=!0,a=l}finally{try{n||null==u.return||u.return()}finally{if(o)throw a}}return r.events=c.default.events,p.forEach((function(t){r[t]=function(){return e[t].apply(e,arguments)}})),r},e.createRouter=e.withRouter=e.default=void 0;var i=a(r("q1tI")),c=o(r("elyg"));e.Router=c.default,e.NextRouter=c.NextRouter;var u=r("qOIg"),s=a(r("0Bsm"));e.withRouter=s.default;var l={router:null,readyCallbacks:[],ready:function(t){if(this.router)return t();this.readyCallbacks.push(t)}},f=["pathname","route","query","asPath","components","isFallback"],p=["push","replace","reload","back","prefetch","beforePopState"];function h(){if(!l.router){throw new Error('No router instance found.\nYou should only use "next/router" inside the client side of your app.\n')}return l.router}Object.defineProperty(l,"events",{get:function(){return c.default.events}}),f.forEach((function(t){Object.defineProperty(l,t,{get:function(){return h()[t]}})})),p.forEach((function(t){l[t]=function(){var e=h();return e[t].apply(e,arguments)}})),["routeChangeStart","beforeHistoryChange","routeChangeComplete","routeChangeError","hashChangeStart","hashChangeComplete"].forEach((function(t){l.ready((function(){c.default.events.on(t,(function(){var e="on"+t.charAt(0).toUpperCase()+t.substring(1),r=l;if(r[e])try{r[e].apply(r,arguments)}catch(n){console.error("Error when running the Router event: "+e),console.error(n.message+"\n"+n.stack)}}))}))}));var y=l;e.default=y;e.createRouter=function(){for(var t=arguments.length,e=new Array(t),r=0;r>>0,1)},emit:function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),o=1;o0&&t.status>=500)return r();throw new Error("Failed to load static props")}return t.json()}))}().then((function(t){return n?n(t):t})).catch((function(t){throw r||(t.code="PAGE_LOAD_ERROR"),t}))}var g=function(){function t(e,r,n,o){var i=this,c=o.initialProps,s=o.pageLoader,p=o.App,h=o.wrapApp,y=o.Component,g=o.err,b=o.subscription,w=o.isFallback;a(this,t),this.sdc={},this.onPopState=function(t){if(t.state){if((!t.state||!i.isSsr||t.state.as!==i.asPath||u.parse(t.state.url).pathname!==i.pathname)&&(!i._bps||i._bps(t.state))){var e=t.state,r=e.url,n=e.as,o=e.options;0,i.replace(r,n,o)}}else{var a=i.pathname,c=i.query;i.changeState("replaceState",l.formatWithValidation({pathname:a,query:c}),l.getURL())}},this._getStaticData=function(t){var e=d(u.parse(t).pathname);return i.sdc[e]?Promise.resolve(i.sdc[e]):m(e,null,i.isSsr,(function(t){return i.sdc[e]=t}))},this._getServerData=function(t){var e=u.parse(t,!0),r=e.pathname,n=e.query;return m(r=d(r),n,i.isSsr)},this.route=v(e),this.components={},"/_error"!==e&&(this.components[this.route]={Component:y,props:c,err:g,__N_SSG:c&&c.__N_SSG,__N_SSP:c&&c.__N_SSP}),this.components["/_app"]={Component:p},this.events=t.events,this.pageLoader=s,this.pathname=e,this.query=r,this.asPath=f.isDynamicRoute(e)&&__NEXT_DATA__.autoExport?e:n,this.sub=b,this.clc=null,this._wrapApp=h,this.isSsr=!0,this.isFallback=w,this.changeState("replaceState",l.formatWithValidation({pathname:e,query:r}),n),window.addEventListener("popstate",this.onPopState)}return i(t,[{key:"update",value:function(t,e){var r=e.default||e,n=this.components[t];if(!n)throw new Error("Cannot update unavailable route: ".concat(t));var o=Object.assign(Object.assign({},n),{Component:r,__N_SSG:e.__N_SSG,__N_SSP:e.__N_SSP});this.components[t]=o,"/_app"!==t?t===this.route&&this.notify(o):this.notify(this.components[this.route])}},{key:"reload",value:function(){window.location.reload()}},{key:"back",value:function(){window.history.back()}},{key:"push",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("pushState",t,e,r)}},{key:"replace",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("replaceState",t,e,r)}},{key:"change",value:function(e,r,n,o){var a=this;return new Promise((function(i,c){o._h||(a.isSsr=!1),l.ST&&performance.mark("routeChange");var s="object"===typeof r?l.formatWithValidation(r):r,d="object"===typeof n?l.formatWithValidation(n):n;if(a.abortComponentLoad(d),!o._h&&a.onlyAHashChange(d))return a.asPath=d,t.events.emit("hashChangeStart",d),a.changeState(e,s,y(d),o),a.scrollToHash(d),t.events.emit("hashChangeComplete",d),i(!0);var m=u.parse(s,!0),g=m.pathname,b=m.query,w=m.protocol;if(!g||w)return i(!1);a.urlIsNew(d)||(e="replaceState");var _=v(g),x=o.shallow,S=void 0!==x&&x;if(f.isDynamicRoute(_)){var O=u.parse(d).pathname,P=h.getRouteRegex(_),j=p.getRouteMatcher(P)(O);if(j)Object.assign(b,j);else if(Object.keys(P.groups).filter((function(t){return!b[t]})).length>0)return c(new Error("The provided `as` value (".concat(O,") is incompatible with the `href` value (").concat(_,"). ")+"Read more: https://err.sh/zeit/next.js/incompatible-href-as"))}t.events.emit("routeChangeStart",d),a.getRouteInfo(_,g,b,d,S).then((function(r){var n=r.error;if(n&&n.cancelled)return i(!1);if(t.events.emit("beforeHistoryChange",d),a.changeState(e,s,y(d),o),a.set(_,g,b,d,r),n)throw t.events.emit("routeChangeError",n,d),n;return t.events.emit("routeChangeComplete",d),i(!0)}),c)}))}},{key:"changeState",value:function(t,e,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};"pushState"===t&&l.getURL()===r||window.history[t]({url:e,as:r,options:n},"",r)}},{key:"getRouteInfo",value:function(t,e,r,n){var o=this,a=arguments.length>4&&void 0!==arguments[4]&&arguments[4],i=this.components[t];if(a&&i&&this.route===t)return Promise.resolve(i);var c=function t(a,i){return new Promise((function(c){return"PAGE_LOAD_ERROR"===a.code||i?(window.location.href=n,a.cancelled=!0,c({error:a})):a.cancelled?c({error:a}):void c(o.fetchComponent("/_error").then((function(t){var n=t.page,i={Component:n,err:a};return new Promise((function(t){o.getInitialProps(n,{err:a,pathname:e,query:r}).then((function(e){i.props=e,i.error=a,t(i)}),(function(e){console.error("Error in error page `getInitialProps`: ",e),i.error=a,i.props={},t(i)}))}))})).catch((function(e){return t(e,!0)})))}))};return new Promise((function(e,r){if(i)return e(i);o.fetchComponent(t).then((function(t){return e({Component:t.page,__N_SSG:t.mod.__N_SSG,__N_SSP:t.mod.__N_SSP})}),r)})).then((function(a){var i=a.Component,c=a.__N_SSG,u=a.__N_SSP;return o._getData((function(){return c?o._getStaticData(n):u?o._getServerData(n):o.getInitialProps(i,{pathname:e,query:r,asPath:n})})).then((function(e){return a.props=e,o.components[t]=a,a}))})).catch(c)}},{key:"set",value:function(t,e,r,n,o){this.isFallback=!1,this.route=t,this.pathname=e,this.query=r,this.asPath=n,this.notify(o)}},{key:"beforePopState",value:function(t){this._bps=t}},{key:"onlyAHashChange",value:function(t){if(!this.asPath)return!1;var e=this.asPath.split("#"),r=o(e,2),n=r[0],a=r[1],i=t.split("#"),c=o(i,2),u=c[0],s=c[1];return!(!s||n!==u||a!==s)||n===u&&a!==s}},{key:"scrollToHash",value:function(t){var e=t.split("#"),r=o(e,2)[1];if(""!==r){var n=document.getElementById(r);if(n)n.scrollIntoView();else{var a=document.getElementsByName(r)[0];a&&a.scrollIntoView()}}else window.scrollTo(0,0)}},{key:"urlIsNew",value:function(t){return this.asPath!==t}},{key:"prefetch",value:function(t){var e=this,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return new Promise((function(o,a){var i=u.parse(t),c=i.pathname,s=i.protocol;c&&!s&&Promise.all([e.pageLoader.prefetchData(t,r),e.pageLoader[n.priority?"loadPage":"prefetch"](v(c))]).then((function(){return o()}),a)}))}},{key:"fetchComponent",value:function(t){var e,r,o,a;return n.async((function(i){for(;;)switch(i.prev=i.next){case 0:return e=!1,r=this.clc=function(){e=!0},i.next=4,n.awrap(this.pageLoader.loadPage(t));case 4:if(o=i.sent,!e){i.next=9;break}throw(a=new Error('Abort fetching component for route: "'.concat(t,'"'))).cancelled=!0,a;case 9:return r===this.clc&&(this.clc=null),i.abrupt("return",o);case 11:case"end":return i.stop()}}),null,this,null,Promise)}},{key:"_getData",value:function(t){var e=this,r=!1,n=function(){r=!0};return this.clc=n,t().then((function(t){if(n===e.clc&&(e.clc=null),r){var o=new Error("Loading initial props cancelled");throw o.cancelled=!0,o}return t}))}},{key:"getInitialProps",value:function(t,e){var r=this.components["/_app"].Component,n=this._wrapApp(r);return e.AppTree=n,l.loadGetInitialProps(r,{AppTree:n,Component:t,router:this,ctx:e})}},{key:"abortComponentLoad",value:function(e){if(this.clc){var r=new Error("Route Cancelled");r.cancelled=!0,t.events.emit("routeChangeError",r,e),this.clc(),this.clc=null}}},{key:"notify",value:function(t){this.sub(t,this.components["/_app"].Component)}}],[{key:"_rewriteUrlForNextExport",value:function(t){return t}}]),t}();e.default=g,g.events=s.default()},"g/15":function(t,e,r){"use strict";var n=r("o0o1");Object.defineProperty(e,"__esModule",{value:!0});var o=r("QmWs");function a(){var t=window.location,e=t.protocol,r=t.hostname,n=t.port;return"".concat(e,"//").concat(r).concat(n?":"+n:"")}function i(t){return"string"===typeof t?t:t.displayName||t.name||"Unknown"}function c(t){return t.finished||t.headersSent}e.execOnce=function(t){var e=this,r=!1,n=null;return function(){if(!r){r=!0;for(var o=arguments.length,a=new Array(o),i=0;i0&&s>u&&(s=u);for(var l=0;l=0?(f=v.substr(0,d),p=v.substr(d+1)):(f=v,p=""),h=decodeURIComponent(f),y=decodeURIComponent(p),n(i,h)?o(i[h])?i[h].push(y):i[h]=[i[h],y]:i[h]=y}return i};var o=Array.isArray||function(t){return"[object Array]"===Object.prototype.toString.call(t)}},ls82:function(t,e,r){var n=function(t){"use strict";var e,r=Object.prototype,n=r.hasOwnProperty,o="function"===typeof Symbol?Symbol:{},a=o.iterator||"@@iterator",i=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r,n){var o=e&&e.prototype instanceof v?e:v,a=Object.create(o.prototype),i=new k(n||[]);return a._invoke=function(t,e,r){var n=l;return function(o,a){if(n===p)throw new Error("Generator is already running");if(n===h){if("throw"===o)throw a;return C()}for(r.method=o,r.arg=a;;){var i=r.delegate;if(i){var c=O(i,r);if(c){if(c===y)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(n===l)throw n=h,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n=p;var u=s(t,e,r);if("normal"===u.type){if(n=r.done?h:f,u.arg===y)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n=h,r.method="throw",r.arg=u.arg)}}}(t,r,i),a}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(n){return{type:"throw",arg:n}}}t.wrap=u;var l="suspendedStart",f="suspendedYield",p="executing",h="completed",y={};function v(){}function d(){}function m(){}var g={};g[a]=function(){return this};var b=Object.getPrototypeOf,w=b&&b(b(R([])));w&&w!==r&&n.call(w,a)&&(g=w);var _=m.prototype=v.prototype=Object.create(g);function x(t){["next","throw","return"].forEach((function(e){t[e]=function(t){return this._invoke(e,t)}}))}function S(t,e){var r;this._invoke=function(o,a){function i(){return new e((function(r,i){!function r(o,a,i,c){var u=s(t[o],t,a);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"===typeof f&&n.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,i,c)}),(function(t){r("throw",t,i,c)})):e.resolve(f).then((function(t){l.value=t,i(l)}),(function(t){return r("throw",t,i,c)}))}c(u.arg)}(o,a,r,i)}))}return r=r?r.then(i,i):i()}}function O(t,r){var n=t.iterator[r.method];if(n===e){if(r.delegate=null,"throw"===r.method){if(t.iterator.return&&(r.method="return",r.arg=e,O(t,r),"throw"===r.method))return y;r.method="throw",r.arg=new TypeError("The iterator does not provide a 'throw' method")}return y}var o=s(n,t.iterator,r.arg);if("throw"===o.type)return r.method="throw",r.arg=o.arg,r.delegate=null,y;var a=o.arg;return a?a.done?(r[t.resultName]=a.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function P(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function j(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function k(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(P,this),this.reset(!0)}function R(t){if(t){var r=t[a];if(r)return r.call(t);if("function"===typeof t.next)return t;if(!isNaN(t.length)){var o=-1,i=function r(){for(;++o=0;--a){var i=this.tryEntries[a],c=i.completion;if("root"===i.tryLoc)return o("end");if(i.tryLoc<=this.prev){var u=n.call(i,"catchLoc"),s=n.call(i,"finallyLoc");if(u&&s){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),j(r),y}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;j(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:R(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}(t.exports);try{regeneratorRuntime=n}catch(o){Function("r","regeneratorRuntime = r")(n)}},lwsE:function(t,e){t.exports=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}},m0LI:function(t,e){t.exports=function(t,e){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t)){var r=[],n=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!e||r.length!==e);n=!0);}catch(u){o=!0,a=u}finally{try{n||null==c.return||c.return()}finally{if(o)throw a}}return r}}},nOHt:function(t,e,r){"use strict";var n=r("sXyB"),o=r("284h"),a=r("TqRt");e.__esModule=!0,e.useRouter=function(){return i.default.useContext(u.RouterContext)},e.makePublicRouterInstance=function(t){var e=t,r={},n=!0,o=!1,a=void 0;try{for(var i,u=f[Symbol.iterator]();!(n=(i=u.next()).done);n=!0){var s=i.value;"object"!==typeof e[s]?r[s]=e[s]:r[s]=Object.assign({},e[s])}}catch(l){o=!0,a=l}finally{try{n||null==u.return||u.return()}finally{if(o)throw a}}return r.events=c.default.events,p.forEach((function(t){r[t]=function(){return e[t].apply(e,arguments)}})),r},e.createRouter=e.withRouter=e.default=void 0;var i=a(r("q1tI")),c=o(r("elyg"));e.Router=c.default,e.NextRouter=c.NextRouter;var u=r("qOIg"),s=a(r("0Bsm"));e.withRouter=s.default;var l={router:null,readyCallbacks:[],ready:function(t){if(this.router)return t();this.readyCallbacks.push(t)}},f=["pathname","route","query","asPath","components","isFallback"],p=["push","replace","reload","back","prefetch","beforePopState"];function h(){if(!l.router){throw new Error('No router instance found.\nYou should only use "next/router" inside the client side of your app.\n')}return l.router}Object.defineProperty(l,"events",{get:function(){return c.default.events}}),f.forEach((function(t){Object.defineProperty(l,t,{get:function(){return h()[t]}})})),p.forEach((function(t){l[t]=function(){var e=h();return e[t].apply(e,arguments)}})),["routeChangeStart","beforeHistoryChange","routeChangeComplete","routeChangeError","hashChangeStart","hashChangeComplete"].forEach((function(t){l.ready((function(){c.default.events.on(t,(function(){var e="on"+t.charAt(0).toUpperCase()+t.substring(1),r=l;if(r[e])try{r[e].apply(r,arguments)}catch(n){console.error("Error when running the Router event: "+e),console.error(n.message+"\n"+n.stack)}}))}))}));var y=l;e.default=y;e.createRouter=function(){for(var t=arguments.length,e=new Array(t),r=0;r>>0,1)},emit:function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),o=1;o0&&t.status>=500)return r();throw new Error("Failed to load static props")}return t.json()}))}().then((function(t){return n?n(t):t})).catch((function(t){throw r||(t.code="PAGE_LOAD_ERROR"),t}))}var g=function(){function t(e,r,n,o){var i=this,c=o.initialProps,s=o.pageLoader,p=o.App,h=o.wrapApp,y=o.Component,g=o.err,b=o.subscription,w=o.isFallback;a(this,t),this.sdc={},this.onPopState=function(t){if(t.state){if((!t.state||!i.isSsr||t.state.as!==i.asPath||u.parse(t.state.url).pathname!==i.pathname)&&(!i._bps||i._bps(t.state))){var e=t.state,r=e.url,n=e.as,o=e.options;0,i.replace(r,n,o)}}else{var a=i.pathname,c=i.query;i.changeState("replaceState",l.formatWithValidation({pathname:a,query:c}),l.getURL())}},this._getStaticData=function(t){var e=d(u.parse(t).pathname);return i.sdc[e]?Promise.resolve(i.sdc[e]):m(e,null,i.isSsr,(function(t){return i.sdc[e]=t}))},this._getServerData=function(t){var e=u.parse(t,!0),r=e.pathname,n=e.query;return m(r=d(r),n,i.isSsr)},this.route=v(e),this.components={},"/_error"!==e&&(this.components[this.route]={Component:y,props:c,err:g,__N_SSG:c&&c.__N_SSG,__N_SSP:c&&c.__N_SSP}),this.components["/_app"]={Component:p},this.events=t.events,this.pageLoader=s,this.pathname=e,this.query=r,this.asPath=f.isDynamicRoute(e)&&__NEXT_DATA__.autoExport?e:n,this.sub=b,this.clc=null,this._wrapApp=h,this.isSsr=!0,this.isFallback=w,this.changeState("replaceState",l.formatWithValidation({pathname:e,query:r}),n),window.addEventListener("popstate",this.onPopState)}return i(t,[{key:"update",value:function(t,e){var r=e.default||e,n=this.components[t];if(!n)throw new Error("Cannot update unavailable route: ".concat(t));var o=Object.assign(Object.assign({},n),{Component:r,__N_SSG:e.__N_SSG,__N_SSP:e.__N_SSP});this.components[t]=o,"/_app"!==t?t===this.route&&this.notify(o):this.notify(this.components[this.route])}},{key:"reload",value:function(){window.location.reload()}},{key:"back",value:function(){window.history.back()}},{key:"push",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("pushState",t,e,r)}},{key:"replace",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return this.change("replaceState",t,e,r)}},{key:"change",value:function(e,r,n,o){var a=this;return new Promise((function(i,c){o._h||(a.isSsr=!1),l.ST&&performance.mark("routeChange");var s="object"===typeof r?l.formatWithValidation(r):r,d="object"===typeof n?l.formatWithValidation(n):n;if(a.abortComponentLoad(d),!o._h&&a.onlyAHashChange(d))return a.asPath=d,t.events.emit("hashChangeStart",d),a.changeState(e,s,y(d),o),a.scrollToHash(d),t.events.emit("hashChangeComplete",d),i(!0);var m=u.parse(s,!0),g=m.pathname,b=m.query,w=m.protocol;if(!g||w)return i(!1);a.urlIsNew(d)||(e="replaceState");var _=v(g),x=o.shallow,S=void 0!==x&&x;if(f.isDynamicRoute(_)){var O=u.parse(d).pathname,P=h.getRouteRegex(_),j=p.getRouteMatcher(P)(O);if(j)Object.assign(b,j);else if(Object.keys(P.groups).filter((function(t){return!b[t]})).length>0)return c(new Error("The provided `as` value (".concat(O,") is incompatible with the `href` value (").concat(_,"). ")+"Read more: https://err.sh/zeit/next.js/incompatible-href-as"))}t.events.emit("routeChangeStart",d),a.getRouteInfo(_,g,b,d,S).then((function(r){var n=r.error;if(n&&n.cancelled)return i(!1);if(t.events.emit("beforeHistoryChange",d),a.changeState(e,s,y(d),o),a.set(_,g,b,d,r),n)throw t.events.emit("routeChangeError",n,d),n;return t.events.emit("routeChangeComplete",d),i(!0)}),c)}))}},{key:"changeState",value:function(t,e,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};"pushState"===t&&l.getURL()===r||window.history[t]({url:e,as:r,options:n},"",r)}},{key:"getRouteInfo",value:function(t,e,r,n){var o=this,a=arguments.length>4&&void 0!==arguments[4]&&arguments[4],i=this.components[t];if(a&&i&&this.route===t)return Promise.resolve(i);var c=function t(a,i){return new Promise((function(c){return"PAGE_LOAD_ERROR"===a.code||i?(window.location.href=n,a.cancelled=!0,c({error:a})):a.cancelled?c({error:a}):void c(o.fetchComponent("/_error").then((function(t){var n=t.page,i={Component:n,err:a};return new Promise((function(t){o.getInitialProps(n,{err:a,pathname:e,query:r}).then((function(e){i.props=e,i.error=a,t(i)}),(function(e){console.error("Error in error page `getInitialProps`: ",e),i.error=a,i.props={},t(i)}))}))})).catch((function(e){return t(e,!0)})))}))};return new Promise((function(e,r){if(i)return e(i);o.fetchComponent(t).then((function(t){return e({Component:t.page,__N_SSG:t.mod.__N_SSG,__N_SSP:t.mod.__N_SSP})}),r)})).then((function(a){var i=a.Component,c=a.__N_SSG,u=a.__N_SSP;return o._getData((function(){return c?o._getStaticData(n):u?o._getServerData(n):o.getInitialProps(i,{pathname:e,query:r,asPath:n})})).then((function(e){return a.props=e,o.components[t]=a,a}))})).catch(c)}},{key:"set",value:function(t,e,r,n,o){this.isFallback=!1,this.route=t,this.pathname=e,this.query=r,this.asPath=n,this.notify(o)}},{key:"beforePopState",value:function(t){this._bps=t}},{key:"onlyAHashChange",value:function(t){if(!this.asPath)return!1;var e=this.asPath.split("#"),r=o(e,2),n=r[0],a=r[1],i=t.split("#"),c=o(i,2),u=c[0],s=c[1];return!(!s||n!==u||a!==s)||n===u&&a!==s}},{key:"scrollToHash",value:function(t){var e=t.split("#"),r=o(e,2)[1];if(""!==r){var n=document.getElementById(r);if(n)n.scrollIntoView();else{var a=document.getElementsByName(r)[0];a&&a.scrollIntoView()}}else window.scrollTo(0,0)}},{key:"urlIsNew",value:function(t){return this.asPath!==t}},{key:"prefetch",value:function(t){var e=this,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return new Promise((function(o,a){var i=u.parse(t),c=i.pathname,s=i.protocol;c&&!s&&Promise.all([e.pageLoader.prefetchData(t,r),e.pageLoader[n.priority?"loadPage":"prefetch"](v(c))]).then((function(){return o()}),a)}))}},{key:"fetchComponent",value:function(t){var e,r,o,a;return n.async((function(i){for(;;)switch(i.prev=i.next){case 0:return e=!1,r=this.clc=function(){e=!0},i.next=4,n.awrap(this.pageLoader.loadPage(t));case 4:if(o=i.sent,!e){i.next=9;break}throw(a=new Error('Abort fetching component for route: "'.concat(t,'"'))).cancelled=!0,a;case 9:return r===this.clc&&(this.clc=null),i.abrupt("return",o);case 11:case"end":return i.stop()}}),null,this,null,Promise)}},{key:"_getData",value:function(t){var e=this,r=!1,n=function(){r=!0};return this.clc=n,t().then((function(t){if(n===e.clc&&(e.clc=null),r){var o=new Error("Loading initial props cancelled");throw o.cancelled=!0,o}return t}))}},{key:"getInitialProps",value:function(t,e){var r=this.components["/_app"].Component,n=this._wrapApp(r);return e.AppTree=n,l.loadGetInitialProps(r,{AppTree:n,Component:t,router:this,ctx:e})}},{key:"abortComponentLoad",value:function(e){if(this.clc){var r=new Error("Route Cancelled");r.cancelled=!0,t.events.emit("routeChangeError",r,e),this.clc(),this.clc=null}}},{key:"notify",value:function(t){this.sub(t,this.components["/_app"].Component)}}],[{key:"_rewriteUrlForNextExport",value:function(t){return t}}]),t}();e.default=g,g.events=s.default()},"g/15":function(t,e,r){"use strict";var n=r("o0o1");Object.defineProperty(e,"__esModule",{value:!0});var o=r("QmWs");function a(){var t=window.location,e=t.protocol,r=t.hostname,n=t.port;return"".concat(e,"//").concat(r).concat(n?":"+n:"")}function i(t){return"string"===typeof t?t:t.displayName||t.name||"Unknown"}function c(t){return t.finished||t.headersSent}e.execOnce=function(t){var e=this,r=!1,n=null;return function(){if(!r){r=!0;for(var o=arguments.length,a=new Array(o),i=0;i0&&s>u&&(s=u);for(var l=0;l=0?(f=v.substr(0,d),p=v.substr(d+1)):(f=v,p=""),h=decodeURIComponent(f),y=decodeURIComponent(p),n(i,h)?o(i[h])?i[h].push(y):i[h]=[i[h],y]:i[h]=y}return i};var o=Array.isArray||function(t){return"[object Array]"===Object.prototype.toString.call(t)}},ls82:function(t,e,r){var n=function(t){"use strict";var e,r=Object.prototype,n=r.hasOwnProperty,o="function"===typeof Symbol?Symbol:{},a=o.iterator||"@@iterator",i=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r,n){var o=e&&e.prototype instanceof v?e:v,a=Object.create(o.prototype),i=new k(n||[]);return a._invoke=function(t,e,r){var n=l;return function(o,a){if(n===p)throw new Error("Generator is already running");if(n===h){if("throw"===o)throw a;return C()}for(r.method=o,r.arg=a;;){var i=r.delegate;if(i){var c=O(i,r);if(c){if(c===y)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(n===l)throw n=h,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n=p;var u=s(t,e,r);if("normal"===u.type){if(n=r.done?h:f,u.arg===y)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n=h,r.method="throw",r.arg=u.arg)}}}(t,r,i),a}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(n){return{type:"throw",arg:n}}}t.wrap=u;var l="suspendedStart",f="suspendedYield",p="executing",h="completed",y={};function v(){}function d(){}function m(){}var g={};g[a]=function(){return this};var b=Object.getPrototypeOf,w=b&&b(b(R([])));w&&w!==r&&n.call(w,a)&&(g=w);var _=m.prototype=v.prototype=Object.create(g);function x(t){["next","throw","return"].forEach((function(e){t[e]=function(t){return this._invoke(e,t)}}))}function S(t,e){var r;this._invoke=function(o,a){function i(){return new e((function(r,i){!function r(o,a,i,c){var u=s(t[o],t,a);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"===typeof f&&n.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,i,c)}),(function(t){r("throw",t,i,c)})):e.resolve(f).then((function(t){l.value=t,i(l)}),(function(t){return r("throw",t,i,c)}))}c(u.arg)}(o,a,r,i)}))}return r=r?r.then(i,i):i()}}function O(t,r){var n=t.iterator[r.method];if(n===e){if(r.delegate=null,"throw"===r.method){if(t.iterator.return&&(r.method="return",r.arg=e,O(t,r),"throw"===r.method))return y;r.method="throw",r.arg=new TypeError("The iterator does not provide a 'throw' method")}return y}var o=s(n,t.iterator,r.arg);if("throw"===o.type)return r.method="throw",r.arg=o.arg,r.delegate=null,y;var a=o.arg;return a?a.done?(r[t.resultName]=a.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function P(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function j(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function k(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(P,this),this.reset(!0)}function R(t){if(t){var r=t[a];if(r)return r.call(t);if("function"===typeof t.next)return t;if(!isNaN(t.length)){var o=-1,i=function r(){for(;++o=0;--a){var i=this.tryEntries[a],c=i.completion;if("root"===i.tryLoc)return o("end");if(i.tryLoc<=this.prev){var u=n.call(i,"catchLoc"),s=n.call(i,"finallyLoc");if(u&&s){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),j(r),y}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;j(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:R(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}(t.exports);try{regeneratorRuntime=n}catch(o){Function("r","regeneratorRuntime = r")(n)}},lwsE:function(t,e){t.exports=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}},m0LI:function(t,e){t.exports=function(t,e){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t)){var r=[],n=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!e||r.length!==e);n=!0);}catch(u){o=!0,a=u}finally{try{n||null==c.return||c.return()}finally{if(o)throw a}}return r}}},nOHt:function(t,e,r){"use strict";var n=r("sXyB"),o=r("284h"),a=r("TqRt");e.__esModule=!0,e.useRouter=function(){return i.default.useContext(u.RouterContext)},e.makePublicRouterInstance=function(t){var e=t,r={},n=!0,o=!1,a=void 0;try{for(var i,u=f[Symbol.iterator]();!(n=(i=u.next()).done);n=!0){var s=i.value;"object"!==typeof e[s]?r[s]=e[s]:r[s]=Object.assign({},e[s])}}catch(l){o=!0,a=l}finally{try{n||null==u.return||u.return()}finally{if(o)throw a}}return r.events=c.default.events,p.forEach((function(t){r[t]=function(){return e[t].apply(e,arguments)}})),r},e.createRouter=e.withRouter=e.default=void 0;var i=a(r("q1tI")),c=o(r("elyg"));e.Router=c.default,e.NextRouter=c.NextRouter;var u=r("qOIg"),s=a(r("0Bsm"));e.withRouter=s.default;var l={router:null,readyCallbacks:[],ready:function(t){if(this.router)return t();this.readyCallbacks.push(t)}},f=["pathname","route","query","asPath","components","isFallback"],p=["push","replace","reload","back","prefetch","beforePopState"];function h(){if(!l.router){throw new Error('No router instance found.\nYou should only use "next/router" inside the client side of your app.\n')}return l.router}Object.defineProperty(l,"events",{get:function(){return c.default.events}}),f.forEach((function(t){Object.defineProperty(l,t,{get:function(){return h()[t]}})})),p.forEach((function(t){l[t]=function(){var e=h();return e[t].apply(e,arguments)}})),["routeChangeStart","beforeHistoryChange","routeChangeComplete","routeChangeError","hashChangeStart","hashChangeComplete"].forEach((function(t){l.ready((function(){c.default.events.on(t,(function(){var e="on"+t.charAt(0).toUpperCase()+t.substring(1),r=l;if(r[e])try{r[e].apply(r,arguments)}catch(n){console.error("Error when running the Router event: "+e),console.error(n.message+"\n"+n.stack)}}))}))}));var y=l;e.default=y;e.createRouter=function(){for(var t=arguments.length,e=new Array(t),r=0;r {\n if (typeof fragmentChild === 'string' ||\n typeof fragmentChild === 'number') {\n return fragmentList;\n }\n return fragmentList.concat(fragmentChild);\n }, []));\n }\n return list.concat(child);\n}\nconst METATYPES = ['name', 'httpEquiv', 'charSet', 'itemProp'];\n/*\n returns a function for filtering head child elements\n which shouldn't be duplicated, like \n Also adds support for deduplicated `key` properties\n*/\nfunction unique() {\n const keys = new Set();\n const tags = new Set();\n const metaTypes = new Set();\n const metaCategories = {};\n return (h) => {\n let unique = true;\n if (h.key && typeof h.key !== 'number' && h.key.indexOf('$') > 0) {\n const key = h.key.slice(h.key.indexOf('$') + 1);\n if (keys.has(key)) {\n unique = false;\n }\n else {\n keys.add(key);\n }\n }\n // eslint-disable-next-line default-case\n switch (h.type) {\n case 'title':\n case 'base':\n if (tags.has(h.type)) {\n unique = false;\n }\n else {\n tags.add(h.type);\n }\n break;\n case 'meta':\n for (let i = 0, len = METATYPES.length; i < len; i++) {\n const metatype = METATYPES[i];\n if (!h.props.hasOwnProperty(metatype))\n continue;\n if (metatype === 'charSet') {\n if (metaTypes.has(metatype)) {\n unique = false;\n }\n else {\n metaTypes.add(metatype);\n }\n }\n else {\n const category = h.props[metatype];\n const categories = metaCategories[metatype] || new Set();\n if (categories.has(category)) {\n unique = false;\n }\n else {\n categories.add(category);\n metaCategories[metatype] = categories;\n }\n }\n }\n break;\n }\n return unique;\n };\n}\n/**\n *\n * @param headElement List of multiple instances\n */\nfunction reduceComponents(headElements, props) {\n return headElements\n .reduce((list, headElement) => {\n const headElementChildren = react_1.default.Children.toArray(headElement.props.children);\n return list.concat(headElementChildren);\n }, [])\n .reduce(onlyReactElement, [])\n .reverse()\n .concat(defaultHead(props.inAmpMode))\n .filter(unique())\n .reverse()\n .map((c, i) => {\n const key = c.key || i;\n return react_1.default.cloneElement(c, { key });\n });\n}\nconst Effect = side_effect_1.default();\n/**\n * This component injects elements to `` of your page.\n * To avoid duplicated `tags` in `` you can use the `key` property, which will make sure every tag is only rendered once.\n */\nfunction Head({ children }) {\n return (react_1.default.createElement(amp_context_1.AmpStateContext.Consumer, null, ampState => (react_1.default.createElement(head_manager_context_1.HeadManagerContext.Consumer, null, updateHead => (react_1.default.createElement(Effect, { reduceComponentsToState: reduceComponents, handleStateChange: updateHead, inAmpMode: amp_1.isInAmpMode(ampState) }, children))))));\n}\nHead.rewind = Effect.rewind;\nexports.default = Head;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nconst react_1 = require(\"react\");\nconst isServer = typeof window === 'undefined';\nexports.default = () => {\n const mountedInstances = new Set();\n let state;\n function emitChange(component) {\n state = component.props.reduceComponentsToState([...mountedInstances], component.props);\n if (component.props.handleStateChange) {\n component.props.handleStateChange(state);\n }\n }\n return class extends react_1.Component {\n // Used when server rendering\n static rewind() {\n const recordedState = state;\n state = undefined;\n mountedInstances.clear();\n return recordedState;\n }\n constructor(props) {\n super(props);\n if (isServer) {\n mountedInstances.add(this);\n emitChange(this);\n }\n }\n componentDidMount() {\n mountedInstances.add(this);\n emitChange(this);\n }\n componentDidUpdate() {\n emitChange(this);\n }\n componentWillUnmount() {\n mountedInstances.delete(this);\n emitChange(this);\n }\n render() {\n return null;\n }\n };\n};\n","\"use strict\";var _interopRequireDefault=require(\"@babel/runtime/helpers/interopRequireDefault\");exports.__esModule=true;exports.default=void 0;var _react=_interopRequireDefault(require(\"react\"));var _head=_interopRequireDefault(require(\"../next-server/lib/head\"));var statusCodes={400:'Bad Request',404:'This page could not be found',405:'Method Not Allowed',500:'Internal Server Error'};/**\n * `Error` component used for handling errors.\n */class Error extends _react.default.Component{static getInitialProps(_ref){var{res,err}=_ref;var statusCode=res&&res.statusCode?res.statusCode:err?err.statusCode:404;return{statusCode};}render(){var{statusCode}=this.props;var title=this.props.title||statusCodes[statusCode]||'An unexpected error has occurred';return _react.default.createElement(\"div\",{style:styles.error},_react.default.createElement(_head.default,null,_react.default.createElement(\"title\",null,statusCode,\": \",title)),_react.default.createElement(\"div\",null,_react.default.createElement(\"style\",{dangerouslySetInnerHTML:{__html:'body { margin: 0 }'}}),statusCode?_react.default.createElement(\"h1\",{style:styles.h1},statusCode):null,_react.default.createElement(\"div\",{style:styles.desc},_react.default.createElement(\"h2\",{style:styles.h2},title,\".\"))));}}exports.default=Error;Error.displayName='ErrorPage';var styles={error:{color:'#000',background:'#fff',fontFamily:'-apple-system, BlinkMacSystemFont, Roboto, \"Segoe UI\", \"Fira Sans\", Avenir, \"Helvetica Neue\", \"Lucida Grande\", sans-serif',height:'100vh',textAlign:'center',display:'flex',flexDirection:'column',alignItems:'center',justifyContent:'center'},desc:{display:'inline-block',textAlign:'left',lineHeight:'49px',height:'49px',verticalAlign:'middle'},h1:{display:'inline-block',borderRight:'1px solid rgba(0, 0, 0,.3)',margin:0,marginRight:'20px',padding:'10px 23px 10px 0',fontSize:'24px',fontWeight:500,verticalAlign:'top'},h2:{fontSize:'14px',fontWeight:'normal',lineHeight:'inherit',margin:0,padding:0}};","module.exports = (__webpack_require__(/*! dll-reference dll_82519ec661270f7f484f */ \"dll-reference dll_82519ec661270f7f484f\"))(\"./node_modules/react/index.js\");","module.exports = dll_82519ec661270f7f484f;"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACVA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACRA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;AChBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACPA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACJA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACJA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACZA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACTA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;ACVA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;AChBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;ACZA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;ACVA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;;;;;;;;ACfA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;ACVA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;;;;;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAnCA;AACA;AAoCA;AACA;AACA;AACA;;;;;;AAIA;AACA;AAEA;AACA;AACA;AAOA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;AAIA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;AC/HA;AACA;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAPA;AACA;AAOA;AAAA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAMA;AACA;AAfA;AAAA;AAAA;AAgBA;AACA;AACA;AAlBA;AAAA;AAAA;AAoBA;AACA;AArBA;AAAA;AAAA;AAuBA;AACA;AACA;AAzBA;AAAA;AAAA;AA2BA;AACA;AA5BA;AACA;AADA;AAAA;AAAA;AA8BA;;;;;;;;;;;;AC3CA;AACA;;;;;;;;;;;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;AAEA;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;ACFA;;;;;;;;;;;ACAA;;;;A","sourceRoot":""}
--------------------------------------------------------------------------------
/out/_next/static/runtime/main-89c3fa0a1c8f272d65df.js:
--------------------------------------------------------------------------------
1 | (window.webpackJsonp=window.webpackJsonp||[]).push([[7],{BMP1:function(e,t,r){"use strict";var n=r("284h")(r("IKlv"));window.next=n,(0,n.default)().catch((function(e){console.error(e.message+"\n"+e.stack)}))},DqTX:function(e,t,r){"use strict";t.__esModule=!0,t.default=function(){var e=null;return function(t){var r=e=Promise.resolve().then((function(){if(r===e){e=null;var n={};t.forEach((function(e){var t=n[e.type]||[];t.push(e),n[e.type]=t}));var o=n.title?n.title[0]:null,i="";if(o){var s=o.props.children;i="string"===typeof s?s:s.join("")}i!==document.title&&(document.title=i),["meta","base","link","style","script"].forEach((function(e){!function(e,t){var r=document.getElementsByTagName("head")[0],n=r.querySelector("meta[name=next-head-count]");0;for(var o=Number(n.content),i=[],s=0,u=n.previousElementSibling;s v * sp)\n}\n\nlet Line = () =>
\n\nlet Space = () =>
\n\nlet Button = ({\n label,\n clearer,\n trigger,\n text_label,\n press_gates,\n custom_style,\n}) => {\n let button_style = {\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'inherit',\n border: 'none',\n padding: 0,\n margin: 0,\n width: sp,\n background: 'black',\n color: 'white',\n display: 'block',\n }\n if (custom_style !== undefined) {\n button_style = Object.assign(button_style, custom_style)\n }\n return (\n \n
{\n trigger()\n }}\n >\n {label}\n \n {text_label !== undefined ? (\n
{\n trigger()\n }}\n >\n
\n
{text_label}
\n
\n ) : null}\n
\n )\n}\n\nlet RepeatButton = ({\n label,\n clearer,\n trigger,\n text_label,\n press_gates,\n custom_style,\n}) => {\n let repeat_ref = useRef(null)\n let start_gate = useRef(false)\n\n let touch_mode = useRef(false)\n\n let button_style = {\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'inherit',\n border: 'none',\n padding: 0,\n margin: 0,\n width: sp,\n background: 'black',\n color: 'white',\n display: 'block',\n }\n if (custom_style !== undefined) {\n button_style = Object.assign(button_style, custom_style)\n }\n return (\n \n
{\n touch_mode.current = true\n press_gates.current = true\n trigger()\n setTimeout(() => {\n if (press_gates.current) {\n repeat_ref.current = setInterval(() => {\n trigger()\n }, 100)\n clearer(repeat_ref.current)\n }\n }, 400)\n }}\n onTouchEnd={e => {\n setTimeout(() => {\n touch_mode.current = false\n }, 400)\n e.preventDefault()\n }}\n onMouseDown={e => {\n if (!touch_mode.current) {\n press_gates.current = true\n trigger()\n setTimeout(() => {\n if (press_gates.current) {\n repeat_ref.current = setInterval(() => {\n trigger()\n }, 100)\n clearer(repeat_ref.current)\n }\n }, 400)\n }\n }}\n onMouseUp={e => {\n if (!touch_mode.current) {\n clearInterval(repeat_ref.current)\n }\n }}\n >\n {label}\n \n {text_label !== undefined ? (\n
{\n repeat_ref.current = setInterval(() => {\n trigger()\n }, 200)\n clearer(repeat_ref.current)\n trigger()\n }}\n onMouseUp={e => {\n clearInterval(repeat_ref.current)\n }}\n >\n
\n
{text_label}
\n
\n ) : null}\n
\n )\n}\n\nconst Home = () => {\n let cref = useRef(null)\n let clear_render_ref = useRef(false)\n let clear_ref = useRef(false)\n let state = useRef({})\n let km_ref = useRef({})\n let slider_click_ref = useRef(null)\n let slider_touch_mode = useRef(false)\n let press_gates = useRef(false)\n let [width, setWidth] = useState(null)\n let file_input = useRef(null)\n let ti_ref = useRef(null)\n let thresh_ref = useRef(null)\n let [favicon, setFavicon] = useState('favicon.png')\n\n function loadImage(src) {\n let c = cref.current\n let cx = c.getContext('2d')\n let img = document.createElement('img')\n img.onload = () => {\n let aspect = img.width / img.height\n let window_aspect =\n (window.innerWidth - sp) / (window.innerHeight - sp * 8)\n\n let snapw, snaph\n if (aspect < window_aspect) {\n // worry about height\n let adj_height = Math.min(\n img.height,\n Math.floor(window.innerHeight - sp * 8)\n )\n snaph = Math.round(adj_height / sp) * sp\n let snapr = snaph / img.height\n snapw = Math.round((img.width * snapr) / sp) * sp\n } else {\n // worry about width\n let adj_width = Math.min(\n img.width,\n Math.floor(window.innerWidth - sp) - sp / 2\n )\n snapw = Math.round(adj_width / sp) * sp\n let snapr = snapw / img.width\n snaph = Math.round((img.height * snapr) / sp) * sp\n }\n\n img.width = snapw\n img.height = snaph\n\n setWidth(img.width)\n\n c.width = img.width\n c.height = img.height\n\n let cols = img.width / sp\n let rows = img.height / sp\n let cells = cols * rows\n\n // size slider\n let ti = ti_ref.current\n ti.width = img.width - sp * 4\n ti.height = sp * 2\n\n // preserve dimensions\n let t_img = document.createElement('canvas')\n t_img.width = c.width\n t_img.height = c.height\n let t_imgx = t_img.getContext('2d')\n t_imgx.drawImage(img, 0, 0, c.width, c.height)\n img = t_img\n\n // draw original image\n // cx.drawImage(img, 0, 0, c.width, c.height)\n\n // store original image\n let imc = document.createElement('canvas')\n imc.width = c.width\n imc.height = c.height\n let imx = imc.getContext('2d')\n imx.drawImage(img, 0, 0, c.width, c.height)\n\n // cut up original image\n let tiles = []\n for (let i = 0; i < cells; i++) {\n let t = document.createElement('canvas')\n t.width = sp\n t.height = sp\n let tx = t.getContext('2d')\n\n let x = i % cols\n let y = Math.floor(i / cols)\n\n tx.drawImage(imc, x * sp, y * sp, sp, sp, 0, 0, sp, sp)\n\n let complexity = t.toDataURL().length / (sp * sp)\n\n tiles.push({ t, c: complexity, x, y, i })\n }\n tiles = _.sortBy(tiles, 'c')\n\n // grid with coordinates\n let grid = [...Array(rows)].map((n, y) =>\n [...Array(cols)].map((n, x) => {\n let d = Math.sqrt(\n Math.pow(x - cols / 2, 2) + Math.pow(y - rows / 2, 2)\n ).toFixed(8)\n return [x, y, d]\n })\n )\n\n // spiral order for iteration\n let ordered = _.flatten(grid)\n ordered.sort(function(a, b) {\n return a[2] - b[2]\n })\n\n // spiral test\n // for (let i = 0; i < 800; i++) {\n // let [x, y] = ordered[i]\n // cx.fillRect(...spx([x, y, 1, 1]))\n // }\n\n let threshold = cells - Math.round(cells / 2)\n state.current.threshold = threshold\n state.current.cells = cells\n state.current.ordered = ordered\n state.current.grid = grid\n state.current.cols = cols\n state.current.rows = rows\n state.current.imc = imc\n state.current.tiles = tiles\n\n // favicon\n let t = document.createElement('canvas')\n t.width = 16\n t.height = 16\n let tx = t.getContext('2d')\n tx.imageSmoothingEnabled = false\n tx.drawImage(img, 0, 0, img.width, img.height, 0, 0, 16, 16)\n setFavicon(t.toDataURL())\n\n render()\n\n // cx.fillStyle = 'red'\n // cx.fillRect((cols / 2) * sp - 1, 0, 2, c.height)\n // cx.fillRect(0, (rows / 2) * sp - 1, c.width, 2)\n // cx.fillStyle = 'black'\n }\n img.src = src\n }\n\n function render() {\n clear_render_ref.current = false\n let c = cref.current\n let cx = c.getContext('2d')\n let {\n cells,\n threshold,\n ordered,\n grid,\n cols,\n rows,\n imc,\n tiles,\n } = state.current\n\n // active\n let active = [...Array(rows)].map((n, y) =>\n [...Array(cols)].map((n, x) => [x, y, false])\n )\n for (let i = threshold; i < cells; i++) {\n let tile = tiles[i]\n let x = tile.x\n let y = tile.y\n active[y][x][2] = true\n }\n\n // slider\n let ti = ti_ref.current\n let tix = ti.getContext('2d')\n tix.fillStyle = '#ddd'\n tix.fillRect(0, 0, ti.width, sp * 2)\n tix.fillStyle = '#999'\n let tmark = Math.min(\n Math.max(1, Math.round(ti.width * ((cells - threshold) / cells))),\n ti.width - 2\n )\n tix.fillRect(tmark - 1, 0, 3, sp * 2)\n\n thresh_ref.current.innerHTML = cells - threshold + '/' + cells\n\n function getFree(x, y) {\n // it it off map it is undefined\n if (active[y] === undefined) return null\n if (active[y][x] === undefined) return null\n let check = active[y][x]\n // false means empty\n if (check[2] === false) {\n return grid[y][x]\n } else {\n return null\n }\n // return if false\n // if (coords) {\n // let [gx, gy] = coords\n // }\n }\n\n function getMove(x, y) {\n let raw = [\n [0, -1],\n [1, -1],\n [1, 1],\n [1, 0],\n [1, 1],\n [0, 1],\n [-1, 1],\n [-1, 0],\n [-1, -1],\n ].map(v => getFree(x + v[0], y + v[1]))\n let self = grid[y][x]\n let filtered = raw.filter(v => v !== null)\n let distances = filtered.map(v => parseFloat(v[2]))\n let min_distance = _.min(distances)\n if (min_distance < self[2]) {\n let min_i = distances.indexOf(min_distance)\n return filtered[min_i]\n } else {\n return null\n }\n }\n\n function _render() {\n let least_active = true\n let moved = false\n\n for (let i = 0; i < cells; i++) {\n let [x, y] = ordered[i]\n let check = active[y][x]\n if (check[2] === true) {\n least_active = false\n let move_to = getMove(x, y)\n if (move_to !== null) {\n moved = true\n let [mx, my] = move_to\n // let old = active[my][mx].slice()\n let old = [null, null, false]\n active[my][mx] = check\n active[y][x] = old\n }\n }\n }\n\n if (least_active) {\n cx.clearRect(0, 0, c.width, c.height)\n }\n if (!moved) {\n // only draw when done\n for (let i = 0; i < cells; i++) {\n let x = i % cols\n let y = Math.floor(i / cols)\n let check = active[y][x]\n if (check[2]) {\n cx.drawImage(\n imc,\n ...spx([...check.slice(0, 2), 1, 1]),\n ...spx([x, y, 1, 1])\n )\n }\n }\n } else if (moved && !clear_render_ref.current) {\n cx.clearRect(0, 0, c.width, c.height)\n\n // for (let i = 0; i < cells; i++) {\n // let x = i % cols\n // let y = Math.floor(i / cols)\n // let check = active[y][x]\n // // if (check) {\n // cx.drawImage(\n // imc,\n // ...spx([...check.slice(0, 2), 1, 1]),\n // ...spx([x, y, 1, 1])\n // )\n // // }\n // }\n\n _render()\n }\n }\n\n _render()\n }\n\n function clickSetThreshold(x) {\n let rect = ti_ref.current.getBoundingClientRect()\n x = x - rect.left\n let percent = x / ti_ref.current.width\n let { cells, threshold } = state.current\n let new_thresh =\n cells - Math.min(cells, Math.max(0, Math.round(percent * cells)))\n state.current.threshold = new_thresh\n render()\n }\n\n useEffect(() => {\n loadImage('veilance-field-photo.jpg')\n }, [])\n\n function trigger(key) {\n keyAction(key, null)\n }\n\n function keyAction(key, event) {\n let km = km_ref.current\n if (event === null) {\n event = { shiftKey: false }\n }\n\n let shift = event.shiftKey\n key = key.toLowerCase()\n\n if (key === 'o') {\n let input = file_input.current\n function handleChange(e) {\n let files = ''\n for (let item of this.files) {\n console.log(item)\n files += item.name + '.' + item.type\n if (item.type.indexOf('image') < 0) {\n continue\n }\n let src = URL.createObjectURL(item)\n loadImage(src)\n }\n this.removeEventListener('change', handleChange)\n }\n input.addEventListener('change', handleChange)\n\n input.dispatchEvent(\n new MouseEvent('click', {\n bubbles: true,\n cancelable: true,\n view: window,\n })\n )\n } else if (key === 'p') {\n let link = document.createElement('a')\n\n cref.current.toBlob(function(blob) {\n link.setAttribute(\n 'download',\n 'collapse-' +\n new Date()\n .toISOString()\n .slice(0, -4)\n .replace(/-/g, '')\n .replace(/:/g, '')\n .replace(/_/g, '')\n .replace(/\\./g, '') +\n 'Z' +\n '.png'\n )\n\n link.setAttribute('href', URL.createObjectURL(blob))\n link.dispatchEvent(\n new MouseEvent(`click`, {\n bubbles: true,\n cancelable: true,\n view: window,\n })\n )\n })\n }\n\n if (key === 'l' || key === 'arrowright') {\n let move = 10\n if (shift) move = 1\n state.current.threshold = Math.max(0, state.current.threshold - move)\n clear_render_ref.current = true\n render()\n } else if (key === 'h' || key === 'arrowleft') {\n let move = 10\n if (shift) move = 1\n state.current.threshold = Math.min(\n state.current.cells,\n state.current.threshold + move\n )\n clear_render_ref.current = true\n render()\n }\n }\n\n function downHandler(e) {\n km_ref.current[e.key] = true\n keyAction(e.key, e)\n }\n\n function upHandler(e) {\n km_ref.current[e.key] = false\n }\n\n function handleMouseMove(e) {\n if (!slider_touch_mode.current) {\n if (slider_click_ref.current) {\n clickSetThreshold(e.clientX)\n }\n }\n }\n\n function clearer(id) {\n clear_ref.current.push(id)\n }\n\n function clearRepeatIntervals() {\n for (let i = 0; i < clear_ref.current.length; i++) {\n let item = clear_ref.current[i]\n clearInterval(item)\n }\n clear_ref.current = []\n }\n\n function clearPressGates() {\n press_gates.current = false\n }\n\n function handleMouseUp(e) {\n if (!slider_touch_mode.current) {\n if (slider_click_ref.current) {\n slider_click_ref.current = false\n clickSetThreshold(e.clientX)\n }\n }\n clearPressGates()\n clearRepeatIntervals()\n }\n\n function onDrop(e) {\n e.preventDefault()\n e.stopPropagation()\n let file = e.dataTransfer.files[0]\n let filename = file.path ? file.path : file.name ? file.name : ''\n let src = URL.createObjectURL(file)\n loadImage(src)\n }\n\n function onDrag(e) {\n e.stopPropagation()\n e.preventDefault()\n e.dataTransfer.dropEffect = 'copy'\n }\n\n function onPaste(e) {\n e.preventDefault()\n e.stopPropagation()\n for (const item of e.clipboardData.items) {\n if (item.type.indexOf('image') < 0) {\n continue\n }\n let file = item.getAsFile()\n let src = URL.createObjectURL(file)\n loadImage(src)\n }\n }\n\n function handleTouchMove(e) {\n if (slider_touch_mode.current) {\n if (slider_click_ref.current) {\n clickSetThreshold(e.changedTouches[0].clientX)\n e.preventDefault()\n }\n }\n }\n\n function handleTouchEnd(e) {\n // touch end doesn't seem to have client x\n clearPressGates()\n clearRepeatIntervals()\n }\n\n useEffect(() => {\n window.addEventListener('keydown', downHandler)\n window.addEventListener('keyup', upHandler)\n window.addEventListener('mousemove', handleMouseMove)\n window.addEventListener('mouseup', handleMouseUp)\n window.addEventListener('paste', onPaste)\n window.addEventListener('dragover', onDrag)\n window.addEventListener('drop', onDrop)\n window.addEventListener('touchend', handleTouchEnd)\n window.addEventListener('touchmove', handleTouchMove, { passive: false })\n return () => {\n window.removeEventListener('keydown', downHandler)\n window.removeEventListener('keyup', upHandler)\n window.removeEventListener('mousemove', handleMouseMove)\n window.removeEventListener('mouseup', handleMouseUp)\n window.removeEventListener('paste', onPaste)\n window.removeEventListener('dragover', onDrag)\n window.removeEventListener('drop', onDrop)\n window.removeEventListener('touchend', handleTouchEnd)\n window.removeEventListener('touchmove', handleTouchMove)\n }\n }, [])\n\n let title = 'Collapse'\n // TODO\n let description = 'Collapse an image into itself using ranked pixels.'\n let share_img_url = 'https://collapse.constraint.systems/collapse.png'\n let og_url = 'https://collapse.constraint.systems'\n\n return (\n \n \n
\n
{title} \n
\n
\n
\n
{title} \n
\n
\n
\n
\n
\n
\n \n\n
\n
\n
\n
\n
\n {\n trigger('o')\n }}\n />\n \n {\n trigger('p')\n }}\n />\n
\n\n
\n\n
\n
\n
\n
{\n slider_click_ref.current = true\n slider_touch_mode.current = true\n clickSetThreshold(e.changedTouches[0].clientX)\n }}\n onTouchEnd={e => {\n setTimeout(() => {\n slider_click_ref.current = false\n slider_touch_mode.current = false\n }, 400)\n }}\n onMouseDown={e => {\n if (!slider_touch_mode.current) {\n slider_click_ref.current = true\n clickSetThreshold(e.clientX)\n }\n }}\n />\n {\n trigger('h')\n }}\n />\n
\n {\n trigger('l')\n }}\n />\n \n
\n
\n Superpixels are ranked and selected based on their size when\n compressed (compression size is used as a proxy for complexity).\n Learn more about how selection works in{' '}\n
\n Res\n \n . Superpixels are iteratively collapsed towards the center using a\n distance field.\n
\n
\n
\n
\n
\n
\n
\n
\n\n \n
\n )\n}\n\nexport default Home\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvCA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6CA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AAbA;AAAA;AAAA;AACA;AAcA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAEA;AAGA;AACA;AANA;AACA;AACA;AAQA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAeA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAVA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAUA;AACA;AACA;AAdA;AAcA;AAEA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AAEA;AACA;AAcA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AAAA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAVA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AAJA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AACA;AACA;AACA;AAJA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAtKA;AAAA;AAAA;AAmNA;AACA;AACA;;;;A","sourceRoot":""}
--------------------------------------------------------------------------------
/out/collapse.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/collapse.gif
--------------------------------------------------------------------------------
/out/collapse.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/collapse.png
--------------------------------------------------------------------------------
/out/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/favicon.png
--------------------------------------------------------------------------------
/out/fonts/IBMPlexMono-Italic.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/fonts/IBMPlexMono-Italic.woff
--------------------------------------------------------------------------------
/out/fonts/IBMPlexMono-Italic.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/fonts/IBMPlexMono-Italic.woff2
--------------------------------------------------------------------------------
/out/fonts/IBMPlexMono-Regular.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/fonts/IBMPlexMono-Regular.woff
--------------------------------------------------------------------------------
/out/fonts/IBMPlexMono-Regular.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/fonts/IBMPlexMono-Regular.woff2
--------------------------------------------------------------------------------
/out/index.html:
--------------------------------------------------------------------------------
1 | Collapse
o
Load image (or paste or drop)
Superpixels are ranked and selected based on their size when compressed (compression size is used as a proxy for complexity). Learn more about how selection works in
Res . Superpixels are iteratively collapsed towards the center using a distance field.
Original model photo from
Ssense .
--------------------------------------------------------------------------------
/out/mrrobot2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/mrrobot2.jpg
--------------------------------------------------------------------------------
/out/veilance-field-photo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/out/veilance-field-photo.jpg
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "spiral",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev",
7 | "build": "next build",
8 | "start": "next start",
9 | "deploy": "next build && next export && touch out/.nojekyll && touch out/CNAME && echo \"collapse.constraint.systems\" >> out/CNAME && git add out/ && git commit -m \"Deploy to gh-pages\" && git subtree push --prefix out origin gh-pages"
10 | },
11 | "dependencies": {
12 | "lodash": "^4.17.15",
13 | "next": "9.3.0",
14 | "react": "16.13.0",
15 | "react-dom": "16.13.0"
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/pages/index.js:
--------------------------------------------------------------------------------
1 | import Head from 'next/head'
2 | import React, { useRef, useState, useEffect, useReducer } from 'react'
3 | import * as _ from 'lodash'
4 |
5 | let sp = 16
6 | // let cols = 40
7 | // let rows = 30
8 | // let cells = cols * rows
9 |
10 | function spx(array) {
11 | return array.map(v => v * sp)
12 | }
13 |
14 | let Line = () =>
15 |
16 | let Space = () =>
17 |
18 | let Button = ({
19 | label,
20 | clearer,
21 | trigger,
22 | text_label,
23 | press_gates,
24 | custom_style,
25 | }) => {
26 | let button_style = {
27 | fontFamily: 'inherit',
28 | fontSize: 'inherit',
29 | lineHeight: 'inherit',
30 | border: 'none',
31 | padding: 0,
32 | margin: 0,
33 | width: sp,
34 | background: 'black',
35 | color: 'white',
36 | display: 'block',
37 | }
38 | if (custom_style !== undefined) {
39 | button_style = Object.assign(button_style, custom_style)
40 | }
41 | return (
42 |
43 |
{
46 | trigger()
47 | }}
48 | >
49 | {label}
50 |
51 | {text_label !== undefined ? (
52 |
{
55 | trigger()
56 | }}
57 | >
58 |
59 |
{text_label}
60 |
61 | ) : null}
62 |
63 | )
64 | }
65 |
66 | let RepeatButton = ({
67 | label,
68 | clearer,
69 | trigger,
70 | text_label,
71 | press_gates,
72 | custom_style,
73 | }) => {
74 | let repeat_ref = useRef(null)
75 | let start_gate = useRef(false)
76 |
77 | let touch_mode = useRef(false)
78 |
79 | let button_style = {
80 | fontFamily: 'inherit',
81 | fontSize: 'inherit',
82 | lineHeight: 'inherit',
83 | border: 'none',
84 | padding: 0,
85 | margin: 0,
86 | width: sp,
87 | background: 'black',
88 | color: 'white',
89 | display: 'block',
90 | }
91 | if (custom_style !== undefined) {
92 | button_style = Object.assign(button_style, custom_style)
93 | }
94 | return (
95 |
96 |
{
99 | touch_mode.current = true
100 | press_gates.current = true
101 | trigger()
102 | setTimeout(() => {
103 | if (press_gates.current) {
104 | repeat_ref.current = setInterval(() => {
105 | trigger()
106 | }, 100)
107 | clearer(repeat_ref.current)
108 | }
109 | }, 400)
110 | }}
111 | onTouchEnd={e => {
112 | setTimeout(() => {
113 | touch_mode.current = false
114 | }, 400)
115 | e.preventDefault()
116 | }}
117 | onMouseDown={e => {
118 | if (!touch_mode.current) {
119 | press_gates.current = true
120 | trigger()
121 | setTimeout(() => {
122 | if (press_gates.current) {
123 | repeat_ref.current = setInterval(() => {
124 | trigger()
125 | }, 100)
126 | clearer(repeat_ref.current)
127 | }
128 | }, 400)
129 | }
130 | }}
131 | onMouseUp={e => {
132 | if (!touch_mode.current) {
133 | clearInterval(repeat_ref.current)
134 | }
135 | }}
136 | >
137 | {label}
138 |
139 | {text_label !== undefined ? (
140 |
{
143 | repeat_ref.current = setInterval(() => {
144 | trigger()
145 | }, 200)
146 | clearer(repeat_ref.current)
147 | trigger()
148 | }}
149 | onMouseUp={e => {
150 | clearInterval(repeat_ref.current)
151 | }}
152 | >
153 |
154 |
{text_label}
155 |
156 | ) : null}
157 |
158 | )
159 | }
160 |
161 | const Home = () => {
162 | let cref = useRef(null)
163 | let clear_render_ref = useRef(false)
164 | let clear_ref = useRef(false)
165 | let state = useRef({})
166 | let km_ref = useRef({})
167 | let slider_click_ref = useRef(null)
168 | let slider_touch_mode = useRef(false)
169 | let press_gates = useRef(false)
170 | let [width, setWidth] = useState(null)
171 | let file_input = useRef(null)
172 | let ti_ref = useRef(null)
173 | let thresh_ref = useRef(null)
174 | let [favicon, setFavicon] = useState('favicon.png')
175 |
176 | function loadImage(src) {
177 | let c = cref.current
178 | let cx = c.getContext('2d')
179 | let img = document.createElement('img')
180 | img.onload = () => {
181 | let aspect = img.width / img.height
182 | let window_aspect =
183 | (window.innerWidth - sp) / (window.innerHeight - sp * 8)
184 |
185 | let snapw, snaph
186 | if (aspect < window_aspect) {
187 | // worry about height
188 | let adj_height = Math.min(
189 | img.height,
190 | Math.floor(window.innerHeight - sp * 8)
191 | )
192 | snaph = Math.round(adj_height / sp) * sp
193 | let snapr = snaph / img.height
194 | snapw = Math.round((img.width * snapr) / sp) * sp
195 | } else {
196 | // worry about width
197 | let adj_width = Math.min(
198 | img.width,
199 | Math.floor(window.innerWidth - sp) - sp / 2
200 | )
201 | snapw = Math.round(adj_width / sp) * sp
202 | let snapr = snapw / img.width
203 | snaph = Math.round((img.height * snapr) / sp) * sp
204 | }
205 |
206 | img.width = snapw
207 | img.height = snaph
208 |
209 | setWidth(img.width)
210 |
211 | c.width = img.width
212 | c.height = img.height
213 |
214 | let cols = img.width / sp
215 | let rows = img.height / sp
216 | let cells = cols * rows
217 |
218 | // size slider
219 | let ti = ti_ref.current
220 | ti.width = img.width - sp * 4
221 | ti.height = sp * 2
222 |
223 | // preserve dimensions
224 | let t_img = document.createElement('canvas')
225 | t_img.width = c.width
226 | t_img.height = c.height
227 | let t_imgx = t_img.getContext('2d')
228 | t_imgx.drawImage(img, 0, 0, c.width, c.height)
229 | img = t_img
230 |
231 | // draw original image
232 | // cx.drawImage(img, 0, 0, c.width, c.height)
233 |
234 | // store original image
235 | let imc = document.createElement('canvas')
236 | imc.width = c.width
237 | imc.height = c.height
238 | let imx = imc.getContext('2d')
239 | imx.drawImage(img, 0, 0, c.width, c.height)
240 |
241 | // cut up original image
242 | let tiles = []
243 | for (let i = 0; i < cells; i++) {
244 | let t = document.createElement('canvas')
245 | t.width = sp
246 | t.height = sp
247 | let tx = t.getContext('2d')
248 |
249 | let x = i % cols
250 | let y = Math.floor(i / cols)
251 |
252 | tx.drawImage(imc, x * sp, y * sp, sp, sp, 0, 0, sp, sp)
253 |
254 | let complexity = t.toDataURL().length / (sp * sp)
255 |
256 | tiles.push({ t, c: complexity, x, y, i })
257 | }
258 | tiles = _.sortBy(tiles, 'c')
259 |
260 | // grid with coordinates
261 | let grid = [...Array(rows)].map((n, y) =>
262 | [...Array(cols)].map((n, x) => {
263 | let d = Math.sqrt(
264 | Math.pow(x - cols / 2, 2) + Math.pow(y - rows / 2, 2)
265 | ).toFixed(8)
266 | return [x, y, d]
267 | })
268 | )
269 |
270 | // spiral order for iteration
271 | let ordered = _.flatten(grid)
272 | ordered.sort(function(a, b) {
273 | return a[2] - b[2]
274 | })
275 |
276 | // spiral test
277 | // for (let i = 0; i < 800; i++) {
278 | // let [x, y] = ordered[i]
279 | // cx.fillRect(...spx([x, y, 1, 1]))
280 | // }
281 |
282 | let threshold = cells - Math.round(cells / 2)
283 | state.current.threshold = threshold
284 | state.current.cells = cells
285 | state.current.ordered = ordered
286 | state.current.grid = grid
287 | state.current.cols = cols
288 | state.current.rows = rows
289 | state.current.imc = imc
290 | state.current.tiles = tiles
291 |
292 | // favicon
293 | let t = document.createElement('canvas')
294 | t.width = 16
295 | t.height = 16
296 | let tx = t.getContext('2d')
297 | tx.imageSmoothingEnabled = false
298 | tx.drawImage(img, 0, 0, img.width, img.height, 0, 0, 16, 16)
299 | setFavicon(t.toDataURL())
300 |
301 | render()
302 |
303 | // cx.fillStyle = 'red'
304 | // cx.fillRect((cols / 2) * sp - 1, 0, 2, c.height)
305 | // cx.fillRect(0, (rows / 2) * sp - 1, c.width, 2)
306 | // cx.fillStyle = 'black'
307 | }
308 | img.src = src
309 | }
310 |
311 | function render() {
312 | clear_render_ref.current = false
313 | let c = cref.current
314 | let cx = c.getContext('2d')
315 | let {
316 | cells,
317 | threshold,
318 | ordered,
319 | grid,
320 | cols,
321 | rows,
322 | imc,
323 | tiles,
324 | } = state.current
325 |
326 | // active
327 | let active = [...Array(rows)].map((n, y) =>
328 | [...Array(cols)].map((n, x) => [x, y, false])
329 | )
330 | for (let i = threshold; i < cells; i++) {
331 | let tile = tiles[i]
332 | let x = tile.x
333 | let y = tile.y
334 | active[y][x][2] = true
335 | }
336 |
337 | // slider
338 | let ti = ti_ref.current
339 | let tix = ti.getContext('2d')
340 | tix.fillStyle = '#ddd'
341 | tix.fillRect(0, 0, ti.width, sp * 2)
342 | tix.fillStyle = '#999'
343 | let tmark = Math.min(
344 | Math.max(1, Math.round(ti.width * ((cells - threshold) / cells))),
345 | ti.width - 2
346 | )
347 | tix.fillRect(tmark - 1, 0, 3, sp * 2)
348 |
349 | thresh_ref.current.innerHTML = cells - threshold + '/' + cells
350 |
351 | function getFree(x, y) {
352 | // it it off map it is undefined
353 | if (active[y] === undefined) return null
354 | if (active[y][x] === undefined) return null
355 | let check = active[y][x]
356 | // false means empty
357 | if (check[2] === false) {
358 | return grid[y][x]
359 | } else {
360 | return null
361 | }
362 | // return if false
363 | // if (coords) {
364 | // let [gx, gy] = coords
365 | // }
366 | }
367 |
368 | function getMove(x, y) {
369 | let raw = [
370 | [0, -1],
371 | [1, -1],
372 | [1, 1],
373 | [1, 0],
374 | [1, 1],
375 | [0, 1],
376 | [-1, 1],
377 | [-1, 0],
378 | [-1, -1],
379 | ].map(v => getFree(x + v[0], y + v[1]))
380 | let self = grid[y][x]
381 | let filtered = raw.filter(v => v !== null)
382 | let distances = filtered.map(v => parseFloat(v[2]))
383 | let min_distance = _.min(distances)
384 | if (min_distance < self[2]) {
385 | let min_i = distances.indexOf(min_distance)
386 | return filtered[min_i]
387 | } else {
388 | return null
389 | }
390 | }
391 |
392 | function _render() {
393 | let least_active = true
394 | let moved = false
395 |
396 | for (let i = 0; i < cells; i++) {
397 | let [x, y] = ordered[i]
398 | let check = active[y][x]
399 | if (check[2] === true) {
400 | least_active = false
401 | let move_to = getMove(x, y)
402 | if (move_to !== null) {
403 | moved = true
404 | let [mx, my] = move_to
405 | // let old = active[my][mx].slice()
406 | let old = [null, null, false]
407 | active[my][mx] = check
408 | active[y][x] = old
409 | }
410 | }
411 | }
412 |
413 | if (least_active) {
414 | cx.clearRect(0, 0, c.width, c.height)
415 | }
416 | if (!moved) {
417 | // only draw when done
418 | for (let i = 0; i < cells; i++) {
419 | let x = i % cols
420 | let y = Math.floor(i / cols)
421 | let check = active[y][x]
422 | if (check[2]) {
423 | cx.drawImage(
424 | imc,
425 | ...spx([...check.slice(0, 2), 1, 1]),
426 | ...spx([x, y, 1, 1])
427 | )
428 | }
429 | }
430 | } else if (moved && !clear_render_ref.current) {
431 | cx.clearRect(0, 0, c.width, c.height)
432 |
433 | // for (let i = 0; i < cells; i++) {
434 | // let x = i % cols
435 | // let y = Math.floor(i / cols)
436 | // let check = active[y][x]
437 | // // if (check) {
438 | // cx.drawImage(
439 | // imc,
440 | // ...spx([...check.slice(0, 2), 1, 1]),
441 | // ...spx([x, y, 1, 1])
442 | // )
443 | // // }
444 | // }
445 |
446 | _render()
447 | }
448 | }
449 |
450 | _render()
451 | }
452 |
453 | function clickSetThreshold(x) {
454 | let rect = ti_ref.current.getBoundingClientRect()
455 | x = x - rect.left
456 | let percent = x / ti_ref.current.width
457 | let { cells, threshold } = state.current
458 | let new_thresh =
459 | cells - Math.min(cells, Math.max(0, Math.round(percent * cells)))
460 | state.current.threshold = new_thresh
461 | render()
462 | }
463 |
464 | useEffect(() => {
465 | loadImage('veilance-field-photo.jpg')
466 | }, [])
467 |
468 | function trigger(key) {
469 | keyAction(key, null)
470 | }
471 |
472 | function keyAction(key, event) {
473 | let km = km_ref.current
474 | if (event === null) {
475 | event = { shiftKey: false }
476 | }
477 |
478 | let shift = event.shiftKey
479 | key = key.toLowerCase()
480 |
481 | if (key === 'o') {
482 | let input = file_input.current
483 | function handleChange(e) {
484 | let files = ''
485 | for (let item of this.files) {
486 | console.log(item)
487 | files += item.name + '.' + item.type
488 | if (item.type.indexOf('image') < 0) {
489 | continue
490 | }
491 | let src = URL.createObjectURL(item)
492 | loadImage(src)
493 | }
494 | this.removeEventListener('change', handleChange)
495 | }
496 | input.addEventListener('change', handleChange)
497 |
498 | input.dispatchEvent(
499 | new MouseEvent('click', {
500 | bubbles: true,
501 | cancelable: true,
502 | view: window,
503 | })
504 | )
505 | } else if (key === 'p') {
506 | let link = document.createElement('a')
507 |
508 | cref.current.toBlob(function(blob) {
509 | link.setAttribute(
510 | 'download',
511 | 'collapse-' +
512 | new Date()
513 | .toISOString()
514 | .slice(0, -4)
515 | .replace(/-/g, '')
516 | .replace(/:/g, '')
517 | .replace(/_/g, '')
518 | .replace(/\./g, '') +
519 | 'Z' +
520 | '.png'
521 | )
522 |
523 | link.setAttribute('href', URL.createObjectURL(blob))
524 | link.dispatchEvent(
525 | new MouseEvent(`click`, {
526 | bubbles: true,
527 | cancelable: true,
528 | view: window,
529 | })
530 | )
531 | })
532 | }
533 |
534 | if (key === 'l' || key === 'arrowright') {
535 | let move = 10
536 | if (shift) move = 1
537 | state.current.threshold = Math.max(0, state.current.threshold - move)
538 | clear_render_ref.current = true
539 | render()
540 | } else if (key === 'h' || key === 'arrowleft') {
541 | let move = 10
542 | if (shift) move = 1
543 | state.current.threshold = Math.min(
544 | state.current.cells,
545 | state.current.threshold + move
546 | )
547 | clear_render_ref.current = true
548 | render()
549 | }
550 | }
551 |
552 | function downHandler(e) {
553 | km_ref.current[e.key] = true
554 | keyAction(e.key, e)
555 | }
556 |
557 | function upHandler(e) {
558 | km_ref.current[e.key] = false
559 | }
560 |
561 | function handleMouseMove(e) {
562 | if (!slider_touch_mode.current) {
563 | if (slider_click_ref.current) {
564 | clickSetThreshold(e.clientX)
565 | }
566 | }
567 | }
568 |
569 | function clearer(id) {
570 | clear_ref.current.push(id)
571 | }
572 |
573 | function clearRepeatIntervals() {
574 | for (let i = 0; i < clear_ref.current.length; i++) {
575 | let item = clear_ref.current[i]
576 | clearInterval(item)
577 | }
578 | clear_ref.current = []
579 | }
580 |
581 | function clearPressGates() {
582 | press_gates.current = false
583 | }
584 |
585 | function handleMouseUp(e) {
586 | if (!slider_touch_mode.current) {
587 | if (slider_click_ref.current) {
588 | slider_click_ref.current = false
589 | clickSetThreshold(e.clientX)
590 | }
591 | }
592 | clearPressGates()
593 | clearRepeatIntervals()
594 | }
595 |
596 | function onDrop(e) {
597 | e.preventDefault()
598 | e.stopPropagation()
599 | let file = e.dataTransfer.files[0]
600 | let filename = file.path ? file.path : file.name ? file.name : ''
601 | let src = URL.createObjectURL(file)
602 | loadImage(src)
603 | }
604 |
605 | function onDrag(e) {
606 | e.stopPropagation()
607 | e.preventDefault()
608 | e.dataTransfer.dropEffect = 'copy'
609 | }
610 |
611 | function onPaste(e) {
612 | e.preventDefault()
613 | e.stopPropagation()
614 | for (const item of e.clipboardData.items) {
615 | if (item.type.indexOf('image') < 0) {
616 | continue
617 | }
618 | let file = item.getAsFile()
619 | let src = URL.createObjectURL(file)
620 | loadImage(src)
621 | }
622 | }
623 |
624 | function handleTouchMove(e) {
625 | if (slider_touch_mode.current) {
626 | if (slider_click_ref.current) {
627 | clickSetThreshold(e.changedTouches[0].clientX)
628 | e.preventDefault()
629 | }
630 | }
631 | }
632 |
633 | function handleTouchEnd(e) {
634 | // touch end doesn't seem to have client x
635 | clearPressGates()
636 | clearRepeatIntervals()
637 | }
638 |
639 | useEffect(() => {
640 | window.addEventListener('keydown', downHandler)
641 | window.addEventListener('keyup', upHandler)
642 | window.addEventListener('mousemove', handleMouseMove)
643 | window.addEventListener('mouseup', handleMouseUp)
644 | window.addEventListener('paste', onPaste)
645 | window.addEventListener('dragover', onDrag)
646 | window.addEventListener('drop', onDrop)
647 | window.addEventListener('touchend', handleTouchEnd)
648 | window.addEventListener('touchmove', handleTouchMove, { passive: false })
649 | return () => {
650 | window.removeEventListener('keydown', downHandler)
651 | window.removeEventListener('keyup', upHandler)
652 | window.removeEventListener('mousemove', handleMouseMove)
653 | window.removeEventListener('mouseup', handleMouseUp)
654 | window.removeEventListener('paste', onPaste)
655 | window.removeEventListener('dragover', onDrag)
656 | window.removeEventListener('drop', onDrop)
657 | window.removeEventListener('touchend', handleTouchEnd)
658 | window.removeEventListener('touchmove', handleTouchMove)
659 | }
660 | }, [])
661 |
662 | let title = 'Collapse'
663 | // TODO
664 | let description = 'Collapse an image into itself using ranked superpixels.'
665 | let share_img_url = 'https://collapse.constraint.systems/collapse.png'
666 | let og_url = 'https://collapse.constraint.systems'
667 |
668 | return (
669 |
670 |
671 |
672 |
{title}
673 |
674 |
678 |
679 |
{title}
680 |
681 |
682 |
683 |
684 |
685 |
686 |
687 |
688 |
696 |
697 |
701 |
702 |
703 | {
709 | trigger('o')
710 | }}
711 | />
712 |
713 | {
719 | trigger('p')
720 | }}
721 | />
722 |
723 |
724 |
725 |
726 |
727 |
728 |
736 |
{
747 | slider_click_ref.current = true
748 | slider_touch_mode.current = true
749 | clickSetThreshold(e.changedTouches[0].clientX)
750 | }}
751 | onTouchEnd={e => {
752 | setTimeout(() => {
753 | slider_click_ref.current = false
754 | slider_touch_mode.current = false
755 | }, 400)
756 | }}
757 | onMouseDown={e => {
758 | if (!slider_touch_mode.current) {
759 | slider_click_ref.current = true
760 | clickSetThreshold(e.clientX)
761 | }
762 | }}
763 | />
764 | {
770 | trigger('h')
771 | }}
772 | />
773 |
782 | {
788 | trigger('l')
789 | }}
790 | />
791 |
792 |
793 |
794 | Superpixels are ranked and selected based on their size when
795 | compressed (compression size is used as a proxy for complexity).
796 | Learn more about how selection works in{' '}
797 |
798 | Res
799 |
800 | . Superpixels are iteratively collapsed towards the center using a
801 | distance field.
802 |
803 |
804 |
814 |
815 |
835 |
836 |
837 |
838 |
839 |
878 |
879 | )
880 | }
881 |
882 | export default Home
883 |
--------------------------------------------------------------------------------
/public/collapse.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/collapse.gif
--------------------------------------------------------------------------------
/public/collapse.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/collapse.png
--------------------------------------------------------------------------------
/public/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/favicon.png
--------------------------------------------------------------------------------
/public/fonts/IBMPlexMono-Italic.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/fonts/IBMPlexMono-Italic.woff
--------------------------------------------------------------------------------
/public/fonts/IBMPlexMono-Italic.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/fonts/IBMPlexMono-Italic.woff2
--------------------------------------------------------------------------------
/public/fonts/IBMPlexMono-Regular.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/fonts/IBMPlexMono-Regular.woff
--------------------------------------------------------------------------------
/public/fonts/IBMPlexMono-Regular.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/fonts/IBMPlexMono-Regular.woff2
--------------------------------------------------------------------------------
/public/mrrobot2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/mrrobot2.jpg
--------------------------------------------------------------------------------
/public/veilance-field-photo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/constraint-systems/collapse/6d96d38b7cc2cb8d96e469e92b0c204c76d64368/public/veilance-field-photo.jpg
--------------------------------------------------------------------------------