35 lines
1.2 KiB
Text
35 lines
1.2 KiB
Text
% stash("pooru.search" => 1);
|
|
|
|
<%= form_for "list_media" =>
|
|
name => "search",
|
|
class => "layout-flex-row suggestions" =>
|
|
begin %>
|
|
<div class="layout-flex-item-fullsize position-relative"
|
|
x-data="tagsSuggestions('<%= param "tags" %>')"
|
|
@click.outside="open = false">
|
|
<input name="tags" value="<%= param "tags" %>" placeholder="Search tags..."
|
|
x-ref="search"
|
|
x-model="search"
|
|
@focus="fetchSuggestionsOnFocus"
|
|
@input.debounce="fetchSuggestionsOnInput"
|
|
@keydown.tab="autocompleteItem"
|
|
@keydown.enter="autocompleteItem"
|
|
@keydown.up.prevent="previousItem"
|
|
@keydown.down.prevent="nextItem"
|
|
@keydown.escape="open = false">
|
|
<ul
|
|
x-ref="suggestions"
|
|
x-cloak x-show="open && items.length > 0">
|
|
<template x-for="(item, index) in sortedItems" :key="item.display">
|
|
<li
|
|
:class="index === activeItem ? 'suggestion-hover' : ''"
|
|
@click="autocompletePointedItem"
|
|
@mouseenter="setHoveredItem">
|
|
<span x-text="item.display" :class="item.kind_class"></span>
|
|
<span class="float-right" x-text="item.count"></span>
|
|
</li>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
<%= submit_button "Search" %>
|
|
<% end %>
|