Created
June 6, 2020 16:08
-
-
Save tranchausky/9b219af9011236e0bdfec09aec03d5b6 to your computer and use it in GitHub Desktop.
javascript create css,js, copy text
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var head = document.head || document.getElementsByTagName('head')[0]; | |
var body = document.body || document.getElementsByTagName('body')[0]; | |
var style = document.createElement('link'); | |
style.setAttribute('rel', 'stylesheet'); | |
style.setAttribute('href', '//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/tomorrow.min.css'); | |
var script = document.createElement('script'); | |
script.setAttribute('src', '//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js'); | |
head.append(style); | |
head.append(script); | |
body.innerHTML += '<div style="margin-top: 30px; display: block; width: 100%;"><p style="font-family:Arial,sans-serif; font-weight: bold; font-size: 1.1em">Source code<button id="clipboard-copy" style="float: right; margin: 10px 10px 0 0">Copy to clipboard</button></p><pre style="border: solid 1px #ddd"><code class="html javascript" id="code"></code></pre></div>'; | |
/** | |
* This helper functions checks how many whitespaces preceed the last tag, which should have 0 | |
* @param html | |
*/ | |
function calculateStartingWhitespacesCount(html) { | |
var lines = html.split(/\r?\n/); | |
var lastLine = lines[lines.length - 1]; | |
return lastLine.search(/\S|$/); | |
} | |
function waitForElement() { | |
if (typeof hljs !== 'undefined'){ | |
hljs.initHighlighting(); | |
} | |
else { | |
setTimeout(waitForElement, 100); | |
} | |
} | |
function copyToClipboard() { | |
var copyText = document.getElementById('code'); | |
if (document.selection) { | |
var range = document.body.createTextRange(); | |
range.moveToElementText(document.getElementById('code')); | |
range.select().createTextRange(); | |
document.execCommand("copy"); | |
} else if (window.getSelection) { | |
var range = document.createRange(); | |
range.selectNode(document.getElementById('code')); | |
window.getSelection().addRange(range); | |
document.execCommand("copy"); | |
} | |
if (window.getSelection) { | |
window.getSelection().removeAllRanges(); | |
} else if (document.selection) { | |
document.selection.empty(); | |
} | |
document.getElementById('clipboard-copy').innerText = 'Copied!'; | |
setTimeout(function() { | |
document.getElementById('clipboard-copy').innerText = 'Copy to clipboard'; | |
}, 2000); | |
} | |
var codeElements = document.getElementsByClassName('code'); | |
for (var i = 0; i < codeElements.length; i++) { | |
var tag = codeElements[i].cloneNode(true); | |
var classes = tag.className.replace('code', ''); | |
if (classes === '') { | |
tag.removeAttribute('class'); | |
} else { | |
tag.className = classes; | |
} | |
// fix indentation | |
var startingWhitespaces = calculateStartingWhitespacesCount(tag.outerHTML); | |
var regex = new RegExp('^ {' + startingWhitespaces + '}', 'mg'); | |
document.getElementById('code').innerText += tag.outerHTML.replace(regex, '') + '\n'; | |
} | |
document.getElementById('clipboard-copy').addEventListener('click', copyToClipboard); | |
waitForElement(); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment