A simple Counter using SmartBlocks

✂️ Copy of your #42SmartBlock from Roam

# Create Counter #42SmartBlock

```
<%SET:counter,0%> <%NOBLOCKOUTPUT%>
```

{{0:42SmartBlock:Counter}} {{🔁:42SmartBlock:CounterReset}}

<%JAVASCRIPT:```javascript
setTimeout(()=>{
roam42KeyboardLib.pressEsc();
roam42KeyboardLib.pressEsc();
},500);```%><%NOBLOCKOUTPUT%>

# Counter #42SmartBlock

<%IF:<%GET:counter%>%><%THEN:<%SET:counter,<%GET:counter%>%>%><%ELSE:<%SET:counter,0%>%> <%NOBLOCKOUTPUT%>

```
<%SET:result, %> <%NOBLOCKOUTPUT%>
```

<%JAVASCRIPT:```javascript
var counter = Number(roam42.smartBlocks.activeWorkflow.vars["counter"]);
var beginning = '{{';
var ending = ':42SmartBlock:Counter}}'; // #reset^^{{🔁:42SmartBlock:CounterReset}}^^';
var result = roam42.smartBlocks.activeWorkflow.vars["result"];
counter = counter + 1;
result = beginning.concat(String(counter),ending);
roam42.smartBlocks.activeWorkflow.vars["counter"] = String(counter);
roam42.smartBlocks.activeWorkflow.vars["result"] = result;
return(result);```%><%NOBLOCKOUTPUT%>

```
<%GET:result%>
```

<%JAVASCRIPT:```javascript
setTimeout(()=>{
roam42KeyboardLib.pressEsc();
roam42KeyboardLib.pressEsc();
},500);```%><%NOBLOCKOUTPUT%>

#  CounterReset #42SmartBlock

```
<%SET:counter,-1%> <%NOBLOCKOUTPUT%>
```
```
{{🔁:42SmartBlock:CounterReset}}
```

<%JAVASCRIPT:```javascript
setTimeout(()=>{
roam42KeyboardLib.pressEsc();
roam42KeyboardLib.pressEsc();
},500);```%><%NOBLOCKOUTPUT%>

<%NOTIFICATION:7,Press the counter button<br/>to complete the reset.%><%NOBLOCKOUTPUT%>

📋 Describe the SmartBlock

A simple counter. Click the button on the left to increment the counter. Click the button on the right to reset it to zero.

✅ Describe any prerequisites or dependencies that are required for this SmartBlock

📷 Screenshot of your #42SmartBlock workflow/template from Roam

💡 Additional Info

Demo https://www.loom.com/share/0cc9750bd08342668c2851c22cc82afc

CSS used (optional)

/ buttons / .block-bullet-view .bp3-button:not([class*="bp3-icon"]):not(.block-ref-count-button):not(.bp3-minimal) { background: transparent !important; padding: 0; line-height: 2em; font-weight: 500; border-radius: 2em !important; box-shadow: 1px 1px 2px 0px var(--bullet-closed-border) !important; }

/ toast at bottom right / .iziToast-theme-dark { background-color: orange !important; } p.iziToast-message { color: #5D3E32 !important; font-weight: bold !important; }

dvargas92495 / SmartBlocks