Skip to content

Instantly share code, notes, and snippets.

@ecchochan
Created January 16, 2021 06:24
Show Gist options
  • Select an option

  • Save ecchochan/fe7707ea065d33b33f5d6ddf0fb144c0 to your computer and use it in GitHub Desktop.

Select an option

Save ecchochan/fe7707ea065d33b33f5d6ddf0fb144c0 to your computer and use it in GitHub Desktop.
Show console message on screen :D
var ConsoleLogHTML=function(e,t,n,o,r,i,l){"use strict";for(var f=0;f<t.length;f++)r!==typeof n[t[f]]&&(e[t[f]]=n[t[f]]);var c=n.skipHtml,a=o.keys(e),s=r!==typeof n.clear&&n.clear,u=typeof jQuery!==r&&jQuery,p=function(){for(var e,t,n={},r=0;r<arguments.length;r++)for(t=o.keys(arguments[r]),e=0;e<t.length;e++)n[t[e]]=arguments[r][t[e]];return n},d=function(t,o,r,i,f,c){n.skipHtml[t]=function(){e[t].apply(n,arguments)},n[t]=function(){var e,a,s,u;for(e="",s=0;s<arguments.length;s++){if(a=arguments[s]+"",a===l)try{a="Object "+JSON.stringify(arguments[s])}catch(e){}e+=(s>0?" ":"")+a}e=(i?"["+(new Date).toLocaleTimeString()+"] ":"")+e,u=document.createElement("li"),u.setAttribute("data-level",t),u.innerText=e,r[t]&&u.setAttribute("class",r[t]),c?o.appendChild(u):o.insertBefore(u,o.firstChild),f&&n.skipHtml[t].apply(n,arguments)}};return{DEFAULTS:{error:"text-danger",warn:"text-warning",info:"text-success",debug:"text-info",log:""},disconnect:function(){n.skipHtml=c;for(var t=0;t<a.length;t++)n[a[t]]=e[a[t]];!1!==s&&(n.clear=s)},connect:function(e,t,o,r,l){if(u&&e instanceof u&&(e=e[0]),typeof r!==i&&(r=!0),typeof o!==i&&(o=!0),!(e instanceof HTMLUListElement))throw new Error("The target must be a HTML <ul> element");t=p(ConsoleLogHTML.DEFAULTS,t||{}),n.skipHtml={};for(var f=0;f<a.length;f++)d(a[f],e,t,o,r,l);!1!==s&&(n.clear=function(){e.innerText="",s.apply(n)})}}}({},["log","debug","info","warn","error"],console,Object,"undefined","boolean","[object Object]");"undefined"!=typeof module&&"undefined"!=typeof module.exports&&(module.exports=ConsoleLogHTML);
const debug_box = document.createElement("ul");
debug_box.setAttribute("style","position: absolute;top: 0;width: 100%;padding: 0;background: #fff;opacity: 0.6;height: 100px;overflow: auto;margin: 0;");
document.body.appendChild(debug_box);
ConsoleLogHTML.connect(debug_box); // Redirect log messages
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment