source: src/main/resources/templates/homepage.html

Last change on this file was f29cd58, checked in by gjoko kostadinov <gjokokostadinov@…>, 6 months ago

Add services search functionality.
  • Property mode set to 100755
File size: 6.3 KB
Line 
1<!DOCTYPE html>
2<html>
3<head>
4 <title>Homepage</title>
5
6 <meta charset="utf-8"/>
7 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
8
9 <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"/>
10 <!-- Google Fonts -->
11 <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet"/>
12 <!-- MDB -->
13 <link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/5.0.0/mdb.min.css" rel="stylesheet"/>
14
15 <link href='css/fullcalendar.css' rel='stylesheet'/>
16 <link href='css/fullcalendar.print.css' rel='stylesheet' media='print'/>
17 <link href="css/homepage.css" rel="stylesheet"/>
18 <link href="css/headers.css" rel="stylesheet"/>
19</head>
20<body>
21
22<!-- Navbar start -->
23<header class="p-3 mb-3 border-bottom">
24 <div class="row" style="justify-content: space-between;">
25 <div class="col-md-4 mb-4">
26 Welcome to the Schedlr
27 </div>
28 <div class="col-md-3 mb-3">
29 <input class="form-control mr-sm-2" id="search-input" type="search" placeholder="Search" aria-label="Find services">
30 </div>
31
32 <div class="col-md-1 mb-1">
33 <button id="search" class="btn btn-primary btn-block" onclick="searchServices()">
34 Search
35 </button>
36 </div>
37 <div class="col-md-2 mb-2">
38 <button id="profile" class="btn btn-primary btn-block" onclick="goToProfile()">
39 Profile
40 </button>
41 </div>
42 <div class="col-md-2 mb-2">
43 <button id="logout" class="btn btn-primary btn-block">
44 Logout
45 </button>
46 </div>
47 <div class="col-md-2 mb-2">
48 <button id="login" class="btn btn-primary btn-block">
49 Login
50 </button>
51 </div>
52 </div>
53</header>
54<!-- Navbar end -->
55<div class="container">
56 <div id='body-after-search' style="display:none;">
57 <div id='wrap'>
58 <div id='calendar'></div>
59 <div style='clear:both'></div>
60 </div>
61 <div class="card">
62 <div class="form-outline mb-4">
63 <input id="company" disabled class="form-control" placeholder="company"
64 aria-label="company"/>
65 </div>
66 <div class="form-outline mb-4">
67 <input id="service" disabled class="form-control" placeholder="service"
68 aria-label="service"/>
69 </div>
70 <div class="form-outline mb-4">
71 <label for="startdatetime">Start:</label>
72 <input type="datetime-local" id="startdatetime" name="startdatetime" style="float:right;">
73 </div>
74 <div class="form-outline mb-4">
75 <label for="enddatetime">End:</label>
76 <input type="datetime-local" id="enddatetime" name="enddatetime" style="float:right;">
77 </div>
78 <div class="form-outline mb-4">
79 <button id="createAppointment" class="btn btn-primary btn-block">
80 Create Appointment
81 </button>
82 </div>
83 </div>
84 <div class="card form-outline mb-4" style="margin-top:30px;">
85 <ul class="list-group list-group-flush" id="reviews-ul">
86 <li class="list-group-item"><b>service name: </b><span id="rating-service-name"></span></li>
87 <li class="list-group-item"><b>rating </b><span id="rating-value"></span></li>
88 <li class="list-group-item" style="margin-bottom:10px;"><b>reviews count </b><span
89 id="rating-count"></span></li>
90 <li class="list-group-item" id="reviews-li"><a href="#/reviews_page">Checkout reviews</a></li>
91 </ul>
92 </div>
93
94 </div>
95 <div id="welcome-message" class="welcome_message">
96 <div class="card text-center">
97 <div class="card-body">
98 <h1 class="card-title">
99 Welcome to Schedlr, please you the search bar to find the services you want.
100 </h1>
101 </div>
102 </div>
103 </div>
104 <div class="modal fade" id="showReviewsModal" tabindex="-1" aria-labelledby="showReviewsModalLabel"
105 aria-hidden="true">
106 <div class="modal-dialog modal-xl modal-dialog-scrollable modal-dialog-centered">
107 <div class="modal-content">
108 <div class="modal-header">
109 <h1>Reviews</h1>
110 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
111 </div>
112 <div class="modal-body form-outline col-lg-12 row" id="reviewsModalBody"
113 style="--mdb-gutter-x: 0 !important; background-color: #f0f0f0 !important;">
114 </div>
115 <div class="modal-footer">
116 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
117 </div>
118 </div>
119 </div>
120 </div>
121 <div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="showSearchResultsModalLabel" aria-hidden="true">
122 <div class="modal-dialog modal-xl modal-dialog-scrollable modal-dialog-centered">
123 <div class="modal-content">
124 <div class="modal-header">
125 <h1>Search results</h1>
126 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
127 </div>
128 <div class="modal-body form-outline col-lg-12 row" id="searchResultsModalBody"
129 style="--mdb-gutter-x: 0 !important; background-color: #f0f0f0 !important;">
130 </div>
131 <div class="modal-footer">
132 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
133 </div>
134 </div>
135 </div>
136
137 </div>
138</div>
139<script src='js/jquery-1.10.2.js' type="text/javascript"></script>
140<script src='js/jquery-ui.custom.min.js' type="text/javascript"></script>
141<script src='js/fullcalendar.js' type="text/javascript"></script>
142<script src="js/homepage.js" type="text/javascript"></script>
143<script src="js/bootstrap.bundle.min.js"></script>
144<script src="js/logout.js" type="text/javascript"></script>
145</body>
146</html>
Note: See TracBrowser for help on using the repository browser.