Dashboard Temp Share Shortlinks Frames API

HTMLify

Describing You
Views: 307 | Author: abh 
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Describing You</title>
        <link rel="stylesheet" href="style.css" />
        <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400;1,600&display=swap" rel="stylesheet" />
        <link rel="stylesheet" href="https://unpkg.com/@sakun/system.css" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <main>
            <div id="input-div">
                <div class="title-bar">
                    <h1 class="title">Describing You</h1>
                </div>

                <br>
                <label for="image-upload-input" id="image-upload-label" class="btn" style="display:block;width:80%;">Pick your Pics</label>
                <input type="file" id="image-upload-input" style="display:none;" accept="image/*" multiple>

                <br><br>

                <button class="btn" onclick="process_images()">Process Images</button>

                <p id="input-div-pera">Upload Images (can also upload GIFs)</p>

                <hr>
                <br><br>

                <button class="btn" onclick="goto_credit()">Credits</button>
            </div>

            <div id="loading-div">
                <div class="title-bar">
                    <h1 class="title">Loading Assets</h1>
                </div>

                <p id="loading-div-pera"></p>

                <hr>
                <br><br>

            </div>

            <div id="play-div">
                <canvas id="text-layer" draggable="false"></canvas>
                <img id="her-image" draggable="false">
                <img id="background-image" draggable="false">
            </div>

            <div id="credit-div">
                <div class="title-bar">
                    <h1 class="title">Credits</h1>
                </div>

                <div>
                    <h2 class="title">Aman Babu Hemant</h2>
                    <p><a href="http://GitHub.com/AmanBabuHemant">The Developer</a></p>
                </div>

                <hr>
                <br>

                <div>
                    <h2 class="title">Background Images</h2>
                    <p>Images are sourced from <a href="https://pixabay.com">Pixabay</a>.<br>
                        Users:
                        <a href="https://pixabay.com/users/qimono-1962238/">Arek Socha</a>,<br>
                        <a href="https://pixabay.com/users/mzmatuszewski0-825220/">Mariusz Matuszewski</a>,<br>
                        <a href="https://pixabay.com/users/jarmoluk-143740/">Michal Jarmoluk</a>,<br>
                        <a href="https://pixabay.com/users/ghinzo-10938903/">Ghinzo</a>,<br>
                        <a href="https://pixabay.com/users/dehncka-5934301/">Denis Velikanov</a>,<br>
                        <a href="https://pixabay.com/users/bogitw-851103/">Gerhard Bögner</a>,<br>
                        <a href="https://pixabay.com/users/ralf1403-21380246/">Ralf Ruppert</a>,<br>
                        <a href="https://pixabay.com/users/ylanite-2218222/">Ylanite Koppens</a>,<br>
                        <a href="https://pixabay.com/users/stocksnap-894430/">StockSnap</a>,<br>
                        <a href="https://pixabay.com/users/moshehar-7046690/">Moshe Harosh</a>,<br>
                        <a href="https://pixabay.com/users/thelightnist-11132485/">Johann Lavandier</a> and<br>
                        <a href="https://pixabay.com/users/atlantios-4957810/">Antonios Ntoumas</a>.
                    </p>
                </div>

                <hr>
                <br>

                <div>
                    <h2 class="title">You</h2>
                    <p>Yup, you, because you uploaded images. You were the subject.</p>
                </div>

                <hr>
                <br>

                <div>
                    <h2 class="title">Background Audio</h2>
                    <p>A clip of <a href="https://www.youtube.com/watch?v=AWAsI3U2EaE">Golden Brown</a> by <a href="https://www.youtube.com/@MousikesPeriigiseis">Mousikes Periigiseis</a>.</p>
                </div>

                <hr>
                <br>

                <div>
                    <h2 class="title">Describing Audio</h2>
                    <p><a href="https://www.instagram.com/reels/audio/1034670394854910">This Instagram Audio</a></p>
                </div>

                <hr>
                <br>

                <div>
                    <h2 class="title">Inspiration</h2>
                    <p>Inspiration comes from this <a href="https://www.instagram.com/reel/DQW5qctCJYL">Instagram Reel</a></p>
                </div>

                <hr>
                <br>

                <button class="btn" onclick="goto_input()">Back to Home</button>
            </div>
        </main>
    </body>
    <script src="script.js"></script>
</html>



<!-- 128 -->

Share this file: