Click here for free DL of the app version that can save data.

No:24882

←

Prev Next

→

Texting Simulator
Developer User7388｜Date and time 23/11/13 20:21:35
Build time 90.451 sec｜Game capacity 2.791KB｜

Script

Texting Simulator

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

Click here for free DL of the app version that can save data.

<html>
  <head>
    <meta charset="UTF-8">
    <title>Texting Simulator</title>
    <style>
      body {
        font-family: Arial, sans-serif;
      }
      .message-box {
        height: 300px;
        width: 250px;
        border: 1px solid #ccc;
        overflow-y: scroll;
        padding: 10px;
      }
      .message {
        margin-bottom: 10px;
      }
      .message .sender {
        color: blue;
      }
      .message .content {
        color: black;
      }
      .input-row {
        margin-top: 10px;
      }
      .input-row input,
      .input-row button {
        padding: 6px;
        font-size: 14px;
        margin-right: 5px;
      }
    </style>
  </head>
  <body>
    <h1>Texting Simulator</h1>
    <div class="message-box" id="message-box"></div>
    <div class="input-row">
      <input type="text" id="input-message" placeholder="Type your message">
      <button onclick="sendMessage()">Send</button>
    </div>

function renderMessages() {
        const messageBox = document.getElementById("message-box");
        messageBox.innerHTML = "";
        
        for (let message of messages) {
          const sender = message.sender;
          const content = message.content;

const messageEl = document.createElement("div");
          messageEl.className = "message";

const senderEl = document.createElement("span");
          senderEl.className = "sender";
          senderEl.innerText = sender + ": ";

const contentEl = document.createElement("span");
          contentEl.className = "content";
          contentEl.innerText = content;

messageEl.appendChild(senderEl);
          messageEl.appendChild(contentEl);
          messageBox.appendChild(messageEl);
        }

messageBox.scrollTop = messageBox.scrollHeight;
      }

function sendMessage() {
        const inputMessage = document.getElementById("input-message");
        const messageContent = inputMessage.value;

messages.push({ sender: "You", content: messageContent });
        renderMessages();

// Clear input
        inputMessage.value = "";
      }

function receiveMessage(sender, content) {
        messages.push({ sender, content });
        renderMessages();
      }

// Simulating receiving messages
      setTimeout(function() {
        receiveMessage("Friend", "Hey, how are you?");
      }, 1000);

setTimeout(function() {
        receiveMessage("Friend", "Want to hang out today?");
      }, 2000);

setTimeout(function() {
        receiveMessage("Friend", "Are you there?");
      }, 3000);

setTimeout(function() {
        receiveMessage("Friend", "Let me know when you're free");
      }, 4000);

</script>
  </body>
</html>