Line wrap toggle for editor and paste viewer with remembered preference (#130)

- wrap toggle button on /new editor and paste view (accent active state)
- flips white-space pre <-> pre-wrap on the code body
- shared localStorage preference palette-wrap, default off
- settings checkbox reads and writes the same preference

internal/web/templates/paste.html

@@ -6,6 +6,7 @@
       <h1>{{if .Title}}{{.Title}}{{else}}Untitled paste{{end}}</h1>
       {{if .CustomSlug}}<span class="slug">/{{.CustomSlug}}</span>{{end}}
       <div class="spacer"></div>
+      <button class="iconbtn wrap-toggle" id="wrap-toggle" type="button" title="Toggle line wrap" aria-label="Toggle line wrap" aria-pressed="false">wrap</button>
       <a class="iconbtn" href="/raw/{{.ID}}">raw</a>
       <a class="iconbtn" href="#" id="copy-btn" onclick="copyContent(this); return false;">copy</a>
       {{if .DeletionToken}}<a class="iconbtn danger" href="#" onclick="redeem('{{.DeletionToken}}'); return false;">delete</a>{{end}}
@@ -80,5 +81,24 @@ function redeem(token) {
   fetch('/api/pastes/{{.ID}}/redeem?token=' + encodeURIComponent(token), {method: 'DELETE'})
     .then(r => { if (r.ok) location.href = '/history'; else alert('delete failed'); });
 }
+
+// #130: line wrap toggle, shared preference with the editor (palette-wrap)
+(function () {
+  var el = document.getElementById('codebody');
+  var btn = document.getElementById('wrap-toggle');
+  function apply(on) {
+    el.classList.toggle('wrap', on);
+    btn.setAttribute('aria-pressed', on ? 'true' : 'false');
+  }
+  var on = false;
+  try { on = localStorage.getItem('palette-wrap') === 'true'; } catch (e) {}
+  apply(on);
+  btn.addEventListener('click', function () {
+    on = !on;
+    try { localStorage.setItem('palette-wrap', on ? 'true' : 'false'); } catch (e) {}
+    apply(on);
+  });
+  document.addEventListener('palette-wrapchange', function (e) { apply(e.detail); });
+})();
 </script>
 {{template "foot" .}}