| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126 |
- <!DOCTYPE html>
- <html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout/layout}">
- <head>
- <title>Advanced Search</title>
- <script src="/js/search/index.js" defer></script>
- </head>
- <body>
- <div layout:fragment="content" class="ui container" id="app">
- <br />
- <h2 class="ui dividing header">Advanced Search</h2>
- <div class="ui two column internally celled stackable grid">
- <div class="twelve wide column">
- <div v-if="searched && searchResult.content.length == 0" class="ui message">
- No results found.
- </div>
- <br />
- <div v-if="searchResult.content != null && searchResult.content.length > 0">
- <div v-for="asset in searchResult.content" class="ui segments">
- <div class="ui inverted segment">
- <a :href="'/' + asset.id">
- <span class="ui large text">{{ asset.details.title }}</span>
- </a>
- <span class="ui star rating small disabled" style="position: absolute; top: 40%; right: 1%;">
- <i class="yellow star icon" v-for="index in asset.rating.averageRating"></i>
- <i class="grey star icon" v-for="index in (5 - asset.rating.averageRating)"></i>
- </span>
- </div>
- <div class="ui secondary segment" style="min-height: 110px;">
- <img class="ui small left floated image" :src="'/image/' + asset.mediaLinks.imageIds.split(',')[0]" />
- <span>by {{ asset.owner.username }}</span>
- <div>
- {{ asset.details.shortDescription }}
- </div>
- </div>
- <div class="ui bottom segment">
- <!-- Tags -->
- <div class="ui black labels" v-if="asset.details.tags.length > 0">
- <a class="ui label" :href="'/search/?tag=' + encodeURI(tag)" v-for="tag in asset.details.tags.split(',')">
- {{ tag }}
- </a>
- </div>
- <span v-if="asset.details.tags.length == 0" class="ui label">No Tags Specified</span>
- <!-- END: Tags -->
- </div>
- </div>
- </div>
- </div>
- <div class="four wide column">
- <div class="ui form">
- <div class="field">
- <div class="ui selection dropdown tooltip" id="categoriesDropdown" data-content="Category">
- <input type="hidden" v-model="search.categoryId" />
- <i class="dropdown icon"></i>
- <div class="default text">All</div>
- <div class="menu">
- <div class="item" data-value="-1">All</div>
- <div class="item" th:if="${category.parent != null}" th:each="category : ${categories}" th:data-value="${category.id}" th:text="${category.parent.name + ' > ' + category.name}" th:value="${category.name}"></div>
- </div>
- </div>
- </div>
- <div class="field">
- <div class="ui fluid input tooltip" data-content="Title">
- <input type="text" placeholder="title" v-model="search.title" />
- </div>
- </div>
- <div class="field">
- <div class="ui fluid input tooltip" data-content="tag">
- <input type="text" placeholder="tag" v-model="search.tag" />
- </div>
- </div>
- <div class="field">
- <div class="ui fluid input tooltip" data-content="author">
- <input type="text" placeholder="author" v-model="search.author" />
- </div>
- </div>
- <div class="field">
- <div class="ui selection dropdown tooltip" id="orderByDropdown" data-content="Order By">
- <input type="hidden" value="search.orderBy" />
- <i class="dropdown icon"></i>
- <div class="default text">Newest</div>
- <div class="menu">
- <div class="item" data-value="title">Title</div>
- <div class="item" data-value="created">Creation Date</div>
- <div class="item" data-value="updated">Last Updated</div>
- <div class="item" data-value="rating">Rating</div>
- </div>
- </div>
- </div>
- <div class="field">
- <div class="ui selection dropdown tooltip" id="directionDropdown" data-content="Direction">
- <input type="hidden" v-model="search.direction" />
- <i class="dropdown icon"></i>
- <div class="default text">Descending</div>
- <div class="menu">
- <div class="item" data-value="descending">Descending</div>
- <div class="item" data-value="ascending">Ascending</div>
- </div>
- </div>
- </div>
- </div>
- <br />
- <div @click="beginSearch()" id="searchButton" class="ui button">Search</div>
- </div>
- </div>
- <br /><br />
- </div>
- </body>
- </html>
|