2019-11-11 03:33:57 +01:00

98 lines
20 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Discord Offline History</title>
<script type="text/javascript">
var e=function(){var e,n,a,i,s,o,l,u,d={i:/\*\*([\s\S]+?)\*\*(?!\*)/g,s:/(.)?\*([\s\S]+?)\*(?!\*)/g,o:/__([\s\S]+?)__(?!_)/g,l:/~~([\s\S]+?)~~(?!~)/g,g:/(`+)\s*([\s\S]*?[^`])\s*\1(?!`)/g,p:/```(?:([A-z0-9\-]+?)\n+)?\n*([^]+?)\n*```/g,v:/(\b(?:https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gi,h:/<(\b(?:https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])>/gi,L:/\\`/g,C:/\\([*\\])/g,M:/\\__|_\\_|\\_\\_|\\~~|~\\~|\\~\\~/g,k:/([*_~\\])/g,T:/&lt;@&(\d+?)&gt;/g,j:/&lt;@!?(\d+?)&gt;/g,P:/&lt;#(\d+?)&gt;/g,R:/&lt;:([^:]+):(\d+?)&gt;/g,U:/&lt;a:([^:]+):(\d+?)&gt;/g},f=function(e){var t=e.url.lastIndexOf("."),n=-1===t?"":e.url.substring(t).toLowerCase();return".png"===n||".gif"===n||".jpg"===n||".jpeg"===n},m=function(e){var t=new Date(e);return t.toLocaleDateString()+", "+t.toLocaleTimeString()};return{S:function(){e=new c(["<div data-channel='{id}'>","<div class='info'><strong class='name'>#{name}</strong><span class='msgcount'>{msgcount}</span></div>","<span class='server'>{server.name} ({server.type})</span>","</div>"].join("")),n=new c(["<div data-channel='{id}'>","<div class='info'><strong class='name'>{name}</strong><span class='msgcount'>{msgcount}</span></div>","<span class='server'>({server.type})</span>","</div>"].join("")),a=new c(["<div>","<h2><strong class='username'>{user.name}</strong><span class='info time'>{timestamp}</span>{edit}</h2>","<div class='message'>{contents}{embeds}{attachments}</div>","</div>"].join("")),i=new c(["<a href='{url}' class='embed thumbnail'><img src='{url}' alt='(image attachment not found)'></a><br>"].join("")),s=new c(["<div class='embed download'><a href='{url}' class='title'>{t}</a><p class='desc'>{d}</p></div>"].join("")),o=new c(["<div class='embed download'><a href='{url}' class='title'>{t}</a></div>"].join("")),l=new c(["<div class='embed download'><p>(Formatted embeds are currently not supported)</p></div>"].join("")),u=new c(["<a href='{url}' class='embed download'>Download {filename}</a>"].join(""))},I:f,A:function(t){return("SERVER"===t.server.type?e:n).apply(t,(e,t)=>{if("server.type"===e)switch(t){case"SERVER":return"server";case"GROUP":return"group";case"DM":return"user"}})},O:function(e){return a.apply(e,(e,n)=>{if("timestamp"===e)return m(n);if("contents"===e){if(null==n||0===n.length)return"";var a=t.F(n.replace(d.h,"$1"));if(r.N.enableFormatting){var c=(e,t)=>"&#"+t.charCodeAt(0)+";";a=a.replace(d.L,"&#96;").replace(d.p,(e,t,n)=>"<code class='block'>"+n.replace(d.k,c)+"</code>").replace(d.g,(e,t,n)=>"<code class='inline'>"+n.replace(d.k,c)+"</code>").replace(d.C,c).replace(d.M,e=>e.replace(/\\/g,"").replace(/(.)/g,c)).replace(d.i,"<b>$1</b>").replace(d.s,(e,t,n)=>"\\"===t?e:(t||"")+"<i>"+n+"</i>").replace(d.o,"<u>$1</u>").replace(d.l,"<s>$1</s>")}var g=r.N.enableAnimatedEmoji?"gif":"png";return"<p>"+(a=a.replace(d.v,"<a href='$1' target='_blank' rel='noreferrer'>$1</a>").replace(d.P,(e,t)=>"<span class='link mention-chat'>#"+r.H(t)+"</span>").replace(d.j,(e,t)=>"<span class='link mention-user'>@"+r._(t)+"</span>").replace(d.R,"<img src='https://cdn.discordapp.com/emojis/$2.png' alt=':$1:' title=':$1:' class='emoji'>").replace(d.U,"<img src='https://cdn.discordapp.com/emojis/$2."+g+"' alt=':$1:' title=':$1:' class='emoji'>"))+"</p>"}if("embeds"===e)return n?n.map(e=>{switch(e.type){case"image":return r.N.enableImagePreviews?i.apply(e):"";case"rich":return(e.t?e.d?s:o:l).apply(e)}}).join(""):"";if("attachments"===e)return n?n.map(e=>{if(f(e)&&r.N.enableImagePreviews)return i.apply(e);var t=e.url.split("/");return u.apply({url:e.url,filename:t[t.length-1]})}).join(""):"";if("edit"===e)return n?"<span class='info edited'>(edited"+(n>1?" "+m(n):"")+")</span>":""})}}}(),t=function(){var e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},t=/[&<>"']/g;return{id:(e,t)=>(t||document).getElementById(e),B:(e,t)=>Array.prototype.slice.call((t||document).getElementsByClassName(e)),tag:(e,t)=>Array.prototype.slice.call((t||document).getElementsByTagName(e)),D:(e,t)=>(t||document).getElementsByClassName(e)[0],createElement:(e,t)=>{var n=document.createElement(e);t.appendChild(n);return n},$:e=>e.parentNode.removeChild(e),F:n=>String(n).replace(t,t=>e[t])}}(),n=function(){var e,n,a=!1,i=function(e,n){var a=new Blob([n],{type:"octet/stream"});if("msSaveBlob"in window.navigator)return window.navigator.msSaveBlob(a,e);var i=window.URL.createObjectURL(a),s=t.createElement("a",document.body);s.href=i,s.download=e,s.style.display="none",s.click(),document.body.removeChild(s),window.URL.revokeObjectURL(i)},s=function(e){return window.btoa(unescape(encodeURIComponent(e)))},r=function(e){return decodeURIComponent(escape(window.atob(e)))};return{S:function(){a=!0,e="<!DOCTYPE html>\n"+document.documentElement.outerHTML,t.id("btn-upload-file").insertAdjacentHTML("afterend",`<button id="btn-embed-file" disabled>Embed File</button>`),t.id("btn-embed-file").addEventListener("click",()=>i("embed.html",n))},Z:function(i){a&&(t.id("btn-embed-file").disabled=!1,n=e.replace("</title>",`</title>\n<script type="text/javascript">window.DHT_EMBEDDED = "${s(i)}";<\/script>`).replace(`<${document.body.tagName.toLowerCase()}>`,`<body class="embedded">`))},q:function(){var e=window.DHT_EMBEDDED;return e?r(e):null}}}();document.addEventListener("DOMContentLoaded",()=>{var t=n.q();"?embed"!==location.search||t||n.S();e.S();a.S();a.J(()=>{r.V(a.G())});r.V(a.G());a.Y(e=>{r.K(e)});a.W(e=>{r.X(e)});r.ee(e=>{a.ne(e)});r.ae((e,t)=>{a.ie(e,t,r.se)});r.re(e=>{a.oe(r.ce(),r.le());a.ue(e);a.de()});var i=function(e,t,a){var i;try{i=JSON.parse(e),n.Z(e)}catch(e){return console.error(e),void alert(t)}s.fe(i)?r.me(new s(i)):alert(a)};t?i(t,"Could not parse embedded file, see console for details.","Embedded file has an invalid format."):a.ge(e=>{if(1===e.length){var t=e[0],n=new FileReader;n.onload=(()=>i(n.result,"Could not parse '"+t.name+"', see console for details.","File '"+t.name+"' has an invalid format.")),n.readAsText(t,"UTF-8")}else alert("Please, select only one file.");return!0})});var a=function(){var n,a,i,s,o=function(){var e=t.D("active",t.id("opt-filter-list"));return e&&""!==e.value?{type:e.getAttribute("data-filter-type"),value:e.value}:null},c=function(){i&&i(o())},l=function(e,n){var a=t.id("dialog");return a.innerHTML=n,a.style.width=e+"px",a.style.marginLeft=-e/2+"px",t.id("modal").classList.add("visible"),a},u=function(){l(560,`\r\n<label><input id='dht-cfg-imgpreviews' type='checkbox'> Image Previews</label><br>\r\n<label><input id='dht-cfg-formatting' type='checkbox'> Message Formatting</label><br>\r\n<label><input id='dht-cfg-animemoji' type='checkbox'> Animated Emoji</label><br>`);var e=function(e,n){var a=t.id(e);a.checked=r.N[n],a.addEventListener("change",()=>r.N[n]=a.checked)};e("dht-cfg-imgpreviews","enableImagePreviews"),e("dht-cfg-formatting","enableFormatting"),e("dht-cfg-animemoji","enableAnimatedEmoji")},d=function(){var e="https://github.com/chylex/Discord-History-Tracker";l(560,`\r\n<p>Discord History Tracker is developed by <a href='https://chylex.com'>chylex</a> as an <a href='${e}/blob/master/LICENSE.md'>open source</a> project.</p>\r\n<sub>BETA v.17, released 11 Nov 2019</sub>\r\n<p>Please, report any issues and suggestions to the <a href='${e}/issues'>tracker</a>. If you want to support the development, please spread the word and consider <a href='https://www.patreon.com/chylex'>becoming a patron</a> or <a href='https://ko-fi.com/chylex'>buying me a coffee</a>. Any support is appreciated!</p>\r\n<p><a href='${e}/issues'>Issue Tracker</a> &nbsp;&mdash;&nbsp; <a href='${e}'>GitHub Repository</a> &nbsp;&mdash;&nbsp; <a href='https://twitter.com/chylexmc'>Developer's Twitter</a></p>`)};return{S:function(){var e=t.id("uploaded-file"),i=t.id("opt-messages-filter"),r=t.id("opt-filter-list");t.id("btn-upload-file").addEventListener("click",()=>{e.click()}),e.addEventListener("change",()=>{n&&n(e.files)&&(e.value=null,i.value="",i.dispatchEvent(new Event("change")),t.id("opt-filter-contents").value="")}),i.value="",i.addEventListener("change",()=>{t.B("active",r).forEach(e=>e.classList.remove("active"));i.value&&r.querySelector("[data-filter-type='"+i.value+"']").classList.add("active");c()}),Array.prototype.forEach.call(r.children,e=>{e.addEventListener("SELECT"===e.tagName?"change":"input",e=>c())}),t.id("opt-messages-per-page").addEventListener("change",()=>{a&&a()}),t.tag("button",t.D("nav")).forEach(e=>{e.disabled=!0;e.addEventListener("click",()=>{s&&s(e.getAttribute("data-nav"))})}),t.id("btn-settings").addEventListener("click",()=>{u()}),t.id("btn-about").addEventListener("click",()=>{d()}),t.id("overlay").addEventListener("click",()=>{t.id("modal").classList.remove("visible");t.id("dialog").innerHTML=""})},ge:function(e){n=e},J:function(e){a=e},Y:function(e){i=e},W:function(e){s=e},G:function(){return parseInt(t.id("opt-messages-per-page").value,10)},oe:function(e,n){t.id("nav-page-current").innerHTML=e,t.id("nav-page-total").innerHTML=n||"?",t.id("nav-first").disabled=1===e,t.id("nav-prev").disabled=1===e,t.id("nav-pick").disabled=(n||0)<=1,t.id("nav-next").disabled=e===(n||1),t.id("nav-last").disabled=e===(n||1)},ie:function(n,a,i){var s=t.id("channels");if(n){if(null!=o()&&(n=n.filter(e=>e.msgcount>0)),s.innerHTML=n.map(t=>e.A(t)).join(""),Array.prototype.forEach.call(s.children,e=>{e.addEventListener("click",n=>{var a=t.D("active",s);a&&a.classList.remove("active");e.classList.add("active");i(e.getAttribute("data-channel"))})}),a){var r=s.querySelector("[data-channel='"+a+"']");r&&r.classList.add("active")}}else s.innerHTML=""},ue:function(n){t.id("messages").innerHTML=n?n.map(t=>e.O(t)).join(""):""},ne:function(e){for(var n=t.id("opt-filter-user");n.length>1;)n.remove(1);var a=[];for(var i of Object.keys(e)){var s=document.createElement("option");s.value=i,s.text=e[i].name,a.push(s)}a.sort((e,t)=>e.text.toLocaleLowerCase().localeCompare(t.text.toLocaleLowerCase())),a.forEach(e=>n.add(e))},de:function(){t.id("messages").scrollTop=0}}}(),i={};i.pe={ve:e=>t=>t.u===e,he:(e,t)=>n=>n.t>=e&&n.t<=t,be:e=>t=>-1!==("m"in t?t.m:"").indexOf(e),Le:e=>t=>e.test("m"in t?t.m:""),Ee:()=>t=>t.e&&t.e.some(e=>"image"===e.type)||t.a&&t.a.some(e.I),we:()=>t=>t.a&&t.a.some(t=>!e.I(t)),Ce:()=>e=>e.e&&e.e.length>0,ye:()=>e=>e.a&&e.a.length>0,Me:()=>e=>"te"in e?e.te:1==(1&e.f)},i.ke={Te:(e,t)=>e.length===t.length?e>t?1:e<t?-1:0:e.length>t.length?1:-1,je:(e,t)=>e.length===t.length?e>t?-1:e<t?1:0:e.length>t.length?-1:1};class s{constructor(e){var t=this;t.meta=e.meta,t.data=e.data,t.meta.users=t.meta.users||{},t.meta.userindex=t.meta.userindex||[],t.meta.servers=t.meta.servers||[],t.meta.channels=t.meta.channels||{}}static fe(e){return e&&"object"==typeof e.meta&&"object"==typeof e.data}Pe(e){return this.meta.servers[e]||{name:"&lt;unknown&gt;",type:"ERROR"}}Re(){return this.meta.channels}Ue(e){return this.meta.channels[e]||{id:e,name:e}}Se(){return this.meta.users}Ie(e){return this.meta.users[this.meta.userindex[e]]||{name:"&lt;unknown&gt;"}}Ae(e){return this.meta.users[e]||{name:e}}Oe(e){return this.meta.userindex.indexOf(e)}Fe(e){return this.data[e]||{}}}var r=function(){var e,t,n,a,s,r,o,c,l,u={},d=function(e){o&&o(u.Ne(),e)},f=function(){c&&c(u.xe())},m=function(){l&&l(u.He())};u.ae=function(e){o=e},u.re=function(e){c=e},u.ee=function(e){l=e},u.me=function(n){e=n,t=null,a=null,s=1,m(),d(),f()},u.H=function(t){return e.Ue(t).name},u._=function(t){return e.Ae(t).name};var g=function(t){var a=e.Fe(t),i=Object.keys(a);return n&&(i=i.filter(e=>n(a[e]))),i};u.Ne=function(){if(!e)return[];var t=e.Re();return Object.keys(t).map(n=>({id:n,name:t[n].name,server:e.Pe(t[n].server),msgcount:g(n).length})).sort((e,t)=>{var n=e.server;var a=t.server;return n.type.localeCompare(a.type,"en")||n.name.toLocaleLowerCase().localeCompare(a.name.toLocaleLowerCase(),void 0,{_e:!0})||e.name.toLocaleLowerCase().localeCompare(t.name.toLocaleLowerCase(),void 0,{_e:!0})})},u.se=function(e){s=1,a=e,t=g(e).sort(i.ke.Te),f()},u.Be=function(){return a},u.xe=function(){if(!t)return[];var n=e.Fe(a),i=r*(u.ce()-1);return t.slice(i,r?i+r:void 0).map(t=>{var a=n[t];return{user:e.Ie(a.u),timestamp:a.t,contents:"m"in a?a.m:null,embeds:a.e,attachments:a.a,edit:"te"in a?a.te:1==(1&a.f)}})},u.K=function(t){switch(t?t.type:""){case"user":n=i.pe.ve(e.Oe(t.value));break;case"contents":n=i.pe.be(t.value);break;case"withimages":n=i.pe.Ee();break;case"withdownloads":n=i.pe.we();break;case"edited":n=i.pe.Me();break;default:n=null}d(a),a&&u.se(a)},u.He=function(){return e?e.Se():[]},u.V=function(e){r=e,f()},u.X=function(e){switch(e){case"first":s=1;break;case"prev":s=Math.max(1,s-1);break;case"next":s=Math.min(u.le(),s+1);break;case"last":s=u.le();break;case"pick":var t=parseInt(prompt("Select page:",s),10);if(!t&&0!==t)return;s=Math.max(1,Math.min(u.le(),t))}f()},u.ce=function(){var e=u.le();return s>e&&e>0&&(s=e),s||1},u.le=function(){return t?r?Math.ceil(t.length/r):1:0},u.N={};var p=e=>{try{return localStorage.getItem(e)}catch(e){return console.error(e),null}},v=(e,t)=>{try{localStorage.setItem(e,t)}catch(e){console.error(e)}},h=(e,t,n)=>{var a="_"+e;Object.defineProperty(u.N,e,{get:()=>u.N[a],set:t=>{u.N[a]=t;f();v(e,t)}});var i=p(e);null!==i&&(i=n(i));u.N[a]=null===i?t:i},b=e=>{if("true"===e)return!0;if("false"===e)return!1;return null};return h("enableImagePreviews",!0,b),h("enableFormatting",!0,b),h("enableAnimatedEmoji",!0,b),u}(),o=/{([^{}]+?)}/g;class c{constructor(e){this.contents=e}apply(e,n){return this.contents.replace(o,(a,i)=>{var s=i.split(".").reduce((e,t)=>e[t],e);if(n){var r=n(i,s);return void 0===r?t.F(s):r}return t.F(s)})}} </script>
<style type="text/css">
#channels{width:15vw;min-width:215px;max-width:300px;overflow-y:auto;background-color:#1c1e22}#channels>div{cursor:pointer;padding:10px 12px;color:#eee;font-size:15px;border-bottom:1px solid #333}
#channels>div:hover,#channels>div.active{background-color:#282b30}#channels .info{display:flex;height:16px;margin-bottom:4px}#channels .name{flex-grow:1;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
#channels .msgcount{flex-shrink:1;background-color:rgba(255,255,255,0.08);border-radius:4px;margin-left:4px;margin-top:1px;padding:2px 5px;font-size:11px}body{font-family:Whitney,"Helvetica Neue",Helvetica,Verdana,"Lucida Grande",sans-serif;line-height:1;margin:0;padding:0;overflow:hidden}
body.embedded .hide-embedded{display:none}#menu{width:100%;height:48px;display:flex;flex-direction:row}#app{height:calc(100vh - 48px);display:flex;flex-direction:row}
#menu{background-color:#17181c;border-bottom:1px dotted #5d626b}#menu .splitter{width:1px;margin:9px 4px;background-color:#5d626b}#menu .separator{flex:1 1 0}#menu :disabled{background-color:#555;cursor:default}
#menu button,#menu select,#menu input[type="text"]{margin:8px;background-color:#7289da;color:#FFF;text-shadow:1px 1px 2px rgba(0,0,0,0.75)}
#menu button{font-size:17px;padding:0 12px;border:0;cursor:pointer}#menu select{font-size:14px;padding:6px;border:0;cursor:pointer}#menu input[type="text"]{font-size:14px;padding:7px 12px;border:0}
#menu .nav{display:flex;flex-direction:row;margin:0 8px}#menu .nav>button{font-size:14px}#menu .nav>button.icon{font-family:Lucida Console,monospace;font-size:17px;padding:0 8px}
#menu .nav>button,#menu .nav>p{margin:8px 1px}#opt-filter-list>select,#opt-filter-list>input{display:none}#opt-filter-list>.active{display:block}#messages{flex:1 1 0;overflow-y:auto;background-color:#36393e}
#messages>div{margin:0 24px;padding:4px 0 12px;border-bottom:1px solid rgba(255,255,255,0.04)}#messages h2{margin:0;padding:0;display:block}#messages .username{color:#FFF;font-size:15px;font-weight:600;letter-spacing:0}
#messages .info{color:rgba(255,255,255,0.2);font-size:12px;font-weight:500;letter-spacing:0}#messages .time{margin-left:10px}#messages .edited{margin-left:5px}.message{margin-top:6px;color:rgba(255,255,255,0.7);font-size:15px;line-height:1.1em;white-space:pre-wrap;word-wrap:break-word}
.message .link{color:#7289da;background-color:rgba(115,139,215,0.1)}.message a{color:#0096cf;text-decoration:none}.message a:hover{text-decoration:underline}.message p{margin:0}
.message .embed{display:inline-block;margin-top:8px}.message .embed .title{font-weight:bold;display:inline-block}.message .embed .desc{margin-top:4px}.message .thumbnail{max-width:calc(100% - 20px);max-height:320px}
.message .thumbnail img{max-width:100%;max-height:320px;border-radius:3px}.message .download{margin-right:8px;padding:8px 9px;border:1px solid rgba(255,255,255,0.5);border-radius:3px}
.message .embed:first-child,.message .download+.download{margin-top:0}.message code{background-color:#2e3136;border-radius:5px;font-family:Menlo,Consolas,Monaco,monospace;font-size:14px}
.message code.inline{display:inline;padding:2px}.message code.block{display:block;border:2px solid #282b30;margin-top:6px;padding:7px}.message .emoji{width:22px;height:22px;margin:0 1px;vertical-align:-30%;object-fit:contain}
#modal div{position:absolute;display:none}#modal.visible div{display:block}#modal #overlay{left:0;top:0;width:100%;height:100%;background-color:#000}#modal.visible #overlay{opacity:.5}
#dialog{left:50%;top:50%;padding:16px;background-color:#fff;transform:translateY(-50%)}#dialog p{line-height:1.2}#dialog p:first-child,#dialog p:last-child{margin-top:1px;margin-bottom:1px}
#dialog sub{color:#999;font-size:12px}#dialog a{color:#0096cf;text-decoration:none}#dialog a:hover{text-decoration:underline} </style>
</head>
<body>
<div id="menu">
<input id="uploaded-file" type="file" style="display:none">
<button id="btn-upload-file" class="hide-embedded">Load File</button>
<div class="splitter hide-embedded"></div>
<button id="btn-settings">Settings</button>
<div> <!-- needed to stop the select from messing up -->
<select id="opt-messages-per-page">
<option value="50">50 messages per page&nbsp;</option>
<option value="100">100 messages per page&nbsp;</option>
<option value="250">250 messages per page&nbsp;</option>
<option value="500">500 messages per page&nbsp;</option>
<option value="1000">1000 messages per page&nbsp;</option>
<option value="0">All messages&nbsp;</option>
</select>
</div>
<div class="nav">
<button id="nav-first" data-nav="first" class="icon">&laquo;</button>
<button id="nav-prev" data-nav="prev" class="icon">&lsaquo;</button>
<button id="nav-pick" data-nav="pick">Page <span id="nav-page-current">1</span>/<span id="nav-page-total">?</span></button>
<button id="nav-next" data-nav="next" class="icon">&rsaquo;</button>
<button id="nav-last" data-nav="last" class="icon">&raquo;</button>
</div>
<div class="splitter"></div>
<div> <!-- needed to stop the select from messing up -->
<select id="opt-messages-filter">
<option value="">No filter&nbsp;</option>
<option value="user">Filter messages by user&nbsp;</option>
<option value="contents">Filter messages by contents&nbsp;</option>
<option value="withimages">Only messages with images&nbsp;</option>
<option value="withdownloads">Only messages with downloads&nbsp;</option>
<option value="edited">Only edited messages&nbsp;</option>
</select>
</div>
<div id="opt-filter-list">
<select id="opt-filter-user" data-filter-type="user">
<option value="">Select user...</option>
</select>
<input id="opt-filter-contents" type="text" data-filter-type="contents" placeholder="Messages containing...">
<input type="hidden" data-filter-type="withimages" value="1">
<input type="hidden" data-filter-type="withdownloads" value="1">
<input type="hidden" data-filter-type="edited" value="1">
</div>
<div class="separator"></div>
<button id="btn-about">About</button>
</div>
<div id="app">
<div id="channels"></div>
<div id="messages"></div>
</div>
<div id="modal">
<div id="overlay"></div>
<div id="dialog"></div>
</div>
</body>
</html>