lucos_search_component 0.0.7 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/example/index.html +20 -4
  2. package/index.js +51 -11
  3. package/package.json +1 -1
package/example/index.html CHANGED
@@ -3,14 +3,30 @@
3
3
  <title>Hello World Search Component</title>
4
4
  </head>
5
5
  <body>
6
- <label for="search-field">Everything:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search-field"></select>
7
- <label for="search-field">No Tracks:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search-field" data-exclude_types="Track"></select>
8
- <label for="search-field">Only Cites and Rivers:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search-field" data-types="City,River"></select>
9
- <label for="search-field">Load with existing items</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search-field" multiple>
6
+ <label for="search1">Everything:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search1"></select>
7
+ <label for="search2">No Tracks:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search2" data-exclude_types="Track"></select>
8
+ <label for="search3">Only Cites and Rivers:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search3" data-types="City,River"></select>
9
+ <label for="search4">Load with existing items:</label><select is="lucos-search" data-api-key="${KEY_LUCOS_ARACHNE}" id="search4" multiple>
10
10
  <option id="https://contacts.l42.eu/people/2" selected>https://contacts.l42.eu/people/2</option>
11
11
  <option id="https://eolas.l42.eu/metadata/place/2/" selected>https://eolas.l42.eu/metadata/place/2/</option>
12
12
  <option id="https://media-metadata.l42.eu/tracks/13713" selected>https://media-metadata.l42.eu/tracks/13713</option>
13
13
  </select>
14
+ <label for="search5">More than 10:</label>
15
+ <select is="lucos-search" id="search5" data-api-key="${KEY_LUCOS_ARACHNE}" data-exclude_types="Track" multiple>
16
+ <option value="https://eolas.l42.eu/metadata/place/125/" selected>https://eolas.l42.eu/metadata/place/125/</option>
17
+ <option value="https://eolas.l42.eu/metadata/place/126/" selected>https://eolas.l42.eu/metadata/place/126/</option>
18
+ <option value="https://eolas.l42.eu/metadata/place/28/" selected>https://eolas.l42.eu/metadata/place/28/</option>
19
+ <option value="https://eolas.l42.eu/metadata/place/307/" selected>https://eolas.l42.eu/metadata/place/307/</option>
20
+ <option value="https://eolas.l42.eu/metadata/place/308/" selected>https://eolas.l42.eu/metadata/place/308/</option>
21
+ <option value="https://eolas.l42.eu/metadata/place/310/" selected>https://eolas.l42.eu/metadata/place/310/</option>
22
+ <option value="https://eolas.l42.eu/metadata/place/311/" selected>https://eolas.l42.eu/metadata/place/311/</option>
23
+ <option value="https://eolas.l42.eu/metadata/place/312/" selected>https://eolas.l42.eu/metadata/place/312/</option>
24
+ <option value="https://eolas.l42.eu/metadata/place/313/" selected>https://eolas.l42.eu/metadata/place/313/</option>
25
+ <option value="https://eolas.l42.eu/metadata/place/314/" selected>https://eolas.l42.eu/metadata/place/314/</option>
26
+ <option value="https://eolas.l42.eu/metadata/place/315/" selected>https://eolas.l42.eu/metadata/place/315/</option>
27
+ <option value="https://eolas.l42.eu/metadata/place/316/" selected>https://eolas.l42.eu/metadata/place/316/</option>
28
+ <option value="https://eolas.l42.eu/metadata/place/317/" selected>https://eolas.l42.eu/metadata/place/317/</option>
29
+ </select>
14
30
  <script src="./built.js"></script>
15
31
  </body>
16
32
  </html>
package/index.js CHANGED
@@ -50,6 +50,34 @@ class LucosSearchComponent extends HTMLSelectElement {
50
50
  --lozenge-background: #044E00;
51
51
  --lozenge-border: #033100;
52
52
  }
