Untitled

<!DOCTYPE html>
<html>
<head>
    <title>Prodavachnik</title>
    <script src="scripts/prodavachnik.js"></script>
    <script src="scripts/jquery-3.1.1.min.js"></script>
    <link rel="stylesheet" type="text/css" href="styles/prodavachnik.css" />
    <link href="https://fonts.googleapis.com/css?family=Lato|Open+Sans" rel="stylesheet">
</head>

<body onload="startApp()">
<header id="menu" class="menu">
    <a href="#" id="linkHome" class="menu-item" >Home</a>
    <a href="#" id="linkLogin" class="menu-item">Login</a>
    <a href="#" id="linkRegister" class="menu-item">Register</a>
    <a href="#" id="linkListAds" class="menu-item">List Advertisements</a>
    <a href="#" id="linkCreateAd" class="menu-item">Create Advertisement</a>
    <a href="#" id="linkLogout" class="menu-item">Logout</a>
    <span id="loggedInUser" class="menu-item">m ara ba</span>
    <div></div>
</header>

<main>
    <section id="loadingBox" class="loadingBox">Loading ...</section>

    <section id="infoBox" class="infoBox">Info</section>

    <section id="errorBox" class="errorBox">Error</section>

    <section id="viewHome" class="viewHome">
        <h1 class="title">Welcome</h1>
        <p class="body-text">Welcome to our advertisement site.</p>
    </section>

    <section id="viewLogin" class="viewLogin">
        <h1 class="titleForm">Please login</h1>
        <form id="formLogin" class="form">
            <div>Username:</div>
            <div><input type="text" name="username" required /></div>
            <div>Password:</div>
            <div><input type="password" name="passwd" required /></div>
            <div><input type="submit" id="buttonLoginUser" value="Login" /></div>
        </form>
    </section>

    <section id="viewRegister" class="viewRegister">
        <h1 class="titleForm">Please register here</h1>
        <form id="formRegister" class="form">
            <div>Username:</div>
            <div><input type="text" name="username" required /></div>
            <div>Password:</div>
            <div><input type="password" name="passwd" required /></div>
            <div><input type="submit" id="buttonRegisterUser" value="Register" /></div>
        </form>
    </section>

    <section id="viewAds" class="viewAds">
        <h1 class="titleForm">Advertisements</h1>
        <div id="ads" class="ads">
            <table>
                <tr>
                    <th>Title</th>
                    <th>Publisher</th>
                    <th>Description</th>
                    <th>Price</th>
                    <th>Date Published</th>
                </tr>
                <tr>
                    <td>Ad title</td>
                    <td>Ad author</td>
                    <td>Ad description</td>
                    <td>Price</td>
                    <td>Date published</td>
                    <td>
                        <a href="#">[Delete]</a>
                        <a href="#">[Edit]</a>
                    </td>
                </tr>
            </table>
        </div>
    </section>

    <section id="viewCreateAd" class="viewCreateAd">
        <h1 class="titleForm">Create new Advertisement</h1>
        <form id="formCreateAd" class="form">
            <div>Title:</div>
            <div><input type="text" name="title" required /></div>
            <div>Description:</div>
            <div><textarea name="description" rows="10" required></textarea></div>
            <div>Date Published:</div>
            <div><input type="date" name="datePublished" required /></div>
            <div>Price:</div>
            <div><input type="number" step="0.01" name="price" required /></div>
            <div><input type="button" id="buttonCreateAd" value="Create" /></div>
        </form>
    </section>

    <section id="viewEditAd" class="viewEditAd">
        <h1 class="titleForm">Edit existing advertisement</h1>
        <form id="formEditAd" class="form">
            <div><input type="hidden" name="id" required /></div>
            <div><input type="hidden" name="publisher" required /></div>
            <div>Title:</div>
            <div><input type="text" name="title" required /></div>
            <div>Description:</div>
            <div><textarea name="description" rows="10" required></textarea></div>
            <div>Date Published:</div>
            <div><input type="date" name="datePublished" required /></div>
            <div>Price:</div>
            <div><input type="number" step="0.01" name="price" required /></div>
            <div><input type="button" id="buttonEditAd" value="Edit" /></div>
        </form>
    </section>
    <script>
        startApp();
    </script>
</main>
<footer>Prodavachnik - Simple SPA Application</footer>
</body>
</html>