fixed search, added clear button

openid-connect-server-webapp/src/main/webapp/resources/js/client.js

@@ -97,13 +97,28 @@ var ClientModel = Backbone.Model.extend({
     
     matches:function(term) {
     	if (term) {
-    		return (this.get('clientId').toLowerCase().indexOf(term.toLowerCase()) != -1)
+    		if (this.get('clientId').toLowerCase().indexOf(term.toLowerCase()) != -1) {
-    		|| (this.get('clientName') != null && this.get('clientName').toLowerCase().indexOf(term.toLowerCase()) != -1)
+    			return true;
-    		|| (this.get('clientDescription') != null && this.get('clientDescription').toLowerCase().indexOf(term.toLowerCase()) != -1)
+    		} else if (this.get('clientName') != null && this.get('clientName').toLowerCase().indexOf(term.toLowerCase()) != -1) {
-    		|| (this.get('clientUri') != null && this.get('clientUri').toLowerCase().indexOf(term.toLowerCase()) != -1)
+    			return true;
-    		|| (this.get('contacts') != null && _.filter(this.get('contacts'), function(item) {
+    		} else if (this.get('clientDescription') != null && this.get('clientDescription').toLowerCase().indexOf(term.toLowerCase()) != -1) {
-    			return item.toLowerCase().indexOf(term.toLowerCase()) != -1;
+    			return true;
-    		}));
+    		} else if (this.get('clientUri') != null && this.get('clientUri').toLowerCase().indexOf(term.toLowerCase()) != -1) {
+    			return true;
+    		} else {
+    			if (this.get('contacts') != null) {
+    				var f = _.filter(this.get('contacts'), function(item) {
+    					return item.toLowerCase().indexOf(term.toLowerCase()) != -1;
+    				});
+    				if (f.length > 0) {
+    					return true;
+    				} else {
+    					return false;
+    				}
+    			}  else {
+    				return false;
+    			}
+    		}
     	} else {
     		return true;
     	}
@@ -284,7 +299,8 @@ var ClientListView = Backbone.View.extend({
     events:{
         "click .new-client":"newClient",
         "click .refresh-table":"refreshTable",
-        'keyup .search-query':'searchTable'
+        'keyup .search-query':'searchTable',
+        'click .form-search button':'clearSearch'
     },
 
     newClient:function (e) {
@@ -322,9 +338,19 @@ var ClientListView = Backbone.View.extend({
 		if (this.filteredModel.length > 0) {
 			$('#client-table', this.el).show();
 			$('#client-table-empty', this.el).hide();
+			$('#client-table-search-empty', this.el).hide();
 		} else {
-			$('#client-table', this.el).hide();
+			if (this.model.length > 0) {
-			$('#client-table-empty', this.el).show();
+				// there's stuff in the model but it's been filtered out
+				$('#client-table', this.el).hide();
+				$('#client-table-empty', this.el).hide();
+				$('#client-table-search-empty', this.el).show();
+			} else {
+				// we're empty
+				$('#client-table', this.el).hide();
+				$('#client-table-empty', this.el).show();
+				$('#client-table-search-empty', this.el).hide();
+			}
 		}
 	},
 	
@@ -359,18 +385,20 @@ var ClientListView = Backbone.View.extend({
     		this.filteredModel = this.model;
     	}
     	
-    	console.log(this.filteredModel);
-    	
     	// clear out the table
     	$('tbody', this.el).html('');
     	
     	// re-render the table
     	this.renderInner();
     	
-    	//$('.search-query', this.el).val(term);
+    },
-    	//$('.search-query', this.el).focus();
+    
-    	
+    clearSearch:function(e) {
+    	$('.search-query', this.el).val('');
+    	this.searchTable();
     }
+    
+    
 });
 
 var ClientFormView = Backbone.View.extend({

openid-connect-server-webapp/src/main/webapp/resources/template/client.html

@@ -84,9 +84,19 @@
     <div class="well well-small">
 		<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button> &nbsp;
         <button class="btn btn-small btn-primary new-client"><i class="icon-plus icon-white"></i> New Client</button>
-		<input type="text" class="search-query pull-right" placeholder="Search...">
+		<div class="form-search pull-right">
+			<div class="input-append">
+				<input type="text" class="search-query" placeholder="Search...">
+				<button class="btn">&times;</button>
+			</div>
+		</div>
     </div>
 
+
+	<div id="client-table-search-empty" class="alert alert-warning">
+		There are no clients that match your search criteria.
+	</div>
+
 	<div id="client-table-empty" class="alert alert-info">
 		There are no registered clients on this server.
 	</div>