<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="Created" content="2025-09-16">
    <meta name="Author" content="Kārlis Grīnvalds">
    <meta name="Last edited" content="2025-09-16">
    <meta name="Edited by" content="Kārlis Grīnvalds">
    <title>Wiki-Media | File upload</title>
    <script src="../js/jquery/jquery-3.7.1.min.js"></script>
    <script src="../js/file_upload.js"></script>
    <script src="../js/script.js"></script>
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/elements.css">
    <link rel="stylesheet" href="../css/file_form.css">
</head>
<body>
    <!-- Shows create account and log in links or log out link and welcome message for the user -->
    <div id="UserProfile" class="user-profile"></div>
    <!-- Page layout -->
    <div class="container">
        <header>
            <!-- Search bar -->
            <div id="SearchBarDiv" class="search-bar">
                <input type="text" id="SearchField" placeholder="Search Wiki-Media">
                <button id="SearchBtn">Search</button>
            </div>
            <!-- Displays all the action that the user can do -->
            <div id="UserActionBar" class="action-bar"></div>
        </header>
        <div class="main">
            <!-- File upload form -->
            <div class="form-container">
                <div class="form">
                    <h1>File upload</h1>
                    <label id="FileUploadLabel" for="UploadedFile" class="custom-file-upload" value="0">Upload a file</label>
                    <input id="UploadedFile" type="file" accept="image/*, audio/*"><br>
                    <div id="DisplayFile"></div><br>
                    <input id="FileDisplayName" placeholder="Display name"><br>
                    <textarea id="FileDescription" placeholder="Description"></textarea>
                </div>
            </div>
            <!-- Error output -->
            <p id="ErrorText" class="error-text"></p>
        </div>
        <footer>Page: file upload<br></footer>
    </div>
</body>
</html>