litewebchatinput.min.js

function insertAtCursor(e,t){var n=e,o=t;if(n.focus(),window.getSelection){var i=window.getSelection();if(i.getRangeAt&&i.rangeCount){var l=i.getRangeAt(0);l.deleteContents();var a,c,d=document.createElement("div");d.innerHTML=o;for(var r=document.createDocumentFragment();a=d.firstChild;)c=r.appendChild(a);l.insertNode(r),c&&(l=l.cloneRange(),l.setStartAfter(c),l.collapse(!0),i.removeAllRanges(),i.addRange(l))}}else if(document.selection&&"Control"!=document.selection.type){n.focus();l=document.selection.createRange();l.pasteHTML(o),n.focus()}}function addImage(e){new Promise((t,n)=>{var o=new FileReader;o.onload=function(e){var t=e.target.result,n=new Image;n.src=t;var o=n.outerHTML;insertAtCursor(chatInput,o)},o.readAsDataURL(e)})}function inputFile(e){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=0;e<this.files.length;e++)addImage(this.files[e])},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=0;t<e.dataTransfer.files.length;t++){var n=e.dataTransfer.files[t];0==n.type.indexOf("image")?addImage(n):sendFile(n)}},downChild.ondragover=function(e){e.preventDefault(),downChild.style.border="3px solid #1E90FF"},downChild.ondragleave=function(e){e.preventDefault(),downChild.style.border="none"}))}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,o=upperChild.offsetHeight,i=downChild.offsetHeight;return document.onmousemove=function(e){var t=e||event,l=t.clientY-n;100<o+l&&100<i-l&&(upperChild.style.height=`calc(100% - ${i-l}px)`,downChild.style.height=i-l+"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)}),chatInput.focus();