2b:null 2c:["$","title",null,{"children":"Counter and reset | Alain Roan | Observable"}] 31:[] 2f:{"id":"e12a9e772827078e","slug":"counter-and-reset","title":"Counter and reset","thumbnail":"e02a2971eaf1d0ca913b65e34fa3b4e36bb3cadb53b9fb42ca43ceff143388f5","access_level":"public","create_time":"$D2019-03-10T16:24:07.280Z","update_time":"$D2024-06-04T13:14:53.893Z","view_time":null,"first_public_time":"$D2019-03-10T17:28:21.217Z","fork":false,"stars":5,"starred":false,"owner":{"type":"team","id":"f8fce27399341cf5","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":"starter_2024"},"version":142,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"1e78bb64fcda4384","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":null}],"members":[{"type":"individual","id":"1e78bb64fcda4384","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Counter and reset","cells":[{"id":0,"value":"md`# Counter and reset\nI though it was easy to define a counter with reset button. It took me a rather long time to make it working. I share this notebook in case it will be useful to somebody else.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"md`## with input on viewof`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"viewof count = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"parseInt(count)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"{\n const form = html``;\n form.inc.onclick = () => {\n ++viewof count.value;\n viewof count.dispatchEvent(new CustomEvent(\"input\"));\n };\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"{\n const init = html``;\n init.onclick = () => {\n viewof count.value = 0;\n viewof count.dispatchEvent(new CustomEvent(\"input\"));\n };\n return init;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"md `## with mutable`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"mutable counter = 0\n\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"{\n const form = html``;\n form.inc.onclick = () => ++mutable counter;\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":117,"value":"{\n const init = html``;\n init.onclick = () => mutable counter =0;\n return init;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"md `## array of counters` ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"mutable arr=[1,2,3,4]\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"{\n const form = html``;\n form.inc.onclick = () => ++mutable arr[0];\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":139,"value":"{\n const init = html``;\n init.onclick = () => mutable arr[0] =0;\n return init;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"