henry-search 1.0.28 → 1.0.29
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.
- package/dist/HenrySearch.css +1 -1
- package/dist/HenrySearch.js +5454 -5441
- package/dist/HenrySearch.umd.cjs +106 -106
- package/package.json +1 -1
- package/src/components/AudioLinks.vue +6 -1
- package/src/components/Search.vue +13 -3
- package/src/components/SearchTab.vue +3 -3
- package/src/styles/atoms/audioLinks/index.scss +9 -2
- package/src/styles/atoms/menuSelect/index.scss +1 -0
- package/src/styles/atoms/toolTip/index.scss +5 -3
- package/src/styles/molecules/resultActions/index.scss +3 -1
- package/src/styles/organisms/filters/index.scss +11 -9
- package/src/styles/organisms/performanceGrid/index.scss +2 -2
- package/src/styles/organisms/resultsGrid/index.scss +1 -2
- package/src/styles/templates/eventsSearch/index.scss +1 -1
- package/src/styles/templates/performance/index.scss +1 -1
package/package.json
CHANGED
|
@@ -4,13 +4,18 @@ const props = defineProps({
|
|
|
4
4
|
audioId: {
|
|
5
5
|
type: Number,
|
|
6
6
|
require: true
|
|
7
|
+
},
|
|
8
|
+
extraClasses: {
|
|
9
|
+
type: String,
|
|
10
|
+
require: false,
|
|
11
|
+
default: ''
|
|
7
12
|
}
|
|
8
13
|
})
|
|
9
14
|
|
|
10
15
|
</script>
|
|
11
16
|
|
|
12
17
|
<template>
|
|
13
|
-
<div class="audioLinks__box">
|
|
18
|
+
<div :class="`audioLinks__box ${props.extraClasses}`">
|
|
14
19
|
<div class="audioLinks__links">
|
|
15
20
|
<span class="audioLinks__label -first">Public</span>
|
|
16
21
|
<a href="https://forms.office.com/pages/responsepage.aspx?id=OdIW0TyQrUiHfXYXUGXf-OBndBFJDdZNtXXrOlwA-shUNVBBNjZNQkozSEw2SUs3SFU1Q1I2R1VQTCQlQCN0PWcu&fswReload=1&fswNavStart=1674745526953" target="_blank" class="audioLinks__link -first">Request Form<svg class="audioLinks__arrow" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
import PTabs from './PTabs.vue'
|
|
6
6
|
import SearchTab from "./SearchTab.vue"
|
|
7
7
|
import EventLinks from "./EventLinks.vue"
|
|
8
|
+
import AudioLinks from "./AudioLinks.vue"
|
|
8
9
|
|
|
9
10
|
import formatDate from '../composables/formatDate'
|
|
10
11
|
|
|
@@ -33,7 +34,8 @@
|
|
|
33
34
|
|
|
34
35
|
onMounted(() => {
|
|
35
36
|
document.addEventListener("click", function(){
|
|
36
|
-
|
|
37
|
+
console.log('click')
|
|
38
|
+
document.querySelectorAll(".audioLinks__box").forEach((el) => {
|
|
37
39
|
el.classList.remove("-open")
|
|
38
40
|
})
|
|
39
41
|
})
|
|
@@ -146,6 +148,12 @@
|
|
|
146
148
|
return attributeArray.join("; ")
|
|
147
149
|
}
|
|
148
150
|
|
|
151
|
+
const showAudioLinks = (event) => {
|
|
152
|
+
event.stopPropagation()
|
|
153
|
+
const audioLinkBox = event.currentTarget.parentElement.querySelector(".audioLinks__box")
|
|
154
|
+
audioLinkBox.classList.toggle("-open")
|
|
155
|
+
}
|
|
156
|
+
|
|
149
157
|
|
|
150
158
|
</script>
|
|
151
159
|
|
|
@@ -205,13 +213,14 @@
|
|
|
205
213
|
<span class="resultsGrid__mobileHeader">Composer/Work</span>
|
|
206
214
|
{{ w?.composers?.join("; ") }} / {{ w?.title }}
|
|
207
215
|
<div v-if="w.has_recording" class="toolTip">
|
|
208
|
-
<a
|
|
216
|
+
<a @click="showAudioLinks">
|
|
209
217
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" class="resultsGrid__icon">
|
|
210
218
|
<circle cx="9" cy="9" r="9" fill="#14284E"/>
|
|
211
219
|
<path d="M9.81086 5L6.92983 7.30483H4.625V10.7621H6.92983L9.81086 13.0669V5Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
212
220
|
<path d="M12.4268 6.99219C12.9669 7.53246 13.2703 8.26513 13.2703 9.02908C13.2703 9.79302 12.9669 10.5257 12.4268 11.066" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
213
221
|
</svg>
|
|
214
222
|
</a>
|
|
223
|
+
<audio-links :audio-id="item.bso_audio_id" extraClasses="-inGrid" />
|
|
215
224
|
<span class="toolTip__text">Access Audio</span>
|
|
216
225
|
</div>
|
|
217
226
|
</div>
|
|
@@ -247,7 +256,7 @@
|
|
|
247
256
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
248
257
|
{{ w?.composers?.join("; ") }} / {{ w?.title }}
|
|
249
258
|
<div v-if="w.has_recording" class="toolTip">
|
|
250
|
-
<a
|
|
259
|
+
<a @click="showAudioLinks">
|
|
251
260
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" class="resultsGrid__icon">
|
|
252
261
|
<circle cx="9" cy="9" r="9" fill="#14284E"/>
|
|
253
262
|
<path d="M9.81086 5L6.92983 7.30483H4.625V10.7621H6.92983L9.81086 13.0669V5Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
@@ -255,6 +264,7 @@
|
|
|
255
264
|
</svg>
|
|
256
265
|
|
|
257
266
|
</a>
|
|
267
|
+
<audio-links :audio-id="item.bso_audio_id" extraClasses="-inGrid" />
|
|
258
268
|
<span class="toolTip__text">Access Audio</span>
|
|
259
269
|
</div>
|
|
260
270
|
</div>
|
|
@@ -689,7 +689,7 @@
|
|
|
689
689
|
</div>
|
|
690
690
|
</summary>
|
|
691
691
|
<div class="accordion__content">
|
|
692
|
-
<ais-menu-select v-if="refinement.type == 'location'" :attribute="'location.country'" operator="and" limit="100" >
|
|
692
|
+
<ais-menu-select v-if="refinement.type == 'location'" :attribute="'location.country'" operator="and" :limit="100" >
|
|
693
693
|
<template v-slot="{ items, refine }">
|
|
694
694
|
<select @change="refine($event.currentTarget.value)">
|
|
695
695
|
<option value="">Select Country</option>
|
|
@@ -697,7 +697,7 @@
|
|
|
697
697
|
</select>
|
|
698
698
|
</template>
|
|
699
699
|
</ais-menu-select>
|
|
700
|
-
<ais-menu-select v-if="refinement.type == 'location'" :attribute="'location.state'" operator="and" limit="100">
|
|
700
|
+
<ais-menu-select v-if="refinement.type == 'location'" :attribute="'location.state'" operator="and" :limit="100">
|
|
701
701
|
<template v-slot="{ items, refine }">
|
|
702
702
|
<select @change="refine($event.currentTarget.value)">
|
|
703
703
|
<option value="">Select State</option>
|
|
@@ -705,7 +705,7 @@
|
|
|
705
705
|
</select>
|
|
706
706
|
</template>
|
|
707
707
|
</ais-menu-select>
|
|
708
|
-
<ais-menu-select placeholder="Select City" v-if="refinement.type == 'location'" :attribute="'location.city'" operator="and" limit="100">
|
|
708
|
+
<ais-menu-select placeholder="Select City" v-if="refinement.type == 'location'" :attribute="'location.city'" operator="and" :limit="100">
|
|
709
709
|
<template v-slot="{ items, refine }">
|
|
710
710
|
<select @change="refine($event.currentTarget.value)">
|
|
711
711
|
<option value="">Select City</option>
|
|
@@ -7,10 +7,17 @@
|
|
|
7
7
|
|
|
8
8
|
&__box {
|
|
9
9
|
display:none;
|
|
10
|
+
right: 5rem;
|
|
11
|
+
margin-top: 2rem;
|
|
12
|
+
&.-inGrid {
|
|
13
|
+
right: 0rem;
|
|
14
|
+
left: -7rem;
|
|
15
|
+
width: 15rem;
|
|
16
|
+
margin-top: 0;
|
|
17
|
+
}
|
|
10
18
|
&.-open {
|
|
11
19
|
position:absolute;
|
|
12
|
-
|
|
13
|
-
margin-top: 2rem;
|
|
20
|
+
|
|
14
21
|
z-index: 100;
|
|
15
22
|
display:block;
|
|
16
23
|
}
|
|
@@ -10,16 +10,18 @@
|
|
|
10
10
|
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
11
11
|
font-size: 0.75rem;
|
|
12
12
|
font-weight: 100;
|
|
13
|
-
|
|
14
|
-
left:
|
|
13
|
+
height: 1.8rem;
|
|
14
|
+
left: -1.2rem;
|
|
15
15
|
margin-left: -100%;
|
|
16
16
|
opacity: 0;
|
|
17
17
|
padding: 5px 0;
|
|
18
18
|
position: absolute;
|
|
19
19
|
text-align: center;
|
|
20
|
+
text-wrap: nowrap;
|
|
21
|
+
top: 2rem;
|
|
20
22
|
transition: opacity 0.3s;
|
|
21
23
|
visibility: hidden;
|
|
22
|
-
width:
|
|
24
|
+
width: 6rem;
|
|
23
25
|
z-index: 1;
|
|
24
26
|
}
|
|
25
27
|
&__text::after {
|
|
@@ -116,7 +116,7 @@
|
|
|
116
116
|
position: sticky;
|
|
117
117
|
//bottom: 0;
|
|
118
118
|
z-index: 3;
|
|
119
|
-
height:
|
|
119
|
+
height: 80px;
|
|
120
120
|
width: 100vw;
|
|
121
121
|
box-shadow: 0 -30px 30px var(--color-gray-100);
|
|
122
122
|
background-color: white;
|
|
@@ -125,7 +125,6 @@
|
|
|
125
125
|
}
|
|
126
126
|
.ais-ClearRefinements {
|
|
127
127
|
width: 100%;
|
|
128
|
-
height: 100%;
|
|
129
128
|
display: grid;
|
|
130
129
|
grid-template-columns: 1fr 1fr;
|
|
131
130
|
align-items: center;
|
|
@@ -140,27 +139,28 @@
|
|
|
140
139
|
}
|
|
141
140
|
button.filterApply,
|
|
142
141
|
button.filterClear {
|
|
142
|
+
border-radius: 5px;
|
|
143
|
+
border: 0;
|
|
143
144
|
gap: 1rem;
|
|
144
145
|
justify-content: space-between;
|
|
145
|
-
width: 90%;
|
|
146
|
-
height: 80%;
|
|
147
146
|
justify-self: center;
|
|
148
|
-
border: 0;
|
|
149
|
-
border-radius: 5px;
|
|
150
147
|
padding: 1rem;
|
|
151
|
-
|
|
148
|
+
width: 90%;
|
|
152
149
|
}
|
|
153
150
|
button.filterClear {
|
|
154
151
|
background-color: var(--color-gray-100);
|
|
155
152
|
border: none;
|
|
156
|
-
height:
|
|
153
|
+
height: 110%;
|
|
157
154
|
|
|
158
155
|
}
|
|
159
156
|
button.filterApply {
|
|
160
157
|
background-color: var(--color-turquoise);
|
|
161
158
|
color: var(--color-dark-blue);
|
|
162
159
|
font-weight: 600;
|
|
160
|
+
height: 94%;
|
|
163
161
|
margin-right: 1rem;
|
|
162
|
+
position: relative;
|
|
163
|
+
top: .3rem;
|
|
164
164
|
}
|
|
165
165
|
|
|
166
166
|
}
|
|
@@ -272,11 +272,13 @@
|
|
|
272
272
|
&__wrapper {
|
|
273
273
|
overflow-y: scroll;
|
|
274
274
|
width: 100%;
|
|
275
|
-
height:
|
|
275
|
+
height: 97%;
|
|
276
|
+
padding-top: 0.5rem;
|
|
276
277
|
@include at(lg) {
|
|
277
278
|
overflow: hidden;
|
|
278
279
|
display: grid;
|
|
279
280
|
height: auto;
|
|
281
|
+
padding-top: 0;
|
|
280
282
|
}
|
|
281
283
|
}
|
|
282
284
|
}
|