Changeset 2b0a4db


Ignore:
Timestamp:
02/08/23 20:42:53 (22 months ago)
Author:
Gjoko Kostadinov <gjoko.kostadinov@…>
Branches:
master
Children:
46fd0c7
Parents:
a436340
Message:

Fix page layout and js bugs.

Location:
src/main/resources
Files:
2 deleted
4 edited

Legend:

Unmodified
Added
Removed

  • src/main/resources/data.sql

    ra436340 r2b0a4db  
    77insert into business_type (id, created, modified, name)
    88values (1, current_timestamp, current_timestamp, 'tailor'),
    9        (2, current_timestamp, current_timestamp, 'nail salon'),
    10        (3, current_timestamp, current_timestamp, 'massage parlor'),
    11        (4, current_timestamp, current_timestamp, 'makeup studio'),
     9       (2, current_timestamp, current_timestamp, 'nail technician'),
     10       (3, current_timestamp, current_timestamp, 'masseuse'),
     11       (4, current_timestamp, current_timestamp, 'makeup artist'),
    1212       (5, current_timestamp, current_timestamp, 'hairdresser'),
    1313       (6, current_timestamp, current_timestamp, 'barber');

  • src/main/resources/static/js/register_business.js

    ra436340 r2b0a4db  
    99
    1010        $.each(data, function(index, obj) {
    11             $el.append($("<option></option>")
    12                 .attr("value", obj.value).text(obj.text));
     11            $el.append("<option value=" + obj.value + ">" + obj.text + "</option>");
    1312        });
    1413    });
    … …  
    1615    $("#companyType").change(function() {
    1716        var selectedVal = $(this).find(':selected').val();
    18         var selectedText = $(this).find(':selected').text();
    1917        alert(JSON.stringify(enumerations[selectedVal-1]));
     18        var selectedObj = enumerations[selectedVal-1];
     19        var $el = $("#predefined_services");
     20        $el.empty();
     21        $.each(selectedObj['serviceTypes'], function (index, obj) {
     22            $el.append(
     23                '<div class="form-check">\n' +
     24                '    <input class="form-check-input" type="checkbox" value=\"' + obj.id + '\" id=\"'+ obj.id +'\">\n' +
     25                '        <label class="form-check-label" for=\"' + obj.id + '\">\n' +
     26                              obj.name +
     27                '         </label>\n' +
     28                '    </div>')
     29        });
    2030    })
    2131});
    22 
    23 document.addEventListener('DOMContentLoaded', e => {
    24     $('#input-prefetch').autocomplete()
    25 }, false);

  • src/main/resources/templates/homepage.html

    ra436340 r2b0a4db  
    77    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    88
    9     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet" />
     9    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"/>
    1010    <!-- Google Fonts -->
    11     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
     11    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet"/>
    1212    <!-- MDB -->
    13     <link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/5.0.0/mdb.min.css" rel="stylesheet" />
     13    <link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/5.0.0/mdb.min.css" rel="stylesheet"/>
    1414
    1515    <link href='css/fullcalendar.css' rel='stylesheet'/>
    1616    <link href='css/fullcalendar.print.css' rel='stylesheet' media='print'/>
    17     <link href="css/homepage.css" rel="stylesheet" />
     17    <link href="css/homepage.css" rel="stylesheet"/>
    1818    <link href="css/headers.css" rel="stylesheet">
    1919</head>
    … …  
    2525        <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
    2626            <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 text-dark text-decoration-none">
    27                 <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"/></svg>
     27                <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap">
     28                    <use xlink:href="#bootstrap"/>
     29                </svg>
    2830            </a>
    2931
    … …  
    4042
    4143            <div class="dropdown text-end">
    42                 <a href="#" class="d-block link-dark text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
     44                <a href="#" class="d-block link-dark text-decoration-none dropdown-toggle" data-bs-toggle="dropdown"
     45                   aria-expanded="false">
    4346                    <img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
    4447                </a>
    … …  
    4750                    <li><a class="dropdown-item" href="#">Settings</a></li>
    4851                    <li><a class="dropdown-item" href="#">Profile</a></li>
    49                     <li><hr class="dropdown-divider"></li>
     52                    <li>
     53                        <hr class="dropdown-divider">
     54                    </li>
    5055                    <li><a class="dropdown-item" href="#">Sign out</a></li>
    5156                </ul>
    … …  
    6469    <div class="card">
    6570        <div class="card-body py-5 px-md-5">
    66                 <div>
    67                     <label for="student-birth-date">Date of search:</label>
    68                     <input type="date" id="student-birth-date"/>
    69                 </div>
    70                 <div>
    71                     <button type="submit" class="button" id="search">Search</button>
    72                 </div>
     71            <div>
     72                <label for="student-birth-date">Date of search:</label>
     73                <input type="date" id="student-birth-date"/>
     74            </div>
     75            <div>
     76                <button type="submit" class="button" id="search">Search</button>
     77            </div>
    7378        </div>
    7479    </div>

  • src/main/resources/templates/register_business.html

    ra436340 r2b0a4db  
    55    <title>Schedlr</title>
    66
    7     <!-- Font Awesome -->
    8     <link
    9             href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
    10             rel="stylesheet"
    11     />
    12     <!-- Google Fonts -->
    13     <link
    14             href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
    15             rel="stylesheet"
    16     />
    17     <!-- MDB -->
    18     <link
    19             href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/5.0.0/mdb.min.css"
    20             rel="stylesheet"
    21     />
     7    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"
     8          integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
     9
    2210    <link rel="stylesheet" href="css/login.css">
    2311
    … …  
    2917            <div class="col-lg-6 mb-5 mb-lg-0">
    3018                <h1 class="my-5 display-3 fw-bold ls-tight">
    31                     Register as  <br />
     19                    Register as <br/>
    3220                    <span class="text-primary">a business</span>
    3321                </h1>
    … …  
    4937                                <div class="col-md-6 mb-4">
    5038                                    <div class="form-outline">
    51                                         <input type="text" id="firstName" class="form-control" />
    52                                         <label class="form-label" for="firstName">First name</label>
     39                                        <input type="text" id="firstName" class="form-control" placeholder="Username"
     40                                               aria-label="Username"/>
    5341                                    </div>
    5442                                </div>
    5543                                <div class="col-md-6 mb-4">
    5644                                    <div class="form-outline">
    57                                         <input type="text" id="lastName" class="form-control" />
    58                                         <label class="form-label" for="lastName">Last name</label>
     45                                        <input type="text" id="lastName" class="form-control" placeholder="Last name"
     46                                               aria-label="lastname"/>
    5947                                    </div>
    6048                                </div>
    … …  
    6351                            <!-- Email input -->
    6452                            <div class="form-outline mb-4">
    65                                 <input type="email" id="email" class="form-control" />
    66                                 <label class="form-label" for="email">Email address</label>
     53                                <input type="email" id="email" class="form-control" placeholder="Email"
     54                                       aria-label="Email"/>
    6755                            </div>
    6856
    6957                            <!-- Email input -->
    7058                            <div class="form-outline mb-4">
    71                                 <input type="email" id="username" class="form-control" />
    72                                 <label class="form-label" for="username">Username</label>
     59                                <input type="text" id="username" class="form-control" placeholder="Username"
     60                                       aria-label="username"/>
    7361                            </div>
    7462
    7563                            <!-- Password input -->
    7664                            <div class="form-outline mb-4">
    77                                 <input type="password" id="password" class="form-control" />
    78                                 <label class="form-label" for="password">Password</label>
     65                                <input type="password" id="password" class="form-control" placeholder="Password"
     66                                       aria-label="password"/>
    7967                            </div>
    8068
    … …  
    8472
    8573                            <div class="form-outline mb-4">
    86                                 <input type="email" id="companyName" class="form-control" />
    87                                 <label class="form-label" for="companyName">Company Name</label>
     74                                <input type="email" id="companyName" class="form-control" placeholder="Company Name"
     75                                       aria-label="companyName"/>
    8876                            </div>
    8977
    9078                            <div class="form-outline mb-4">
    91                                 <select class="form-select" id="companyType">
    92                                     <option value="" disabled selected hidden>Company Type</option>
     79                                <select class="form-select" id="companyType" aria-label="Default select example">
     80                                    <option disabled selected hidden>Company Type</option>
    9381                                </select>
    9482                            </div>
    9583
    96                             <div class="form-group form-outline mb-4">
    97                                 <label for="services">Services</label>
    98                                 <input type="text" class="form-control" placeholder="Services" list="list-timezone" id="services">
    99                                 <datalist id="list-timezone">
    100                                 </datalist>
     84                            <div class="text-center">
     85                                <p>Select from the predefined services or add a new one</p>
     86                            </div>
     87
     88                            <div class="row">
     89                                <div class="form-outline col-md-10">
     90                                    <div class="form-outline">
     91                                        <input type="text" id="services" class="form-control" placeholder="Services"
     92                                               aria-label="services"/>
     93                                    </div>
     94                                </div>
     95                                <div class="form-outline col-md-2 d-grid">
     96                                    <button class="btn btn-primary" id="add_service">Add</button>
     97                                </div>
     98                            </div>
     99
     100
     101                            <div id="predefined_services" class="form-outline mb-4">
    101102                            </div>
    102103
    … …  
    113114    </div>
    114115</div>
    115 <script src='js/jquery-1.10.2.js' type="text/javascript"></script>
    116 <script
    117         type="text/javascript"
    118         src="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/5.0.0/mdb.min.js"
    119 ></script>
     116<!-- jQuery library -->
     117<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
     118        integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4"
     119        crossorigin="anonymous"></script>
     120<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"
     121        integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3"
     122        crossorigin="anonymous"></script>
     123<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
    120124<script src="js/register_business.js" type="text/javascript"></script>
    121 <script src="js/bootstrap-autocomplete.min.js"></script>
    122125</body>
    123126</html>
Note: See TracChangeset for help on using the changeset viewer.