Index: /SRUAggregator/trunk/src/main/resources/assets/js/components/corpusview.jsx
===================================================================
--- /SRUAggregator/trunk/src/main/resources/assets/js/components/corpusview.jsx	(revision 7218)
+++ /SRUAggregator/trunk/src/main/resources/assets/js/components/corpusview.jsx	(revision 7219)
@@ -13,4 +13,11 @@
 		languageMap: PT.object.isRequired,
 	},
+	
+	getInitialState() {
+	    return {
+	        viewSelected: false, // only show the selected collections
+	        //showDisabled: false, // dont hide items with {visible = false} // implemented, but out commented feature...
+	    }
+	},
 
 	toggleSelection: function (corpus, e) {
@@ -20,5 +27,17 @@
 		this.stop(e);
 	},
-
+	
+	toggleViewSelected(evt) {
+	    this.setState( (st)=> ({viewSelected:!st.viewSelected}) );
+	},
+	toggleShowDisabled(evt) {
+	    this.setState( (st)=> ({showDisabled:!st.showDisabled}) );
+	},
+
+	toggleDescExpansion: function (corpus) {
+		corpus.descExpanded = !corpus.descExpanded;
+		this.props.corpora.update();
+	},
+	
 	toggleExpansion: function (corpus) {
 		corpus.expanded = !corpus.expanded;
@@ -27,5 +46,6 @@
 
 	selectAll: function(value) {
-		this.props.corpora.recurse(function(c) { c.selected = value; });
+	    // select all _visible_
+		this.props.corpora.recurse(function(c) { c.visible ? c.selected = value : false });
 		this.props.corpora.update();
 	},
@@ -128,5 +148,5 @@
 			return false;
 		}
-		return 	<div className="expansion-handle" style={{}}>
+		return 	<div className="expansion-handle" onClick={this.toggleExpansion.bind(this, corpus)}>
 					<a>
 						{corpus.expanded ?
@@ -145,12 +165,27 @@
 				.join(", ");
 	},
-
-	renderFilteredMessage: function() {
+	
+	shouldShowItem(level, corpus) {
+	    if (this.state.viewSelected && !corpus.selected) {
+	        return false;
+	    }
+	    if (!this.state.showDisabled && !corpus.visible) {
+	           return false;
+	    }
+        // normal search filter.
+        if (level === 0 && corpus.priority <= 0) {
+		    return false;
+	    }
+	    
+	    return true;
+	},
+
+	renderFilteredMessage() {
 		var total = 0;
 		var visible = 0;
-		this.props.corpora.recurse(function(corpus){
-			if (corpus.visible) {
+		this.props.corpora.recurse((corpus) => {
+			if (corpus.visible || this.state.showDisabled) {
 				total ++;
-				if (corpus.priority > 0) {
+				if (this.shouldShowItem(0, corpus)) {
 					visible++;
 				}
@@ -160,10 +195,13 @@
 			return false;
 		}
+		if (visible === 0) {
+			return false; // we do have an "empty" message anyway
+		}
 		return 	<div> Showing {visible} out of {total} (sub)collections. </div>;
 	},
 
 	renderCorpus: function(level, minmaxp, corpus) {
-		if (!corpus.visible || corpus.priority <= 0) {
-			return false;
+		if (!this.shouldShowItem(level, corpus)) {
+		    return;
 		}
 
@@ -174,8 +212,8 @@
 		var color = minmaxp[0] === minmaxp[1] ? 'transparent' : 'hsl('+hue+', 50%, 50%)';
 		var priorityStyle = {paddingBottom: 4, paddingLeft: 2, borderBottom: '3px solid '+color };
-		var expansive = corpus.expanded ? {overflow:'hidden'} 
+		var expansive = corpus.descExpanded ? {overflow:'hidden'} 
 			: {whiteSpace:'nowrap', overflow:'hidden', textOverflow: 'ellipsis'};
 		return	<div className={corpusContainerClass} key={corpus.id}>
-					<div className="row corpus" onClick={this.toggleExpansion.bind(this, corpus)}>
+					<div className="row corpus" onClick={this.toggleDescExpansion.bind(this, corpus)}>
 						<div className="col-sm-1 vcenter">
 								<div className="inline" style={priorityStyle} onClick={this.toggleSelection.bind(this,corpus)}>
@@ -211,14 +249,60 @@
 				</div>;
 	},
-
-	render: function() {
-		var minmaxp = this.getMinMaxPriority();
+	
+	renderCorpList() {
+	    var minmaxp = this.getMinMaxPriority();
+	    
+	    const corpListRender = [];
+	       
+	    // this is so we get a non-undefined items .length in corpListRender.
+	    this.props.corpora.corpora.forEach( c => {
+	        var rend = this.renderCorpus(0, minmaxp, c);
+	        if (rend) corpListRender.push(rend);
+	   });
+	   
+	   return <div className="corpusview-corpora">
+		    { corpListRender.length > 0 ? corpListRender :
+                <h3 className="aligncenter">{
+                    this.state.viewSelected ? "No collections selected yet!" : "No collections found."
+                }</h3>
+            }
+		</div>
+		
+	},
+	
+	render() {
+	    var selectedCount = 0;
+	    //var disabledCount = 0;
+	    this.props.corpora.recurse( c => {
+	        if (c.selected && c.visible) selectedCount++;
+	        //if (c.selected) selectedCount++;
+	        //if (!c.visible) disabledCount++;
+	    });
+	    
+
 		return	<div style={{margin: "0 30px"}}>
 					<div className="row">
+					{/*
 						<div className="float-left inline">
-							<h3 style={{marginTop:10}}>
+							<h3 style={{marginTop: 0}}>
 								{this.props.corpora.getSelectedMessage()}
 							</h3>
 						</div>
+					*/}
+						
+						<div className="float-left inline corpusview-filter-buttons">
+						    <div className="btn-group btn-group-toggle" >
+						    
+                              <label className={"btn btn-light btn " + (this.state.viewSelected ? 'active':'inactive')} onClick={this.toggleViewSelected} title="View selected collections">
+                                <span className={this.state.viewSelected ? "glyphicon glyphicon-check" : "glyphicon glyphicon-unchecked"} /> View selected ({selectedCount})
+                              </label>
+                              {/*
+                              <label className={"btn btn-light btn-sm " + (this.state.showDisabled ? 'active':'inactive')} onClick={this.toggleShowDisabled} label="Toggle showing of collections disabled in this search mode">
+                                <span className={this.state.showDisabled ? "glyphicon glyphicon-check" : "glyphicon glyphicon-unchecked"} />  Show disabled ({disabledCount})
+                              </label>
+                              */}
+                            </div>
+						</div>
+						
 						<div className="float-right inline">
 							<button className="btn btn-default" style={{ marginRight: 10 }} onClick={this.selectAll.bind(this,true)}>
@@ -234,6 +318,5 @@
 						</div>
 					</div>
-					
-					{this.props.corpora.corpora.map(this.renderCorpus.bind(this, 0, minmaxp))}
+					{this.renderCorpList()}
 				</div>;
 	}
