2b:null 2c:["$","title",null,{"children":"A short dictionary of misunderstood words — Expiration Date | Esther Yang | Observable"}] 31:T4e2,"Expiration date sounds like a label on the can!" You have fantasies about the date. Studying in Japan, you embraced the Buddhism aesthetics, wabi-sabi. Beauty for your lay in impermanence. That's why sakura was beautiful because it represented the transient beauty of the seasons. Everything is fleeting anyway. Our story was a piece of Japanese artwork, and that's good enough for you. At least it's art. I speculated that you acknowledged the effect of scarcity because people cannot appreciate others unless they realize they would lose it someday. Loss aversion and scarcity manipulation theories popped up in my head like a fish making air bubbles. For me, pursuing something temporary felt like meaningless hookups. It was because of the deterministic impermanence that made infinity beautiful. I was fascinated by infinity. Reading time and space in astrophysics was equivalent to reading spiritual books. I dismissed pop music but worshiped classical music because only great things could last. I felt disconnected by your artistic excitement. I assumed superficial pop culture would always be tossed by the giant wheel of history, and it sounded like our love was going to fall into the same category as the clock tick tock tick tock...32:[{"id":"dba9ba40e0250970d699f5f65c929bd39d1bffee364a2de91d658817c14b03bbd31146cd3fc4f5a8042a8a694a225b2e7cb3323221a0d724cb69f7311ae1c1b2","href":"https://static.observableusercontent.com/files/dba9ba40e0250970d699f5f65c929bd39d1bffee364a2de91d658817c14b03bbd31146cd3fc4f5a8042a8a694a225b2e7cb3323221a0d724cb69f7311ae1c1b2","name":"automn.jpg","type":"image/jpeg","lastModified":1638627665028.513,"size":1540556},{"id":"82a0e74713de07a1599c691f75623a08d0f40e1a261eafd92c41f4a0be5c8ead871ab9149485c11916ed312f07c29a30895f8e516ce246abab43a97d0bd1020c","href":"https://static.observableusercontent.com/files/82a0e74713de07a1599c691f75623a08d0f40e1a261eafd92c41f4a0be5c8ead871ab9149485c11916ed312f07c29a30895f8e516ce246abab43a97d0bd1020c","name":"can.png","type":"image/png","lastModified":1638690433290.617,"size":630532}] 2f:{"id":"f8bab476e1d86f0f","slug":"yufei","title":"A short dictionary of misunderstood words — Expiration Date","thumbnail":"e6b13f6e6ac5733596d2b13bd86ddf4fafd8410a2f122ec81779ff037bf45eaf","access_level":"public","create_time":"$D2021-12-04T14:18:04.496Z","update_time":"$D2021-12-31T16:34:41.803Z","view_time":null,"first_public_time":"$D2021-12-21T12:17:52.877Z","fork":{"id":"c1f4aaf7fd919f39","slug":"image-distortion-with-perlin-noise","title":"Image distortion with Perlin noise","owner":{"id":"8186b1ae1b4a94e2","login":"kerryrodden","name":"Kerry Rodden"}},"stars":1,"starred":false,"owner":{"type":"team","id":"e70ea9e65da345a8","login":"ff6424cb4831f0b2","name":"Esther Yang","avatar_url":"https://avatars-next.observableusercontent.com/54b178ac3c2f861f0bfbb26b59a52383cb5a9cfb17d899c5e936e1cef5ea3710","tier":"starter_2024"},"version":908,"publish_version":908,"role":null,"authored":false,"authors":[{"type":"individual","id":"ff6424cb4831f0b2","login":"ff6424cb4831f0b2","name":"Esther Yang","avatar_url":"https://avatars-next.observableusercontent.com/54b178ac3c2f861f0bfbb26b59a52383cb5a9cfb17d899c5e936e1cef5ea3710","tier":null}],"members":[{"type":"individual","id":"ff6424cb4831f0b2","login":"ff6424cb4831f0b2","name":"Esther Yang","avatar_url":"https://avatars-next.observableusercontent.com/54b178ac3c2f861f0bfbb26b59a52383cb5a9cfb17d899c5e936e1cef5ea3710","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"A short dictionary of misunderstood words — Expiration Date","cells":[{"id":0,"value":"md`# A short dictionary of misunderstood words — Expiration Date`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":149,"value":"Shivering in the wind, we talked about January 1st, our expiration date. Break up sounds like a prevention measure to protect me from heartbreak casualties. I always wondered if I shouldn't even start since the beginning, but the world didn't successfully stop COVID from spreading either. In fact, the similarity between them is that both COVID and your affection are too infectious. \n\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":637,"value":"md`\n\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":633,"value":"$31","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":721,"value":"## How will our relationship look like after expiration? \n\nI imagine our relationship after expiration with fear and discomfort. You say you will write stories about us for all the parallel universes. I try to use the picture below to foreshadow our relationship after expiration distorts it. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":773,"value":"viewof image = imageInput({\n crossOrigin: \"anonymous\",\n initialUrl: \n\"https://s3.us-west-2.amazonaws.com/secure.notion-static.com/3bf4041c-9ba7-4e56-87f3-8e0e1e6c31d4/pic.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIAT73L2G45EIPT3X45%2F20211231%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20211231T162651Z&X-Amz-Expires=86400&X-Amz-Signature=db522d247277775ee1f454703bde5beaf687b90dfc0025b474b3dae92d4eef9a&X-Amz-SignedHeaders=host&response-content-disposition=filename%20%3D%22pic.png%22&x-id=GetObject\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":776,"value":"y= {\n image.style.maxWidth = \"100%\";\n return image;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":691,"value":"input = {\n let ctx = DOM.canvas(2576, 1932).getContext(\"2d\");\n ctx.drawImage(image, 0, 0);\n return {\n data: ctx.getImageData(0, 0, 2576, 1932),\n width: 2576,\n height: 1932\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":471,"value":"viewof reverseMap = Toggle({\n label: \"Reverse map\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":427,"value":"image2 = displayDistortedImage(input, reverseMap)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":284,"value":"md`You can play with the controls below to affect the amount and quality of distortion.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"viewof octaves = Range([1, 6], {\n label: \"Noise detail (octaves)\",\n step: 1,\n value: 3\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":181,"value":"viewof amount = Range([10, maxAmount], {\n label: \"Amount of distortion\",\n step: 10,\n value: maxAmount / 2\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":184,"value":"viewof scale = Range([0.0001, maxScale], {\n label: \"Scale\",\n step: 0.0001,\n value: maxScale / 4\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":529,"value":"md`These last two controls affect the noise sampling, so they retain the same level of distortion but just lead to different patterns.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":508,"value":"viewof offset1 = Range([0, 255], {\n label: \"Offset 1\",\n step: 1,\n value: 100\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":511,"value":"viewof offset2 = Range([0, 255], {\n label: \"Offset 2\",\n step: 1,\n value: 0\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":734,"value":"## Autumn thought about expiration","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":572,"value":"md`\n\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":581,"value":"秋天的時候想到到期日，就會想起這首詩，第一句雖然不是結尾，卻有種畫龍點睛的輕盈和巧妙。\n\n（怕你沒讀過，可以仔細觀察第一句）\n\n
","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":28,"value":"function displayDistortedImage(input, reverseMap) {\n const ctx = DOM.context2d(input.width, input.height, 1);\n const outputPixels = ctx.getImageData(0, 0, input.width, input.height);\n distortPixels(\n input.data,\n outputPixels,\n input.width,\n input.height,\n reverseMap\n );\n ctx.putImageData(outputPixels, 0, 0);\n ctx.canvas.style.maxWidth = \"100%\";\n return html`${ctx.canvas}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":364,"value":"function distortPixels(inputPixels, outputPixels, width, height, reverseMap) {\n for (let x = 0; x < width; x++) {\n for (let y = 0; y < height; y++) {\n const inputIndex = reverseMap\n ? getShiftedPixelIndex(x, y, width, height)\n : getPixelIndex(x, y, width);\n const outputIndex = reverseMap\n ? getPixelIndex(x, y, width)\n : getShiftedPixelIndex(x, y, width, height);\n for (let i = 0; i < 4; i++) {\n outputPixels.data[outputIndex + i] = inputPixels.data[inputIndex + i];\n }\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"function getPixelIndex(x, y, width) {\n return y * width * 4 + x * 4;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"function getShiftedPixelIndex(x, y, width, height) {\n const shift = {\n x: amount * noise(scale * x, scale * y),\n y: amount * noise(offset1 + scale * x, offset2 + scale * y)\n };\n const newX = clamp(Math.round(x + shift.x), 0, width - 1);\n const newY = clamp(Math.round(y + shift.y), 0, height - 1);\n return getPixelIndex(newX, newY, width);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"import { Toggle, Range } from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"import {imageInput} from \"@mbostock/file-input\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"import {octave, perlin2} from \"@mbostock/perlin-noise\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"noise = octave(perlin2, octaves)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":419,"value":"function clamp(value, min, max) {\n if (value < min) {\n return min;\n } else if (value > max) {\n return max;\n } else {\n return value;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":483,"value":"maxAmount = Math.round(Math.min(input.width, input.height) / 100) * 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":494,"value":"maxScale = Number(20 / maxAmount).toPrecision(1)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"