#87 - Cleanup view template.
This commit is contained in:
Oliver Gierke
@@ -1,24 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title>Starbucks Storefinder</title>
|
||||
|
||||
<title>Starbucks Storefinder</title>
|
||||
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<link rel="stylesheet" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}"/>
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
#map {
|
||||
height: 400px;
|
||||
width: 400px;
|
||||
background-image: url("/img/map.png");
|
||||
background-size: 400px 300px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
</style>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<link rel="stylesheet"
|
||||
th:href="@{/webjars/bootstrap/css/bootstrap.min.css}" />
|
||||
|
||||
<style type="text/css">
|
||||
#map {
|
||||
height: 400px;
|
||||
width: 400px;
|
||||
background-image: url("/img/map.png");
|
||||
background-size: 400px 300px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -27,88 +26,97 @@
|
||||
|
||||
<h1>Starbucks Storefinder</h1>
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">Search</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<h3 class="panel-title">Search</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
|
||||
<form action="/" class="form-horizontal">
|
||||
<form action="/" class="form-horizontal">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label">Predefined locations:</label>
|
||||
<div class="col-sm-10">
|
||||
<a class="btn btn-default" th:each="location : ${locations}" th:href="@{/(location=${{location.value}},distance=${{selectedDistance}})}" th:text="${location.key}">Foo</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label">Predefined
|
||||
locations:</label>
|
||||
<div class="col-sm-10">
|
||||
<a class="btn btn-default" th:each="location : ${locations}"
|
||||
th:href="@{/(location=${{location.value}},distance=${{selectedDistance}})}"
|
||||
th:text="${location.key}">Foo</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="location" class="col-sm-2 control-label">Location:</label>
|
||||
<div class="col-sm-2">
|
||||
<input id="location" name="location" th:value="${{location}}" type="text" class="form-control" placeholder="lat,long" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="location" class="col-sm-2 control-label">Location:</label>
|
||||
<div class="col-sm-2">
|
||||
<input id="location" name="location" th:value="${{location}}"
|
||||
type="text" class="form-control" placeholder="lat,long" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="distance" class="col-sm-2 control-label">Distance:</label>
|
||||
<div class="col-sm-2">
|
||||
<select id="distance" name="distance" class="form-control">
|
||||
<option th:each="distance : ${distances}" th:value="${{distance}}" th:text="${distance}" th:selected="${distance == selectedDistance}">
|
||||
Distance
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="distance" class="col-sm-2 control-label">Distance:</label>
|
||||
<div class="col-sm-2">
|
||||
<select id="distance" name="distance" class="form-control">
|
||||
<option th:each="distance : ${distances}"
|
||||
th:value="${{distance}}" th:text="${distance}"
|
||||
th:selected="${distance == selectedDistance}">
|
||||
Distance</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<button id="submit" type="submit" class="btn btn-default">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<button id="submit" type="submit" class="btn btn-default">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel panel-default">
|
||||
|
||||
<div id="resultList" class="panel-heading">
|
||||
<h3 class="panel-title">Results</h3>
|
||||
</div>
|
||||
<h3 class="panel-title">Results</h3>
|
||||
</div>
|
||||
|
||||
<div class="panel-body">
|
||||
<div class="panel-body">
|
||||
|
||||
<div id="map" class="col-md-4" th:attr="data-uri=${api}"></div>
|
||||
<div id="map" class="col-md-4" th:attr="data-uri=${api}"></div>
|
||||
|
||||
<div class="col-sm-8" style="margin-left: 1em">
|
||||
<div th:if="${stores.hasContent()}">
|
||||
<p th:text="'Showing ' + ${stores.numberOfElements} + ' of ' + ${stores.totalElements} + ' results.'">Found 1 results.</p>
|
||||
<ol class="search-results">
|
||||
<li class="search-result" th:each="store : ${stores}" th:text="${store.name} + ' - ' + ${store.address}">Store name</li>
|
||||
</ol>
|
||||
</div>
|
||||
<p class="search-result no-results" th:unless="${stores.hasContent()}">No Results</p>
|
||||
</div>
|
||||
<div class="col-sm-8" style="margin-left: 1em">
|
||||
<div th:if="${stores.hasContent()}">
|
||||
<p
|
||||
th:text="'Showing ' + ${stores.numberOfElements} + ' of ' + ${stores.totalElements} + ' results.'">Found
|
||||
1 results.</p>
|
||||
<ol class="search-results">
|
||||
<li class="search-result" th:each="store : ${stores}"
|
||||
th:text="${store.name} + ' - ' + ${store.address}">Store
|
||||
name</li>
|
||||
</ol>
|
||||
</div>
|
||||
<p class="search-result no-results"
|
||||
th:unless="${stores.hasContent()}">No Results</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript"
|
||||
th:src="@{/webjars/jquery/jquery.min.js}"></script>
|
||||
<script type="text/javascript"
|
||||
th:src="@{/webjars/jquery/jquery.min.js}"></script>
|
||||
|
||||
<script type="text/javascript"
|
||||
th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
|
||||
<script type="text/javascript"
|
||||
th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
|
||||
|
||||
<script type="text/javascript"
|
||||
th:src="@{/webjars/URI.js/URI.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/webjars/URI.js/URI.min.js}"></script>
|
||||
|
||||
<script type="text/javascript"
|
||||
src="//maps.google.com/maps/api/js?sensor=false"></script>
|
||||
<script type="text/javascript"
|
||||
src="//maps.google.com/maps/api/js?sensor=false"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
<script type="text/javascript">
|
||||
(function () {
|
||||
"use strict";
|
||||
|
||||
|
||||
Reference in New Issue
Block a user