howtos/how-to-set-an-away-message/index.html

<!DOCTYPE html>

<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>TalkJS tutorial</title>
  </head>

  <script>
    (function (t, a, l, k, j, s) {
      s = a.createElement("script");
      s.async = 1;
      s.src = "https://cdn.talkjs.com/talk.js";
      a.head.appendChild(s);
      k = t.Promise;
      t.Talk = {
        v: 3,
        ready: {
          then: function (f) {
            if (k)
              return new k(function (r, e) {
                l.push([f, r, e]);
              });
            l.push([f]);
          },
          catch: function () {
            return k && new k();
          },
          c: l,
        },
      };
    })(window, document, []);
  </script>

  <script>
    Talk.ready.then(function () {
      const me = new Talk.User({
        id: "autoReplyExampleUser",
        name: "Sebastian",
        email: "sebastian@example.com",
        photoUrl: "https://talkjs.com/images/avatar-5.jpg",
        role: "customer",
        welcomeMessage: "Hi!",
      });
      const talkSession = new Talk.Session({
        appId: "<APP_ID>", // replace with your app ID
        me: me,
      });

      var other = new Talk.User({
        id: "autoReplyExampleSupportAgent",
        name: "Alice",
        email: "alice@example.com",
        photoUrl: "https://talkjs.com/images/avatar-1.jpg",
        role: "support",
        welcomeMessage: "Hey, how can I help?",
      });

      var conversation = talkSession.getOrCreateConversation(
        "autoReplyExampleConversation"
      );
      conversation.setParticipant(me);
      conversation.setParticipant(other);

      const chatbox = talkSession.createChatbox();
      chatbox.select(conversation);
      chatbox.mount(document.getElementById("talkjs-container"));
    });
  </script>

  <body>
    <!-- container element in which TalkJS will display a chat UI -->
    <div id="talkjs-container" style="width: 90%; margin: 30px; height: 500px">
      <i>Loading chat...</i>
    </div>
  </body>
</html>