Read and Write Document Settings.

read-write-documents-settings.yml

name: Document Settings Sample (Simplified)
description: >-
  Small Office.js sample for reading and writing a fixed
  document setting using the key "example_key", with an
  activity log for reads, writes, saves, and refreshes.

host: POWERPOINT
api_set: {}

script:
  language: javascript
  content: |
    Office.onReady(() => {
      document.getElementById("writeButton").addEventListener("click", writeSetting);
      document.getElementById("readButton").addEventListener("click", readSetting);
      document.getElementById("refreshReadButton").addEventListener("click", refreshThenReadSetting);

      document.getElementById("status").textContent = "Ready.";
      addLog("Office initialized.");
    });

    const SETTINGS_KEY = "example_key";

    function addLog(message) {
      const log = document.getElementById("log");
      const timestamp = new Date().toLocaleTimeString();
      log.textContent = `[${timestamp}] ${message}\n` + log.textContent;
    }

    function writeSetting() {
      const value = document.getElementById("settingsValue").value;

      addLog(`WRITE requested. Key="${SETTINGS_KEY}", Value="${value}"`);

      Office.context.document.settings.set(SETTINGS_KEY, value);

      addLog(`SAVE triggered. Key="${SETTINGS_KEY}"`);

      Office.context.document.settings.saveAsync((result) => {
        if (result.status === Office.AsyncResultStatus.Succeeded) {
          document.getElementById("status").textContent = "Saved setting.";
          addLog(`SAVE succeeded. Value="${value}"`);
        } else {
          document.getElementById("status").textContent =
            "Save failed: " + result.error.message;
          addLog(`SAVE failed. Error="${result.error.message}"`);
        }
      });
    }

    function readSetting() {
      const value = Office.context.document.settings.get(SETTINGS_KEY);

      document.getElementById("settingsValue").value =
        value === undefined ? "" : value;

      if (value === undefined) {
        document.getElementById("status").textContent = "No value found.";
        addLog(`READ. No value found for key="${SETTINGS_KEY}"`);
      } else {
        document.getElementById("status").textContent = "Read setting.";
        addLog(`READ. Value="${value}"`);
      }
    }

    function refreshThenReadSetting() {
      addLog("REFRESH requested.");

      Office.context.document.settings.refreshAsync((result) => {
        if (result.status !== Office.AsyncResultStatus.Succeeded) {
          document.getElementById("status").textContent =
            "Refresh failed: " + result.error.message;
          addLog(`REFRESH failed. Error="${result.error.message}"`);
          return;
        }

        addLog("REFRESH succeeded.");
        readSetting();
      });
    }

template:
  language: html
  content: |
    <label>
      Content
      <textarea id="settingsValue">Hello from document settings.</textarea>
    </label>

    <button id="writeButton">Write in document settings</button>
    <button id="readButton">Read from document settings</button>
    <button id="refreshReadButton">Refresh then read</button>

    <div id="status">Waiting for Office…</div>

    <h3>Activity Log</h3>
    <pre id="log"></pre>

style:
  language: css
  content: |
    label {
      display: block;
      margin-top: 12px;
    }

    textarea {
      box-sizing: border-box;
      display: block;
      margin-top: 4px;
      width: 100%;
      min-height: 96px;
      font: inherit;
    }

    button {
      margin-top: 12px;
      margin-right: 8px;
      padding: 6px 10px;
    }

    #log {
      margin-top: 12px;
      border: 1px solid #ccc;
      padding: 8px;
      height: 180px;
      overflow-y: auto;
      white-space: pre-wrap;
      background: #f5f5f5;
      font-size: 12px;
      font-family: Consolas, Monaco, monospace;
    }

libraries: |
  https://appsforoffice.microsoft.com/lib/1/hosted/office.js