53
+ /** Aquatic Places **/
54
+ .lozenge[data-type="Ocean"], .lozenge[data-type="Sea"], .lozenge[data-type="Sea Inlet"], .lozenge[data-type="River"], .lozenge[data-type="Lake"] {
55
+ --lozenge-background: #0085fe;
56
+ --lozenge-border: #0036b1;
57
+ }
58
+ /** Terrestrial Places **/
59
+ .lozenge[data-type="Archipelago"], .lozenge[data-type="Area Of Outstanding Natural Beauty"], .lozenge[data-type="Continent"], .lozenge[data-type="Historical Site"], .lozenge[data-type="Island"], .lozenge[data-type="Mountain"] {
60
+ --lozenge-background: #652c17;
61
+ --lozenge-border: #321200;
62
+ }
63
+ /** Cosmic Places **/
64
+ .lozenge[data-type="Galaxy"], .lozenge[data-type="Planetary System"], .lozenge[data-type="Star"], .lozenge[data-type="Planet"], .lozenge[data-type="Natural Satellite"] {
65
+ --lozenge-background: #15163a;
66
+ --lozenge-border: #000000;
67
+ --lozenge-text: #feffe8;
68
+ }
69
+ /** Human Places **/
70
+ .lozenge[data-type="Airport"], .lozenge[data-type="Autonomous Area"], .lozenge[data-type="City"], .lozenge[data-type="Country"], .lozenge[data-type="County"], .lozenge[data-type="Dependent Territory"], .lozenge[data-type="Historical Site"], .lozenge[data-type="Neighbourhood"], .lozenge[data-type="Province"], .lozenge[data-type="Region"], .lozenge[data-type="Road"], .lozenge[data-type="State"], .lozenge[data-type="Town"], .lozenge[data-type="Tribal Nation"], .lozenge[data-type="Village"] {
71
+ --lozenge-background: #aed0db;
72
+ --lozenge-border: #3f6674;
73
+ --lozenge-text: #0c1a1b;
74
+ }
75
+ /** Supernatural Places **/
76
+ .lozenge[data-type="Supernatural Realm"] {
77
+ --lozenge-background: #f1ff5f;
78
+ --lozenge-border: #674800;
79
+ --lozenge-text: #352005;
80
+ }
53
81
  .lozenge.active {
54
82
  --lozenge-border: #b00;
55
83
  }
@@ -77,20 +105,23 @@ class LucosSearchComponent extends HTMLSelectElement {
77
105
  const queryParams = new URLSearchParams({
78
106
  q: query,
79
107
  });
80
- if (component.getAttribute("data-types")) queryParams.set("types",component.getAttribute("data-types"));
81
- if (component.getAttribute("data-exclude_types")) queryParams.set("exclude_types",component.getAttribute("data-exclude_types"));
82
- const results = await component.basicSearch(queryParams);
108
+ if (component.getAttribute("data-types")) {
109
+ queryParams.set("filter_by",`type:[${component.getAttribute("data-types")}]`);
110
+ } else if (component.getAttribute("data-exclude_types")) {
111
+ queryParams.set("filter_by",`type:![${component.getAttribute("data-exclude_types")}]`);
112
+ }
113
+ const results = await component.searchRequest(queryParams);
83
114
  this.clearOptions();
84
115
  callback(results);
85
116
  },
86
117
  plugins: {
87
118
  remove_button:{
88
119
  title:'Remove this item',
89
- }
120
+ },
121
+ drag_drop: {},
90
122
  },
91
- onItemAdd: function() { // Workaround until https://github.com/orchidjs/tom-select/issues/854 is merged/released
123
+ onItemAdd: function() { // Workaround until https://github.com/orchidjs/tom-select/pull/945 is merged/released
92
124
  this.setTextboxValue('');
93
- this.clearOptions();
94
125
  this.refreshOptions();
95
126
  },
96
127
  onFocus: function() {
@@ -102,9 +133,10 @@ class LucosSearchComponent extends HTMLSelectElement {
102
133
  if (ids.length < 1) return;
103
134
  const searchParams = new URLSearchParams({
104
135
  q: '*',
105
- ids: ids.join(","),
136
+ filter_by: `id:[${ids.join(",")}]`,
137
+ per_page: ids.length,
106
138
  });
107
- const results = await component.basicSearch(searchParams);
139
+ const results = await component.searchRequest(searchParams);
108
140
  results.forEach(result => {
109
141
  this.updateOption(result.id, result);
110
142
  });
@@ -119,14 +151,22 @@ class LucosSearchComponent extends HTMLSelectElement {
119
151
  },
120
152
  });
121
153
  }
122
- async basicSearch(searchParams) {
154
+ async searchRequest(searchParams) {
123
155
  const key = this.getAttribute("data-api-key");
124
156
  if (!key) throw new Error("No `data-api-key` attribute set on `lucos-search` component");
125
- const response = await fetch("https://arachne.l42.eu/basic-search?"+searchParams.toString(), {
126
- headers: { Authorization: `key ${key}` },
157
+ searchParams.set('query_by', "pref_label,labels,description,lyrics");
158
+ searchParams.set('query_by_weights', "10,8,3,1");
159
+ searchParams.set('sort_by', "_text_match:desc,pref_label:asc");
160
+ searchParams.set('prioritize_num_matching_fields', false);
161
+ searchParams.set('include_fields', "id,pref_label,type");
162
+ const response = await fetch("https://arachne.l42.eu/search?"+searchParams.toString(), {
163
+ headers: { 'X-TYPESENSE-API-KEY': key },
127
164
  signal: AbortSignal.timeout(900),
128
165
  });
129
166
  const data = await response.json();
167
+ if (!response.ok) {
168
+ throw new Error(`Recieved ${response.status} error from search endpoint: ${data["message"]}`);
169
+ }
130
170
  const results = data.hits.map(result => {
131
171
  return {...result, ...result.document}
132
172
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lucos_search_component",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "description": "Web Component for searching lucOS data",
5
5
  "type": "module",
6
6
  "main": "index.js",