Untitled

mail@pastecode.io avatar
unknown
html
a year ago
2.5 kB
3
Indexable
Never
<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width-device-width, initial-scale=1.0">
    <title>CSS ASCII ART</title>
<style>
button.go, p.picbase, p.pictxt{
   visibility: hidden;
   display: none;
   }
</style>
<script>
function proceed() {
    var tx = document.getElementById("txt").value;
    var txx = tx.concat("\n");
    var text = txx.repeat(1500);
    var reader = new FileReader();

    reader.onload = function(e) {
    document.getElementByClassName('go').click();
    document.getElementByClassName("picbase").value = e.target.result;
    document.getElementByClassName("pictxt").value = text;
    };
    reader.readAsDataURL(input.files[0]);
}
</script>
</head>
<body>
    
<?php

if(isset($_POST['go'])) {
echo '<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width-device-width, initial-scale=1.0">
    <title>CSS ASCII ART</title>
    <style>
            p.art {
                font-size: 5px;
                line-height: 5px;
                text-align: justify;
                -webkit-background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                background-size: cover;
                -webkit-filter: grayscale(1) invert(0);
                filter: grayscale(1) invert(0);
                background: "url('.$pic.')";
                background-attachment: fixed;
                -webkit-background-clip: text;
                -webkit-text-fill-color: rgba(255,255,255,0.2);
            }
    </style>

</head>
<body>
    <div id="artOrg">
        <p class="art">'.$text.'</p>
    </div>
</body> 
</html>';
}
?>
    <div class="formOrg">
        <input type="file" id="myfile" name="myfile" onchange="readURL(this);" accept="image/*"><br><br>
        <input type="text" id="txt" name="txt" placeholder="Text..."><br><br>
        <button class="proceed" onclick="proceed()" onchange="readURL(this);">CREATE</button>
        <form method="post">
        <button class="go" type="submit" name="go" value="go"></button>
        </form>
        <p class="picbase"></p>
        <p class="pictxt"></p>
    </div>
    <div id="artOrg">
        <p id="art"></p>
    </div>
</body> 
</html>