mirror of
https://github.com/Radarr/Radarr
synced 2024-12-24 17:01:38 +00:00
Added search bar under nav bar to jump to series by searching
This commit is contained in:
parent
8ff34aac4d
commit
48dbc127a7
6 changed files with 98 additions and 33 deletions
|
@ -1,6 +1,9 @@
|
|||
@import "prefixer";
|
||||
|
||||
#main-menu-region {
|
||||
text-align : center;
|
||||
margin-bottom : 10px;
|
||||
|
||||
i:before {
|
||||
font-size : 35px;
|
||||
}
|
||||
|
@ -8,27 +11,6 @@
|
|||
i {
|
||||
width : 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.backdrop #nav-region {
|
||||
background-color : #000000;
|
||||
.opacity(0.85);
|
||||
}
|
||||
|
||||
#nav-region li a:hover, #in-sub-nav li a.active {
|
||||
background-color : #555555;
|
||||
text-decoration : none;
|
||||
}
|
||||
|
||||
#nav-region {
|
||||
|
||||
margin-bottom : 80px;
|
||||
height : 120px;
|
||||
|
||||
.span12 {
|
||||
margin-left : 0px;
|
||||
}
|
||||
|
||||
|
||||
.logo {
|
||||
margin-top : 25px;
|
||||
|
@ -37,10 +19,6 @@
|
|||
width : 70px;
|
||||
}
|
||||
|
||||
ul {
|
||||
text-align : center;
|
||||
margin-bottom : 10px;
|
||||
}
|
||||
li {
|
||||
list-style-type : none;
|
||||
display : inline-block;
|
||||
|
@ -55,7 +33,7 @@
|
|||
padding : 15px 10px 5px;
|
||||
min-height : 56px;
|
||||
min-width : 64px;
|
||||
margin : 20px 10px 10px;
|
||||
margin : 20px 10px 5px;
|
||||
color : #b9b9b9;
|
||||
font-weight : 100;
|
||||
}
|
||||
|
@ -66,3 +44,45 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.backdrop #nav-region {
|
||||
background-color : #000000;
|
||||
.opacity(0.85);
|
||||
}
|
||||
|
||||
#nav-region li a:hover, #in-sub-nav li a.active {
|
||||
background-color : #555555;
|
||||
text-decoration : none;
|
||||
}
|
||||
|
||||
#nav-region {
|
||||
margin-bottom : 80px;
|
||||
height : 150px;
|
||||
|
||||
.span12 {
|
||||
margin-left : 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
text-align: center;
|
||||
|
||||
input, .add-on {
|
||||
background-color: #333333;
|
||||
border-color: #333333;
|
||||
color: #cccccc;
|
||||
}
|
||||
|
||||
ul {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background-color: #333333;
|
||||
color: #cccccc;
|
||||
|
||||
> li > a {
|
||||
color: #cccccc;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -19,5 +19,4 @@ define(function () {
|
|||
items : 20
|
||||
});
|
||||
};
|
||||
|
||||
});
|
||||
|
|
|
@ -59,4 +59,15 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<div class="search">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="icon-search"></i></span>
|
||||
<input class="span4 x-series-search" id="prependedInput" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,14 +1,23 @@
|
|||
'use strict';
|
||||
define(
|
||||
[
|
||||
'marionette'
|
||||
'marionette',
|
||||
'Navbar/Search'
|
||||
], function (Marionette) {
|
||||
return Marionette.ItemView.extend({
|
||||
template : 'Navbar/NavbarTemplate',
|
||||
|
||||
ui: {
|
||||
search: '.x-series-search'
|
||||
},
|
||||
|
||||
events: {
|
||||
'click a': 'onClick'
|
||||
},
|
||||
|
||||
template : 'Navbar/NavbarTemplate',
|
||||
onRender: function (){
|
||||
this.ui.search.bindSearch();
|
||||
},
|
||||
|
||||
onClick: function (event) {
|
||||
|
||||
|
|
29
UI/Navbar/Search.js
Normal file
29
UI/Navbar/Search.js
Normal file
|
@ -0,0 +1,29 @@
|
|||
'use strict';
|
||||
define(
|
||||
[
|
||||
'app',
|
||||
'Series/SeriesCollection'
|
||||
], function (App, SeriesCollection) {
|
||||
$.fn.bindSearch = function () {
|
||||
$(this).typeahead({
|
||||
source : function () {
|
||||
return SeriesCollection.map(function (model) {
|
||||
return model.get('title');
|
||||
});
|
||||
},
|
||||
|
||||
sorter: function (items) {
|
||||
return items.sort();
|
||||
},
|
||||
|
||||
updater: function (item) {
|
||||
var series = SeriesCollection.find(function (model) {
|
||||
return model.get('title') === item;
|
||||
});
|
||||
|
||||
this.$element.blur();
|
||||
App.Router.navigate('/series/{0}'.format(series.get('titleSlug')), { trigger: true });
|
||||
}
|
||||
});
|
||||
};
|
||||
});
|
|
@ -41,14 +41,13 @@ define(
|
|||
},
|
||||
|
||||
initialize: function () {
|
||||
$('body').addClass('backdrop');
|
||||
|
||||
this.listenTo(this.model, 'change:monitored', this._setMonitoredState);
|
||||
this.listenTo(App.vent, App.Events.SeriesDeleted, this._onSeriesDeleted);
|
||||
this.listenTo(App.vent, App.Events.SeasonRenamed, this._onSeasonRenamed);
|
||||
},
|
||||
|
||||
onShow: function () {
|
||||
$('body').addClass('backdrop');
|
||||
var fanArt = this._getFanArt();
|
||||
|
||||
if (fanArt) {
|
||||
|
@ -61,8 +60,6 @@ define(
|
|||
this._showSeasons();
|
||||
this._setMonitoredState();
|
||||
this._showInfo();
|
||||
|
||||
|
||||
},
|
||||
|
||||
onRender: function () {
|
||||
|
|
Loading…
Reference in a new issue