๐ŸŒฟ Culminating Project ๐ŸŒฟ

๐Ÿชท Assignment Status

// ๐Ÿชท STUDY NOOK STATUS STATION

const filePath = dv.current().file.path;
const options = [
  { name: "Not started", emoji: "๐ŸŒฑ" },
  { name: "In progress", emoji: "โ˜•" },
  { name: "Done", emoji: "๐ŸŒธ" }
];

let currentStatus = String(
  dv.current().status ?? "Not started"
);

const station = dv.container.createDiv();
station.style.margin = "16px 0 28px";

station.createEl("p", {
  text: "How is this assignment coming along?"
});

const buttons = station.createDiv();
buttons.style.display = "flex";
buttons.style.flexWrap = "wrap";
buttons.style.gap = "10px";

const controls = [];

function refreshButtons() {
  for (const control of controls) {
    const selected = control.name === currentStatus;

    control.button.style.background = selected
      ? "var(--interactive-accent)"
      : "var(--background-secondary)";

    control.button.style.color = selected
      ? "var(--text-on-accent)"
      : "var(--text-normal)";

    control.button.style.border = selected
      ? "2px solid var(--interactive-accent)"
      : "1px solid var(--background-modifier-border)";

    control.button.style.fontWeight = selected
      ? "600" : "400";

    control.button.setAttribute(
      "aria-pressed", String(selected)
    );
  }
}

for (const option of options) {
  const button = buttons.createEl("button", {
    text: option.emoji + " " + option.name
  });

  button.style.borderRadius = "12px";
  button.style.padding = "10px 16px";
  button.style.cursor = "pointer";
  button.style.flex = "1 1 120px";

  controls.push({
    name: option.name, button
  });

  button.addEventListener("click", async () => {
    if (currentStatus === option.name) return;

    const previousStatus = currentStatus;
    currentStatus = option.name;

    controls.forEach(c => c.button.disabled = true);
    refreshButtons();

    try {
      const file = app.vault.getAbstractFileByPath(filePath);

      if (!file) {
        throw new Error("Assignment file not found.");
      }

      await app.fileManager.processFrontMatter(
        file,
        fm => { fm.status = option.name; }
      );

      new Notice(
        "๐ŸŒฟ Status updated: " + option.name
      );

    } catch (error) {
      currentStatus = previousStatus;
      refreshButtons();
      new Notice("Could not update status.");
      console.error(error);

    } finally {
      controls.forEach(c => c.button.disabled = false);
    }
  });
}

refreshButtons();

๐ŸŒฑ Next step

  • First 10-minute action

๐Ÿ“œ Work notes

  • What needs to be submitted?
  • Submission location:
  • Instructions / rubric link:

๐Ÿชท Notes

๐Ÿ’š Completion checklist

  • Start the assignment
  • Complete the main work
  • Check answers / review instructions
  • Submit assignment

๐Ÿชป Planning

  • Work session scheduled for:
  • Estimated time (minutes): 180
  • Questions to ask:

๐ŸŒธ Wrap-up

  • Actual time spent:
  • What I learned:
  • Follow-up / review needed:
Built with LogoFlowershow