diff --git a/client/agenda/AgendaQuickAccess.vue b/client/agenda/AgendaQuickAccess.vue index 8823ca13e..d080e5dd4 100644 --- a/client/agenda/AgendaQuickAccess.vue +++ b/client/agenda/AgendaQuickAccess.vue @@ -74,7 +74,6 @@ size='large' :show-arrow='true' trigger='click' - @select='downloadIcs' ) n-button.mt-2( id='agenda-quickaccess-addtocal-btn' @@ -141,14 +140,26 @@ const route = useRoute() const downloadIcsOptions = [ { - label: 'Subscribe... (webcal)', key: 'subscribe', - icon: () => h('i', { class: 'bi bi-calendar-week text-blue' }) + type: 'render', + render: () => h('a', { + class: 'agenda-quickaccess-callinks', + href: `webcal://${window.location.host}${icsLink.value}` + }, [ + h('i', { class: 'bi bi-calendar-week text-blue' }), + h('span', 'Subscribe... (webcal)') + ]) }, { - label: 'Download... (.ics)', key: 'download', - icon: () => h('i', { class: 'bi bi-arrow-down-square' }) + type: 'render', + render: () => h('a', { + class: 'agenda-quickaccess-callinks', + href: icsLink.value + }, [ + h('i', { class: 'bi bi-arrow-down-square' }), + h('span', 'Download... (.ics)') + ]) } ] @@ -158,6 +169,17 @@ const shortMode = computed(() => { return siteStore.viewport <= 1350 }) +const icsLink = computed(() => { + if (agendaStore.pickerMode) { + const sessionKeywords = agendaStore.scheduleAdjusted.map(s => s.sessionKeyword) + return `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${sessionKeywords.join(',')}` + } else if (agendaStore.selectedCatSubs.length > 0) { + return `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${agendaStore.selectedCatSubs.join(',')}` + } else { + return `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}` + } +}) + // METHODS function pickerStart () { @@ -177,24 +199,6 @@ function pickerDiscard () { } } -function downloadIcs (key) { - message.loading('Generating calendar file... Download will begin shortly.') - let icsUrl = '' - if (agendaStore.pickerMode) { - const sessionKeywords = agendaStore.scheduleAdjusted.map(s => s.sessionKeyword) - icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${sessionKeywords.join(',')}` - } else if (agendaStore.selectedCatSubs.length > 0) { - icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${agendaStore.selectedCatSubs.join(',')}` - } else { - icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}` - } - if (key === 'subscribe') { - window.location.assign(`webcal://${window.location.host}${icsUrl}`) - } else { - window.location.assign(icsUrl) - } -} - function scrollToDay (dayId, ev) { ev.preventDefault() document.getElementById(`agenda-day-${dayId}`)?.scrollIntoView(true) @@ -284,5 +288,24 @@ function scrollToNow (ev) { margin-top: 15px; margin-bottom: 15px; } + + &-callinks { + padding: 8px 16px; + display: flex; + text-decoration: none; + align-items: center; + + &:hover, &:focus { + text-decoration: underline; + } + + > i { + font-size: var(--n-font-size); + } + + > span { + margin-left: 12px; + } + } } diff --git a/playwright/tests/meeting/agenda.spec.js b/playwright/tests/meeting/agenda.spec.js index 0bc247996..a68fdeff2 100644 --- a/playwright/tests/meeting/agenda.spec.js +++ b/playwright/tests/meeting/agenda.spec.js @@ -928,7 +928,7 @@ test.describe('past - desktop', () => { test('agenda add to calendar', async ({ page }) => { await expect(page.locator('#agenda-quickaccess-addtocal-btn')).toContainText('Add to your calendar') await page.locator('#agenda-quickaccess-addtocal-btn').click() - const ddnLocator = page.locator('.n-dropdown-menu > .n-dropdown-option') + const ddnLocator = page.locator('.n-dropdown-menu > div > a.agenda-quickaccess-callinks') await expect(ddnLocator).toHaveCount(2) await expect(ddnLocator.first()).toContainText('Subscribe') await expect(ddnLocator.last()).toContainText('Download')