Code Comp Ext
Hub » Code Comp Ext
<head> <link rel="stylesheet" type="text/css" href="/local--code/7happy7:code-comp-ext/3"> </head> <body style="margin: 0; padding: 0;"> <form> <input type="radio" id="comp" name="a" checked="checked">compression<input type="radio" id="ext" name="a">extraction <input type="button" value="reset" onclick="reset()"><input type="button" value="copy result" onclick="copyAfter()"> <textarea id="before" placeholder="insert before-text" oninput="replace()" rows="10" style="width: 99%;"></textarea> <textarea id="after" rows="10" style="width: 99%;" placeholder="result" readonly></textarea> <script src="/local--code/7happy7:code-comp-ext/2"></script> </body>
let comp = document.getElementById("comp"); let ext = document.getElementById("ext"); let before = document.getElementById("before"); let after = document.getElementById("after"); let afterCode, i; afterCode = ""; /* @import url();a, b {a: a;a: a;}a {a: a;a: a;}@media (a) {a {a: a;a: a;}} */ function replace() { afterCode = before.value; if (comp.checked) { afterCode = afterCode.split(/ +/g).join("").split((/\n/g)).join(""); }else { afterCode = afterCode.split(/{/g).join("{\n ").split(/;/g).join(";\n ").split(/}/g).join("}\n").split(/ }/g).join("}").split(/, ?/g).join(",\n").replace(/{\n (.*?){/mg, "{\n$1{").replace(/(}[^{]*?;\n) /mg, "$1"); } after.value = afterCode; } function reset(){ before.value = ""; replace(); } function copyAfter(){ if(execCopy(after.value)){ }else { alert('error: copying failed'); } }; function execCopy(string) { let temp = document.createElement('div'); temp.appendChild(document.createElement('pre')).textContent = string; let elemPosition = temp.style; elemPosition.position = 'fixed'; elemPosition.left = '-100%'; document.body.appendChild(temp); document.getSelection().selectAllChildren(temp); let result = document.execCommand('copy'); document.body.removeChild(temp); return result; };
body * { font-family: Courier, monospace; font-size: 10px; } input, textarea { font-family: inherit; font-size: 100%; } form { margin: 1em 0 0; } table * { margin: 0; padding: 0; } td { width: 50%; vertical-align: top; } ul { list-style: none; } ul#repList { position: relative; left: -2px; } ul#exList > li:before { content: ".split("; } ul#exList > li:after { content: ")"; } ul#repList > li:before { content: '.join("'; } ul#repList > li:after { content: '")'; } li { border-bottom: 1px solid #fff; margin-bottom: 0.2em; } li:last-child { border-bottom: none; margin-bottom: 0; }
page revision: 10, last edited: 09 Apr 2019 13:54