1 | import { a as __extends, _ as __assign } from './tslib.es6-f952ba6f.js';
|
2 | import { U as Utils } from './Utils-38a0872e.js';
|
3 | import { select, pointer, selectAll } from 'd3';
|
4 | import { S as ServerClient } from './ServerClient-8d9a15d8.js';
|
5 | import { C as Component } from './Component-5173b5ea.js';
|
6 | import { H as Hierarchy } from './Hierarchy-336157a1.js';
|
7 | import 'awesomplete';
|
8 | import { M as ModelAutocomplete } from './ModelAutocomplete-31909926.js';
|
9 |
|
10 | var ModelSearch = (function (_super) {
|
11 | __extends(ModelSearch, _super);
|
12 | function ModelSearch(renderTarget) {
|
13 | var _this = _super.call(this, renderTarget) || this;
|
14 | _this.usedContinuationTokens = {};
|
15 | _this.currentResultIndex = -1;
|
16 | _this.stripHits = function (str) {
|
17 | return str.split('<hit>').map(function (h) { return h.split('</hit>').map(function (h2) { return Utils.strip(h2); }).join('</hit>'); }).join('<hit>');
|
18 | };
|
19 | _this.server = new ServerClient();
|
20 | select("html").on("click." + Utils.guid(), function (event) {
|
21 | if (_this.clickedInstance && event.target != _this.clickedInstance && _this.contextMenu) {
|
22 | _this.closeContextMenu();
|
23 | _this.clickedInstance = null;
|
24 | }
|
25 | });
|
26 | return _this;
|
27 | }
|
28 | ModelSearch.prototype.ModelSearch = function () {
|
29 | };
|
30 | ModelSearch.prototype.render = function (environmentFqdn, getToken, hierarchyData, chartOptions) {
|
31 | var _this = this;
|
32 | this.chartOptions.setOptions(chartOptions);
|
33 | var self = this;
|
34 | var continuationToken, searchText;
|
35 | var targetElement = select(this.renderTarget);
|
36 | targetElement.html('');
|
37 | this.wrapper = targetElement.append('div').attr('class', 'tsi-modelSearchWrapper');
|
38 | _super.prototype.themify.call(this, this.wrapper, this.chartOptions.theme);
|
39 | var inputWrapper = this.wrapper.append("div")
|
40 | .attr("class", "tsi-modelSearchInputWrapper");
|
41 | var autocompleteOnInput = function (st, event) {
|
42 | self.usedContinuationTokens = {};
|
43 |
|
44 | if (st.length === 0) {
|
45 | searchText = st;
|
46 | self.instanceResults.html('');
|
47 | self.currentResultIndex = -1;
|
48 | hierarchyElement.node().style.display = 'block';
|
49 | showMore.node().style.display = 'none';
|
50 | noResults.style('display', 'none');
|
51 | }
|
52 | else if (event.which === 13 || event.keyCode === 13) {
|
53 | hierarchyElement.node().style.display = 'none';
|
54 | self.instanceResults.html('');
|
55 | self.currentResultIndex = -1;
|
56 | noResults.style('display', 'none');
|
57 | searchInstances(st);
|
58 | searchText = st;
|
59 | }
|
60 | };
|
61 | var modelAutocomplete = new ModelAutocomplete(inputWrapper.node());
|
62 | modelAutocomplete.render(environmentFqdn, getToken, __assign({ onInput: autocompleteOnInput, onKeydown: function (event, ap) { _this.handleKeydown(event, ap); } }, chartOptions));
|
63 | var ap = modelAutocomplete.ap;
|
64 | var results = this.wrapper.append('div')
|
65 | .attr("class", "tsi-modelSearchResults").on('scroll', function () {
|
66 | self.closeContextMenu();
|
67 | var that = this;
|
68 | if (that.scrollTop + that.clientHeight + 150 > self.instanceResults.node().clientHeight && searchText.length !== 0) {
|
69 | searchInstances(searchText, continuationToken);
|
70 | }
|
71 | });
|
72 | var noResults = results.append('div').text(this.getString('No results')).classed('tsi-noResults', true).style('display', 'none');
|
73 | var instanceResultsWrapper = results.append('div').attr('class', 'tsi-modelSearchInstancesWrapper');
|
74 | this.instanceResults = instanceResultsWrapper.append('div').attr('class', 'tsi-modelSearchInstances');
|
75 | var showMore = instanceResultsWrapper.append('div').attr('class', 'tsi-showMore').text(this.getString('Show more') + '...').on('click', function () { return searchInstances(searchText, continuationToken); }).style('display', 'none');
|
76 | var hierarchyElement = this.wrapper.append('div')
|
77 | .attr("class", "tsi-hierarchyWrapper");
|
78 | var hierarchy = new Hierarchy(hierarchyElement.node());
|
79 | hierarchy.render(hierarchyData, __assign(__assign({}, this.chartOptions), { withContextMenu: true }));
|
80 | var searchInstances = function (searchText, ct) {
|
81 | if (ct === void 0) { ct = null; }
|
82 | var self = _this;
|
83 | if (ct === 'END')
|
84 | return;
|
85 | if (ct === null || !self.usedContinuationTokens[ct]) {
|
86 | self.usedContinuationTokens[ct] = true;
|
87 | getToken().then(function (token) {
|
88 | self.server.getTimeseriesInstancesSearch(token, environmentFqdn, searchText, ct).then(function (r) {
|
89 | var instances;
|
90 | if (Array.isArray(r.instances)) {
|
91 | continuationToken = r.instancesContinuationToken;
|
92 | instances = r.instances;
|
93 | }
|
94 | else {
|
95 | if (r.instances.hasOwnProperty('hits')) {
|
96 | instances = r.instances.hits;
|
97 | continuationToken = r.instances.hits.continuationToken;
|
98 | }
|
99 | }
|
100 | if (!continuationToken)
|
101 | continuationToken = 'END';
|
102 | showMore.node().style.display = continuationToken !== 'END' ? 'block' : 'none';
|
103 | if (instances.length == 0) {
|
104 | noResults.style('display', 'block');
|
105 | }
|
106 | else {
|
107 | noResults.style('display', 'none');
|
108 | }
|
109 | instances.forEach(function (i) {
|
110 | var handleClick = function (elt, wrapperMousePos, eltMousePos, fromKeyboard) {
|
111 | if (fromKeyboard === void 0) { fromKeyboard = false; }
|
112 | self.closeContextMenu();
|
113 | if (self.clickedInstance != elt) {
|
114 | self.clickedInstance = elt;
|
115 | i.type = self.types.filter(function (t) {
|
116 | return t.name.replace(/\s/g, '') === (i.highlights.type ? i.highlights.type.split('<hit>').join('').split('</hit>').join('').replace(/\s/g, '') : i.highlights.typeName.split('<hit>').join('').split('</hit>').join('').replace(/\s/g, ''));
|
117 | })[0];
|
118 | var contextMenuActions = self.chartOptions.onInstanceClick(i);
|
119 | self.contextMenu = self.wrapper.append('div');
|
120 | if (!Array.isArray(contextMenuActions)) {
|
121 | contextMenuActions = [contextMenuActions];
|
122 | }
|
123 | var totalActionCount_1 = contextMenuActions.map(function (cma) { return Object.keys(cma).length; }).reduce(function (p, c) { return p + c; }, 0);
|
124 | var currentActionIndex_1 = 0;
|
125 | contextMenuActions.forEach(function (cma, cmaGroupIdx) {
|
126 | Object.keys(cma).forEach(function (k, kIdx, kArray) {
|
127 | var localActionIndex = currentActionIndex_1;
|
128 | self.contextMenu.append('div').text(k).on('click', cma[k]).on('keydown', function (event) {
|
129 | var evt = event;
|
130 | if (evt.keyCode === 13) {
|
131 | this.click();
|
132 | }
|
133 | if (evt.keyCode === 13 || evt.keyCode === 37) {
|
134 | self.closeContextMenu();
|
135 | var results_1 = self.instanceResults.selectAll('.tsi-modelResultWrapper');
|
136 | results_1.nodes()[self.currentResultIndex].focus();
|
137 | }
|
138 | if (evt.keyCode === 40 && (localActionIndex + 1 < totalActionCount_1)) {
|
139 | self.contextMenu.node().children[localActionIndex + 1 + cmaGroupIdx + (kIdx === (kArray.length - 1) ? 1 : 0)].focus();
|
140 | }
|
141 | if (evt.keyCode === 38 && localActionIndex > 0) {
|
142 | self.contextMenu.node().children[localActionIndex - 1 + cmaGroupIdx - (kIdx === 0 ? 1 : 0)].focus();
|
143 | }
|
144 | }).attr('tabindex', '0');
|
145 | currentActionIndex_1++;
|
146 | });
|
147 | self.contextMenu.append('div').classed('tsi-break', true);
|
148 | });
|
149 | self.contextMenu.attr('style', function () { return "top: " + (wrapperMousePos - eltMousePos) + "px"; });
|
150 | self.contextMenu.classed('tsi-modelSearchContextMenu', true);
|
151 | select(elt).classed('tsi-resultSelected', true);
|
152 | if (self.contextMenu.node().children.length > 0 && fromKeyboard) {
|
153 | self.contextMenu.node().children[0].focus();
|
154 | }
|
155 | }
|
156 | else {
|
157 | self.clickedInstance = null;
|
158 | }
|
159 | };
|
160 | _this.instanceResults.append('div').html(self.getInstanceHtml(i))
|
161 | .on('click', function (event) {
|
162 | var mouseWrapper = pointer(event, self.wrapper.node());
|
163 | var mouseElt = pointer(event);
|
164 | handleClick(this, mouseWrapper[1], mouseElt[1]);
|
165 | })
|
166 | .on('keydown', function (event) {
|
167 | var evt = event;
|
168 | if (evt.keyCode === 13) {
|
169 | var resultsNodes = _this.instanceResults.selectAll('.tsi-modelResultWrapper').nodes();
|
170 | var height = 0;
|
171 | for (var i = 0; i < _this.currentResultIndex; i++) {
|
172 | height += resultsNodes[0].clientHeight;
|
173 | }
|
174 | handleClick(_this.instanceResults.select('.tsi-modelResultWrapper:focus').node(), height - results.node().scrollTop + 48, 0, true);
|
175 | }
|
176 | self.handleKeydown(evt, ap);
|
177 | }).attr('tabindex', '0').classed('tsi-modelResultWrapper', true);
|
178 | });
|
179 | });
|
180 | });
|
181 | }
|
182 | };
|
183 | getToken().then(function (token) {
|
184 | _this.server.getTimeseriesHierarchies(token, environmentFqdn).then(function (r) {
|
185 | _this.hierarchies = r.hierarchies;
|
186 | });
|
187 | });
|
188 |
|
189 | getToken().then(function (token) {
|
190 | _this.server.getTimeseriesTypes(token, environmentFqdn).then(function (r) {
|
191 | _this.types = r.types;
|
192 | });
|
193 | });
|
194 | };
|
195 | ModelSearch.prototype.handleKeydown = function (event, ap) {
|
196 | if (!ap.isOpened) {
|
197 | var results = this.instanceResults.selectAll('.tsi-modelResultWrapper');
|
198 | if (results.size()) {
|
199 | if (event.keyCode === 40 && this.currentResultIndex < results.nodes().length - 1) {
|
200 | this.currentResultIndex++;
|
201 | results.nodes()[this.currentResultIndex].focus();
|
202 | }
|
203 | else if (event.keyCode === 38) {
|
204 | this.currentResultIndex--;
|
205 | if (this.currentResultIndex <= -1) {
|
206 | this.currentResultIndex = -1;
|
207 | ap.input.focus();
|
208 | }
|
209 | else {
|
210 | results.nodes()[this.currentResultIndex].focus();
|
211 | }
|
212 | }
|
213 | }
|
214 | }
|
215 | };
|
216 | ModelSearch.prototype.closeContextMenu = function () {
|
217 | if (this.contextMenu) {
|
218 | this.contextMenu.remove();
|
219 | }
|
220 | selectAll('.tsi-resultSelected').classed('tsi-resultSelected', false);
|
221 | };
|
222 | ModelSearch.prototype.getInstanceHtml = function (i) {
|
223 | var _this = this;
|
224 | return "<div class=\"tsi-modelResult\">\n <div class=\"tsi-modelPK\">\n " + (i.highlights.name ? this.stripHits(i.highlights.name) : this.stripHits(i.highlights.timeSeriesIds ? i.highlights.timeSeriesIds.join(' ') : i.highlights.timeSeriesId.join(' '))) + "\n </div>\n <div class=\"tsi-modelHighlights\">\n " + this.stripHits(i.highlights.description && i.highlights.description.length ? i.highlights.description : this.getString('No description')) + "\n <br/><table>\n " + (i.highlights.name ? ('<tr><td>' + this.getString("Time Series ID") + '</td><td>' + this.stripHits(i.highlights.timeSeriesIds ? i.highlights.timeSeriesIds.join(' ') : i.highlights.timeSeriesId.join(' ')) + '</td></tr>') : '') + " \n " + i.highlights.instanceFieldNames.map(function (ifn, idx) {
|
225 | var val = i.highlights.instanceFieldValues[idx];
|
226 | if (ifn.indexOf('<hit>') !== -1 || val.indexOf('<hit>') !== -1) {
|
227 | return val.length === 0 ? '' : '<tr><td>' + _this.stripHits(ifn) + '</td><td>' + _this.stripHits(val) + '</tr>';
|
228 | }
|
229 | }).join('') + "\n </table>\n </div>\n </div>";
|
230 | };
|
231 | return ModelSearch;
|
232 | }(Component));
|
233 |
|
234 | export { ModelSearch as M };
|