2b:null 2c:["$","title",null,{"children":"OpenCV Test | Jasper Tran O'Leary | Observable"}] 31:[{"id":"f74c42ad854b00fc5ad08aec7825fff80e9929264e0d61ccf63cd000231d2cb5777e79971fc4c7f1bd01fa2028c1ef4a33d8785d720d4cb0332cc83ff1e8b840","href":"https://static.observableusercontent.com/files/f74c42ad854b00fc5ad08aec7825fff80e9929264e0d61ccf63cd000231d2cb5777e79971fc4c7f1bd01fa2028c1ef4a33d8785d720d4cb0332cc83ff1e8b840","name":"opencv.js","type":"application/javascript","lastModified":1681773260401.166,"size":7943648}] 2f:{"id":"ee5e7e950aed4280","slug":null,"title":"OpenCV Test","thumbnail":"64c30abc81a060dc20d58835d5de6f3b385ceddbaac260c45aecc1a10ba55454","access_level":"public","create_time":"$D2023-04-17T23:12:13.005Z","update_time":"$D2023-05-24T17:17:59.128Z","view_time":null,"first_public_time":"$D2023-04-17T23:12:13.005Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"bb910cbb860f0cef","login":"jtranoleary","name":"Jasper Tran O'Leary","avatar_url":"https://avatars-next.observableusercontent.com/7b1fca3ec60e80d6d0d1652c3cc957a07a96f4415cca592cee189df0f44ab416","tier":"starter_2024","bio":""},"version":204,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f17f6741d5f43f60","login":"jtranoleary","name":"Jasper Tran O'Leary","avatar_url":"https://avatars-next.observableusercontent.com/7b1fca3ec60e80d6d0d1652c3cc957a07a96f4415cca592cee189df0f44ab416","tier":null,"bio":""}],"members":[{"type":"individual","id":"f17f6741d5f43f60","login":"jtranoleary","name":"Jasper Tran O'Leary","avatar_url":"https://avatars-next.observableusercontent.com/7b1fca3ec60e80d6d0d1652c3cc957a07a96f4415cca592cee189df0f44ab416","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"OpenCV Test","cells":[{"id":0,"value":"# OpenCV Test","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":3,"value":"hostname = \"http://localhost:3000\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"import { cv, handleError, registerFile } from \"@mootari/opencv-js\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"cv","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"import(\n \"https://cdn.jsdelivr.net/gh/meemoo/meemoo-elements@main/src/mm-webcam.js\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"import(\n \"https://cdn.jsdelivr.net/gh/meemoo/meemoo-elements@main/src/mm-debug.js\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"webcam = html`\n\n \n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"viewof latestImage = {\n const ui = html`

`;\n let image = null;\n ui.value = image;\n\n ui.querySelector(\"button\").onclick = (e) => {\n const vid = webcam.querySelector(\"video\");\n const canvas = document.createElement(\"canvas\");\n canvas.width = vid.videoWidth;\n canvas.height = vid.videoHeight;\n const context = canvas.getContext(\"2d\");\n context.drawImage(vid, 0, 0);\n\n canvas.toBlob(\n function (blob) {\n image = URL.createObjectURL(blob);\n ui.value = image;\n ui.dispatchEvent(new CustomEvent(\"input\"));\n },\n \"image/jpeg\",\n 0.95\n );\n };\n mutable indicator = Date.now();\n return ui;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":"latestImage","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":197,"value":"mutable indicator = Date.now()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"viewof inputImage = new Promise((resolve) => {\n resolve(html`

`);\n}).then((domElement) => {\n let finalElement = htl.html`

${domElement}

`;\n let ugh = document.getElementById(\"preview-image\");\n // console.log(ugh);\n let matrix = ugh ? cv.imread(ugh) : new cv.Mat();\n finalElement.value = matrix;\n return finalElement;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"inputImage.size()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"dstMat = {\n let dst = new cv.Mat();\n cv.cvtColor(inputImage, dst, cv.COLOR_RGBA2GRAY);\n return dst;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"viewof output = new Promise((resolve) => {\n resolve(html`

`);\n}).then((domElement) => {\n let finalElement = htl.html`

${domElement}

`;\n cv.imshow(domElement, dstMat);\n finalElement.value = dstMat;\n return finalElement;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1"}} 30:"$2f:body"