2c:null 2d:["$","title",null,{"children":"Utils | Philippe Deschaseaux | Observable"}] 32:[] 30:{"id":"dd5e3bdbece67f4e","slug":"utils","title":"Utils","thumbnail":"26f4979dd68a92c5e2d7d6c7d91d7371f65fc045a51f8f6e5e1c34938f919c3a","access_level":"public","create_time":"$D2018-03-23T09:55:22.674Z","update_time":"$D2023-11-02T16:28:30.630Z","view_time":null,"first_public_time":"$D2018-03-23T09:56:43.453Z","fork":false,"stars":5,"starred":false,"owner":{"type":"team","id":"cf2a83be2759e071","login":"ehouais","name":"Philippe Deschaseaux","avatar_url":"https://avatars-next.observableusercontent.com/59e97a66cd990ae4d696ee6feb742004d97f024d9bc0db66fbc4b60357d0005f","tier":"starter_2024"},"version":234,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"7c1eebd3c1c51af1","login":"ehouais","name":"Philippe Deschaseaux","avatar_url":"https://avatars-next.observableusercontent.com/59e97a66cd990ae4d696ee6feb742004d97f024d9bc0db66fbc4b60357d0005f","tier":null}],"members":[{"type":"individual","id":"7c1eebd3c1c51af1","login":"ehouais","name":"Philippe Deschaseaux","avatar_url":"https://avatars-next.observableusercontent.com/59e97a66cd990ae4d696ee6feb742004d97f024d9bc0db66fbc4b60357d0005f","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"70021a89d22017f0","slug":"tools","title":"Tools","owner":{"id":"cf2a83be2759e071","login":"ehouais","name":"Philippe Deschaseaux"}},"type":"notebook","body":{"title":"Utils","cells":[{"id":0,"value":"md`# Utils`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"corsFetch = url => fetch(`https://cors-anywhere.herokuapp.com/${url}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"fetchProgress = (url, init, max, title) => {\n const { bar, set, dispatch } = viewofProgressBar(title, max);\n fetch(url, init).then(async response => {\n const reader = response.body && response.body.getReader()\n const concat = new Uint8Array(max)\n let length = 0\n while (true) {\n const {done, value} = await reader.read()\n if (done) break;\n concat.set(value, length)\n length += value.length\n set(length)\n }\n dispatch(concat.buffer)\n });\n return bar\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"promisify = fn => (...args) => new Promise((resolve, reject) => {\n fn(...args, (err, data) => err ? reject(err) : resolve(data))\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"Logger = () => {\n const container = DOM.element(\"div\");\n const ta = DOM.element(\"textarea\");\n Object.assign(ta.style, {\n width: \"100%\",\n height: \"200px\",\n fontFamily: \"monospace\",\n fontSize: \"13px\"\n });\n ta.readOnly = true;\n container.appendChild(ta);\n Object.assign(container.style, { width: width + \"px\" });\n container.value = {\n log: txt => {\n ta.value += txt + \"\\n\";\n },\n reset: () => {\n ta.value = \"\";\n }\n };\n return container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"decodeImage = (imageData, cb, [stepX, stepY] = [1, 1]) => {\n const { width, height, data } = imageData;\n const [stepIx, stepIy] = [stepX * 4, (stepY - 1) * 4];\n for (let index = 0, j = 0; j < height; j += stepY, index += stepIy)\n for (let i = 0; i < width; i += stepX, index += stepIx)\n cb([i, j], data.slice(index, index + 3));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"resizeImageData = (imageData, sx, sy, sWidth, sHeight, dWidth, dHeight) => {\n const scontext = DOM.context2d(sWidth + sx, sHeight + sy, 1);\n scontext.putImageData(imageData, 0, 0, sx, sy, sWidth + sx, sHeight + sy);\n const context = DOM.context2d(dWidth, dHeight, 1);\n context.drawImage(\n scontext.canvas,\n sx,\n sy,\n sWidth,\n sHeight,\n 0,\n 0,\n dWidth,\n dHeight\n );\n return context.getImageData(0, 0, dWidth, dHeight);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"canvas = (param1, param2) => {\n const fromDims = dims => [DOM.context2d(...dims, 1), ...dims];\n const fromContext = ctx => [ctx, ctx.canvas.width, ctx.canvas.height];\n const [ctx, width, height] = (param1.canvas ? fromContext : fromDims)(param1);\n const fill = (data, [W, H], color) => {\n for (let j = H - 1, index = 0; j >= 0; j--) {\n for (let i = 0; i < W; i++, index += 4) {\n data.set(color(i, j), index);\n data[index + 3] = 255;\n }\n }\n };\n const imageData = ([W, H], color) => {\n const data = new Uint8ClampedArray(4 * W * H);\n fill(data, [W, H], typeof color == \"function\" ? color : () => color);\n return new ImageData(data, W, H);\n };\n const data = param2.width ? param2 : imageData([width, height], param2);\n ctx.putImageData(data, 0, 0);\n return ctx.canvas;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"viewofCanvas = function(W, H) {\n const context = DOM.context2d(W, H, 1);\n const canvas = context.canvas;\n const set = (obj, propname, value) => ((obj[propname] = value), obj);\n const fill = color => set(context, 'fillStyle', color).fillRect(0, 0, W, H);\n const input = () => new CustomEvent(\"input\");\n const dispatch = value => set(canvas, 'value', value).dispatchEvent(input());\n fill(\"hsl(0,0%,80%)\");\n return { context, canvas, dispatch, fill };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"viewofText = function() {\n const div = DOM.element(\"div\");\n return {\n div,\n dispatch: function(value) {\n div.value = value;\n div.dispatchEvent(new CustomEvent(\"input\"));\n }\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"viewofProgressBar = function(title, max = 100, height) {\n const container = DOM.element(\"div\")\n if (height) container.style.height = `${height}px`\n const label = html`${title}...`\n const progress = html``\n container.append(label, progress)\n return {\n bar: container,\n set: value => {\n progress.setAttribute('value', value)\n if (value >= max) {\n label.textContent = `${title}: done`\n progress.remove()\n }\n },\n dispatch: function(value) {\n container.value = value\n container.dispatchEvent(new CustomEvent(\"input\"))\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"image2canvas = (imageData, width) => {\n const context = DOM.context2d(imageData.width, imageData.height, 1);\n context.putImageData(imageData, 0, 0);\n if (!width || imageData.width <= width) return context.canvas;\n\n const height = (imageData.height * width) / imageData.width;\n const contextr = DOM.context2d(width, height, 1);\n contextr.drawImage(context.canvas, 0, 0, width, height);\n return contextr.canvas;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"rgb2hsl = ([r, g, b]) => {\n const max = Math.max(r, g, b);\n const min = Math.min(r, g, b);\n let h,\n s,\n l = (max + min) / 2;\n\n if (max == min) {\n h = s = 0; // achromatic\n } else {\n const d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n if (max == r) h = (g - b) / d + (g < b ? 6 : 0);\n else if (max == g) h = (b - r) / d + 2;\n else h = (r - g) / d + 4;\n h /= 6;\n }\n\n return [h, s, l];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"rgb2hsv = ([r, g, b]) => {\n const [min, max] = [Math.min(r, g, b), Math.max(r, g, b)];\n let h,\n s,\n v = max;\n const diff = max - min;\n const diffc = c => (max - c) / 6 / diff + 0.5;\n\n if (diff == 0) {\n h = s = 0;\n } else {\n s = diff / max;\n let [rr, gg, bb] = [diffc(r), diffc(g), diffc(b)];\n\n if (r === max) h = bb - gg;\n else if (g === max) h = 1 / 3 + rr - bb;\n else if (b === max) h = 2 / 3 + gg - rr;\n\n if (h < 0) h += 1;\n else if (h > 1) h -= 1;\n }\n return [h, s, v];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"colorGradient = ([r, g, b], nb) => {\n const [rf, gf, bf] = [r / nb, g / nb, b / nb];\n return [...Array(nb)]\n .map((_, i) => [(i * rf) | 0, (i * gf) | 0, (i * bf) | 0]);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"interpolateRGB = ([r1, g1, b1], [r2, g2, b2], r) => [\n (r1 + r * (r2 - r1)) | 0,\n (g1 + r * (g2 - g1)) | 0,\n (b1 + r * (b2 - b1)) | 0\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"interpolatePalette = (palette, color, r) => palette.map(c => interpolateRGB(c, color, r))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":138,"value":"colorShades = (rgb, n) =>\n [...Array(n)].map((_, i) => rgb.map(f => ((i * f) / n) | 0))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"separator = function() {\n return html`

`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"floor = function(n, dec) {\n const pow = 10**dec;\n return Math.floor(n*pow)/pow;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"minstRand0 = function(seed) {\n var rndval = seed;\n const mod = 2**31-1;\n return function() {\n rndval = rndval * 16807 % mod;\n return (rndval - 1) / (mod - 1);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"Range = (bounds) => {\n let [min, max] = bounds || [+Infinity, -Infinity];\n return {\n bounds: () => [min, max],\n expand: (...values) => {\n values.forEach((value) => {\n [min, max] = [Math.min(min, value), Math.max(max, value)];\n });\n return this;\n },\n constrain: (value) => Math.max(min, Math.min(max, value))\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"MultiRange = dimensions => {\n const ranges = [...Array(dimensions)].map(_ => Range());\n const r = {\n bounds: () => ranges.map(r => r.bounds()),\n expand: (...points) => {\n points.forEach(coords => {\n ranges.forEach((r, i) => {\n r.expand(coords[i]);\n });\n });\n return r;\n },\n constrain: (...points) =>\n points.map(coords => ranges.map((r, i) => r.constrain(coords[i])))\n };\n return r;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"fillArray = (array, values) => {\n const N = array.length;\n const n = values.length;\n for (let index = 0; index < N; index += n) array.set(values, index);\n return array;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"umod = (val, mod) => val < 0 ? val-Math.floor(val) : val % mod;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"sliders = function(params, filter) {\n const form = DOM.element('form');\n var value = {};\n for (let name in params) {\n let input = slider(params[name]);\n let div = input.querySelector('div');\n if (div) div.style.marginTop = '10px';\n let update = function() {\n value[name] = input.value;\n form.value = filter ? filter(value) : value;\n };\n\tinput.addEventListener('input', update);\n update();\n form.appendChild(input);\n }\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 31:"$30:body"