From 64a9bfae4a659f38f33320e59004a1d1dd259a40 Mon Sep 17 00:00:00 2001
From: ilotterytea <iltsu@alright.party>
Date: Tue, 9 Dec 2025 01:51:38 +0500
Subject: upd: replaced <?php echo with <?=

---
 emotes/index.php  |  23 +--
 emotes/upload.php | 560 +++++++++++++++++++++++++++---------------------------
 2 files changed, 289 insertions(+), 294 deletions(-)

(limited to 'emotes')

diff --git a/emotes/index.php b/emotes/index.php
index 3999d8e..06d9e43 100644
--- a/emotes/index.php
+++ b/emotes/index.php
@@ -240,10 +240,9 @@ if (CLIENT_REQUIRES_JSON) {
                                     if (isset($_SESSION["user_role"]) && $_SESSION["user_role"]["permission_emoteset_own"]) {
                                         echo '' ?>
                                         <form action="/emotes/setmanip.php" method="POST">
-                                            <input type="text" name="id" value="<?php echo $emote->get_id() ?>"
-                                                style="display: none;">
+                                            <input type="text" name="id" value="<?= $emote->get_id() ?>" style="display: none;">
                                             <input type="text" name="emote_set_id"
-                                                value="<?php echo $_SESSION["user_active_emote_set_id"] ?>" style="display: none;">
+                                                value="<?= $_SESSION["user_active_emote_set_id"] ?>" style="display: none;">
                                             <?php
                                             if ($added) {
                                                 ?>
@@ -251,13 +250,11 @@ if (CLIENT_REQUIRES_JSON) {
                                                 <button type="submit" class="red">Remove from my channel</button>
                                             </form>
                                             <form action="/emotes/setmanip.php" method="POST" class="row">
-                                                <input type="text" name="id" value="<?php echo $emote->get_id() ?>"
-                                                    style="display: none;">
+                                                <input type="text" name="id" value="<?= $emote->get_id() ?>" style="display: none;">
                                                 <input type="text" name="emote_set_id"
-                                                    value="<?php echo $_SESSION["user_active_emote_set_id"] ?>" style="display: none;">
+                                                    value="<?= $_SESSION["user_active_emote_set_id"] ?>" style="display: none;">
                                                 <input type="text" name="value" id="emote-alias-input"
-                                                    value="<?php echo $emote_current_name ?>"
-                                                    placeholder="<?php echo $emote->get_code() ?>">
+                                                    value="<?= $emote_current_name ?>" placeholder="<?= $emote->get_code() ?>">
                                                 <input type="text" name="action" value="alias" style="display: none;">
                                                 <button type="submit" class="transparent"><img src="/static/img/icons/pencil.png"
                                                         alt="Rename" title="Rename"></button>
@@ -276,15 +273,13 @@ if (CLIENT_REQUIRES_JSON) {
 
                                     <?php if ($emote->get_uploaded_by() === $_SESSION["user_id"]): ?>
                                         <form action="/emotes/delete.php" method="post">
-                                            <input type="text" name="id" value="<?php echo $emote->get_id() ?>"
-                                                style="display: none;">
+                                            <input type="text" name="id" value="<?= $emote->get_id() ?>" style="display: none;">
                                             <button type="submit" class="transparent">
                                                 <img src="/static/img/icons/bin.png" alt="Delete emote" title="Delete emote">
                                             </button>
                                         </form>
                                         <form action="/emotes/delete.php" method="post">
-                                            <input type="text" name="id" value="<?php echo $emote->get_id() ?>"
-                                                style="display: none;">
+                                            <input type="text" name="id" value="<?= $emote->get_id() ?>" style="display: none;">
                                             <input type="text" name="unlink" value="1" style="display:none">
                                             <button type="submit" class="transparent">
                                                 <img src="/static/img/icons/link_break.png" alt="Remove your authorship"
@@ -481,8 +476,8 @@ if (CLIENT_REQUIRES_JSON) {
                                     <tr>
                                         <th>Source</th>
                                         <td>
-                                            <a href="<?php echo $emote->get_source() ?>"
-                                                target="_blank"><?php echo $emote->get_source() ?></a>
+                                            <a href="<?= $emote->get_source() ?>"
+                                                target="_blank"><?= $emote->get_source() ?></a>
                                         </td>
                                     </tr>
                                 <?php endif; ?>
diff --git a/emotes/upload.php b/emotes/upload.php
index e509345..d931c05 100644
--- a/emotes/upload.php
+++ b/emotes/upload.php
@@ -46,145 +46,145 @@ if ($_SERVER['REQUEST_METHOD'] != "POST") {
     include "{$_SERVER['DOCUMENT_ROOT']}/lib/partials.php";
 
     echo '' ?>
-            <html>
-
-            <head>
-                <title>Upload an emote - <?php echo CONFIG['instance']['name'] ?></title>
-                <link rel="stylesheet" href="/static/style.css">
-                <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
-            </head>
-
-            <body>
-                <div class="container">
-                    <div class="wrapper">
-                        <?php html_navigation_bar() ?>
-                        <?php display_alert() ?>
-
-                        <section class="content row">
-                            <div class="column small-gap">
-                                <section class="box">
-                                    <div class="box navtab">
-                                        <div>
-                                            <b>Upload a new emote</b>
-                                            <p style="font-size:8px;">You can just upload, btw. Anything you want.</p>
-                                        </div>
+    <html>
+
+    <head>
+        <title>Upload an emote - <?= CONFIG['instance']['name'] ?></title>
+        <link rel="stylesheet" href="/static/style.css">
+        <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
+    </head>
+
+    <body>
+        <div class="container">
+            <div class="wrapper">
+                <?php html_navigation_bar() ?>
+                <?php display_alert() ?>
+
+                <section class="content row">
+                    <div class="column small-gap">
+                        <section class="box">
+                            <div class="box navtab">
+                                <div>
+                                    <b>Upload a new emote</b>
+                                    <p style="font-size:8px;">You can just upload, btw. Anything you want.</p>
+                                </div>
+                            </div>
+                            <div class="box content">
+                                <form action="/emotes/upload.php" method="POST" enctype="multipart/form-data">
+                                    <h3>Image<span style="color:red;">*</span></h3>
+
+                                    <input type="file" name="file" id="form-file" accept=".gif,.jpg,.jpeg,.png,.webp"
+                                        required>
+
+                                    <div id="form-manual-files" style="display:none;">
+                                        <input type="file" name="file-1x" id="form-file-1x"
+                                            accept=".gif,.jpg,.jpeg,.png,.webp">
+                                        <label class="inline"
+                                            for="file-1x"><?= sprintf("%dx%d", CONFIG['emote']['maxsizex'] / 4, CONFIG['emote']['maxsizey'] / 4) ?></label>
+                                        <input type="file" name="file-2x" id="form-file-2x"
+                                            accept=".gif,.jpg,.jpeg,.png,.webp">
+                                        <label class="inline"
+                                            for="file-2x"><?= sprintf("%dx%d", CONFIG['emote']['maxsizex'] / 2, CONFIG['emote']['maxsizey'] / 2) ?></label>
+                                        <input type="file" name="file-3x" id="form-file-3x"
+                                            accept=".gif,.jpg,.jpeg,.png,.webp">
+                                        <label class="inline"
+                                            for="file-3x"><?= sprintf("%dx%d", CONFIG['emote']['maxsizex'], CONFIG['emote']['maxsizey']) ?></label>
                                     </div>
-                                    <div class="box content">
-                                        <form action="/emotes/upload.php" method="POST" enctype="multipart/form-data">
-                                            <h3>Image<span style="color:red;">*</span></h3>
-
-                                            <input type="file" name="file" id="form-file" accept=".gif,.jpg,.jpeg,.png,.webp"
-                                                required>
-
-                                            <div id="form-manual-files" style="display:none;">
-                                                <input type="file" name="file-1x" id="form-file-1x"
-                                                    accept=".gif,.jpg,.jpeg,.png,.webp">
-                                                <label class="inline"
-                                                    for="file-1x"><?php echo sprintf("%dx%d", CONFIG['emote']['maxsizex'] / 4, CONFIG['emote']['maxsizey'] / 4) ?></label>
-                                                <input type="file" name="file-2x" id="form-file-2x"
-                                                    accept=".gif,.jpg,.jpeg,.png,.webp">
-                                                <label class="inline"
-                                                    for="file-2x"><?php echo sprintf("%dx%d", CONFIG['emote']['maxsizex'] / 2, CONFIG['emote']['maxsizey'] / 2) ?></label>
-                                                <input type="file" name="file-3x" id="form-file-3x"
-                                                    accept=".gif,.jpg,.jpeg,.png,.webp">
-                                                <label class="inline"
-                                                    for="file-3x"><?php echo sprintf("%dx%d", CONFIG['emote']['maxsizex'], CONFIG['emote']['maxsizey']) ?></label>
-                                            </div>
-
-                                            <div>
-                                                <label for="manual" class="inline">Manual resize</label>
-                                                <input type="checkbox" name="manual" value="1" onchange="display_manual_resize()">
-                                            </div>
-
-                                            <h3>Emote name<span style="color:red;">*</span></h3>
-                                            <input type="text" name="code" id="code" required>
-
-                                            <div>
-                                                <label for="visibility" class="inline">Emote visibility: </label>
-                                                <select name="visibility" id="form-visibility">
-                                                    <option value="1">Public</option>
-                                                    <option value="0">Unlisted</option>
-                                                </select><br>
-                                                <p id="form-visibility-description" style="font-size: 10px;">test</p>
-                                            </div>
-
-                                            <label for="notes">Approval notes</label>
-                                            <textarea name="notes" id="form-notes"></textarea>
-
-                                            <table class="vertical left font-weight-normal">
-                                                <tr>
-                                                    <th>Emote source:</th>
-                                                    <td class="flex"><input class="grow" name="source" id="form-source"></input>
-                                                    </td>
-                                                </tr>
-                                                <?php if (CONFIG['tags']['enable'] && CONFIG['tags']['maxcount'] != 0): ?>
-                                                            <tr>
-                                                                <th>Tags <span class="font-small" style="cursor: help;" title="<?php
-                                                                echo 'Tags are used for fast search. ';
-                                                                if (CONFIG['tags']['maxcount'] > 0) {
-                                                                    echo 'You can use ' . CONFIG['tags']['maxcount'] . ' tags. ';
-                                                                }
-                                                                echo 'They are space-separated o algo.';
-                                                                ?>">[?]</span>:
-                                                                </th>
-                                                                <td class="flex"><input class="grow" name="tags" id="form-tags"></input></td>
-                                                            </tr>
-                                                <?php endif; ?>
-                                            </table>
-
-                                            <div>
-                                                <label for="tos" class="inline">Do you accept <a href="/rules.php"
-                                                        target="_BLANK">the
-                                                        rules</a>?<span style="color:red;">*</span></label>
-                                                <input type="checkbox" name="tos" value="1" required>
-                                            </div>
-
-                                            <button type="submit" id="upload-button">Upload as
-                                                <?php echo $uploader_name ?></button>
-                                        </form>
+
+                                    <div>
+                                        <label for="manual" class="inline">Manual resize</label>
+                                        <input type="checkbox" name="manual" value="1" onchange="display_manual_resize()">
                                     </div>
-                                </section>
 
-                                <?php
-                                if (CONFIG['captcha']['enable'] && (CONFIG['captcha']['force'] || !isset($_SESSION["user_id"]))) {
-                                    html_captcha_form();
-                                }
-                                ?>
-                            </div>
+                                    <h3>Emote name<span style="color:red;">*</span></h3>
+                                    <input type="text" name="code" id="code" required>
 
-                            <div class="column small-gap grow" id="emote-showcase" style="display: none;">
-                                <!-- Emote Preview -->
-                                <section class="box">
-                                    <div class="box navtab">
-                                        Emote Preview - <span id="emote-name"><i>Empty</i></span>
+                                    <div>
+                                        <label for="visibility" class="inline">Emote visibility: </label>
+                                        <select name="visibility" id="form-visibility">
+                                            <option value="1">Public</option>
+                                            <option value="0">Unlisted</option>
+                                        </select><br>
+                                        <p id="form-visibility-description" style="font-size: 10px;">test</p>
                                     </div>
-                                    <div class="box content">
-                                        <div class="emote-showcase items-bottom">
-                                            <div class="emote-image column items-center small-gap">
-                                                <img src="" alt="" class="emote-image-1x">
-                                                <p class="size font-small"></p>
-                                            </div>
-                                            <div class="emote-image column items-center small-gap">
-                                                <img src="" alt="" class="emote-image-2x">
-                                                <p class="size font-small"></p>
-                                            </div>
-                                            <div class="emote-image column items-center small-gap">
-                                                <img src="" alt="" class="emote-image-3x">
-                                                <p class="size font-small"></p>
-                                            </div>
-                                        </div>
-                                        <p style="font-size: 12px;">The result may differ.</p>
+
+                                    <label for="notes">Approval notes</label>
+                                    <textarea name="notes" id="form-notes"></textarea>
+
+                                    <table class="vertical left font-weight-normal">
+                                        <tr>
+                                            <th>Emote source:</th>
+                                            <td class="flex"><input class="grow" name="source" id="form-source"></input>
+                                            </td>
+                                        </tr>
+                                        <?php if (CONFIG['tags']['enable'] && CONFIG['tags']['maxcount'] != 0): ?>
+                                            <tr>
+                                                <th>Tags <span class="font-small" style="cursor: help;" title="<?php
+                                                echo 'Tags are used for fast search. ';
+                                                if (CONFIG['tags']['maxcount'] > 0) {
+                                                    echo 'You can use ' . CONFIG['tags']['maxcount'] . ' tags. ';
+                                                }
+                                                echo 'They are space-separated o algo.';
+                                                ?>">[?]</span>:
+                                                </th>
+                                                <td class="flex"><input class="grow" name="tags" id="form-tags"></input></td>
+                                            </tr>
+                                        <?php endif; ?>
+                                    </table>
+
+                                    <div>
+                                        <label for="tos" class="inline">Do you accept <a href="/rules.php"
+                                                target="_BLANK">the
+                                                rules</a>?<span style="color:red;">*</span></label>
+                                        <input type="checkbox" name="tos" value="1" required>
                                     </div>
-                                </section>
 
-                                <!-- Chat Preview -->
-                                <section class="box">
-                                    <div class="box navtab">
-                                        Chat Preview
+                                    <button type="submit" id="upload-button">Upload as
+                                        <?= $uploader_name ?></button>
+                                </form>
+                            </div>
+                        </section>
+
+                        <?php
+                        if (CONFIG['captcha']['enable'] && (CONFIG['captcha']['force'] || !isset($_SESSION["user_id"]))) {
+                            html_captcha_form();
+                        }
+                        ?>
+                    </div>
+
+                    <div class="column small-gap grow" id="emote-showcase" style="display: none;">
+                        <!-- Emote Preview -->
+                        <section class="box">
+                            <div class="box navtab">
+                                Emote Preview - <span id="emote-name"><i>Empty</i></span>
+                            </div>
+                            <div class="box content">
+                                <div class="emote-showcase items-bottom">
+                                    <div class="emote-image column items-center small-gap">
+                                        <img src="" alt="" class="emote-image-1x">
+                                        <p class="size font-small"></p>
+                                    </div>
+                                    <div class="emote-image column items-center small-gap">
+                                        <img src="" alt="" class="emote-image-2x">
+                                        <p class="size font-small"></p>
                                     </div>
-                                    <div class="box content no-gap column chat rounded">
-                                        <?php
-                                        $stmt = $db->query("SELECT u.username,
+                                    <div class="emote-image column items-center small-gap">
+                                        <img src="" alt="" class="emote-image-3x">
+                                        <p class="size font-small"></p>
+                                    </div>
+                                </div>
+                                <p style="font-size: 12px;">The result may differ.</p>
+                            </div>
+                        </section>
+
+                        <!-- Chat Preview -->
+                        <section class="box">
+                            <div class="box navtab">
+                                Chat Preview
+                            </div>
+                            <div class="box content no-gap column chat rounded">
+                                <?php
+                                $stmt = $db->query("SELECT u.username,
                                         CASE
                                             WHEN ub.badge_id IS NOT NULL THEN ub.badge_id
                                             WHEN r.badge_id IS NOT NULL THEN r.badge_id
@@ -197,191 +197,191 @@ if ($_SERVER['REQUEST_METHOD'] != "POST") {
                                     ORDER BY RAND() LIMIT 3
                                 ");
 
-                                        while ($row = $stmt->fetch()) {
-                                            echo '<div class="row small-gap items-center chat-message">';
+                                while ($row = $stmt->fetch()) {
+                                    echo '<div class="row small-gap items-center chat-message">';
 
-                                            if ($row["badge_id"]) {
-                                                echo '<img src="/static/userdata/badges/' . $row["badge_id"] . '/1x.webp" alt="" title="" /> ';
-                                            }
+                                    if ($row["badge_id"]) {
+                                        echo '<img src="/static/userdata/badges/' . $row["badge_id"] . '/1x.webp" alt="" title="" /> ';
+                                    }
 
-                                            echo '<span style="color: rgb(' . random_int(128, 255) . ', ' . random_int(128, 255) . ', ' . random_int(128, 255) . ')">';
-                                            echo $row["username"];
-                                            echo ': </span>';
+                                    echo '<span style="color: rgb(' . random_int(128, 255) . ', ' . random_int(128, 255) . ', ' . random_int(128, 255) . ')">';
+                                    echo $row["username"];
+                                    echo ': </span>';
 
-                                            echo '<img src="" alt="" class="emote-image-1x">';
+                                    echo '<img src="" alt="" class="emote-image-1x">';
 
-                                            echo '</div>';
-                                        }
-                                        ?>
-                                    </div>
-                                </section>
+                                    echo '</div>';
+                                }
+                                ?>
                             </div>
                         </section>
                     </div>
-                </div>
-            </body>
-
-            <script>
-                const max_width = <?php echo CONFIG['emote']['maxsizex'] ?>;
-                const max_height = <?php echo CONFIG['emote']['maxsizey'] ?>;
-
-                const fileInput = document.getElementById("form-file");
-                const showcase = document.getElementById("emote-showcase");
-                const reader = new FileReader();
-
-                let manual = false;
-
-                fileInput.addEventListener("change", (e) => {
-                    if (manual) return;
-
-                    showcase.style.display = "flex";
-                    reader.readAsDataURL(e.target.files[0]);
-                    reader.onload = (e) => {
-                        const image = new Image();
-                        image.src = e.target.result;
-                        image.onload = () => {
-                            let m = 1;
-
-                            for (let i = 3; i > 0; i--) {
-                                place_image(i, m, e, image);
-                                m *= 2;
-                            }
-                        };
-                    };
-                });
+                </section>
+            </div>
+        </div>
+    </body>
+
+    <script>
+        const max_width = <?= CONFIG['emote']['maxsizex'] ?>;
+        const max_height = <?= CONFIG['emote']['maxsizey'] ?>;
+
+        const fileInput = document.getElementById("form-file");
+        const showcase = document.getElementById("emote-showcase");
+        const reader = new FileReader();
+
+        let manual = false;
+
+        fileInput.addEventListener("change", (e) => {
+            if (manual) return;
+
+            showcase.style.display = "flex";
+            reader.readAsDataURL(e.target.files[0]);
+            reader.onload = (e) => {
+                const image = new Image();
+                image.src = e.target.result;
+                image.onload = () => {
+                    let m = 1;
+
+                    for (let i = 3; i > 0; i--) {
+                        place_image(i, m, e, image);
+                        m *= 2;
+                    }
+                };
+            };
+        });
 
-                const code = document.getElementById("code");
+        const code = document.getElementById("code");
 
-                code.addEventListener("input", (e) => {
-                    const regex = <?php echo CONFIG['emote']['nameregex'] ?>;
+        code.addEventListener("input", (e) => {
+            const regex = <?= CONFIG['emote']['nameregex'] ?>;
 
-                    if (regex.test(e.target.value) && e.target.value.length <= <?php echo CONFIG['emote']['maxnamelength'] ?>) {
-                        validCode = e.target.value;
-                    } else {
-                        e.target.value = validCode;
-                    }
+            if (regex.test(e.target.value) && e.target.value.length <= <?= CONFIG['emote']['maxnamelength'] ?>) {
+                validCode = e.target.value;
+            } else {
+                e.target.value = validCode;
+            }
 
-                    document.getElementById("emote-name").innerHTML = e.target.value ? e.target.value : "<i>Empty</i>";
-                });
+            document.getElementById("emote-name").innerHTML = e.target.value ? e.target.value : "<i>Empty</i>";
+        });
 
-                const visibility = document.getElementById("form-visibility");
-                visibility.addEventListener("change", (e) => {
-                    set_form_visibility_description(visibility.value);
-                });
+        const visibility = document.getElementById("form-visibility");
+        visibility.addEventListener("change", (e) => {
+            set_form_visibility_description(visibility.value);
+        });
 
-                function set_form_visibility_description(visibility) {
-                    const p = document.getElementById("form-visibility-description");
+        function set_form_visibility_description(visibility) {
+            const p = document.getElementById("form-visibility-description");
 
-                    if (visibility == 1) {
-                        p.innerHTML = "Emote won't appear on the public list until it passes a moderator's review. It still can be added to chats.";
-                    } else {
-                        p.innerHTML = "Emote doesn't appear on the public list and won't be subject to moderation checks. It still can be added to chats.";
-                    }
-                }
+            if (visibility == 1) {
+                p.innerHTML = "Emote won't appear on the public list until it passes a moderator's review. It still can be added to chats.";
+            } else {
+                p.innerHTML = "Emote doesn't appear on the public list and won't be subject to moderation checks. It still can be added to chats.";
+            }
+        }
 
-                set_form_visibility_description(visibility.value);
+        set_form_visibility_description(visibility.value);
 
-                // Manual resize
-                function display_manual_resize() {
-                    const manual_files = document.getElementById("form-manual-files");
+        // Manual resize
+        function display_manual_resize() {
+            const manual_files = document.getElementById("form-manual-files");
 
-                    // resetting previous values
-                    const files = document.querySelectorAll("input[type=file]");
+            // resetting previous values
+            const files = document.querySelectorAll("input[type=file]");
 
-                    for (let file of files) {
-                        file.value = null;
-                        file.removeAttribute("required");
-                    }
+            for (let file of files) {
+                file.value = null;
+                file.removeAttribute("required");
+            }
 
-                    const fileImages = document.querySelectorAll(".emote-image img");
+            const fileImages = document.querySelectorAll(".emote-image img");
 
-                    for (let file of fileImages) {
-                        file.setAttribute("src", "");
-                        file.setAttribute("width", "0");
-                        file.setAttribute("height", "0");
-                    }
+            for (let file of fileImages) {
+                file.setAttribute("src", "");
+                file.setAttribute("width", "0");
+                file.setAttribute("height", "0");
+            }
 
-                    const fileSizes = document.querySelectorAll(".emote-image .size");
+            const fileSizes = document.querySelectorAll(".emote-image .size");
 
-                    for (let file of fileImages) {
-                        file.innerHTML = "";
-                    }
+            for (let file of fileImages) {
+                file.innerHTML = "";
+            }
 
-                    manual = !manual;
+            manual = !manual;
 
-                    if (manual) {
-                        manual_files.style.display = "block";
-                        fileInput.style.display = "none";
-                        const elements = document.querySelectorAll("#form-manual-files input[type=file]");
-                        for (let elem of elements) {
-                            elem.setAttribute("required", "true");
-                        }
-                    } else {
-                        manual_files.style.display = "none";
-                        fileInput.style.display = "block";
-                        fileInput.setAttribute("required", "true");
-                    }
-
-                    showcase.style.display = "none";
+            if (manual) {
+                manual_files.style.display = "block";
+                fileInput.style.display = "none";
+                const elements = document.querySelectorAll("#form-manual-files input[type=file]");
+                for (let elem of elements) {
+                    elem.setAttribute("required", "true");
                 }
+            } else {
+                manual_files.style.display = "none";
+                fileInput.style.display = "block";
+                fileInput.setAttribute("required", "true");
+            }
 
-                document.getElementById("form-file-1x").addEventListener("change", (e) => {
-                    showcase.style.display = "flex";
-                    place_image(1, 4, e, null);
-                });
-
-                document.getElementById("form-file-2x").addEventListener("change", (e) => {
-                    showcase.style.display = "flex";
-                    place_image(2, 2, e, null);
-                });
-
-                document.getElementById("form-file-3x").addEventListener("change", (e) => {
-                    showcase.style.display = "flex";
-                    place_image(3, 1, e, null);
-                });
-
-                function place_image(image_index, multiplier, e, image) {
-                    let ee = e;
-
-                    if (image == null) {
-                        reader.readAsDataURL(e.target.files[0]);
-                        reader.onload = (e) => {
-                            const image = new Image();
-                            image.src = e.target.result;
-                            image.onload = () => {
-                                insert_image(image_index, multiplier, e, image);
-                            };
-                        }
-                    } else {
+            showcase.style.display = "none";
+        }
+
+        document.getElementById("form-file-1x").addEventListener("change", (e) => {
+            showcase.style.display = "flex";
+            place_image(1, 4, e, null);
+        });
+
+        document.getElementById("form-file-2x").addEventListener("change", (e) => {
+            showcase.style.display = "flex";
+            place_image(2, 2, e, null);
+        });
+
+        document.getElementById("form-file-3x").addEventListener("change", (e) => {
+            showcase.style.display = "flex";
+            place_image(3, 1, e, null);
+        });
+
+        function place_image(image_index, multiplier, e, image) {
+            let ee = e;
+
+            if (image == null) {
+                reader.readAsDataURL(e.target.files[0]);
+                reader.onload = (e) => {
+                    const image = new Image();
+                    image.src = e.target.result;
+                    image.onload = () => {
                         insert_image(image_index, multiplier, e, image);
-                    }
+                    };
+                }
+            } else {
+                insert_image(image_index, multiplier, e, image);
+            }
 
-                    function insert_image(i, m, e, image) {
-                        const max_w = max_width / multiplier;
-                        const max_h = max_height / multiplier;
+            function insert_image(i, m, e, image) {
+                const max_w = max_width / multiplier;
+                const max_h = max_height / multiplier;
 
-                        const parentId = `.emote-image-${image_index}x`;
-                        const imgs = document.querySelectorAll(parentId);
+                const parentId = `.emote-image-${image_index}x`;
+                const imgs = document.querySelectorAll(parentId);
 
-                        for (const img of imgs) {
-                            img.setAttribute("src", e.target.result);
+                for (const img of imgs) {
+                    img.setAttribute("src", e.target.result);
 
-                            let ratio = Math.min(max_w / image.width, max_h / image.height);
+                    let ratio = Math.min(max_w / image.width, max_h / image.height);
 
-                            img.setAttribute("width", Math.floor(image.width * ratio));
-                            img.setAttribute("height", Math.floor(image.height * ratio));
+                    img.setAttribute("width", Math.floor(image.width * ratio));
+                    img.setAttribute("height", Math.floor(image.height * ratio));
 
-                            const sizeElement = document.querySelector(`.emote-image:has(${parentId}) .size`);
-                            sizeElement.innerHTML = `${img.getAttribute("width")}x${img.getAttribute("height")}`;
-                        }
-                    }
+                    const sizeElement = document.querySelector(`.emote-image:has(${parentId}) .size`);
+                    sizeElement.innerHTML = `${img.getAttribute("width")}x${img.getAttribute("height")}`;
                 }
-            </script>
+            }
+        }
+    </script>
 
-            </html>
+    </html>
 
-            <?php
-            exit;
+    <?php
+    exit;
 }
 
 if (!CLIENT_REQUIRES_JSON && CONFIG['captcha']['enable'] && !isset($_SESSION["captcha_solved"])) {
-- 
cgit v1.2.3