@knora/search
Version:
Knora ui module: search
100 lines • 14.4 kB
JavaScript
import * as tslib_1 from "tslib";
import { ConnectionPositionPair, Overlay, OverlayConfig, OverlayRef, PositionStrategy } from '@angular/cdk/overlay';
import { TemplatePortal } from '@angular/cdk/portal';
import { Component, ElementRef, Input, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core';
/**
* The search-panel contains the kui-fulltext-search and the kui-extended-search components.
*/
var SearchPanelComponent = /** @class */ (function () {
function SearchPanelComponent(_overlay, _viewContainerRef) {
this._overlay = _overlay;
this._viewContainerRef = _viewContainerRef;
/**
* @param {string} route Route to navigate after search. This route path should contain a component for search results.
*/
this.route = '/search';
/**
*@param {boolean} [projectfilter] If true it shows the selection of projects to filter by one of them
*/
this.projectfilter = false;
/**
* @param {boolean} [advanced] Adds the extended / advanced search to the panel
*/
this.advanced = false;
/**
* @param {boolean} [expert] Adds the expert search / gravsearch editor to the panel
*/
this.expert = false;
}
SearchPanelComponent.prototype.openPanelWithBackdrop = function (type) {
var _this = this;
this.showAdvanced = (type === 'advanced');
var config = new OverlayConfig({
hasBackdrop: true,
backdropClass: 'cdk-overlay-transparent-backdrop',
// backdropClass: 'cdk-overlay-dark-backdrop',
positionStrategy: this.getOverlayPosition(),
scrollStrategy: this._overlay.scrollStrategies.block()
});
this.overlayRef = this._overlay.create(config);
this.overlayRef.attach(new TemplatePortal(this.searchMenu, this._viewContainerRef));
this.overlayRef.backdropClick().subscribe(function () {
_this.overlayRef.detach();
});
};
SearchPanelComponent.prototype.getOverlayPosition = function () {
var positions = [
new ConnectionPositionPair({ originX: 'start', originY: 'bottom' }, { overlayX: 'start', overlayY: 'top' }),
new ConnectionPositionPair({ originX: 'start', originY: 'top' }, { overlayX: 'start', overlayY: 'bottom' })
];
var overlayPosition = this._overlay.position().flexibleConnectedTo(this.searchPanel).withPositions(positions).withLockedPosition(false);
return overlayPosition;
};
SearchPanelComponent.prototype.closeMenu = function () {
this.overlayRef.detach();
};
SearchPanelComponent.ctorParameters = function () { return [
{ type: Overlay },
{ type: ViewContainerRef }
]; };
tslib_1.__decorate([
Input(),
tslib_1.__metadata("design:type", String)
], SearchPanelComponent.prototype, "route", void 0);
tslib_1.__decorate([
Input(),
tslib_1.__metadata("design:type", Boolean)
], SearchPanelComponent.prototype, "projectfilter", void 0);
tslib_1.__decorate([
Input(),
tslib_1.__metadata("design:type", String)
], SearchPanelComponent.prototype, "filterbyproject", void 0);
tslib_1.__decorate([
Input(),
tslib_1.__metadata("design:type", Boolean)
], SearchPanelComponent.prototype, "advanced", void 0);
tslib_1.__decorate([
Input(),
tslib_1.__metadata("design:type", Boolean)
], SearchPanelComponent.prototype, "expert", void 0);
tslib_1.__decorate([
ViewChild('fullSearchPanel', { static: false }),
tslib_1.__metadata("design:type", ElementRef)
], SearchPanelComponent.prototype, "searchPanel", void 0);
tslib_1.__decorate([
ViewChild('searchMenu', { static: false }),
tslib_1.__metadata("design:type", TemplateRef)
], SearchPanelComponent.prototype, "searchMenu", void 0);
SearchPanelComponent = tslib_1.__decorate([
Component({
selector: 'kui-search-panel',
template: "<div class=\"kui-search-panel\" #fullSearchPanel cdkOverlayOrigin>\n\n <!-- DESKTOP VERSION -->\n <kui-fulltext-search class=\"kui-fulltext-search\" [route]=\"route\" [projectfilter]=\"projectfilter\"\n [filterbyproject]=\"filterbyproject\">\n </kui-fulltext-search>\n\n <!-- advanced search button: if advanced === true -->\n <button mat-button *ngIf=\"advanced && !expert\" color=\"primary\"\n (click)=\"openPanelWithBackdrop('advanced')\">advanced</button>\n\n <!-- expert search button: if expert === true -->\n <button mat-button *ngIf=\"!advanced && expert\" color=\"primary\"\n (click)=\"openPanelWithBackdrop('expert')\">expert</button>\n\n <!-- button to select advanced or expert search: if advanced AND expert === true; open menu to select -->\n <button mat-button *ngIf=\"advanced && expert\" [matMenuTriggerFor]=\"selectSearch\">\n <mat-icon>filter_list</mat-icon>\n </button>\n <mat-menu #selectSearch=\"matMenu\">\n <button mat-menu-item (click)=\"openPanelWithBackdrop('advanced')\">\n <span>Advanced search</span>\n </button>\n <button mat-menu-item (click)=\"openPanelWithBackdrop('expert')\">\n <span>Expert search</span>\n </button>\n </mat-menu>\n\n</div>\n\n<!-- full-text search menu -->\n<ng-template #searchMenu>\n <div class=\"kui-search-menu with-extended-search\" [class.with-project-filter]=\"projectfilter\">\n <div class=\"kui-menu-header\">\n <span class=\"kui-menu-title\">\n <h4 *ngIf=\"showAdvanced\">Advanced search</h4>\n <h4 *ngIf=\"!showAdvanced\">Expert search</h4>\n </span>\n <span class=\"fill-remaining-space\"></span>\n <span class=\"kui-menu-close\">\n <button mat-icon-button (click)=\"closeMenu()\">\n <mat-icon>close</mat-icon>\n </button>\n </span>\n </div>\n <div class=\"kui-menu-content\">\n <kui-extended-search *ngIf=\"showAdvanced\" [route]=\"route\" (toggleExtendedSearchForm)=\"closeMenu()\">\n </kui-extended-search>\n <kui-expert-search *ngIf=\"!showAdvanced\" [route]=\"route\" (toggleExpertSearchForm)=\"closeMenu()\">\n </kui-expert-search>\n </div>\n </div>\n</ng-template>\n",
styles: [".advanced-btn{margin-left:10px}.kui-search-panel{display:-webkit-box;display:flex;position:relative;z-index:100}.extended-search-box{margin:12px}@media (max-width:576px){.kui-fulltext-search{height:100%;width:100%!important}}"]
}),
tslib_1.__metadata("design:paramtypes", [Overlay,
ViewContainerRef])
], SearchPanelComponent);
return SearchPanelComponent;
}());
export { SearchPanelComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VhcmNoLXBhbmVsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0Brbm9yYS9zZWFyY2gvIiwic291cmNlcyI6WyJsaWIvc2VhcmNoLXBhbmVsL3NlYXJjaC1wYW5lbC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxPQUFPLEVBQUUsYUFBYSxFQUFFLFVBQVUsRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3BILE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUNyRCxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV2Rzs7R0FFRztBQU1IO0lBcUNJLDhCQUFxQixRQUFpQixFQUMxQixpQkFBbUM7UUFEMUIsYUFBUSxHQUFSLFFBQVEsQ0FBUztRQUMxQixzQkFBaUIsR0FBakIsaUJBQWlCLENBQWtCO1FBckMvQzs7V0FFRztRQUNNLFVBQUssR0FBVyxTQUFTLENBQUM7UUFFbkM7O1dBRUc7UUFDTSxrQkFBYSxHQUFhLEtBQUssQ0FBQztRQU96Qzs7V0FFRztRQUNNLGFBQVEsR0FBYSxLQUFLLENBQUM7UUFFcEM7O1dBRUc7UUFDTSxXQUFNLEdBQWEsS0FBSyxDQUFDO0lBY21CLENBQUM7SUFFdEQsb0RBQXFCLEdBQXJCLFVBQXNCLElBQVk7UUFBbEMsaUJBaUJDO1FBZkcsSUFBSSxDQUFDLFlBQVksR0FBRyxDQUFDLElBQUksS0FBSyxVQUFVLENBQUMsQ0FBQztRQUUxQyxJQUFNLE1BQU0sR0FBRyxJQUFJLGFBQWEsQ0FBQztZQUM3QixXQUFXLEVBQUUsSUFBSTtZQUNqQixhQUFhLEVBQUUsa0NBQWtDO1lBQ2pELDhDQUE4QztZQUM5QyxnQkFBZ0IsRUFBRSxJQUFJLENBQUMsa0JBQWtCLEVBQUU7WUFDM0MsY0FBYyxFQUFFLElBQUksQ0FBQyxRQUFRLENBQUMsZ0JBQWdCLENBQUMsS0FBSyxFQUFFO1NBQ3pELENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDL0MsSUFBSSxDQUFDLFVBQVUsQ0FBQyxNQUFNLENBQUMsSUFBSSxjQUFjLENBQUMsSUFBSSxDQUFDLFVBQVUsRUFBRSxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDO1FBQ3BGLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLENBQUMsU0FBUyxDQUFDO1lBQ3RDLEtBQUksQ0FBQyxVQUFVLENBQUMsTUFBTSxFQUFFLENBQUM7UUFDN0IsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRUQsaURBQWtCLEdBQWxCO1FBQ0ksSUFBTSxTQUFTLEdBQUc7WUFDZCxJQUFJLHNCQUFzQixDQUFDLEVBQUUsT0FBTyxFQUFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLEVBQUUsRUFBRSxRQUFRLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsQ0FBQztZQUMzRyxJQUFJLHNCQUFzQixDQUFDLEVBQUUsT0FBTyxFQUFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxRQUFRLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsQ0FBQztTQUM5RyxDQUFDO1FBRUYsSUFBTSxlQUFlLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsYUFBYSxDQUFDLFNBQVMsQ0FBQyxDQUFDLGtCQUFrQixDQUFDLEtBQUssQ0FBQyxDQUFDO1FBRTFJLE9BQU8sZUFBZSxDQUFDO0lBQzNCLENBQUM7SUFFRCx3Q0FBUyxHQUFUO1FBQ0ksSUFBSSxDQUFDLFVBQVUsQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUM3QixDQUFDOztnQkFuQzhCLE9BQU87Z0JBQ1AsZ0JBQWdCOztJQWxDdEM7UUFBUixLQUFLLEVBQUU7O3VEQUEyQjtJQUsxQjtRQUFSLEtBQUssRUFBRTs7K0RBQWlDO0lBS2hDO1FBQVIsS0FBSyxFQUFFOztpRUFBMEI7SUFLekI7UUFBUixLQUFLLEVBQUU7OzBEQUE0QjtJQUszQjtRQUFSLEtBQUssRUFBRTs7d0RBQTBCO0lBRWU7UUFBaEQsU0FBUyxDQUFDLGlCQUFpQixFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxDQUFDOzBDQUFjLFVBQVU7NkRBQUM7SUFFN0I7UUFBM0MsU0FBUyxDQUFDLFlBQVksRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsQ0FBQzswQ0FBYSxXQUFXOzREQUFNO0lBNUJoRSxvQkFBb0I7UUFMaEMsU0FBUyxDQUFDO1lBQ1AsUUFBUSxFQUFFLGtCQUFrQjtZQUM1QixrMkVBQTRDOztTQUUvQyxDQUFDO2lEQXNDaUMsT0FBTztZQUNQLGdCQUFnQjtPQXRDdEMsb0JBQW9CLENBeUVoQztJQUFELDJCQUFDO0NBQUEsQUF6RUQsSUF5RUM7U0F6RVksb0JBQW9CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29ubmVjdGlvblBvc2l0aW9uUGFpciwgT3ZlcmxheSwgT3ZlcmxheUNvbmZpZywgT3ZlcmxheVJlZiwgUG9zaXRpb25TdHJhdGVneSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9vdmVybGF5JztcbmltcG9ydCB7IFRlbXBsYXRlUG9ydGFsIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL3BvcnRhbCc7XG5pbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIElucHV0LCBUZW1wbGF0ZVJlZiwgVmlld0NoaWxkLCBWaWV3Q29udGFpbmVyUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbi8qKlxuICogVGhlIHNlYXJjaC1wYW5lbCBjb250YWlucyB0aGUga3VpLWZ1bGx0ZXh0LXNlYXJjaCBhbmQgdGhlIGt1aS1leHRlbmRlZC1zZWFyY2ggY29tcG9uZW50cy5cbiAqL1xuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdrdWktc2VhcmNoLXBhbmVsJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc2VhcmNoLXBhbmVsLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9zZWFyY2gtcGFuZWwuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBTZWFyY2hQYW5lbENvbXBvbmVudCB7XG4gICAgLyoqXG4gICAgICogQHBhcmFtICB7c3RyaW5nfSByb3V0ZSBSb3V0ZSB0byBuYXZpZ2F0ZSBhZnRlciBzZWFyY2guIFRoaXMgcm91dGUgcGF0aCBzaG91bGQgY29udGFpbiBhIGNvbXBvbmVudCBmb3Igc2VhcmNoIHJlc3VsdHMuXG4gICAgICovXG4gICAgQElucHV0KCkgcm91dGU6IHN0cmluZyA9ICcvc2VhcmNoJztcblxuICAgIC8qKlxuICAgICAqQHBhcmFtICB7Ym9vbGVhbn0gW3Byb2plY3RmaWx0ZXJdIElmIHRydWUgaXQgc2hvd3MgdGhlIHNlbGVjdGlvbiBvZiBwcm9qZWN0cyB0byBmaWx0ZXIgYnkgb25lIG9mIHRoZW1cbiAgICAgKi9cbiAgICBASW5wdXQoKSBwcm9qZWN0ZmlsdGVyPzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gICAgLyoqXG4gICAgICogQHBhcmFtICB7c3RyaW5nfSBbZmlsdGVyYnlwcm9qZWN0XSBJZiB5b3VyIGZ1bGwtdGV4dCBzZWFyY2ggc2hvdWxkIGJlIGZpbHRlcmVkIGJ5IG9uZSBwcm9qZWN0LCB5b3UgY2FuIGRlZmluZSBpdCB3aXRoIHByb2plY3QgaXJpIGluIHRoZSBwYXJhbWV0ZXIgZmlsdGVyYnlwcm9qZWN0LlxuICAgICAqL1xuICAgIEBJbnB1dCgpIGZpbHRlcmJ5cHJvamVjdD86IHN0cmluZztcblxuICAgIC8qKlxuICAgICAqIEBwYXJhbSAge2Jvb2xlYW59IFthZHZhbmNlZF0gQWRkcyB0aGUgZXh0ZW5kZWQgLyBhZHZhbmNlZCBzZWFyY2ggdG8gdGhlIHBhbmVsXG4gICAgICovXG4gICAgQElucHV0KCkgYWR2YW5jZWQ/OiBib29sZWFuID0gZmFsc2U7XG5cbiAgICAvKipcbiAgICAgKiBAcGFyYW0gIHtib29sZWFufSBbZXhwZXJ0XSBBZGRzIHRoZSBleHBlcnQgc2VhcmNoIC8gZ3JhdnNlYXJjaCBlZGl0b3IgdG8gdGhlIHBhbmVsXG4gICAgICovXG4gICAgQElucHV0KCkgZXhwZXJ0PzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gICAgQFZpZXdDaGlsZCgnZnVsbFNlYXJjaFBhbmVsJywgeyBzdGF0aWM6IGZhbHNlIH0pIHNlYXJjaFBhbmVsOiBFbGVtZW50UmVmO1xuXG4gICAgQFZpZXdDaGlsZCgnc2VhcmNoTWVudScsIHsgc3RhdGljOiBmYWxzZSB9KSBzZWFyY2hNZW51OiBUZW1wbGF0ZVJlZjxhbnk+O1xuICAgIC8vICAgIEBWaWV3Q2hpbGQoJ2V4cGVydFNlYXJjaE1lbnUnLCB7c3RhdGljOmZhbHNlfSkgZXhwZXJ0TWVudTogVGVtcGxhdGVSZWY8YW55PjtcblxuICAgIC8vIG92ZXJsYXkgcmVmZXJlbmNlXG4gICAgb3ZlcmxheVJlZjogT3ZlcmxheVJlZjtcblxuICAgIC8vIHNob3cgYWR2YW5jZWQgb3IgZXhwZXJ0IHNlYXJjaFxuICAgIHNob3dBZHZhbmNlZDogYm9vbGVhbjtcblxuICAgIGNvbnN0cnVjdG9yIChwcml2YXRlIF9vdmVybGF5OiBPdmVybGF5LFxuICAgICAgICBwcml2YXRlIF92aWV3Q29udGFpbmVyUmVmOiBWaWV3Q29udGFpbmVyUmVmLCApIHsgfVxuXG4gICAgb3BlblBhbmVsV2l0aEJhY2tkcm9wKHR5cGU6IHN0cmluZykge1xuXG4gICAgICAgIHRoaXMuc2hvd0FkdmFuY2VkID0gKHR5cGUgPT09ICdhZHZhbmNlZCcpO1xuXG4gICAgICAgIGNvbnN0IGNvbmZpZyA9IG5ldyBPdmVybGF5Q29uZmlnKHtcbiAgICAgICAgICAgIGhhc0JhY2tkcm9wOiB0cnVlLFxuICAgICAgICAgICAgYmFja2Ryb3BDbGFzczogJ2Nkay1vdmVybGF5LXRyYW5zcGFyZW50LWJhY2tkcm9wJyxcbiAgICAgICAgICAgIC8vIGJhY2tkcm9wQ2xhc3M6ICdjZGstb3ZlcmxheS1kYXJrLWJhY2tkcm9wJyxcbiAgICAgICAgICAgIHBvc2l0aW9uU3RyYXRlZ3k6IHRoaXMuZ2V0T3ZlcmxheVBvc2l0aW9uKCksXG4gICAgICAgICAgICBzY3JvbGxTdHJhdGVneTogdGhpcy5fb3ZlcmxheS5zY3JvbGxTdHJhdGVnaWVzLmJsb2NrKClcbiAgICAgICAgfSk7XG5cbiAgICAgICAgdGhpcy5vdmVybGF5UmVmID0gdGhpcy5fb3ZlcmxheS5jcmVhdGUoY29uZmlnKTtcbiAgICAgICAgdGhpcy5vdmVybGF5UmVmLmF0dGFjaChuZXcgVGVtcGxhdGVQb3J0YWwodGhpcy5zZWFyY2hNZW51LCB0aGlzLl92aWV3Q29udGFpbmVyUmVmKSk7XG4gICAgICAgIHRoaXMub3ZlcmxheVJlZi5iYWNrZHJvcENsaWNrKCkuc3Vic2NyaWJlKCgpID0+IHtcbiAgICAgICAgICAgIHRoaXMub3ZlcmxheVJlZi5kZXRhY2goKTtcbiAgICAgICAgfSk7XG4gICAgfVxuXG4gICAgZ2V0T3ZlcmxheVBvc2l0aW9uKCk6IFBvc2l0aW9uU3RyYXRlZ3kge1xuICAgICAgICBjb25zdCBwb3NpdGlvbnMgPSBbXG4gICAgICAgICAgICBuZXcgQ29ubmVjdGlvblBvc2l0aW9uUGFpcih7IG9yaWdpblg6ICdzdGFydCcsIG9yaWdpblk6ICdib3R0b20nIH0sIHsgb3ZlcmxheVg6ICdzdGFydCcsIG92ZXJsYXlZOiAndG9wJyB9KSxcbiAgICAgICAgICAgIG5ldyBDb25uZWN0aW9uUG9zaXRpb25QYWlyKHsgb3JpZ2luWDogJ3N0YXJ0Jywgb3JpZ2luWTogJ3RvcCcgfSwgeyBvdmVybGF5WDogJ3N0YXJ0Jywgb3ZlcmxheVk6ICdib3R0b20nIH0pXG4gICAgICAgIF07XG5cbiAgICAgICAgY29uc3Qgb3ZlcmxheVBvc2l0aW9uID0gdGhpcy5fb3ZlcmxheS5wb3NpdGlvbigpLmZsZXhpYmxlQ29ubmVjdGVkVG8odGhpcy5zZWFyY2hQYW5lbCkud2l0aFBvc2l0aW9ucyhwb3NpdGlvbnMpLndpdGhMb2NrZWRQb3NpdGlvbihmYWxzZSk7XG5cbiAgICAgICAgcmV0dXJuIG92ZXJsYXlQb3NpdGlvbjtcbiAgICB9XG5cbiAgICBjbG9zZU1lbnUoKTogdm9pZCB7XG4gICAgICAgIHRoaXMub3ZlcmxheVJlZi5kZXRhY2goKTtcbiAgICB9XG59XG4iXX0=