litewebchatinput.min.js

function insertAtCursor(e,t){var n=e,i=t;if(n.focus(),window.getSelection){var l=window.getSelection();if(l.getRangeAt&&l.rangeCount){var o=l.getRangeAt(0);o.deleteContents();var a,d,c=document.createElement("div");c.innerHTML=i;for(var r=document.createDocumentFragment();a=c.firstChild;)d=r.appendChild(a);o.insertNode(r),d&&(o=o.cloneRange(),o.setStartAfter(d),o.collapse(!0),l.removeAllRanges(),l.addRange(o))}}else if(document.selection&&"Control"!=document.selection.type){n.focus();o=document.selection.createRange();o.pasteHTML(i),n.focus()}}function addImage(e){new Promise((t,n)=>{var i=new FileReader;i.onload=function(e){var t=e.target.result,n=new Image;n.src=t;var i=n.outerHTML;insertAtCursor(chatInput,i)},i.readAsDataURL(e)})}function inputFile(e){console.log(e),null!=e.maxImageSize?maxImageSize=e.maxImageSize:maxImageSize=-1,null!=e.maxImageNumber?maxImageNumber=e.maxImageNumber:maxImageNumber=-1,e.enable?(imageBtn.onclick=function(){var e=document.createElement("input");e.type="file",e.accept="image/*",e.multiple=!0,e.style.display="none",e.onchange=function(){for(var e=chatInput.getElementsByTagName("img").length,t=0;t<this.files.length;t++)(-1==maxImageNumber||e<maxImageNumber)&&(-1==maxImageSize||this.files[t].size<=maxImageSize?(e++,addImage(this.files[t])):sendFile(this.files[t]))},e.click()},sendFile=e.sendFileFunc,fileBtn.onclick=function(){var e=document.createElement("input");e.type="file",e.multiple=!0,e.style.display="none",e.onchange=function(){for(var e=0;e<this.files.length;e++){var t=this.files[e];sendFile(t)}},e.click()},e.enableDrop&&(downChild.ondrop=function(e){e.preventDefault(),e.stopPropagation(),downChild.style.border="none";for(var t=chatInput.getElementsByTagName("img").length,n=0;n<e.dataTransfer.files.length;n++){var i=e.dataTransfer.files[n];0==i.type.indexOf("image")?(-1==maxImageNumber||t<maxImageNumber)&&(-1==maxImageSize||i.size<=maxImageSize?(addImage(i),t++):sendFile(i)):sendFile(i)}},downChild.ondragover=function(e){e.preventDefault(),downChild.style.border="3px solid #1E90FF"},downChild.ondragleave=function(e){e.preventDefault(),downChild.style.border="none"})):(imageBtn.onclick=null,fileBtn.onclick=null,downChild.ondrop=null,downChild.ondragover=null,downChild.ondragleave=null)}function onPaste(e){if(e.clipboardData&&e.clipboardData.getData){var t=e.clipboardData.getData("text/plain");t&&(e.preventDefault(),document.execCommand("insertText",!1,t))}}var upperChild=document.querySelector(".lite-chatbox"),oLine=document.querySelector(".lite-chatinput hr"),downChild=document.querySelector(".lite-chatinput"),emojiBtn=document.getElementById("emojiBtn"),imageBtn=document.getElementById("imageBtn"),fileBtn=document.getElementById("fileBtn"),editFullScreen=document.getElementById("editFullScreen"),exitFullScreen=document.getElementById("exitFullScreen"),emojiMart=document.getElementById("emojiMart"),toolMusk=document.getElementById("toolMusk"),sendBtn=document.getElementById("sendBtn"),chatInput=document.querySelector(".lite-chatinput>.chatinput"),pickerOptions={locale:"zh",onEmojiSelect:function(e){emojiMart.style.display="none",toolMusk.style.display="none",insertAtCursor(chatInput,e.native)}},picker=new EmojiMart.Picker(pickerOptions);emojiMart.appendChild(picker),oLine.onmousedown=function(e){oLine.style.backgroundColor="#1E90FF";var t=e||event,n=t.clientY,i=upperChild.offsetHeight,l=downChild.offsetHeight;return document.onmousemove=function(e){var t=e||event,o=t.clientY-n;100<i+o&&100<l-o&&(upperChild.style.height=`calc(100% - ${l-o}px)`,downChild.style.height=l-o+"px")},document.onmouseup=function(){oLine.style.backgroundColor="#fff",document.onmousedown=null,document.onmousemove=null},!1},emojiBtn.onclick=function(){emojiMart.style.display="block",toolMusk.style.display="block";let e=emojiMart.offsetHeight;var t=downChild.clientHeight,n=upperChild.clientHeight;e<n?(emojiMart.style.bottom=`${t+3}px`,emojiMart.style.top=""):(emojiMart.style.bottom="",emojiMart.style.top="10px")},editFullScreen.onclick=function(){downHeight=downChild.clientHeight,upperHeight=upperChild.clientHeight,downChild.style.height="100%",upperChild.style.height="0px",editFullScreen.style.display="none",exitFullScreen.style.display="block",oLine.style.display="none"},exitFullScreen.onclick=function(){0!=upperHeight?(downChild.style.height=`${downHeight}px`,upperChild.style.height=`calc(100% - ${downHeight}px)`):(upperChild.style.height="calc(100% - 150px)",downChild.style.height="150px"),exitFullScreen.style.display="none",editFullScreen.style.display="block",oLine.style.display="block"},toolMusk.onclick=function(){emojiMart.style.display="none",toolMusk.style.display="none"},chatInput.addEventListener("paste",function(e){onPaste(e)}),window.addEventListener("DOMContentLoaded",function(){chatInput.focus()});