Changes for page CLB Search Component

Summary

• Page properties (1 modified, 0 added, 0 removed)

Details

Page properties

Content

...	...	@@ -14,14 +14,6 @@
14	14	template.innerHTML = htmlString;
15	15	return template;
16	16	}
17		-
18		- $(selector) {
19		- return this.shadowRoot.querySelector(selector);
20		- }
21		-
22		- $$(selector) {
23		- return this.shadowRoot.querySelectorAll(selector);
24		- }
25	25	}
26	26
27	27	customElements.define('clb-simplified-search',
...	...	@@ -40,35 +40,30 @@
40	40	}
41	41
42	42
43		- handleSearch = () => {
	35	+ handleSearch() {
44	44	fetch(`${this.searchBaseUrl}${encodeURIComponent(this.searchInput.value)}`)
45		- .then(res => res.json())
46		- .then(this.renderResults);
47		-
	37	+ .then(res => res.json())
	38	+ .then(this.renderResults);
48	48	}
49	49
50	50	get searchInput() {
51		- return this.$('input[type="text"]');
	42	+ return this.shadowRoot.querySelector('input[type="text"]');
52	52	}
53	53
54	54	get searchButton() {
55		- return this.$('#search');
	46	+ return this.shadowRoot.querySelector('button');
56	56	}
57	57
58		-
59	59	get searchInputTemplate() {
60		- return this.createTemplate(`
61		- <div>
62		- <input type="text"><button id="search">Search</button>
63		- <div id="results"></div>
64		- <button id="prev">prev</button>
65		- <button id="next">next</button>
66		- </div>
67		- `);
	50	+ return this.createTemplate('<div><input type="text"><button>Search</button><div id="results"></div></div>');
68	68	}
69	69
70		- renderResults = (results) => {
71		- const resultsContainer = this.$('#results');
	53	+ resultsContainer = () => {
	54	+ return this.shadowRoot.querySelector('#results');
	55	+ }
	56	+
	57	+ renderResults(results) {
	58	+ const resultsContainer = this.shadowRoot.querySelector('#results');
72	72	resultsContainer.replaceChildren();
73	73	for(let i = 0, j = results.length; i < j; i++) {
74	74	const { title_, spaces, doccontent_en } = results[i];
...	...	@@ -117,5 +117,4 @@
117	117	}
118	118	);
119	119	</script>
120		-<clb-simplified-search></clb-simplified-search>
121	121	{{/html}}