graphdb-workbench
Version:
The web application for GraphDB APIs
1 lines • 3.81 kB
JavaScript
import{EventService,openInNewTab,ResourceSearchStorageService,SearchButton,SearchButtonConfig,ServiceProvider,SubscriptionList,UriUtil}from"../../../../../api/dist/ontotext-workbench-api";import{h}from"@stencil/core";import{TranslationService}from"../../services/translation.service";import{HtmlUtil}from"../../utils/html-util";import{OntoTooltipPlacement}from"../onto-tooltip/models/onto-tooltip-placement";import{ResourceSearchConstants}from"../../models/resource-search/resource-search-constants";export class OntoRdfSearch{constructor(){this.subscriptions=new SubscriptionList,this.eventService=ServiceProvider.get(EventService),this.resourceSearchStorageService=ServiceProvider.get(ResourceSearchStorageService),this.RDF_CONTEXT="rdfSearchContext",this.isOpen=!1,this.redirectUrl=UriUtil.RESOURCE_URL}handleClick(e){var t;this.isOpen&&((null===(t=this.rdfSearchRef)||void 0===t?void 0:t.contains(e.target))||(this.isOpen=!1))}connectedCallback(){this.onSuggestionSelected()}disconnectedCallback(){this.subscriptions.unsubscribeAll()}componentDidRender(){this.focusSearchInput()}componentDidLoad(){this.buttonConfig=this.createButtonConfig()}render(){return h("section",{key:"ab853ae8835280311974ada17bd83593d084f2c4",ref:e=>this.rdfSearchRef=e,class:"onto-rdf-search",onKeyDown:this.onKeyDown(),"data-test":"onto-rdf-search-component"},h("section",{key:"fde7d09d0d3a796c7b5313d706f5e3892975c8fd",class:"search-area "+(this.isOpen?"visible":"invisible")},h("i",{key:"0bd9a120019ff2efb4d906d6ba3c228b446a3831",onClick:this.setIsOpen(!1),"tooltip-content":TranslationService.translate("rdf_search.tooltips.close_search_area"),"tooltip-placement":OntoTooltipPlacement.BOTTOM,"data-test":"onto-rdf-resource-search-close-btn",class:"ri-close-line close-btn"}),h("onto-search-resource-input",{key:"281a7105140989c1fc624827f1acb5e3e1f7e305",buttonConfig:this.buttonConfig,preserveSearch:!0,isHidden:!this.isOpen,"data-test":"onto-rdf-resource-search-input",context:this.RDF_CONTEXT})),this.isOpen?"":h("onto-search-icon",{onClick:this.setIsOpen(!0)}))}setIsOpen(e){return()=>{this.isOpen=e,this.isOpen&&this.loadSelectedViewFromStorage()}}createButtonConfig(){return new SearchButtonConfig({isRadio:!0,buttons:[this.createSearchButton(ResourceSearchConstants.TABLE_VIEW,"rdf_search.buttons.table",()=>{this.redirectUrl=UriUtil.RESOURCE_URL,this.resourceSearchStorageService.setSelectedView(ResourceSearchConstants.TABLE_VIEW)},!0),this.createSearchButton(ResourceSearchConstants.VISUAL_VIEW,"rdf_search.buttons.visual",()=>{this.redirectUrl=UriUtil.GRAPHS_VISUALIZATIONS_URL,this.resourceSearchStorageService.setSelectedView(ResourceSearchConstants.VISUAL_VIEW)},!1)]})}createSearchButton(e,t,r,s){return new SearchButton({label:TranslationService.translate(t),id:e,callback:r,selected:s})}onSuggestionSelected(){this.subscriptions.add(this.eventService.subscribe(ResourceSearchConstants.SUGGESTION_SELECTED_EVENT,e=>{if(e.getContext()===this.RDF_CONTEXT){const t=e.getSuggestion().getOverrideToVisual()?UriUtil.GRAPHS_VISUALIZATIONS_URL:this.redirectUrl;openInNewTab(UriUtil.createAutocompleteRedirect(t,e.getSuggestion().getValue()))}}))}onKeyDown(){return e=>{"Escape"===e.key&&(this.isOpen=!1)}}focusSearchInput(){this.isOpen&&HtmlUtil.focusElement(`#${this.RDF_CONTEXT}`)}loadSelectedViewFromStorage(){const e=this.resourceSearchStorageService.getSelectedView();if(e){const t=this.buttonConfig.getButtons().find(t=>t.id===e);t&&(this.buttonConfig=this.buttonConfig.selectButton(t))}}static get is(){return"onto-rdf-search"}static get originalStyleUrls(){return{$:["onto-rdf-search.scss"]}}static get styleUrls(){return{$:["onto-rdf-search.css"]}}static get states(){return{isOpen:{},buttonConfig:{}}}static get listeners(){return[{name:"click",method:"handleClick",target:"window",capture:!1,passive:!1}]}}