{{ define "content" }}
<h2>~place</h2>
<p>{{ .Canvas.Rows }}×{{ .Canvas.Cols }}, one pixel at a time. pick a color, click a cell. be nice to your fellow waddlers &lt;3</p>

<div id="palette" class="palette"></div>

<div class="canvas-wrap">
  <canvas id="canvas" width="{{ .Canvas.Cols }}" height="{{ .Canvas.Rows }}"></canvas>
</div>
<p id="cooldown" class="muted"></p>

<script>
window.CANVAS = {
  rows: {{ .Canvas.Rows }},
  cols: {{ .Canvas.Cols }},
  scale: {{ .Canvas.Scale }},
  cooldownMs: {{ .Canvas.CooldownMs }},
  palette: [{{ range $i, $c := .Canvas.Palette }}{{ if $i }}, {{ end }}"{{ $c }}"{{ end }}]
};
</script>
<script src="/static/js/canvas.js"></script>
{{ end }}