henry-search 1.0.14 → 1.0.15
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 +6970 -6979
- package/dist/HenrySearch.umd.cjs +79 -79
- package/package.json +7 -1
- package/src/components/AudioLinks.vue +6 -6
- package/src/components/EventLinks.vue +12 -12
- package/src/components/Search.vue +88 -86
- package/src/components/SearchDetail.vue +35 -33
- package/src/components/SearchTab.vue +69 -82
- package/src/main.js +1 -0
- package/src/styles/atoms/audioLinks/index.scss +46 -0
- package/src/styles/atoms/breadCrumb/index.scss +12 -0
- package/src/styles/atoms/checkBoxes/index.scss +34 -0
- package/src/styles/atoms/clearRefinements/index.scss +2 -0
- package/src/styles/atoms/eventLinks/index.scss +22 -0
- package/src/styles/atoms/index.scss +7 -0
- package/src/styles/atoms/label/index.scss +6 -0
- package/src/styles/atoms/menuSelect/index.scss +28 -0
- package/src/styles/config/index.scss +180 -0
- package/src/styles/index.scss +8 -0
- package/src/styles/molecules/accordion/accordion.html +97 -0
- package/src/styles/molecules/accordion/index.scss +76 -0
- package/src/styles/molecules/currentRefinements/index.scss +22 -0
- package/src/styles/molecules/dateRange/index.scss +184 -0
- package/src/styles/molecules/headerLinks/index.scss +40 -0
- package/src/styles/molecules/index.scss +7 -0
- package/src/styles/molecules/pagination/index.scss +44 -0
- package/src/styles/molecules/resultActions/index.scss +42 -0
- package/src/styles/molecules/searchBox/index.scss +69 -0
- package/src/styles/organisms/activeFilters/index.scss +49 -0
- package/src/styles/organisms/filters/index.scss +241 -0
- package/src/styles/organisms/index.scss +4 -0
- package/src/styles/organisms/performanceGrid/index.scss +121 -0
- package/src/styles/organisms/resultsGrid/index.scss +157 -0
- package/src/styles/templates/eventsSearch/index.scss +381 -0
- package/src/styles/templates/history/index.scss +32 -0
- package/src/styles/templates/index.scss +3 -0
- package/src/styles/templates/performance/index.scss +74 -0
- package/src/components/HelloWorld.vue +0 -43
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "henry-search",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.15",
|
|
4
4
|
"description": "Searches a typesense archive of musical performances",
|
|
5
5
|
"main": "js/main.js",
|
|
6
6
|
"scripts": {
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
"homepage": "https://github.com/bostonsymphony/henry-search#readme",
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@babel/runtime": "^7.28.4",
|
|
27
|
+
"@imarc/pronto": "^2.0.0-rc.6",
|
|
27
28
|
"@vitejs/plugin-vue-jsx": "^5.1.1",
|
|
28
29
|
"@vueform/multiselect": "^2.6.11",
|
|
29
30
|
"@vuepic/vue-datepicker": "^11.0.2",
|
|
@@ -43,6 +44,11 @@
|
|
|
43
44
|
".": {
|
|
44
45
|
"import": "./dist/HenrySearch.js",
|
|
45
46
|
"require": "./dist/HenrySearch.umd.js"
|
|
47
|
+
},
|
|
48
|
+
"./dist/HenrySearch.css": {
|
|
49
|
+
"import": "./dist/HenrySearch.css",
|
|
50
|
+
"require": "./dist/HenrySearch.css",
|
|
51
|
+
"default": "./dist/HenrySearch.css"
|
|
46
52
|
}
|
|
47
53
|
},
|
|
48
54
|
"files": [
|
|
@@ -10,16 +10,16 @@ const props = defineProps({
|
|
|
10
10
|
</script>
|
|
11
11
|
|
|
12
12
|
<template>
|
|
13
|
-
<div class="
|
|
14
|
-
<div class="
|
|
15
|
-
<span class="
|
|
16
|
-
<a href="https://forms.office.com/pages/responsepage.aspx?id=OdIW0TyQrUiHfXYXUGXf-OBndBFJDdZNtXXrOlwA-shUNVBBNjZNQkozSEw2SUs3SFU1Q1I2R1VQTCQlQCN0PWcu&fswReload=1&fswNavStart=1674745526953" class="
|
|
13
|
+
<div class="audioLinks__box">
|
|
14
|
+
<div class="audioLinks__links">
|
|
15
|
+
<span class="audioLinks__label -first">Public</span>
|
|
16
|
+
<a href="https://forms.office.com/pages/responsepage.aspx?id=OdIW0TyQrUiHfXYXUGXf-OBndBFJDdZNtXXrOlwA-shUNVBBNjZNQkozSEw2SUs3SFU1Q1I2R1VQTCQlQCN0PWcu&fswReload=1&fswNavStart=1674745526953" class="audioLinks__link -first">Request Form<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
17
17
|
<path d="M2.82893 8.48571L8.48553 2.82911" stroke="#01ABE6" stroke-width="1.5"/>
|
|
18
18
|
<path d="M2.8288 2.82799L8.48553 2.82812L8.48566 8.48485" stroke="#01ABE6" stroke-width="1.5"/>
|
|
19
19
|
</svg>
|
|
20
20
|
</a>
|
|
21
|
-
<span class="
|
|
22
|
-
<a :href="`https://bso.netx.net/app/#search/exact/${ props.audioId }-A`" class="
|
|
21
|
+
<span class="audioLinks__label">BSO Staff</span>
|
|
22
|
+
<a :href="`https://bso.netx.net/app/#search/exact/${ props.audioId }-A`" class="audioLinks__link">Login<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
23
23
|
<path d="M2.82893 8.48571L8.48553 2.82911" stroke="#01ABE6" stroke-width="1.5"/>
|
|
24
24
|
<path d="M2.8288 2.82799L8.48553 2.82812L8.48566 8.48485" stroke="#01ABE6" stroke-width="1.5"/>
|
|
25
25
|
</svg>
|
|
@@ -20,7 +20,7 @@ const props = defineProps({
|
|
|
20
20
|
|
|
21
21
|
const showAudioLinks = (event) => {
|
|
22
22
|
event.stopPropagation()
|
|
23
|
-
const audioLinkBox = event.currentTarget.parentElement.querySelector(".
|
|
23
|
+
const audioLinkBox = event.currentTarget.parentElement.querySelector(".audioLinks__box")
|
|
24
24
|
audioLinkBox.classList.toggle("-open")
|
|
25
25
|
}
|
|
26
26
|
|
|
@@ -29,10 +29,10 @@ const showAudioLinks = (event) => {
|
|
|
29
29
|
|
|
30
30
|
<template>
|
|
31
31
|
<template v-if="props.detail">
|
|
32
|
-
<div class="
|
|
32
|
+
<div class="headerLinks__media">
|
|
33
33
|
<template v-if="props.item.program_book_link">
|
|
34
|
-
<a :href="props.item.
|
|
35
|
-
<svg class="
|
|
34
|
+
<a :href="props.item.program_book_link" target="_new">
|
|
35
|
+
<svg class="headerLinks__icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
36
36
|
<circle cx="12" cy="12" r="12" fill="#01ABE6"/>
|
|
37
37
|
<path d="M8.30469 16.0947L15.8468 8.55259" stroke="white" stroke-width="2"/>
|
|
38
38
|
<path d="M8.30469 8.55127L15.847 8.55144L15.8472 16.0937" stroke="white" stroke-width="2"/>
|
|
@@ -42,7 +42,7 @@ const showAudioLinks = (event) => {
|
|
|
42
42
|
</template>
|
|
43
43
|
<template v-if="props.item.media && props.item.media.includes('audio') && props.item.bso_audio_id">
|
|
44
44
|
<a @click="showAudioLinks">
|
|
45
|
-
<svg class="
|
|
45
|
+
<svg class="headerLinks__icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
46
46
|
<circle cx="12" cy="12" r="12" fill="#01ABE6"/>
|
|
47
47
|
<path d="M13.081 6.66675L9.23961 9.73985H6.1665V14.3495H9.23961L13.081 17.4226V6.66675Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
48
48
|
<path d="M16.5688 9.32495C17.289 10.0453 17.6936 11.0222 17.6936 12.0408C17.6936 13.0594 17.289 14.0363 16.5688 14.7567" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
@@ -53,7 +53,7 @@ const showAudioLinks = (event) => {
|
|
|
53
53
|
</template>
|
|
54
54
|
</div>
|
|
55
55
|
<a onclick="navigator.clipboard.writeText(window.location.href);">
|
|
56
|
-
<svg class="
|
|
56
|
+
<svg class="headerLinks__icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
57
57
|
<circle cx="12" cy="12" r="11.25" fill="white" stroke="#01ABE6" stroke-width="1.5"/>
|
|
58
58
|
<path d="M11.0835 12.6969C11.3142 13.0223 11.6086 13.2915 11.9466 13.4864C12.2846 13.6812 12.6584 13.797 13.0427 13.8261C13.4269 13.8551 13.8125 13.7966 14.1734 13.6546C14.5343 13.5126 14.862 13.2903 15.1343 13.0029L16.7461 11.3026C17.2354 10.7681 17.5062 10.0523 17.5 9.30925C17.4939 8.56622 17.2114 7.85545 16.7134 7.33002C16.2153 6.8046 15.5416 6.50656 14.8372 6.50011C14.1329 6.49365 13.4544 6.77929 12.9477 7.2955L12.0237 8.26469" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
59
59
|
<path d="M13.8333 11.3032C13.5696 10.9778 13.2332 10.7085 12.8469 10.5137C12.4606 10.3189 12.0334 10.203 11.5943 10.174C11.1552 10.145 10.7145 10.2034 10.302 10.3455C9.88955 10.4875 9.515 10.7097 9.20377 10.9971L7.36178 12.6975C6.80256 13.2319 6.49312 13.9478 6.50012 14.6908C6.50711 15.4338 6.82998 16.1446 7.39918 16.67C7.96838 17.1955 8.73837 17.4935 9.54331 17.5C10.3483 17.5064 11.1237 17.2208 11.7027 16.7046L12.7527 15.7354" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
@@ -62,24 +62,24 @@ const showAudioLinks = (event) => {
|
|
|
62
62
|
</a>
|
|
63
63
|
</template>
|
|
64
64
|
<template v-else>
|
|
65
|
-
<div :class="`
|
|
65
|
+
<div :class="`eventLinks ${ props.extraClasses }`">
|
|
66
66
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
67
67
|
<circle cx="9" cy="9" r="9" fill="#01ABE6"/>
|
|
68
68
|
<path d="M5 9H13" stroke="white" stroke-width="1.5"/>
|
|
69
69
|
<path d="M9 5L13 9L9 13" stroke="white" stroke-width="1.5"/>
|
|
70
70
|
</svg>
|
|
71
|
-
<a class="
|
|
71
|
+
<a class="eventLinks__details" :href="`/details?performanceId=${props.item.id}`" :title="formatDate(item.performance_date) + ' Details'">Details</a>
|
|
72
72
|
</div>
|
|
73
|
-
<div v-if="props.item.program_book_link" :class="`
|
|
73
|
+
<div v-if="props.item.program_book_link" :class="`eventLinks ${ props.extraClasses }`">
|
|
74
74
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
75
75
|
<circle cx="9" cy="9" r="8.25" fill="white" stroke="#01ABE6" stroke-width="1.5"/>
|
|
76
76
|
<path d="M6.22876 12.0713L11.8854 6.41469" stroke="#01ABE6" stroke-width="1.5"/>
|
|
77
77
|
<path d="M6.22864 6.41382L11.8854 6.41395L11.8855 12.0707" stroke="#01ABE6" stroke-width="1.5"/>
|
|
78
78
|
</svg>
|
|
79
|
-
<a class="
|
|
79
|
+
<a class="eventLinks__details" target="_new" :href="props.item.program_book_link" :title="formatDate(item.performance_date) + ' Details'">Program</a>
|
|
80
80
|
</div>
|
|
81
|
-
<div v-if="props.item.media && props.item.media.includes('audio') && props.item.bso_audio_id" :class="`
|
|
82
|
-
<button class="
|
|
81
|
+
<div v-if="props.item.media && props.item.media.includes('audio') && props.item.bso_audio_id" :class="`eventLinks ${ props.extraClasses }`">
|
|
82
|
+
<button class="eventLinks__details" @click="showAudioLinks" :title="formatDate(item.performance_date) + ' Audio'">
|
|
83
83
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
84
84
|
<circle cx="9" cy="9" r="8.25" fill="white" stroke="#01ABE6" stroke-width="1.5"/>
|
|
85
85
|
<path d="M9.81086 5L6.92983 7.30483H4.625V10.7621H6.92983L9.81086 13.0669V5Z" fill="white" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
@@ -132,13 +132,15 @@
|
|
|
132
132
|
|
|
133
133
|
const formatWorkAttribute = (works, attributeName) => {
|
|
134
134
|
const attributeArray = []
|
|
135
|
-
works
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
135
|
+
if (works) {
|
|
136
|
+
works.forEach((w) => {
|
|
137
|
+
w[attributeName].forEach((attr) => {
|
|
138
|
+
if (!attributeArray.includes(attr)) {
|
|
139
|
+
attributeArray.push(attr)
|
|
140
|
+
}
|
|
141
|
+
})
|
|
142
|
+
})
|
|
143
|
+
}
|
|
142
144
|
return attributeArray.join("; ")
|
|
143
145
|
}
|
|
144
146
|
|
|
@@ -162,59 +164,59 @@
|
|
|
162
164
|
:search-host="props.searchHost"
|
|
163
165
|
>
|
|
164
166
|
<template v-slot="{ items }">
|
|
165
|
-
<div class="
|
|
167
|
+
<div class="resultsGrid" v-if="items && items.length">
|
|
166
168
|
<!-- Header Row -->
|
|
167
|
-
<div class="
|
|
168
|
-
<div class="
|
|
169
|
-
<div class="
|
|
170
|
-
<div class="
|
|
171
|
-
<div class="
|
|
172
|
-
<div class="
|
|
173
|
-
<div class="
|
|
169
|
+
<div class="resultsGrid__cell -header -first">Date/Season/Title</div>
|
|
170
|
+
<div class="resultsGrid__cell -header">Venue</div>
|
|
171
|
+
<div class="resultsGrid__cell -header">Ensemble</div>
|
|
172
|
+
<div class="resultsGrid__cell -header">Conductor</div>
|
|
173
|
+
<div class="resultsGrid__cell -header">Composer/Work</div>
|
|
174
|
+
<div class="resultsGrid__cell -header">Artist/Role</div>
|
|
175
|
+
<div class="resultsGrid__cell -header">View</div>
|
|
174
176
|
<template v-for="item, index in items">
|
|
175
177
|
<template v-if="item.works && item.works.length" v-for="w, i in item.works.slice(0, 6)">
|
|
176
178
|
<!-- First row of an event -->
|
|
177
179
|
<template v-if="i == 0">
|
|
178
|
-
<div :class="`
|
|
179
|
-
<span class="
|
|
180
|
+
<div :class="`resultsGrid__cell -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
181
|
+
<span class="resultsGrid__mobileHeader">Date/Season/Title</span>
|
|
180
182
|
{{ formatDate(item.performance_date) }} / {{ item.season + (item.event_title ? " / " + item.event_title : "")}}
|
|
181
183
|
</div>
|
|
182
|
-
<div :class="`
|
|
183
|
-
<span class="
|
|
184
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${((index + 1 == items.length && (i + 1 == item.works.length || i == 5)) && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
185
|
+
<span class="resultsGrid__mobileHeader">Venue</span>
|
|
184
186
|
{{ item.venue }} {{ formatLocation(item.location) }}
|
|
185
187
|
</div>
|
|
186
|
-
<div :class="`
|
|
188
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'}
|
|
187
189
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
188
|
-
<span class="
|
|
189
|
-
<span class="
|
|
190
|
-
<span class="
|
|
190
|
+
<span class="resultsGrid__mobileHeader">Ensemble</span>
|
|
191
|
+
<span class="resultsGrid__ensembles">{{ w.ensembles.join('; ')}}</span>
|
|
192
|
+
<span class="resultsGrid__ensemblesMobile">{{ formatWorkAttribute(item.works, 'ensembles') }}</span>
|
|
191
193
|
</div>
|
|
192
|
-
<div :class="`
|
|
194
|
+
<div :class="`resultsGrid__cell
|
|
193
195
|
${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
194
|
-
<span class="
|
|
195
|
-
<span class="
|
|
196
|
-
<span class="
|
|
196
|
+
<span class="resultsGrid__mobileHeader">Conductor</span>
|
|
197
|
+
<span class="resultsGrid__conductors">{{ w.conductors.join('; ') }}</span>
|
|
198
|
+
<span class="resultsGrid__conductorsMobile">{{ formatWorkAttribute(item.works, 'conductors') }}</span>
|
|
197
199
|
</div>
|
|
198
|
-
<div :class="`
|
|
200
|
+
<div :class="`resultsGrid__cell -work
|
|
199
201
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
200
202
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
201
|
-
<span class="
|
|
203
|
+
<span class="resultsGrid__mobileHeader">Composer/Work</span>
|
|
202
204
|
{{ w?.composers?.join("; ") }} / {{ w?.title }}
|
|
203
205
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" v-if="w.has_recording">
|
|
204
206
|
<path d="M9.81086 5L6.92983 7.30483H4.625V10.7621H6.92983L9.81086 13.0669V5Z" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
205
207
|
<path d="M12.4268 6.99365C12.9669 7.53393 13.2703 8.2666 13.2703 9.03054C13.2703 9.79449 12.9669 10.5272 12.4268 11.0674" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
206
208
|
</svg>
|
|
207
209
|
</div>
|
|
208
|
-
<div :class="`
|
|
209
|
-
<span class="
|
|
210
|
+
<div :class="`resultsGrid__cell -artist ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`" v-if="w.artists && w.artists.length < 3">
|
|
211
|
+
<span class="resultsGrid__mobileHeader">Artist/Role</span>
|
|
210
212
|
{{ w.artists.map((artist) => artist.name + '/' + artist.role).join('; ') }}
|
|
211
213
|
</div>
|
|
212
|
-
<div :class="`
|
|
213
|
-
<span class="
|
|
214
|
+
<div :class="`resultsGrid__cell -artist ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`" v-else>
|
|
215
|
+
<span class="resultsGrid__mobileHeader">Artist/Role</span>
|
|
214
216
|
{{ w.artists ? w.artists.map((artist) => artist.name + '/' + artist.role).slice(0, 2).join('; ') : ""}}
|
|
215
217
|
<br/><a v-if="w.artists" :href="`/details?performanceId=${item.id}`">More...</a>
|
|
216
218
|
</div>
|
|
217
|
-
<div :class="`
|
|
219
|
+
<div :class="`resultsGrid__cell -detailsMobile
|
|
218
220
|
${item.works.length > 1 ? '-details' : '' }
|
|
219
221
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
220
222
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last -lastMobile' : ''}`">
|
|
@@ -223,16 +225,16 @@
|
|
|
223
225
|
</template>
|
|
224
226
|
<!-- Additional event rows -->
|
|
225
227
|
<template v-else-if="i > 0 && i <= 4">
|
|
226
|
-
<div :class="`
|
|
227
|
-
<div :class="`
|
|
228
|
-
<div :class="`
|
|
228
|
+
<div :class="`resultsGrid__cell -empty -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
229
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
230
|
+
<div :class="`resultsGrid__cell -empty
|
|
229
231
|
${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
230
232
|
{{ w.ensembles.join('; ')}}
|
|
231
233
|
</div>
|
|
232
|
-
<div :class="`
|
|
234
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
233
235
|
{{ w.conductors.join('; ') }}
|
|
234
236
|
</div>
|
|
235
|
-
<div :class="`
|
|
237
|
+
<div :class="`resultsGrid__cell -work
|
|
236
238
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
237
239
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
238
240
|
{{ w?.composers?.join("; ") }} / {{ w?.title }}
|
|
@@ -241,20 +243,20 @@
|
|
|
241
243
|
<path d="M12.4268 6.99365C12.9669 7.53393 13.2703 8.2666 13.2703 9.03054C13.2703 9.79449 12.9669 10.5272 12.4268 11.0674" stroke="#01ABE6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
242
244
|
</svg>
|
|
243
245
|
</div>
|
|
244
|
-
<div :class="`
|
|
246
|
+
<div :class="`resultsGrid__cell -artist
|
|
245
247
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
246
248
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"
|
|
247
249
|
v-if="w.artists && w.artists.length < 3">
|
|
248
250
|
{{ w.artists.map((artist) => artist.name + '/' + artist.role).join('; ') }}
|
|
249
251
|
</div>
|
|
250
|
-
<div :class="`
|
|
252
|
+
<div :class="`resultsGrid__cell -artist
|
|
251
253
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
252
254
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"
|
|
253
255
|
v-else>
|
|
254
256
|
{{ w.artists ? w.artists.map((artist) => artist.name + '/' + artist.role).slice(0, 2).join('; ') : ""}}
|
|
255
257
|
<br/><a v-if="w.artists" :href="`/details?performanceId=${item.id}`">More...</a>
|
|
256
258
|
</div>
|
|
257
|
-
<div :class="`
|
|
259
|
+
<div :class="`resultsGrid__cell -detailsMobile
|
|
258
260
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
259
261
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 4)) ? '-last -lastMobile' : ''}
|
|
260
262
|
${ !(i + 1 == item.works.length || i == 5) ? '-empty' : ''}`">
|
|
@@ -264,16 +266,16 @@
|
|
|
264
266
|
</div>
|
|
265
267
|
</template>
|
|
266
268
|
<template v-else-if="i > 4">
|
|
267
|
-
<div :class="`
|
|
268
|
-
<div :class="`
|
|
269
|
-
<div :class="`
|
|
270
|
-
<div :class="`
|
|
271
|
-
<div :class="`
|
|
269
|
+
<div :class="`resultsGrid__cell -empty -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
270
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
271
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
272
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
273
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`">
|
|
272
274
|
<a :href="`/details?performanceId=${item.id}`">More...</a>
|
|
273
275
|
</div>
|
|
274
276
|
|
|
275
|
-
<div :class="`
|
|
276
|
-
<div :class="`
|
|
277
|
+
<div :class="`resultsGrid__cell -empty ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last' : ''}`"></div>
|
|
278
|
+
<div :class="`resultsGrid__cell -detailsMobile
|
|
277
279
|
${index % 2 == 0 ? '-even' : '-odd'}
|
|
278
280
|
${(index + 1 == items.length && (i + 1 == item.works.length || i == 5)) ? '-last -lastMobile' : ''}
|
|
279
281
|
${ !(i + 1 == item.works.length || i == 5) ? '-empty' : ''}`">
|
|
@@ -284,27 +286,27 @@
|
|
|
284
286
|
</template>
|
|
285
287
|
</template>
|
|
286
288
|
<template v-if="!item.works || item.works.length == 0">
|
|
287
|
-
<div :class="`
|
|
288
|
-
<span class="
|
|
289
|
+
<div :class="`resultsGrid__cell -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
290
|
+
<span class="resultsGrid__mobileHeader">Date/Season/Title</span>
|
|
289
291
|
{{ formatDate(item.performance_date) }} / {{ item.season + (item.event_title ? " / " + item.event_title : "")}}
|
|
290
292
|
</div>
|
|
291
|
-
<div :class="`
|
|
292
|
-
<span class="
|
|
293
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
294
|
+
<span class="resultsGrid__mobileHeader">Venue</span>
|
|
293
295
|
{{ item.venue }} {{ formatLocation(item.location) }}
|
|
294
296
|
</div>
|
|
295
|
-
<div :class="`
|
|
297
|
+
<div :class="`resultsGrid__cell
|
|
296
298
|
${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
297
|
-
<span class="
|
|
299
|
+
<span class="resultsGrid__mobileHeader">Ensemble</span>
|
|
298
300
|
{{ item.ensembles ? item.ensembles.join('; ') : ""}}
|
|
299
301
|
</div>
|
|
300
|
-
<div :class="`
|
|
302
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'}
|
|
301
303
|
${(index + 1 == items.length) ? '-last' : ''}`">
|
|
302
|
-
<span class="
|
|
304
|
+
<span class="resultsGrid__mobileHeader">Conductor</span>
|
|
303
305
|
{{ item.conductors.join('; ') }}
|
|
304
306
|
</div>
|
|
305
|
-
<div :class="`
|
|
306
|
-
<div :class="`
|
|
307
|
-
<div :class="`
|
|
307
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`"><span class="resultsGrid__mobileHeader">Composer/Work</span></div>
|
|
308
|
+
<div :class="`resultsGrid__cell -hideMobile ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`"></div>
|
|
309
|
+
<div :class="`resultsGrid__cell -detailsMobile ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
308
310
|
<event-links :item="item" />
|
|
309
311
|
|
|
310
312
|
</div>
|
|
@@ -330,37 +332,37 @@
|
|
|
330
332
|
>
|
|
331
333
|
<template v-slot="{ items }">
|
|
332
334
|
<div class="eventsSearch__artistsGrid">
|
|
333
|
-
<div class="
|
|
334
|
-
<div class="
|
|
335
|
-
<div class="
|
|
336
|
-
<div class="
|
|
335
|
+
<div class="resultsGrid__cell -header -first">Artist</div>
|
|
336
|
+
<div class="resultsGrid__cell -header">Instrument/Role</div>
|
|
337
|
+
<div class="resultsGrid__cell -header">Composer/Work</div>
|
|
338
|
+
<div class="resultsGrid__cell -header"># of Performances</div>
|
|
337
339
|
|
|
338
340
|
<template v-for="item, index in items">
|
|
339
|
-
<div :class="`
|
|
340
|
-
<span class="
|
|
341
|
+
<div :class="`resultsGrid__cell -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
342
|
+
<span class="resultsGrid__mobileHeader">Artist</span>
|
|
341
343
|
<a :href="createURL([{ facet: 'works.artists.name', value: item.artist_name}])">
|
|
342
344
|
{{ item.artist_name }}
|
|
343
345
|
</a>
|
|
344
346
|
</div>
|
|
345
|
-
<div :class="`
|
|
346
|
-
<span class="
|
|
347
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
348
|
+
<span class="resultsGrid__mobileHeader">Role</span>
|
|
347
349
|
<a :href="createURL([{ facet: 'works.artists.role', value: item.artist_role }])">
|
|
348
350
|
{{ item.artist_role }}
|
|
349
351
|
</a>
|
|
350
352
|
</div>
|
|
351
|
-
<div :class="`
|
|
352
|
-
<span class="
|
|
353
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
354
|
+
<span class="resultsGrid__mobileHeader">Composer/Work</span>
|
|
353
355
|
<a :href="createURL([{ facet: 'works.title', value: item.work_title }])">
|
|
354
356
|
{{ item.composer }} / {{ item.work_title }}
|
|
355
357
|
</a>
|
|
356
358
|
</div>
|
|
357
|
-
<div :class="`
|
|
358
|
-
<span class="
|
|
359
|
+
<div :class="`resultsGrid__cell -perfs ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
360
|
+
<span class="resultsGrid__mobileHeader"># of Performances</span>
|
|
359
361
|
<a :href="createURL([{ facet: 'works.artists.name', value: item.artist_name},
|
|
360
362
|
{ facet: 'works.artists.role', value: item.artist_role },
|
|
361
363
|
{ facet: 'works.title', value: item.work_title }
|
|
362
364
|
])">
|
|
363
|
-
<span class="
|
|
365
|
+
<span class="resultsGrid__lightLink">{{ item.num_performances }} Performances</span>
|
|
364
366
|
|
|
365
367
|
</a>
|
|
366
368
|
</div>
|
|
@@ -386,27 +388,27 @@
|
|
|
386
388
|
>
|
|
387
389
|
<template v-slot="{ items }">
|
|
388
390
|
<div class="eventsSearch__worksGrid">
|
|
389
|
-
<div class="
|
|
390
|
-
<div class="
|
|
391
|
-
<div class="
|
|
392
|
-
<div class="
|
|
391
|
+
<div class="resultsGrid__cell -header -first">Composer</div>
|
|
392
|
+
<div class="resultsGrid__cell -header">Work</div>
|
|
393
|
+
<div class="resultsGrid__cell -header">Additional Creator</div>
|
|
394
|
+
<div class="resultsGrid__cell -header"># of times Performed</div>
|
|
393
395
|
<template v-for="item, index in items">
|
|
394
|
-
<div :class="`
|
|
395
|
-
<span class="
|
|
396
|
+
<div :class="`resultsGrid__cell -first ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
397
|
+
<span class="resultsGrid__mobileHeader">Composer</span>
|
|
396
398
|
<a v-for="composer, index in item.composers"
|
|
397
399
|
:href="createURL([{ facet: 'works.composers', value: composer}])">
|
|
398
400
|
{{ `${composer}${index < item.composers.length && item.composers.length > 1 ? '; ' : ''}` }}
|
|
399
401
|
</a>
|
|
400
402
|
</div>
|
|
401
|
-
<div :class="`
|
|
402
|
-
<span class="
|
|
403
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
404
|
+
<span class="resultsGrid__mobileHeader">Work</span>
|
|
403
405
|
<a v-for="title, index in item.title"
|
|
404
406
|
:href="createURL([{ facet: 'works.title', value: title}])">
|
|
405
407
|
{{ `${title}${index < item.title.length && item.title.length > 1 ? '; ' : ''}` }}
|
|
406
408
|
</a>
|
|
407
409
|
</div>
|
|
408
|
-
<div :class="`
|
|
409
|
-
<span class="
|
|
410
|
+
<div :class="`resultsGrid__cell ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
411
|
+
<span class="resultsGrid__mobileHeader">Additional Creator</span>
|
|
410
412
|
<a v-if="item.creators && item.creators.length" v-for="creator, index in item.creators"
|
|
411
413
|
:href="createURL([{ facet: 'works.additional_creators.name', value: creator.name}])">
|
|
412
414
|
<template v-if="(typeof creator !== 'undefined' && creator && typeof creator.name !== 'undefined' && typeof creator.role !== 'undefined')">
|
|
@@ -414,12 +416,12 @@
|
|
|
414
416
|
</template>
|
|
415
417
|
</a>
|
|
416
418
|
</div>
|
|
417
|
-
<div :class="`
|
|
418
|
-
<span class="
|
|
419
|
+
<div :class="`resultsGrid__cell -perfs ${index % 2 == 0 ? '-even' : '-odd'} ${(index + 1 == items.length) ? '-last' : ''}`">
|
|
420
|
+
<span class="resultsGrid__mobileHeader"># of times Performed</span>
|
|
419
421
|
<a :href="createURL([{ facet: 'works.composers', value: item.composers},
|
|
420
422
|
{ facet: 'works.title', value: item.title}
|
|
421
423
|
])">
|
|
422
|
-
<span class="
|
|
424
|
+
<span class="resultsGrid__lightLink">{{ item.num_performances }} Performances</span>
|
|
423
425
|
</a>
|
|
424
426
|
</div>
|
|
425
427
|
</template>
|