svg-replace
Hub » svg-replace
home.pngMain
default.pngAll Pages
default.pngMost Recently Edited
All Members
home.png7happy7′s Hub
default.png_template
default.png_404
One's own CSS Theme
PageList

<head>
<link rel="stylesheet" type="text/css" href="/local--code/7happy7:replace-tool/3">
</head>
 
<body style="margin: 0; padding: 0;">
<form>
<input type="button" value="copy result" onclick="copyAfter()">
<textarea id="before" placeholder="insert svg-code" oninput="replace()" rows="10" style="width: 99%;"></textarea>
<textarea id="after" rows="10" style="width: 99%;" placeholder="result" readonly></textarea>
<form>
<div id="samp"></div>
<script src="/local--code/7happy7:svg-replace/2"></script>
</body>
let before = document.getElementById("before");
let after = document.getElementById("after");
let samp = document.getElementById("samp");
let afterCode, i, X, Y;
afterCode = "";
 
before.value = '<?xml version="1.0" encoding="utf-8"?>';
 
function replace() {
    X = before.value.split("  ").join("").split("\n\n").join("");
    Y = 'url("data:image/svg+xml,' + encodeURIComponent(X) + '")';
    after.value = Y;
    samp.style.backgroundImage = Y;
}
 
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;
}
≡
page revision: 45, last edited: 12 May 2022 06:01
Edit Rate (0) Tags Discuss History Files Print Site tools + Options