safechat/html/chat.html

<div id="message">
  <form id="chat" autocomplete="off" onsubmit="sendmessage(this.elements['recv'].value, this.elements['msg'].value)">
    <input placeholder="receiver" autocomplete="off" type="text" id="recv" oninput="checkpartner(this.value)" />
    <input placeholder="message" autocomplete="off" type="text" id="msg"/>
    <div class="buttongroup">
      <span class="toolbutton">
        <label for="photo"><img src="photo.svg"/></label>
        <input autocomplete="off" type="file" accept="image/*" id="photo" multiple />
      </span>
      <!--
      <span class="toolbutton">
        <label for="file"><img src="video.svg"/></label>
        <input autocomplete="off" type="file" accept="video/*" id="video"/>
      </span>
      <span class="toolbutton">
        <label for="file"><img src="audio.svg"/></label>
        <input autocomplete="off" type="file" accept="audio/*" id="audio"/>
      </span>
      <span class="toolbutton">
        <label for="file"><img src="attachment.svg"/></label>
        <input autocomplete="off" type="file" id="file"/>
      </span>
      -->
      <span class="toolbutton">
        <label for="send"><img src="send.svg"/></label>
        <input type="submit" id="send" disabled/>
      </span>
      <span class="toolbutton">
        <label for="reset"><img src="abort.svg" /></label>
        <input type="reset" id="reset" onclick="clearmessage();" />
      </span>
    </div>
  </form>
  <div id="preview"></div>
</div>
<div id="msgs"></div>
<script>
  $("#file,#photo,#audio,#video").change(function(evt){fileupload(evt)});
  if (!window.FileReader) $("#file,#photo,#audio,#video").hide(); // not supported by browser
</script>