UNPKG

contacts-pane

Version:

Contacts Pane: Contacts manager for Address Book, Groups, and Individuals.

98 lines 5.04 kB
"use strict"; // The Control with decorations var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); }; Object.defineProperty(exports, "__esModule", { value: true }); exports.renderAutocompleteControl = renderAutocompleteControl; const solid_logic_1 = require("solid-logic"); const solid_ui_1 = require("solid-ui"); const autocompletePicker_1 = require("./autocompletePicker"); // dbpediaParameters const publicData_1 = require("./publicData"); const WEBID_NOUN = 'Solid ID'; const kb = solid_logic_1.store; const AUTOCOMPLETE_THRESHOLD = 4; // don't check until this many characters typed const AUTOCOMPLETE_ROWS = 12; // 20? const GREEN_PLUS = solid_ui_1.icons.iconBase + 'noun_34653_green.svg'; const SEARCH_ICON = solid_ui_1.icons.iconBase + 'noun_Search_875351.svg'; function renderAutocompleteControl(dom, person, options, addOneIdAndRefresh) { return __awaiter(this, void 0, void 0, function* () { function autoCompleteDone(object, _name) { return __awaiter(this, void 0, void 0, function* () { const webid = object.uri; removeDecorated(); return addOneIdAndRefresh(person, webid); }); } function greenButtonHandler(_event) { return __awaiter(this, void 0, void 0, function* () { const webid = yield solid_ui_1.widgets.askName(dom, solid_logic_1.store, creationArea, solid_ui_1.ns.vcard('url'), null, WEBID_NOUN); if (!webid) { return; // cancelled by user } return addOneIdAndRefresh(person, webid); }); } function removeDecorated() { creationArea.removeChild(decoratedAutocomplete); decoratedAutocomplete = null; } function searchButtonHandler(_event) { return __awaiter(this, void 0, void 0, function* () { if (decoratedAutocomplete) { creationArea.removeChild(decoratedAutocomplete); decoratedAutocomplete = null; } else { decoratedAutocomplete = dom.createElement('div'); decoratedAutocomplete.setAttribute('style', 'display: flex; flex-flow: wrap;'); decoratedAutocomplete.appendChild(yield (0, autocompletePicker_1.renderAutoComplete)(dom, acOptions, autoCompleteDone)); decoratedAutocomplete.appendChild(acceptButton); decoratedAutocomplete.appendChild(cancelButton); creationArea.appendChild(decoratedAutocomplete); } }); } function droppedURIHandler(uris) { return __awaiter(this, void 0, void 0, function* () { for (const webid of uris) { // normally one but can be more than one yield addOneIdAndRefresh(person, webid); } }); } const queryParams = options.queryParameters || publicData_1.wikidataParameters; const acceptButton = solid_ui_1.widgets.continueButton(dom); const cancelButton = solid_ui_1.widgets.cancelButton(dom, removeDecorated); const klass = options.class; const acOptions = { queryParams, class: klass, acceptButton, cancelButton }; var decoratedAutocomplete = null; // const { dom } = dataBrowserContext options = options || {}; options.editable = kb.updater.editable(person.doc().uri, kb); const creationArea = dom.createElement('div'); creationArea.setAttribute('style', 'display: flex; flex-flow: wrap;'); if (options.editable) { // creationArea.appendChild(await renderAutoComplete(dom, options, autoCompleteDone)) wait for searchButton creationArea.style.width = '100%'; const plus = creationArea.appendChild(solid_ui_1.widgets.button(dom, GREEN_PLUS, options.idNoun, greenButtonHandler)); solid_ui_1.widgets.makeDropTarget(plus, droppedURIHandler, null); if (options.dbLookup) { creationArea.appendChild(solid_ui_1.widgets.button(dom, SEARCH_ICON, options.idNoun, searchButtonHandler)); } } return creationArea; }); } // renderAutocompleteControl // ends //# sourceMappingURL=autocompleteBar.js.map