with image support

This commit is contained in:
Marc Wäckerlin
2015-07-01 00:07:33 +00:00
parent 2d33067f56
commit ceb1ac0958
6 changed files with 242 additions and 216 deletions

View File

@@ -1,12 +1,40 @@
<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"/>
<label class="icon" for="file" style="flex-grow: 0"><img style="width: 2em; height: 2em" src="attachment.svg"/></label>
<input class="icon" autocomplete="off" type="file" id="file" style="display:none"/>
<input type="submit" id="send" disabled/>
</form>
<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").change(function(evt){fileupload(evt)});
if (!window.FileReader) $("#file").hide(); // not supported by browser
$("#file,#photo,#audio,#video").change(function(evt){fileupload(evt)});
if (!window.FileReader) $("#file,#photo,#audio,#video").hide(); // not supported by browser
</script>