mirror of
https://github.com/morpheus65535/bazarr
synced 2025-02-24 06:50:51 +00:00
Added search bar functionality.
This commit is contained in:
parent
43a60eca07
commit
034c8abfc0
6 changed files with 698 additions and 33 deletions
|
@ -10,8 +10,7 @@ import time
|
|||
from operator import itemgetter
|
||||
import platform
|
||||
import io
|
||||
from calendar import day_name
|
||||
import importlib
|
||||
import re
|
||||
|
||||
from get_args import args
|
||||
from config import settings, base_url, save_settings
|
||||
|
@ -35,7 +34,7 @@ from scheduler import Scheduler
|
|||
|
||||
from subliminal_patch.core import SUBTITLE_EXTENSIONS
|
||||
|
||||
from flask import Flask, jsonify, request, Response, Blueprint
|
||||
from flask import Flask, jsonify, request, Response, Blueprint, url_for
|
||||
|
||||
from flask_restful import Resource, Api
|
||||
|
||||
|
@ -67,6 +66,31 @@ class Languages(Resource):
|
|||
return jsonify(result)
|
||||
|
||||
|
||||
class Search(Resource):
|
||||
def get(self):
|
||||
query = request.args.get('query')
|
||||
search_list = []
|
||||
|
||||
if query:
|
||||
if settings.general.getboolean('use_sonarr'):
|
||||
# Get matching series
|
||||
series = database.execute("SELECT title, sonarrSeriesId, year FROM table_shows WHERE title LIKE ? "
|
||||
"ORDER BY title ASC", ("%"+query+"%",))
|
||||
for serie in series:
|
||||
search_list.append({'name': re.sub(r'\ \(\d{4}\)', '', serie['title']) + ' (' + serie['year'] + ')',
|
||||
'url': url_for('episodes', no=serie['sonarrSeriesId'])})
|
||||
|
||||
if settings.general.getboolean('use_radarr'):
|
||||
# Get matching movies
|
||||
movies = database.execute("SELECT title, radarrId, year FROM table_movies WHERE title LIKE ? ORDER BY "
|
||||
"title ASC", ("%"+query+"%",))
|
||||
for movie in movies:
|
||||
search_list.append({'name': re.sub(r'\ \(\d{4}\)', '', movie['title']) + ' (' + movie['year'] + ')',
|
||||
'url': url_for('movie', no=movie['radarrId'])})
|
||||
|
||||
return jsonify(search_list)
|
||||
|
||||
|
||||
class SaveSettings(Resource):
|
||||
def post(self):
|
||||
save_settings(request.form.items())
|
||||
|
@ -1144,6 +1168,8 @@ class SearchWantedMovies(Resource):
|
|||
api.add_resource(Badges, '/badges')
|
||||
api.add_resource(Languages, '/languages')
|
||||
|
||||
api.add_resource(Search, '/search_json')
|
||||
|
||||
api.add_resource(SaveSettings, '/savesettings')
|
||||
|
||||
api.add_resource(SystemTasks, '/systemtasks')
|
||||
|
|
|
@ -511,34 +511,6 @@ def serieseditor():
|
|||
return render_template('serieseditor.html')
|
||||
|
||||
|
||||
@app.route('/search_json/<query>', methods=['GET'])
|
||||
@login_required
|
||||
def search_json(query):
|
||||
|
||||
|
||||
query = '%' + query + '%'
|
||||
search_list = []
|
||||
|
||||
if settings.general.getboolean('use_sonarr'):
|
||||
# Get matching series
|
||||
series = database.execute("SELECT title, sonarrSeriesId, year FROM table_shows WHERE title LIKE ? ORDER BY "
|
||||
"title ASC", (query,))
|
||||
for serie in series:
|
||||
search_list.append(dict([('name', re.sub(r'\ \(\d{4}\)', '', serie['title']) + ' (' + serie['year'] + ')'),
|
||||
('url', '/episodes/' + str(serie['sonarrSeriesId']))]))
|
||||
|
||||
if settings.general.getboolean('use_radarr'):
|
||||
# Get matching movies
|
||||
movies = database.execute("SELECT title, radarrId, year FROM table_movies WHERE title LIKE ? ORDER BY "
|
||||
"title ASC", (query,))
|
||||
for movie in movies:
|
||||
search_list.append(dict([('name', re.sub(r'\ \(\d{4}\)', '', movie['title']) + ' (' + movie['year'] + ')'),
|
||||
('url', '/movie/' + str(movie['radarrId']))]))
|
||||
|
||||
request.content_type = 'application/json'
|
||||
return dict(items=search_list)
|
||||
|
||||
|
||||
@app.route('/episodes/<no>')
|
||||
@login_required
|
||||
def episodes(no):
|
||||
|
|
1
static/css/jquery.typeahead.min.css
vendored
Normal file
1
static/css/jquery.typeahead.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
620
static/css/jquery.typeahead.scss
Normal file
620
static/css/jquery.typeahead.scss
Normal file
|
@ -0,0 +1,620 @@
|
|||
// FORM RESETS ----------------- https://github.com/necolas/normalize.css/ ---------------------------------------------
|
||||
|
||||
.typeahead__container {
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font: inherit; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the font weight unset by the previous rule.
|
||||
*/
|
||||
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||
* controls in Android 4.
|
||||
* 2. Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
html [type="button"], /* 1 */
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Change the border, margin, and padding in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10-.
|
||||
* 2. Remove the padding in IE 10-.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
/**
|
||||
* Correct the text style of placeholders in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.54;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
}
|
||||
|
||||
// VARIABLES -----------------------------------------------------------------------------------------------------------
|
||||
|
||||
$typeahead-font-size: 1rem !default;
|
||||
$typeahead-line-height: 1.25 !default;
|
||||
$typeahead-font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif !default;
|
||||
$typeahead-primary-color: #66afe9 !default;
|
||||
$typeahead-cancel-color: #d0021b !default;
|
||||
$typeahead-radius: 2px !default;
|
||||
$typeahead-shadow: false !default; // true / false
|
||||
$typeahead-dropdown-spacing: 5px !default;
|
||||
$typeahead-outline-color: $typeahead-primary-color !default;
|
||||
$typeahead-loading-size: 1.35rem !default;
|
||||
|
||||
$typeahead-padding-y: 0.5rem !default;
|
||||
$typeahead-padding-x: 0.75rem !default;
|
||||
|
||||
$typeahead-color: #555 !default;
|
||||
$typeahead-border-color: #ccc !default;
|
||||
|
||||
$typeahead-group-color: darken($typeahead-primary-color, 30%) !default;
|
||||
$typeahead-group-background: lighten($typeahead-primary-color, 30%) !default;
|
||||
$typeahead-group-border-color: lighten($typeahead-primary-color, 20%) !default;
|
||||
|
||||
$typeahead-item-color: #333 !default;
|
||||
$typeahead-item-background: #fff !default;
|
||||
$typeahead-item-hover-background: #f5f5f5 !default;
|
||||
$typeahead-item-disabled-color: #bababa !default;
|
||||
$typeahead-item-disabled-background: #fafafa !default;
|
||||
|
||||
$typeahead-label-color: #3a99fc !default;
|
||||
$typeahead-label-font-size: calc(#{$typeahead-font-size} * 0.875) !default;
|
||||
$typeahead-label-border-color: #c2e0ff !default;
|
||||
$typeahead-label-background: lighten($typeahead-primary-color, 30%) !default;
|
||||
|
||||
// TYPEAHEAD -----------------------------------------------------------------------------------------------------------
|
||||
|
||||
.typeahead__ {
|
||||
&container {
|
||||
position: relative;
|
||||
font: $typeahead-font-size $typeahead-font-family;
|
||||
}
|
||||
|
||||
&container * {
|
||||
box-sizing: border-box;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
&query {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&filter {
|
||||
position: relative;
|
||||
button {
|
||||
min-width: 100%;
|
||||
white-space: nowrap;
|
||||
&:after {
|
||||
display: inline-block;
|
||||
margin-left: 4px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
vertical-align: -2px;
|
||||
content: "";
|
||||
border: 4px solid;
|
||||
border-right-color: transparent;
|
||||
border-bottom-color: transparent;
|
||||
border-left-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&field {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&button button {
|
||||
border-top-right-radius: $typeahead-radius;
|
||||
border-bottom-right-radius: $typeahead-radius;
|
||||
}
|
||||
|
||||
&field {
|
||||
// #193 If applied to input, it overrides the placeholder color on IE10/11
|
||||
color: $typeahead-color;
|
||||
input,
|
||||
textarea,
|
||||
[contenteditable],
|
||||
.typeahead__hint {
|
||||
display: block;
|
||||
width: 100%;
|
||||
line-height: $typeahead-line-height;
|
||||
min-height: calc(#{$typeahead-padding-y} * 2 + 1.25rem + 2px);
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
background: #fff;
|
||||
border: 1px solid $typeahead-border-color;
|
||||
border-radius: $typeahead-radius 0 0 $typeahead-radius;
|
||||
appearance: none;
|
||||
box-sizing: border-box;
|
||||
@if ($typeahead-shadow) {
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
border-color: $typeahead-outline-color;
|
||||
}
|
||||
|
||||
//border-color: #007eff;
|
||||
//box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 3px rgba(0, 126, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
&container.hint .typeahead__field {
|
||||
input,
|
||||
textarea,
|
||||
[contenteditable] {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&container.hint .typeahead__query > :last-child,
|
||||
&hint {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
&container button {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
text-align: center;
|
||||
touch-action: manipulation;
|
||||
cursor: pointer;
|
||||
background-color: #fff;
|
||||
border: 1px solid $typeahead-border-color;
|
||||
line-height: $typeahead-line-height;
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
user-select: none;
|
||||
color: $typeahead-color;
|
||||
@if ($typeahead-shadow) {
|
||||
box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: darken($typeahead-color, 10%);
|
||||
background-color: $typeahead-item-hover-background;
|
||||
border-color: darken($typeahead-border-color, 10%);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
background-image: none;
|
||||
@if ($typeahead-shadow) {
|
||||
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
border-color: $typeahead-outline-color;
|
||||
}
|
||||
}
|
||||
|
||||
&container {
|
||||
input.disabled,
|
||||
input[disabled],
|
||||
button.disabled,
|
||||
button[disabled] {
|
||||
cursor: not-allowed;
|
||||
pointer-events: none;
|
||||
opacity: 0.65;
|
||||
box-shadow: none;
|
||||
background-color: #fff;
|
||||
border-color: $typeahead-border-color;
|
||||
}
|
||||
|
||||
//&.multiselect,
|
||||
//&.loading,
|
||||
//&.cancel {
|
||||
.typeahead__field {
|
||||
input,
|
||||
textarea,
|
||||
[contenteditable],
|
||||
.typeahead__hint,
|
||||
.typeahead__label-container {
|
||||
padding-right: 32px;
|
||||
}
|
||||
}
|
||||
//}
|
||||
}
|
||||
|
||||
&filter,
|
||||
&button {
|
||||
z-index: 1;
|
||||
button {
|
||||
margin-left: -1px;
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
z-index: 1001;
|
||||
button {
|
||||
&:focus,
|
||||
&:active {
|
||||
z-index: 1001;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&filter + &button {
|
||||
button {
|
||||
margin-left: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
&container.filter .typeahead__filter {
|
||||
z-index: 1001;
|
||||
}
|
||||
|
||||
&list,
|
||||
&dropdown {
|
||||
position: absolute;
|
||||
//top: 100%;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
width: 100%;
|
||||
min-width: 160px;
|
||||
padding: $typeahead-dropdown-spacing 0;
|
||||
margin: 2px 0 0;
|
||||
list-style: none;
|
||||
text-align: left;
|
||||
background-color: #fff;
|
||||
border: 1px solid $typeahead-border-color;
|
||||
border-radius: $typeahead-radius;
|
||||
background-clip: padding-box;
|
||||
@if ($typeahead-shadow) {
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
}
|
||||
}
|
||||
|
||||
&result.detached .typeahead__list {
|
||||
position: relative;
|
||||
z-index: 1041;
|
||||
top: initial;
|
||||
left: initial;
|
||||
}
|
||||
|
||||
&dropdown {
|
||||
right: 0;
|
||||
left: initial;
|
||||
z-index: 1001;
|
||||
}
|
||||
|
||||
&list > li {
|
||||
position: relative;
|
||||
border-top: solid 1px $typeahead-border-color;
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
|
||||
&list .typeahead__item,
|
||||
&dropdown .typeahead__dropdown-item {
|
||||
&[disabled] {
|
||||
> a {
|
||||
cursor: not-allowed;
|
||||
color: $typeahead-item-disabled-color;
|
||||
background-color: $typeahead-item-disabled-background;
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
display: block;
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
clear: both;
|
||||
color: $typeahead-item-color;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:not([disabled]) {
|
||||
> a:hover,
|
||||
> a:focus,
|
||||
&.active > a {
|
||||
background-color: $typeahead-item-hover-background;
|
||||
color: darken($typeahead-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&list.empty {
|
||||
> li {
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
color: $typeahead-item-color;
|
||||
}
|
||||
}
|
||||
|
||||
&list > .typeahead__group {
|
||||
border-color: $typeahead-group-border-color;
|
||||
font-weight: bold;
|
||||
|
||||
&:first-child {
|
||||
@if ($typeahead-dropdown-spacing > 0) {
|
||||
border-top: solid 1px $typeahead-group-border-color;
|
||||
}
|
||||
}
|
||||
> a,
|
||||
> a:hover,
|
||||
> a:focus,
|
||||
&.active > a {
|
||||
cursor: default;
|
||||
color: $typeahead-group-color;
|
||||
background: $typeahead-group-background;
|
||||
display: block;
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
clear: both;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&list > {
|
||||
li.typeahead__group + li.typeahead__item {
|
||||
border-color: $typeahead-group-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
&container {
|
||||
&.result .typeahead__list,
|
||||
&.filter .typeahead__dropdown,
|
||||
&.hint .typeahead__hint,
|
||||
&.backdrop + .typeahead__backdrop {
|
||||
display: block !important;
|
||||
}
|
||||
.typeahead__list,
|
||||
.typeahead__dropdown,
|
||||
.typeahead__hint,
|
||||
+ .typeahead__backdrop {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
&dropdown li:last-child {
|
||||
margin-top: $typeahead-dropdown-spacing;
|
||||
padding-top: $typeahead-dropdown-spacing;
|
||||
border-top: solid 1px $typeahead-border-color;
|
||||
}
|
||||
|
||||
&cancel-button {
|
||||
user-select: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
cursor: pointer;
|
||||
line-height: 1.25;
|
||||
padding: $typeahead-padding-y $typeahead-padding-x;
|
||||
visibility: hidden;
|
||||
.typeahead__label & {
|
||||
visibility: visible;
|
||||
right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&container.cancel:not(.loading),
|
||||
&label {
|
||||
.typeahead__cancel-button {
|
||||
visibility: visible;
|
||||
&:hover {
|
||||
color: $typeahead-cancel-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&search-icon {
|
||||
padding: 0 1.25rem;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
// Reference: http://www.flaticon.com/free-icon/musica-searcher_70376
|
||||
background: url(data:image/svg+xml;charset=utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTguMS4xLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDI1MC4zMTMgMjUwLjMxMyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjUwLjMxMyAyNTAuMzEzOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCI+CjxnIGlkPSJTZWFyY2giPgoJPHBhdGggc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkOyIgZD0iTTI0NC4xODYsMjE0LjYwNGwtNTQuMzc5LTU0LjM3OGMtMC4yODktMC4yODktMC42MjgtMC40OTEtMC45My0wLjc2ICAgYzEwLjctMTYuMjMxLDE2Ljk0NS0zNS42NiwxNi45NDUtNTYuNTU0QzIwNS44MjIsNDYuMDc1LDE1OS43NDcsMCwxMDIuOTExLDBTMCw0Ni4wNzUsMCwxMDIuOTExICAgYzAsNTYuODM1LDQ2LjA3NCwxMDIuOTExLDEwMi45MSwxMDIuOTExYzIwLjg5NSwwLDQwLjMyMy02LjI0NSw1Ni41NTQtMTYuOTQ1YzAuMjY5LDAuMzAxLDAuNDcsMC42NCwwLjc1OSwwLjkyOWw1NC4zOCw1NC4zOCAgIGM4LjE2OSw4LjE2OCwyMS40MTMsOC4xNjgsMjkuNTgzLDBDMjUyLjM1NCwyMzYuMDE3LDI1Mi4zNTQsMjIyLjc3MywyNDQuMTg2LDIxNC42MDR6IE0xMDIuOTExLDE3MC4xNDYgICBjLTM3LjEzNCwwLTY3LjIzNi0zMC4xMDItNjcuMjM2LTY3LjIzNWMwLTM3LjEzNCwzMC4xMDMtNjcuMjM2LDY3LjIzNi02Ny4yMzZjMzcuMTMyLDAsNjcuMjM1LDMwLjEwMyw2Ny4yMzUsNjcuMjM2ICAgQzE3MC4xNDYsMTQwLjA0NCwxNDAuMDQzLDE3MC4xNDYsMTAyLjkxMSwxNzAuMTQ2eiIgZmlsbD0iIzU1NTU1NSIvPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=) no-repeat scroll center center transparent;
|
||||
}
|
||||
|
||||
&container.loading .typeahead__query {
|
||||
&:before,
|
||||
&:after {
|
||||
transition: all 0s linear, opacity 0.2s ease;
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
content: "";
|
||||
top: 50%;
|
||||
right: 0.55em;
|
||||
margin-top: -($typeahead-loading-size / 2);
|
||||
width: $typeahead-loading-size;
|
||||
height: $typeahead-loading-size;
|
||||
box-sizing: border-box;
|
||||
border-radius: 500rem;
|
||||
border-style: solid;
|
||||
border-width: 0.1em;
|
||||
}
|
||||
|
||||
&:before {
|
||||
border-color: rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
&:after {
|
||||
animation: button-spin 0.6s linear;
|
||||
animation-iteration-count: infinite;
|
||||
border-color: #fff transparent transparent;
|
||||
box-shadow: 0 0 0 1px transparent;
|
||||
}
|
||||
|
||||
@keyframes button-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&label-container {
|
||||
list-style: none;
|
||||
position: absolute;
|
||||
padding-top: calc(#{$typeahead-font-size} * 0.375);
|
||||
padding-left: 6px;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&label {
|
||||
display: flex;
|
||||
font-size: $typeahead-label-font-size;
|
||||
position: relative;
|
||||
background: $typeahead-label-background;
|
||||
border: solid 1px $typeahead-label-border-color;
|
||||
padding-left: 4px;
|
||||
border-radius: $typeahead-radius;
|
||||
margin-right: 4px;
|
||||
margin-bottom: calc(#{$typeahead-font-size} * 0.375);
|
||||
|
||||
> * {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.typeahead__cancel-button {
|
||||
line-height: normal;
|
||||
height: auto;
|
||||
position: static;
|
||||
padding-top: calc(#{$typeahead-font-size} * 0.25 - 1px);
|
||||
padding-bottom: calc(#{$typeahead-font-size} * 0.25 + 1px);
|
||||
padding-left: 6px;
|
||||
padding-right: 6px;
|
||||
margin-left: 4px;
|
||||
font-size: $typeahead-label-font-size;
|
||||
border-left: solid 1px $typeahead-label-border-color;
|
||||
&:hover {
|
||||
background-color: darken($typeahead-label-background, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
10
static/js/jquery.typeahead.min.js
vendored
Normal file
10
static/js/jquery.typeahead.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
@ -38,6 +38,7 @@
|
|||
<link rel="stylesheet" type="text/css"
|
||||
href="{{ url_for('static',filename='plugins/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static',filename='css/bootstrap-select.css') }}" />
|
||||
<link rel="stylesheet" href="{{ url_for('static',filename='css/jquery.typeahead.min.css') }}" />
|
||||
|
||||
{% endblock head_css %}
|
||||
|
||||
|
@ -107,8 +108,14 @@
|
|||
<!-- Search -->
|
||||
<!-- ============================================================== -->
|
||||
<li class="nav-item hidden-sm-down search-box">
|
||||
<form class="form-material"><input type="text" class="form-control text-white"
|
||||
placeholder="Search...">
|
||||
<form class="form-material">
|
||||
<div class="typeahead__container">
|
||||
<div class="typeahead__field">
|
||||
<div class="typeahead__query">
|
||||
<input class="form-control text-white js-typeahead" id="search" placeholder="Search..." autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
|
@ -279,6 +286,7 @@
|
|||
<script src="{{ url_for('static',filename='js/socket.io.js') }}"></script>
|
||||
<script src="{{ url_for('static',filename='js/bootstrap-select.min.js') }}"></script>
|
||||
<script src="{{ url_for('static',filename='moment/moment.js') }}"></script>
|
||||
<script src="{{ url_for('static',filename='js/jquery.typeahead.min.js') }}"></script>
|
||||
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
|
@ -325,6 +333,34 @@
|
|||
})
|
||||
}
|
||||
|
||||
$('#search').typeahead({
|
||||
display: 'name',
|
||||
debug: false,
|
||||
hint: true,
|
||||
minLength: 3,
|
||||
dynamic: true,
|
||||
accent: true,
|
||||
delay: 500,
|
||||
source: {
|
||||
search: {
|
||||
ajax: function (query) {
|
||||
return {
|
||||
url: '{{ url_for("api.search")}}',
|
||||
type: 'GET',
|
||||
data: {
|
||||
query: query
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
callback: {
|
||||
onClick: function (node, a, item, event) {
|
||||
window.location.pathname = item.url;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if ( $('#buttons_bar_left').children().length > 0 || $('#buttons_bar_right').children().length > 0 ) {
|
||||
$('#buttons_bars').show();
|
||||
} else {
|
||||
|
|
Loading…
Reference in a new issue