Add a copyable "clone" and "pull" command on some pages

Sat Mar 15 2025

tucker.mcknight@gmail.com

A command for cloning the repo is shown on the main repo
page, and a command for pulling a specific patch
is shown on each patch's page.

54e819394adf99affda3cbf535f16ee26450a7d1

darcs pull https://repos.tuckerm.us/repos/eleventy-darcs/branches/main -h 54e819394adf99affda3cbf535f16ee26450a7d1
main.css:70
Before
After
.clone {
  border: 1px solid black;
  padding: 0.5rem;
  width: fit-content;
}
.clone #clone-command {
  display: inline;
  margin-right: 0.5rem;
}
patch.njk:10
Before
After
<div class="clone">
  {% set url = [darcsConfig.baseUrl, "/repos/", patchInfo.repoName | slugify] | join | url %}
  <pre id="clone-command">darcs pull {{ url }} -h {{patchInfo.patch.hash}}</pre>
  <button id="repo-clone" onclick="copyCommand()">Copy</buton>
</div>
patch.njk:36
Before
After

<script>
  const copyCommand = () => {
    const text = document.getElementById("clone-command").textContent
    const button = document.getElementById("repo-clone")
    navigator.clipboard.writeText(text).then(() => {
      button.innerText = "Copied"
    })
  }
</script>
repo.njk:9
Before
After
<div class="clone">
  {% set url = [darcsConfig.baseUrl, "/repos/", repo | slugify] | join | url %}
  <pre id="clone-command">darcs clone {{ url }}</pre>
  <button id="repo-clone" onclick="copyCommand()">Copy</buton>
</div>
repo.njk:20
Before
After

<script>
  const copyCommand = () => {
    const text = document.getElementById("clone-command").textContent
    const button = document.getElementById("repo-clone")
    navigator.clipboard.writeText(text).then(() => {
      button.innerText = "Copied"
    })
  }
</script>