快捷弹窗
Ce script ne doit pas être installé directement. C'est une librairie destinée à être incluse dans d'autres scripts avec la méta-directive // @require https://update.greasyfork.org/scripts/522780/1518758/dialog-gui.js
// ==UserScript==
// @name dialog-gui
// @namespace http://tampermonkey.net/
// @version 2.2
// @description 快捷弹窗
// @author twjx
// @grant none
// ==/UserScript==
window.dialog={create:function(attribute,element){this.dialog=document.createElement('div');this.dialog.className='dialog';this.dialog.innerHTML=`<div class="dialog-canvas"></div><div class="dialog-content"><div class="dialog-title"><h2>${attribute.title}</h2><div class="dialog-title-close" onclick="dialog.close()"><img src="https://www.emojiall.com/images/240/symbola/274c.png"></div></div><div class="dialog-body"></div></div>`;Object.assign(this.dialog.children[0].style,{position:'fixed',top:0,left:0,width:'100%',height:'100%',overflow:'auto',backgroundColor:'rgba(0, 0, 0, 0.4)'});Object.assign(attribute.attribute,{position:attribute.attribute.position||'relative',width:(attribute.attribute.width||'500')+'px',height:(attribute.attribute.height||'400')+'px',backgroundColor:attribute.attribute.color||'#fefefe',borderRadius:(attribute.attribute.radius||'10')+'px',boxShadow:attribute.attribute.boxShadow||'0 0 5px 5px darkgray',top:(attribute.attribute.top||'100')+'px',left:(attribute.attribute.left||'50')+'%',transform:attribute.transform||'translate(-50%, 0%)'});Object.assign(this.dialog.children[1].style,attribute.attribute);Object.assign(this.dialog.children[1].children[0].style,{position:'relative',width:'100%',height:'40px',lineHeight:'40px',textAlign:'center',color:'#333',fontWeight:'bold',fontSize:'22px',background:'#f5f5f5',borderBottom:'1px solid #ccc',borderRadius:attribute.attribute.radius||'10px',display:attribute.title?'block':'none'});Object.assign(this.dialog.children[1].children[0].children[1].style,{position:'relative',top:'-60px',left:'92%',width:'30px',height:'30px',lineHeight:'30px',textAlign:'center',color:'#333',fontWeight:'bold',fontSize:'22px',borderBottom:'1px solid #ccc',borderRadius:'50%',cursor:'pointer',backgroundSize:'cover'});Object.assign(this.dialog.children[1].children[0].children[1].children[0].style,{position:'relative',top:'-1px',left:'6px',width:'30px',height:'30px',color:'#333',fontWeight:'bold',fontSize:'25px'});Object.assign(this.dialog.children[1].children[1].style,{position:'relative',width:'96%',height:'calc(96% - 45px)',padding:'10px',overflow:'auto',color:'#333',backgroundColor:'#fff',fontSize:'16px',lineHeight:'1.5',borderRadius:attribute.attribute.radius||'10px'});if(attribute.title==undefined||attribute.title==''){this.dialog.children[1].children[0].style.display='none';}this.dialog.children[0].style.display=attribute.dark_screen?'block':'none';if(attribute.enMove===true){this.move.startmove();}element.appendChild(this.dialog);this.dialog=this.dialog.children[1];var body=this.dialog.children[1];var returnElement=new Map([]);attribute.content.forEach(item=>{var ele=body.appendChild(document.createElement(['text','img','video','audio','scroller'].indexOf(item.type)===-1?'div':[item.content.type,'img','video','audio','div'][['text','img','video','audio','scroller'].indexOf(item.type)]));if(item.returnElement!==false){returnElement.set(item.returnElement,ele);}if(item.type==='scroller'){Object.assign(item.style,{position:item.style.position||'relative',width:item.style.width||'100%',height:item.style.height||'200px',backgroundColor:item.style.backgroundColor||'#f5f5f5',overflow:item.style.overflow||'auto'});ele.innerHTML='<div style="width:400px;height:98%;background-color:#fff;padding:10px;color:#333;font-size:16px;line-height:1.5;text-align:center;">';ele.children[0].innerHTML=item.content.content;if(item.content.scroll_type==='automatic'){var scroller_auto=setInterval(()=>{if(ele.scrollHeight>ele.offsetHeight){ele.scrollTop=ele.scrollHeight-ele.offsetHeight;}else if(ele.scrollTop===0||dialog.dialog===null){clearInterval(scroller_auto);}},500);}}Object.assign(ele.style,item.style);if(item.type==='img'||item.type==='video'||item.type==='audio'){ele.src=item.src;if(item.type==='audio'){ele.controls=true;}}else if(item.type==='text'){ele.innerHTML=item.content.content;}});if(returnElement.size>0){return Object.fromEntries(returnElement);}},onclose:undefined,close:function(){this.dialog.remove();try{this.onclose();}catch(e){}},move:{movep:[],onmove:false,startmove:function(){this.movedlg=dialog.dialog.children[1];this.movedlg.onmousedown=function(e){dialog.move.movep=[e.clientX/window.innerWidth*100-Number(dialog.move.movedlg.style.left.replace('%','')),e.clientY-Number(dialog.move.movedlg.style.top.replace('px',''))];dialog.move.onmove=true;};document.onmouseup=function(e){if(Number(dialog.move.movedlg.style.left.replace('%',''))<0){dialog.move.movedlg.style.left='0%';}if(Number(dialog.move.movedlg.style.top.replace('px',''))<0){dialog.move.movedlg.style.top='0px';}dialog.move.movep=[];dialog.move.onmove=false;};document.onmousemove=function(e){if(dialog.move.onmove===true){dialog.move.movedlg.style.top=e.clientY-dialog.move.movep[1]+'px';dialog.move.movedlg.style.left=(e.clientX/window.innerWidth-dialog.move.movep[0]/window.innerWidth)*100+'%';}};}}};