2019-05-09 13:01:47 +00:00
|
|
|
/*
|
|
|
|
Copyright 2019 New Vector Ltd
|
2019-05-22 14:16:32 +00:00
|
|
|
Copyright 2019 The Matrix.org Foundation C.I.C.
|
2019-05-09 13:01:47 +00:00
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
|
|
|
export default class AutocompleteWrapperModel {
|
2019-06-14 10:16:34 +00:00
|
|
|
constructor(updateCallback, getAutocompleterComponent, updateQuery, partCreator) {
|
2019-05-09 13:01:47 +00:00
|
|
|
this._updateCallback = updateCallback;
|
|
|
|
this._getAutocompleterComponent = getAutocompleterComponent;
|
|
|
|
this._updateQuery = updateQuery;
|
2019-06-14 10:16:34 +00:00
|
|
|
this._partCreator = partCreator;
|
2019-05-09 13:01:47 +00:00
|
|
|
this._query = null;
|
|
|
|
}
|
|
|
|
|
|
|
|
onEscape(e) {
|
|
|
|
this._getAutocompleterComponent().onEscape(e);
|
2019-05-09 13:59:48 +00:00
|
|
|
this._updateCallback({
|
2019-06-14 10:16:34 +00:00
|
|
|
replacePart: this._partCreator.plain(this._queryPart.text),
|
2019-05-09 18:37:45 +00:00
|
|
|
caretOffset: this._queryOffset,
|
2019-05-09 13:59:48 +00:00
|
|
|
close: true,
|
|
|
|
});
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
onEnter() {
|
2019-05-09 14:07:00 +00:00
|
|
|
this._updateCallback({close: true});
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
|
2019-05-24 10:38:01 +00:00
|
|
|
async onTab(e) {
|
|
|
|
const acComponent = this._getAutocompleterComponent();
|
|
|
|
|
2019-06-04 11:21:39 +00:00
|
|
|
if (acComponent.countCompletions() === 0) {
|
2019-05-24 10:38:01 +00:00
|
|
|
// Force completions to show for the text currently entered
|
|
|
|
await acComponent.forceComplete();
|
|
|
|
// Select the first item by moving "down"
|
2019-06-04 11:21:39 +00:00
|
|
|
await acComponent.moveSelection(+1);
|
2019-05-24 10:38:01 +00:00
|
|
|
} else {
|
2019-06-04 11:21:39 +00:00
|
|
|
await acComponent.moveSelection(e.shiftKey ? -1 : +1);
|
2019-05-24 10:38:01 +00:00
|
|
|
}
|
|
|
|
this._updateCallback({
|
|
|
|
close: true,
|
|
|
|
});
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
onUpArrow() {
|
2019-06-04 11:57:15 +00:00
|
|
|
this._getAutocompleterComponent().moveSelection(-1);
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
onDownArrow() {
|
2019-06-04 11:57:15 +00:00
|
|
|
this._getAutocompleterComponent().moveSelection(+1);
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
onPartUpdate(part, offset) {
|
|
|
|
// cache the typed value and caret here
|
|
|
|
// so we can restore it in onComponentSelectionChange when the value is undefined (meaning it should be the typed text)
|
|
|
|
this._queryPart = part;
|
|
|
|
this._queryOffset = offset;
|
|
|
|
this._updateQuery(part.text);
|
|
|
|
}
|
|
|
|
|
|
|
|
onComponentSelectionChange(completion) {
|
|
|
|
if (!completion) {
|
|
|
|
this._updateCallback({
|
|
|
|
replacePart: this._queryPart,
|
2019-05-09 18:37:45 +00:00
|
|
|
caretOffset: this._queryOffset,
|
2019-05-09 13:01:47 +00:00
|
|
|
});
|
|
|
|
} else {
|
|
|
|
this._updateCallback({
|
|
|
|
replacePart: this._partForCompletion(completion),
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
onComponentConfirm(completion) {
|
|
|
|
this._updateCallback({
|
|
|
|
replacePart: this._partForCompletion(completion),
|
|
|
|
close: true,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
_partForCompletion(completion) {
|
2019-06-14 10:16:34 +00:00
|
|
|
const {completionId} = completion;
|
|
|
|
const text = completion.completion;
|
|
|
|
const firstChr = completionId && completionId[0];
|
2019-05-09 13:01:47 +00:00
|
|
|
switch (firstChr) {
|
|
|
|
case "@": {
|
2019-06-14 16:25:43 +00:00
|
|
|
if (completionId === "@room") {
|
|
|
|
return this._partCreator.atRoomPill(completionId);
|
|
|
|
} else {
|
|
|
|
return this._partCreator.userPill(text, completionId);
|
|
|
|
}
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
2019-06-14 10:16:34 +00:00
|
|
|
case "#":
|
|
|
|
return this._partCreator.roomPill(completionId);
|
2019-05-09 14:07:10 +00:00
|
|
|
// also used for emoji completion
|
2019-05-09 13:01:47 +00:00
|
|
|
default:
|
2019-06-14 10:16:34 +00:00
|
|
|
return this._partCreator.plain(text);
|
2019-05-09 13:01:47 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|