new.html

---
layout: base.html
---

<main>
  <button id="getgeo">Add GPS</button>
  <form id="form">
    <textarea name="body"></textarea>
    <button type="submit">submit</button>
  </form>
</main>

<script>
  const form = document.querySelector("#form");
  const button = document.querySelector("#getgeo");
  let currentLocation = null;
  let gps = false;

  const handleGeoSuccess = (position) => {
    gps = true;
    const latitude = position.coords.latitude;
    const longitude = position.coords.longitude;
    currentLocation = [latitude, longitude].map((segment) =>
      segment.toFixed(2)
    );
    button.textContent = currentLocation;
  };
  const handleGeoError = (err) => {
    console.error(err);
    button.textContent = `error`;
  };

  button.addEventListener("click", (e) => {
    navigator.geolocation.getCurrentPosition(handleGeoSuccess, handleGeoError);
  });
  const handleSubmission = (e) => {
    e.preventDefault();

    const text = e.target.elements.body.value;
    const date = new Date();

    const template = `---
date: ${date.toISOString()}
${(gps && `gps: [${currentLocation}]`) || ""}
---
${text}`;

    const message = `📄 - Create new post: ${date}`;
    const ghQueryUrl = `https://github.com/xdesro/stillness/new/main/posts?filename=${date}.html&value=${encodeURIComponent(
      template
    )}&message=${encodeURIComponent(message)}`;
    window.location.href = ghQueryUrl;
  };

  form.addEventListener("submit", handleSubmission);
</script>