<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8" />
  <title>Abwesenheitsnotiz setzen</title>
  <script src="msal-browser.min.js"></script>
  <style>
    body { font-family: Arial, sans-serif; margin: 2rem; text-align: center; }
    button { font-size: 1.1rem; padding: 0.7rem 1.2rem; margin-top: 1rem; cursor: pointer; }
    #status { margin-top: 1.5rem; font-weight: bold; white-space: pre-line; }
    img { max-width: 200px; margin-bottom: 1.5rem; }
    .field { margin: 0.5rem auto; max-width: 350px; text-align: left; }
    label { font-weight: bold; display: block; margin-bottom: 0.2rem; }
    .messageBox {
      padding: 0.7rem;
      background: #f0f0f0;
      border: 1px solid #ccc;
      border-radius: 5px;
      margin-top: 0.3rem;
      font-size: 0.9rem;
    }
  </style>
</head>
<body>

  <img src="https://ramom.de/images/logo.png" alt="Kanzleilogo" />
  <h1>Abwesenheitsnotiz aktivieren</h1>
  <p>Bitte zuerst mit Microsoft 365 anmelden, danach Beginn und Ende auswählen.</p>

  <button id="loginBtn">Mit Microsoft 365 anmelden</button>

  <div id="oofForm" style="display:none; margin-top:1.5rem;">
    <div class="field">
      <label for="startDateTime">Beginn der Abwesenheit</label>
      <input type="datetime-local" id="startDateTime" />
    </div>

    <div class="field">
      <label for="endDateTime">Ende der Abwesenheit</label>
      <input type="datetime-local" id="endDateTime" />
    </div>

    <div class="field">
      <label>Interne Nachricht (fix)</label>
      <div class="messageBox">
        Ich bin aktuell abwesend. Ihre Nachricht wird gegebenenfalls verzögert bearbeitet.
      </div>
    </div>

    <div class="field">
      <label>Externe Nachricht (fix)</label>
      <div class="messageBox">
        <p>Sehr geehrte Damen und Herren,</p>
        <p>ich bin zurzeit nicht erreichbar.</p>
        <p>Ihre Nachricht wird von meiner Vertretung bearbeitet.</p>
        <p>Bitte haben Sie Verständnis dafür, dass in Vertretungsfällen die Bearbeitung mehr Zeit in Anspruch nehmen kann und eine Rückmeldung ggf. erst nach meiner Rückkehr erfolgt.</p>
      </div>
    </div>

    <button id="setOofBtn">Abwesenheitsnotiz aktivieren</button>
  </div>

  <div id="status"></div>

  <script>
    // Feste Texte (nicht veränderbar)
    const INTERNAL_MSG = "Ich bin aktuell abwesend. Ihre Nachricht wird gegebenenfalls verzögert bearbeitet.";
    const EXTERNAL_MSG = `
<p>Sehr geehrte Damen und Herren,</p>
<p>ich bin zurzeit nicht erreichbar.</p>
<p>Ihre Nachricht wird von meiner Vertretung bearbeitet.</p>
<p>Bitte haben Sie Verständnis dafür, dass in Vertretungsfällen die Bearbeitung mehr Zeit in Anspruch nehmen kann und eine Rückmeldung ggf. erst nach meiner Rückkehr erfolgt.</p>
`;

    window.addEventListener("load", () => {
      const statusEl = document.getElementById("status");

      // 1) Prüfen, ob MSAL wirklich geladen wurde
      if (!window.msal || !window.msal.PublicClientApplication) {
        statusEl.style.color = "red";
        statusEl.innerText = "❌ MSAL-Bibliothek konnte nicht geladen werden.\nBitte prüfen: Script-Tag oder Content-Security-Policy.";
        console.error("MSAL nicht verfügbar: window.msal =", window.msal);
        return;
      }

      console.log("MSAL geladen, initialisiere App...");

      const msalConfig = {
        auth: {
          clientId: "097ac550-8d73-42b1-8ad3-a71623373adc",
          authority: "https://login.microsoftonline.com/88a0fc05-0cc0-42a1-87d8-afdf0d2b345e",
          redirectUri: window.location.href
        }
      };

      const loginRequest = { scopes: ["User.Read", "MailboxSettings.ReadWrite"] };
      const msalInstance = new msal.PublicClientApplication(msalConfig);

      const loginBtn = document.getElementById("loginBtn");
      const oofForm = document.getElementById("oofForm");
      const startInput = document.getElementById("startDateTime");
      const endInput = document.getElementById("endDateTime");
      const setOofBtn = document.getElementById("setOofBtn");

      // Defaultwerte: jetzt bis +7 Tage
      function getLocalDateTimeValue(offsetDays = 0) {
        const d = new Date();
        d.setDate(d.getDate() + offsetDays);
        const year = d.getFullYear();
        const month = String(d.getMonth() + 1).padStart(2, "0");
        const day = String(d.getDate()).padStart(2, "0");
        const hours = String(d.getHours()).padStart(2, "0");
        const minutes = String(d.getMinutes()).padStart(2, "0");
        return `${year}-${month}-${day}T${hours}:${minutes}`;
      }

      startInput.value = getLocalDateTimeValue(0);
      endInput.value = getLocalDateTimeValue(7);

      // LOGIN BUTTON
      loginBtn.onclick = async () => {
        console.log("Login-Button geklickt");
        try {
          const response = await msalInstance.loginPopup(loginRequest);
          console.log("Login erfolgreich:", response);
          window.account = response.account;
          loginBtn.style.display = "none";
          oofForm.style.display = "block";
          statusEl.style.color = "green";
          statusEl.innerText = `Angemeldet als: ${window.account.username}`;
        } catch (err) {
          console.error("Loginfehler:", err);
          alert("Loginfehler: " + err.message);
        }
      };

      // OOF SETZEN
      setOofBtn.onclick = async () => {
        try {
          statusEl.style.color = "black";
          statusEl.innerText = "Abwesenheitsnotiz wird gesetzt...";

          const start = startInput.value;
          const end = endInput.value;

          if (!start || !end) {
            statusEl.style.color = "red";
            statusEl.innerText = "Bitte Beginn und Ende eingeben.";
            return;
          }

          if (new Date(start) >= new Date(end)) {
            statusEl.style.color = "red";
            statusEl.innerText = "Das Enddatum muss nach dem Beginndatum liegen.";
            return;
          }

          const startIso = start + ":00";
          const endIso = end + ":00";

          const tokenResponse = await msalInstance.acquireTokenSilent({
            ...loginRequest,
            account: window.account
          });

          const result = await fetch("https://graph.microsoft.com/v1.0/me/mailboxSettings", {
            method: "PATCH",
            headers: {
              "Authorization": `Bearer ${tokenResponse.accessToken}`,
              "Content-Type": "application/json"
            },
            body: JSON.stringify({
              automaticRepliesSetting: {
                status: "scheduled",
                scheduledStartDateTime: {
                  dateTime: startIso,
                  timeZone: "W. Europe Standard Time"
                },
                scheduledEndDateTime: {
                  dateTime: endIso,
                  timeZone: "W. Europe Standard Time"
                },
                internalReplyMessage: INTERNAL_MSG,
                externalReplyMessage: EXTERNAL_MSG,
                externalAudience: "all"
              }
            })
          });

          if (result.ok) {
            statusEl.style.color = "green";
            statusEl.innerText = "✅ Abwesenheitsnotiz erfolgreich aktiviert.";
          } else {
            const txt = await result.text();
            statusEl.style.color = "red";
            statusEl.innerText = "❌ Fehler beim Setzen:\n" + txt;
          }

        } catch (err) {
          console.error("Fehler beim Setzen:", err);
          statusEl.style.color = "red";
          statusEl.innerText = "Fehler: " + err.message;
        }
      };
    });
  </script>
</body>
</html>