Searching icons and spinner fix

New: Manual search has its own icon on series details instead of a dropdown
Fixed: Automatic search icon will spin showing activity
This commit is contained in:
Mark McDowall 2014-09-05 08:28:58 -07:00
parent 3a287bf7e7
commit 86ef30480f
7 changed files with 37 additions and 57 deletions

View File

@ -1,11 +1,12 @@
using System.Collections.Generic; using System;
using System.Collections.Generic;
using NzbDrone.Core.Messaging.Commands; using NzbDrone.Core.Messaging.Commands;
namespace NzbDrone.Core.IndexerSearch namespace NzbDrone.Core.IndexerSearch
{ {
public class EpisodeSearchCommand : Command public class EpisodeSearchCommand : Command
{ {
public List<int> EpisodeIds { get; set; } public List<Int32> EpisodeIds { get; set; }
public override bool SendUpdatesToClient public override bool SendUpdatesToClient
{ {
@ -19,7 +20,7 @@ namespace NzbDrone.Core.IndexerSearch
{ {
} }
public EpisodeSearchCommand(List<int> episodeIds) public EpisodeSearchCommand(List<Int32> episodeIds)
{ {
EpisodeIds = episodeIds; EpisodeIds = episodeIds;
} }

View File

@ -3,18 +3,12 @@
define( define(
[ [
'vent', 'vent',
'marionette',
'Cells/NzbDroneCell', 'Cells/NzbDroneCell',
'Commands/CommandController' 'Commands/CommandController'
], function (vent, Marionette, NzbDroneCell, CommandController) { ], function (vent, NzbDroneCell, CommandController) {
return NzbDroneCell.extend({ return NzbDroneCell.extend({
className: 'episode-actions-cell', className: 'episode-actions-cell',
template : 'Cells/EpisodeActionsCellTemplate',
ui: {
automaticSearch: '.x-automatic-search-icon'
},
events: { events: {
'click .x-automatic-search' : '_automaticSearch', 'click .x-automatic-search' : '_automaticSearch',
@ -22,18 +16,18 @@ define(
}, },
render: function () { render: function () {
var templateName = this.column.get('template') || this.template; this.$el.empty();
this.templateFunction = Marionette.TemplateCache.get(templateName); this.$el.html(
var data = this.cellValue.toJSON(); '<i class="icon-search x-automatic-search" title="Automatic Search"></i>' +
var html = this.templateFunction(data); '<i class="icon-nd-manual-search x-manual-search" title="Manual Search"></i>'
this.$el.html(html); );
CommandController.bindToCommand({ CommandController.bindToCommand({
element: this.$(this.ui.automaticSearch), element: this.$el.find('.x-automatic-search'),
command: { command: {
name : 'episodeSearch', name : 'episodeSearch',
episodeId: this.model.get('id') episodeIds : [ this.model.get('id') ]
} }
}); });

View File

@ -1,14 +0,0 @@
<div class="btn-group hidden-xs">
<button class="btn btn-xs x-automatic-search x-automatic-search-icon" title="Automatic Search" data-container="body"><i class="icon-search"></i></button>
<button class="btn btn-xs dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li class="x-automatic-search">Automatic Search</li>
<li class="x-manual-search">Manual Search</li>
</ul>
</div>
<div class="visible-xs">
<button class="btn btn-xs x-automatic-search x-automatic-search-icon" title="Automatic Search"><i class="icon-search"></i></button>
</div>

View File

@ -114,24 +114,11 @@ td.episode-status-cell, td.quality-cell, td.history-quality-cell {
} }
.episode-actions-cell { .episode-actions-cell {
width: 65px; width: 55px;
li { i {
.clickable(); .clickable();
margin-left : 8px;
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 20px;
color: rgb(51, 51, 51);
white-space: nowrap;
}
li:hover {
text-decoration: none;
color: rgb(255, 255, 255);
background-color: rgb(0, 129, 194);
} }
} }

View File

@ -52,7 +52,6 @@ define(
bindToCommand: function (options) { bindToCommand: function (options) {
var self = this; var self = this;
var existingCommand = CommandCollection.findCommand(options.command); var existingCommand = CommandCollection.findCommand(options.command);
if (existingCommand) { if (existingCommand) {

View File

@ -1,8 +1,9 @@
'use strict'; 'use strict';
define( define(
[ [
'underscore',
'backbone' 'backbone'
], function (Backbone) { ], function (_, Backbone) {
return Backbone.Model.extend({ return Backbone.Model.extend({
url: window.NzbDrone.ApiRoot + '/command', url: window.NzbDrone.ApiRoot + '/command',
@ -18,11 +19,19 @@ define(
} }
for (var key in command) { for (var key in command) {
if (key !== 'name' && command[key] !== this.get(key)) { if (key !== 'name') {
if (Array.isArray(command[key])) {
if (_.difference(command[key], this.get(key)).length > 0) {
return false; return false;
} }
} }
else if (command[key] !== this.get(key)) {
return false;
}
}
}
return true; return true;
}, },

View File

@ -191,3 +191,7 @@
.icon(@exclamation-sign); .icon(@exclamation-sign);
color : @brand-danger; color : @brand-danger;
} }
.icon-nd-manual-search:before {
.icon(@male);
}