Stop search view from messing iwht browser history

Fixes #195

Browser back button functions as expected.

Will go live in v2.0.3.

Author: HarveyKandola

gui/app/components/search/search-view.js

@@ -17,20 +17,43 @@ export default Component.extend({
 	searchSvc: service('search'),
 	results: A([]),
 	validSearch: true,
+	keywords: '' ,
+	matchFilter: null,
 
-	init() {
+	// init() {
+	// 	this._super(...arguments);
+	// },
+
+	didReceiveAttrs() {
+		this._super(...arguments);
+		this.set('keywords', this.get('filter'));
+		this.set('matchFilter', this.get('matchFilter'));
+		this.fetch();
+		console.log('receive a');
+	},
+
+	didReceiveAttrs() {
 		this._super(...arguments);
+		// this.set('keywords', this.get('filter'));
+		this.set('matchFilter', this.get('matchFilter'));
 		this.fetch();
+		console.log('update a');
 	},
 
+	// didUpdateAttrs() {
+	// 	this._super(...arguments);
+	// 	this.fetch();
+	// 	console.log('update a');
+	// },
+
 	fetch() {
 		let payload = {
-			keywords: this.get('filter'),
-			doc: this.get('matchDoc'),
-			attachment: this.get('matchFile'),
-			tag: this.get('matchTag'),
-			content: this.get('matchContent'),
-			slog: this.get('slog')
+			keywords: this.get('keywords'),
+			doc: this.get('matchFilter.matchDoc'),
+			attachment: this.get('matchFilter.matchFile'),
+			tag: this.get('matchFilter.matchTag'),
+			content: this.get('matchFilter.matchContent'),
+			slog: this.get('matchFilter.slog')
 		};
 
 		payload.keywords = payload.keywords.trim();
@@ -51,7 +74,7 @@ export default Component.extend({
 
 	actions: {
 		onSearch() {
-			if (this.get('filter').trim().length < 3) {
+			if (this.get('keywords').trim().length < 3) {
 				this.set('validSearch', false);
 				return;
 			}

gui/app/pods/search/controller.js

@@ -14,12 +14,11 @@ import Controller from '@ember/controller';
 
 export default Controller.extend({
 	appMeta: service(),
-
 	queryParams: ['filter', 'matchDoc', 'matchContent', 'matchTag', 'matchFile', 'slog'],
 	filter: '',
 	matchDoc: true,
 	matchContent: true,
 	matchTag: true,
 	matchFile: true,
-	slog: false,
+	slog: false
 });

gui/app/pods/search/route.js

@@ -13,6 +13,27 @@ import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-rout
 import Route from '@ember/routing/route';
 
 export default Route.extend(AuthenticatedRouteMixin, {
+	matchFilter: null,
+
+	beforeModel(transition) {
+		let matchFilter = {
+			matchDoc: is.undefined(transition.to.queryParams.matchDoc) ? true : (transition.to.queryParams.matchDoc == 'true'),
+			matchContent: is.undefined(transition.to.queryParams.matchContent) ? true : (transition.to.queryParams.matchContent == 'true'),
+			matchTag: is.undefined(transition.to.queryParams.matchTag) ? true : (transition.to.queryParams.matchTag == 'true'),
+			matchFile: is.undefined(transition.to.queryParams.matchFile) ? true : (transition.to.queryParams.matchFile == 'true'),
+			slog: is.undefined(transition.to.queryParams.slog) ? false : (transition.to.queryParams.slog === 'true'),
+		};
+
+		this.set('matchFilter', matchFilter);
+	},
+
+	setupController: function (controller, model) {
+		this._super(controller, model);
+
+		controller.set('model', model);
+		controller.set('matchFilter', this.get('matchFilter'));
+	},
+
     activate() {
 		this.get('browser').setTitle('Search');
 	}

gui/app/pods/search/template.hbs

@@ -5,19 +5,19 @@
 		<div class="title">Match Filter</div>
 		<div class="list">
 			<div class="item">
-				{{input id="search-1" type="checkbox" checked=matchDoc}}
+				{{input id="search-1" type="checkbox" checked=matchFilter.matchDoc}}
 				<label for="search-1" class="name">Document name</label>
 			</div>
 			<div class="item">
-				{{input id="search-2" type="checkbox" checked=matchContent}}
+				{{input id="search-2" type="checkbox" checked=matchFilter.matchContent}}
 				<label for="search-2" class="name">Document content</label>
 			</div>
 			<div class="item">
-				{{input id="search-3" type="checkbox" checked=matchTag}}
+				{{input id="search-3" type="checkbox" checked=matchFilter.matchTag}}
 				<label for="search-3" class="name">Tag name</label>
 			</div>
 			<div class="item">
-				{{input id="search-4" type="checkbox" checked=matchFile}}
+				{{input id="search-4" type="checkbox" checked=matchFilter.matchFile}}
 				<label for="search-4" class="name">Attachment name</label>
 			</div>
 		</div>
@@ -69,9 +69,5 @@
 
 	{{search/search-view
 		filter=filter
-		matchDoc=matchDoc
-		matchContent=matchContent
-		matchTag=matchTag
-		matchFile=matchFile
-		slog=slog}}
+		matchFilter=matchFilter}}
 {{/layout/master-content}}

gui/app/templates/components/search/search-view.hbs

@@ -1,14 +1,14 @@
 <div class="view-search">
 	<form onsubmit={{action "onSearch"}} class="form-inline">
 		<div class="form-group">
-			{{focus-input type="text" value=filter class="form-control mr-3 search-box" placeholder="keywords, tags"}}
+			{{focus-input type="text" value=keywords class="form-control mr-3 search-box" placeholder="keywords, tags"}}
 		</div>
 		<div class="form-group">
 			{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Search onClick=(action "onSearch")}}
 		</div>
 	</form>
 	{{#if validSearch}}
-		{{search/search-results results=results keywords=filter}}
+		{{search/search-results results=results keywords=keywords}}
 	{{else}}
 		{{ui/ui-spacer size=300}}
 		<p class="color-red-700">Your search query is too short</p>