feat(new tools): iCal Generator/Merger/Parser
iCal file generator, merger and parser
This commit is contained in:
sharevb
ShareVB
parent
1c35ac3704
commit
6896d03a3a
14
components.d.ts
vendored
14
components.d.ts
vendored
@ -89,6 +89,9 @@ declare module '@vue/runtime-core' {
|
||||
HtmlWysiwygEditor: typeof import('./src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue')['default']
|
||||
HttpStatusCodes: typeof import('./src/tools/http-status-codes/http-status-codes.vue')['default']
|
||||
IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default']
|
||||
IcalGenerator: typeof import('./src/tools/ical-generator/ical-generator.vue')['default']
|
||||
IcalMerger: typeof import('./src/tools/ical-merger/ical-merger.vue')['default']
|
||||
IcalParser: typeof import('./src/tools/ical-parser/ical-parser.vue')['default']
|
||||
'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default']
|
||||
'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default']
|
||||
IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
|
||||
@ -130,17 +133,28 @@ declare module '@vue/runtime-core' {
|
||||
MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
|
||||
MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
|
||||
NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
|
||||
NButton: typeof import('naive-ui')['NButton']
|
||||
NCheckbox: typeof import('naive-ui')['NCheckbox']
|
||||
NCode: typeof import('naive-ui')['NCode']
|
||||
NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
|
||||
NConfigProvider: typeof import('naive-ui')['NConfigProvider']
|
||||
NDatePicker: typeof import('naive-ui')['NDatePicker']
|
||||
NDivider: typeof import('naive-ui')['NDivider']
|
||||
NEllipsis: typeof import('naive-ui')['NEllipsis']
|
||||
NFormItem: typeof import('naive-ui')['NFormItem']
|
||||
NGi: typeof import('naive-ui')['NGi']
|
||||
NGrid: typeof import('naive-ui')['NGrid']
|
||||
NH1: typeof import('naive-ui')['NH1']
|
||||
NH3: typeof import('naive-ui')['NH3']
|
||||
NIcon: typeof import('naive-ui')['NIcon']
|
||||
NInput: typeof import('naive-ui')['NInput']
|
||||
NInputGroup: typeof import('naive-ui')['NInputGroup']
|
||||
NLayout: typeof import('naive-ui')['NLayout']
|
||||
NLayoutSider: typeof import('naive-ui')['NLayoutSider']
|
||||
NMenu: typeof import('naive-ui')['NMenu']
|
||||
NRadio: typeof import('naive-ui')['NRadio']
|
||||
NRadioGroup: typeof import('naive-ui')['NRadioGroup']
|
||||
NScrollbar: typeof import('naive-ui')['NScrollbar']
|
||||
NSpace: typeof import('naive-ui')['NSpace']
|
||||
NTable: typeof import('naive-ui')['NTable']
|
||||
NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
|
||||
|
||||
@ -68,6 +68,8 @@
|
||||
"highlight.js": "^11.7.0",
|
||||
"iarna-toml-esm": "^3.0.5",
|
||||
"ibantools": "^4.3.3",
|
||||
"ical-generator": "^8.0.0",
|
||||
"ical.js": "^2.1.0",
|
||||
"js-base64": "^3.7.6",
|
||||
"json5": "^2.2.3",
|
||||
"jwt-decode": "^3.1.2",
|
||||
|
||||
58
pnpm-lock.yaml
generated
58
pnpm-lock.yaml
generated
@ -101,6 +101,12 @@ dependencies:
|
||||
ibantools:
|
||||
specifier: ^4.3.3
|
||||
version: 4.3.3
|
||||
ical-generator:
|
||||
specifier: ^8.0.0
|
||||
version: 8.0.0(@types/node@18.15.11)
|
||||
ical.js:
|
||||
specifier: ^2.1.0
|
||||
version: 2.1.0
|
||||
js-base64:
|
||||
specifier: ^3.7.6
|
||||
version: 3.7.7
|
||||
@ -3043,7 +3049,6 @@ packages:
|
||||
|
||||
/@types/node@18.15.11:
|
||||
resolution: {integrity: sha512-E5Kwq2n4SbMzQOn6wnmBjuK9ouqlURrcZDVfbo9ftDDTFt3nk7ZKK4GMOzoYgnpQJKcxwQw+lGaBvvlMo0qN/Q==}
|
||||
dev: true
|
||||
|
||||
/@types/node@18.18.8:
|
||||
resolution: {integrity: sha512-OLGBaaK5V3VRBS1bAkMVP2/W9B+H8meUfl866OrMNQqt7wDgdpWPp5o6gmIc9pB+lIQHSq4ZL8ypeH1vPxcPaQ==}
|
||||
@ -3395,7 +3400,7 @@ packages:
|
||||
dependencies:
|
||||
'@unhead/dom': 0.5.1
|
||||
'@unhead/schema': 0.5.1
|
||||
'@vueuse/shared': 11.0.3(vue@3.3.4)
|
||||
'@vueuse/shared': 11.1.0(vue@3.3.4)
|
||||
unhead: 0.5.1
|
||||
vue: 3.3.4
|
||||
transitivePeerDependencies:
|
||||
@ -4037,8 +4042,8 @@ packages:
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@11.0.3(vue@3.3.4):
|
||||
resolution: {integrity: sha512-0rY2m6HS5t27n/Vp5cTDsKTlNnimCqsbh/fmT2LgE+aaU42EMfXo8+bNX91W9I7DDmxfuACXMmrd7d79JxkqWA==}
|
||||
/@vueuse/shared@11.1.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-YUtIpY122q7osj+zsNMFAfMTubGz0sn5QzE5gPzAIiCmtt2ha3uQUY1+JPyL4gRCTsLPX82Y9brNbo/aqlA91w==}
|
||||
dependencies:
|
||||
vue-demi: 0.14.10(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
@ -6145,6 +6150,47 @@ packages:
|
||||
resolution: {integrity: sha512-RUTlGuFj3cU/Qfu5YIrsIZjW34/VDgKOz5fDr64Mc4NWP9b2i48vQ39r5xCl1yyFQeyEG/lASstIQHAUX18rRA==}
|
||||
dev: false
|
||||
|
||||
/ical-generator@8.0.0(@types/node@18.15.11):
|
||||
resolution: {integrity: sha512-CvVKK3JJrKop6z7i7/NS69FjYdR6ux1LswIeiZ3yaicX7ocMFLQI475JhQabCT7koUkaCVFNVxLaYaxtdPgwww==}
|
||||
engines: {node: 18 || 20 || >=22.0.0}
|
||||
peerDependencies:
|
||||
'@touch4it/ical-timezones': '>=1.6.0'
|
||||
'@types/luxon': '>= 1.26.0'
|
||||
'@types/mocha': '>= 8.2.1'
|
||||
'@types/node': '*'
|
||||
dayjs: '>= 1.10.0'
|
||||
luxon: '>= 1.26.0'
|
||||
moment: '>= 2.29.0'
|
||||
moment-timezone: '>= 0.5.33'
|
||||
rrule: '>= 2.6.8'
|
||||
peerDependenciesMeta:
|
||||
'@touch4it/ical-timezones':
|
||||
optional: true
|
||||
'@types/luxon':
|
||||
optional: true
|
||||
'@types/mocha':
|
||||
optional: true
|
||||
'@types/node':
|
||||
optional: true
|
||||
dayjs:
|
||||
optional: true
|
||||
luxon:
|
||||
optional: true
|
||||
moment:
|
||||
optional: true
|
||||
moment-timezone:
|
||||
optional: true
|
||||
rrule:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@types/node': 18.15.11
|
||||
uuid-random: 1.3.2
|
||||
dev: false
|
||||
|
||||
/ical.js@2.1.0:
|
||||
resolution: {integrity: sha512-BOVfrH55xQ6kpS3muGvIXIg2l7p+eoe12/oS7R5yrO3TL/j/bLsR0PR+tYQESFbyTbvGgPHn9zQ6tI4FWyuSaQ==}
|
||||
dev: false
|
||||
|
||||
/iconv-lite@0.6.3:
|
||||
resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
|
||||
engines: {node: '>=0.10.0'}
|
||||
@ -9032,6 +9078,10 @@ packages:
|
||||
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
|
||||
dev: true
|
||||
|
||||
/uuid-random@1.3.2:
|
||||
resolution: {integrity: sha512-UOzej0Le/UgkbWEO8flm+0y+G+ljUon1QWTEZOq1rnMAsxo2+SckbiZdKzAHHlVh6gJqI1TjC/xwgR50MuCrBQ==}
|
||||
dev: false
|
||||
|
||||
/uuid@9.0.0:
|
||||
resolution: {integrity: sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==}
|
||||
dev: false
|
||||
|
||||
@ -7,8 +7,15 @@ import sqlHljs from 'highlight.js/lib/languages/sql';
|
||||
import xmlHljs from 'highlight.js/lib/languages/xml';
|
||||
import yamlHljs from 'highlight.js/lib/languages/yaml';
|
||||
import iniHljs from 'highlight.js/lib/languages/ini';
|
||||
import bashHljs from 'highlight.js/lib/languages/bash';
|
||||
import markdownHljs from 'highlight.js/lib/languages/markdown';
|
||||
import jsHljs from 'highlight.js/lib/languages/javascript';
|
||||
import cssHljs from 'highlight.js/lib/languages/css';
|
||||
import goHljs from 'highlight.js/lib/languages/go';
|
||||
import csharpHljs from 'highlight.js/lib/languages/csharp';
|
||||
import { Base64 } from 'js-base64';
|
||||
import { useCopy } from '@/composable/copy';
|
||||
import { useDownloadFileFromBase64 } from '@/composable/downloadBase64';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
@ -17,12 +24,17 @@ const props = withDefaults(
|
||||
language?: string
|
||||
copyPlacement?: 'top-right' | 'bottom-right' | 'outside' | 'none'
|
||||
copyMessage?: string
|
||||
wordWrap?: boolean
|
||||
downloadFileName?: string
|
||||
downloadButtonText?: string
|
||||
}>(),
|
||||
{
|
||||
followHeightOf: null,
|
||||
language: 'txt',
|
||||
copyPlacement: 'top-right',
|
||||
copyMessage: 'Copy to clipboard',
|
||||
downloadFileName: '',
|
||||
downloadButtonText: 'Download',
|
||||
},
|
||||
);
|
||||
hljs.registerLanguage('sql', sqlHljs);
|
||||
@ -31,13 +43,25 @@ hljs.registerLanguage('html', xmlHljs);
|
||||
hljs.registerLanguage('xml', xmlHljs);
|
||||
hljs.registerLanguage('yaml', yamlHljs);
|
||||
hljs.registerLanguage('toml', iniHljs);
|
||||
hljs.registerLanguage('bash', bashHljs);
|
||||
hljs.registerLanguage('markdown', markdownHljs);
|
||||
hljs.registerLanguage('css', cssHljs);
|
||||
hljs.registerLanguage('javascript', jsHljs);
|
||||
hljs.registerLanguage('go', goHljs);
|
||||
hljs.registerLanguage('csharp', csharpHljs);
|
||||
|
||||
const { value, language, followHeightOf, copyPlacement, copyMessage } = toRefs(props);
|
||||
const { value, language, followHeightOf, copyPlacement, copyMessage, downloadFileName, downloadButtonText } = toRefs(props);
|
||||
const { height } = followHeightOf.value ? useElementSize(followHeightOf) : { height: ref(null) };
|
||||
|
||||
const { copy, isJustCopied } = useCopy({ source: value, createToast: false });
|
||||
const tooltipText = computed(() => isJustCopied.value ? 'Copied!' : copyMessage.value);
|
||||
|
||||
const valueBase64 = computed(() => Base64.encode(value.value));
|
||||
const { download } = useDownloadFileFromBase64(
|
||||
{
|
||||
source: valueBase64,
|
||||
filename: downloadFileName,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -49,11 +73,16 @@ const tooltipText = computed(() => isJustCopied.value ? 'Copied!' : copyMessage.
|
||||
:style="height ? `min-height: ${height - 40 /* card padding */ + 10 /* negative margin compensation */}px` : ''"
|
||||
>
|
||||
<n-config-provider :hljs="hljs">
|
||||
<n-code :code="value" :language="language" :trim="false" data-test-id="area-content" />
|
||||
<n-code :code="value" :language="language" :word-wrap="wordWrap" :trim="false" data-test-id="area-content" />
|
||||
</n-config-provider>
|
||||
</n-scrollbar>
|
||||
<div absolute right-10px top-10px>
|
||||
<c-tooltip v-if="value" :tooltip="tooltipText" position="left">
|
||||
<div
|
||||
v-if="value && copyPlacement !== 'none'"
|
||||
absolute right-10px
|
||||
:top-10px="copyPlacement === 'top-right' ? '' : 'no'"
|
||||
:bottom-10px="copyPlacement === 'bottom-right' ? '' : 'no'"
|
||||
>
|
||||
<c-tooltip v-if="value && copyPlacement !== 'outside'" :tooltip="tooltipText" position="left">
|
||||
<c-button circle important:h-10 important:w-10 @click="copy()">
|
||||
<n-icon size="22" :component="Copy" />
|
||||
</c-button>
|
||||
@ -65,6 +94,11 @@ const tooltipText = computed(() => isJustCopied.value ? 'Copied!' : copyMessage.
|
||||
{{ tooltipText }}
|
||||
</c-button>
|
||||
</div>
|
||||
<div v-if="downloadFileName !== '' && value !== ''" mt-5 flex justify-center>
|
||||
<c-button secondary @click="download">
|
||||
{{ downloadButtonText }}
|
||||
</c-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { extension as getExtensionFromMimeType, extension as getMimeTypeFromExtension } from 'mime-types';
|
||||
import type { Ref } from 'vue';
|
||||
import type { MaybeRef, Ref } from 'vue';
|
||||
import _ from 'lodash';
|
||||
import { get } from '@vueuse/core';
|
||||
|
||||
export {
|
||||
getMimeTypeFromBase64,
|
||||
@ -75,21 +76,11 @@ function downloadFromBase64({ sourceValue, filename, extension, fileMimeType }:
|
||||
}
|
||||
|
||||
function useDownloadFileFromBase64(
|
||||
{ source, filename, extension, fileMimeType }:
|
||||
{ source: Ref<string>; filename?: string; extension?: string; fileMimeType?: string }) {
|
||||
return {
|
||||
download() {
|
||||
downloadFromBase64({ sourceValue: source.value, filename, extension, fileMimeType });
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function useDownloadFileFromBase64Refs(
|
||||
{ source, filename, extension }:
|
||||
{ source: Ref<string>; filename?: Ref<string>; extension?: Ref<string> }) {
|
||||
{ source: MaybeRef<string>; filename?: MaybeRef<string>; extension?: MaybeRef<string> }) {
|
||||
return {
|
||||
download() {
|
||||
downloadFromBase64({ sourceValue: source.value, filename: filename?.value, extension: extension?.value });
|
||||
downloadFromBase64({ sourceValue: get(source), filename: get(filename), extension: get(extension) });
|
||||
},
|
||||
};
|
||||
}
|
||||
@ -116,3 +107,13 @@ function previewImageFromBase64(base64String: string): HTMLImageElement {
|
||||
|
||||
return img;
|
||||
}
|
||||
|
||||
function useDownloadFileFromBase64Refs(
|
||||
{ source, filename, extension }:
|
||||
{ source: Ref<string>; filename?: Ref<string>; extension?: Ref<string> }) {
|
||||
return {
|
||||
download() {
|
||||
downloadFromBase64({ sourceValue: source.value, filename: filename?.value, extension: extension?.value });
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
127
src/tools/ical-generator/ical-generator.vue
Normal file
127
src/tools/ical-generator/ical-generator.vue
Normal file
@ -0,0 +1,127 @@
|
||||
<script setup lang="ts">
|
||||
import slugify from '@sindresorhus/slugify';
|
||||
import ical, { ICalCalendarMethod } from 'ical-generator';
|
||||
import { Base64 } from 'js-base64';
|
||||
import { useDownloadFileFromBase64 } from '@/composable/downloadBase64';
|
||||
|
||||
interface Event {
|
||||
startend: [number, number]
|
||||
summary?: string
|
||||
description?: string
|
||||
location?: string
|
||||
url?: string
|
||||
}
|
||||
|
||||
const events = ref<Array<Event>>([{
|
||||
startend: [Date.now(), Date.now()],
|
||||
summary: 'An event',
|
||||
}]);
|
||||
function deleteEvent(index: number) {
|
||||
if (events.value.length === 1) {
|
||||
return;
|
||||
}
|
||||
events.value.splice(index, 1);
|
||||
}
|
||||
function addEvent() {
|
||||
const now = Date.now();
|
||||
events.value.push({
|
||||
startend: [now, now + 3600 * 1000],
|
||||
summary: 'An event',
|
||||
});
|
||||
}
|
||||
|
||||
const output = computed(() => {
|
||||
try {
|
||||
const calendar = ical({ name: events.value[0]?.summary || 'unamed' });
|
||||
|
||||
// A method is required for outlook to display event as an invitation
|
||||
calendar.method(ICalCalendarMethod.REQUEST);
|
||||
|
||||
for (const event of events.value) {
|
||||
calendar.createEvent({
|
||||
start: new Date(event.startend[0]).toUTCString(),
|
||||
end: new Date(event.startend[0]).toUTCString(),
|
||||
summary: event.summary,
|
||||
description: event.description,
|
||||
location: event.location,
|
||||
url: event.url,
|
||||
});
|
||||
}
|
||||
|
||||
return { ical: calendar.toString() };
|
||||
}
|
||||
catch (e: any) {
|
||||
return { error: e.toString() };
|
||||
}
|
||||
});
|
||||
const outputBase64 = computed(() => Base64.encode(output.value?.ical || ''));
|
||||
const customOutputFileName = ref('');
|
||||
const outputFileName = computed(() => {
|
||||
if (customOutputFileName.value) {
|
||||
return customOutputFileName.value;
|
||||
}
|
||||
|
||||
return slugify(events.value[0]?.summary || 'unamed');
|
||||
});
|
||||
const { download } = useDownloadFileFromBase64(
|
||||
{
|
||||
source: outputBase64,
|
||||
filename: outputFileName,
|
||||
extension: 'ics',
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<div mb-2 flex items-baseline gap-2>
|
||||
<c-input-text
|
||||
v-model:value="outputFileName"
|
||||
placeholder="Generated if empty"
|
||||
label="Output filename:"
|
||||
label-position="left"
|
||||
mb-2
|
||||
/>
|
||||
<c-button v-if="output.ical" @click="download">
|
||||
Download ICS
|
||||
</c-button>
|
||||
</div>
|
||||
|
||||
<c-alert v-if="output.error" mb-2>
|
||||
{{ output.error }}
|
||||
</c-alert>
|
||||
|
||||
<c-card v-for="(event, index) in events" :key="index" mb-2>
|
||||
<n-form-item label="Title:" label-placement="left">
|
||||
<n-input v-model:value="event.summary" :allow-input="(value:string) => !!value" />
|
||||
</n-form-item>
|
||||
<n-form-item label="Dates and hours:" label-placement="left">
|
||||
<n-date-picker v-model:value="event.startend" type="datetimerange" />
|
||||
</n-form-item>
|
||||
<c-input-text
|
||||
v-model:value="event.description"
|
||||
label="Description"
|
||||
placeholder="Put a description here"
|
||||
multiline
|
||||
rows="2"
|
||||
mb-2
|
||||
/>
|
||||
<c-input-text
|
||||
v-model:value="event.url"
|
||||
label="Url:"
|
||||
label-position="left"
|
||||
placeholder="Put an url here"
|
||||
mb-2
|
||||
/>
|
||||
<div flex justify-center>
|
||||
<c-button @click="deleteEvent(index)">
|
||||
Delete
|
||||
</c-button>
|
||||
</div>
|
||||
</c-card>
|
||||
<div mt-2 flex justify-center>
|
||||
<c-button @click="addEvent">
|
||||
Add Event
|
||||
</c-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
12
src/tools/ical-generator/index.ts
Normal file
12
src/tools/ical-generator/index.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { CalendarEvent } from '@vicons/tabler';
|
||||
import { defineTool } from '../tool';
|
||||
|
||||
export const tool = defineTool({
|
||||
name: 'ICAL Generator',
|
||||
path: '/ical-generator',
|
||||
description: 'Generate ICAL/ICS file from event infos',
|
||||
keywords: ['ical', 'calendar', 'event', 'generator'],
|
||||
component: () => import('./ical-generator.vue'),
|
||||
icon: CalendarEvent,
|
||||
createdAt: new Date('2024-08-15'),
|
||||
});
|
||||
82
src/tools/ical-merger/ical-merger.service.test.ts
Normal file
82
src/tools/ical-merger/ical-merger.service.test.ts
Normal file
@ -0,0 +1,82 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import { mergeIcals } from './ical-merger.service';
|
||||
|
||||
describe('ical-merger', () => {
|
||||
describe('mergeIcals', () => {
|
||||
it('merge correctly', () => {
|
||||
expect(mergeIcals([
|
||||
`BEGIN:VCALENDAR
|
||||
PRODID:-//xyz Corp//NONSGML PDA Calendar Version 1.0//EN
|
||||
VERSION:2.0
|
||||
BEGIN:VEVENT
|
||||
DTSTAMP:19960704T120000Z
|
||||
UID:uid1@example.com
|
||||
ORGANIZER:mailto:jsmith@example.com
|
||||
DTSTART:19960918T143000Z
|
||||
DTEND:19960920T220000Z
|
||||
STATUS:CONFIRMED
|
||||
CATEGORIES:CONFERENCE
|
||||
SUMMARY:Networld+Interop Conference
|
||||
DESCRIPTION:Networld+Interop Conference
|
||||
and Exhibit\\nAtlanta World Congress Center\\n
|
||||
Atlanta\\, Georgia
|
||||
END:VEVENT
|
||||
END:VCALENDAR`,
|
||||
`BEGIN:VCALENDAR
|
||||
METHOD:xyz
|
||||
VERSION:2.0
|
||||
PRODID:-//ABC Corporation//NONSGML My Product//EN
|
||||
BEGIN:VEVENT
|
||||
DTSTAMP:19970324T120000Z
|
||||
SEQUENCE:0
|
||||
UID:uid3@example.com
|
||||
ORGANIZER:mailto:jdoe@example.com
|
||||
ATTENDEE;RSVP=TRUE:mailto:jsmith@example.com
|
||||
DTSTART:19970324T123000Z
|
||||
DTEND:19970324T210000Z
|
||||
CATEGORIES:MEETING,PROJECT
|
||||
CLASS:PUBLIC
|
||||
SUMMARY:Calendaring Interoperability Planning Meeting
|
||||
DESCRIPTION:Discuss how we can test c&s interoperability\\n
|
||||
using iCalendar and other IETF standards.
|
||||
LOCATION:LDB Lobby
|
||||
ATTACH;FMTTYPE=application/postscript:ftp://example.com/pub/
|
||||
conf/bkgrnd.ps
|
||||
END:VEVENT
|
||||
END:VCALENDAR`,
|
||||
])).to.eq(
|
||||
`BEGIN:VCALENDAR
|
||||
PRODID:it-tools-ical-merger
|
||||
VERSION:1.0
|
||||
BEGIN:VEVENT
|
||||
DTSTAMP:19960704T120000Z
|
||||
UID:uid1@example.com
|
||||
ORGANIZER:mailto:jsmith@example.com
|
||||
DTSTART:19960918T143000Z
|
||||
DTEND:19960920T220000Z
|
||||
STATUS:CONFIRMED
|
||||
CATEGORIES:CONFERENCE
|
||||
SUMMARY:Networld+Interop Conference
|
||||
DESCRIPTION:Networld+Interop Conference and Exhibit\\nAtlanta World Congress
|
||||
Center\\nAtlanta\\, Georgia
|
||||
END:VEVENT
|
||||
BEGIN:VEVENT
|
||||
DTSTAMP:19970324T120000Z
|
||||
SEQUENCE:0
|
||||
UID:uid3@example.com
|
||||
ORGANIZER:mailto:jdoe@example.com
|
||||
ATTENDEE;RSVP=TRUE:mailto:jsmith@example.com
|
||||
DTSTART:19970324T123000Z
|
||||
DTEND:19970324T210000Z
|
||||
CATEGORIES:MEETING,PROJECT
|
||||
CLASS:PUBLIC
|
||||
SUMMARY:Calendaring Interoperability Planning Meeting
|
||||
DESCRIPTION:Discuss how we can test c&s interoperability\\nusing iCalendar a
|
||||
nd other IETF standards.
|
||||
LOCATION:LDB Lobby
|
||||
ATTACH;FMTTYPE=application/postscript:ftp://example.com/pub/conf/bkgrnd.ps
|
||||
END:VEVENT
|
||||
END:VCALENDAR`.replace(/\n/g, '\r\n'));
|
||||
});
|
||||
});
|
||||
});
|
||||
45
src/tools/ical-merger/ical-merger.service.ts
Normal file
45
src/tools/ical-merger/ical-merger.service.ts
Normal file
@ -0,0 +1,45 @@
|
||||
import ICAL from 'ical.js';
|
||||
|
||||
export function mergeIcals(inputs: Array<string>, options: {
|
||||
calname?: string
|
||||
timezone?: string
|
||||
caldesc?: string
|
||||
} = {}) {
|
||||
let calendar;
|
||||
for (const input of inputs) {
|
||||
try {
|
||||
const jcal = ICAL.parse(input);
|
||||
const cal = new ICAL.Component(jcal);
|
||||
|
||||
if (!calendar) {
|
||||
calendar = cal;
|
||||
calendar.updatePropertyWithValue('prodid', 'it-tools-ical-merger');
|
||||
calendar.updatePropertyWithValue('version', '1.0');
|
||||
|
||||
if (options.calname) {
|
||||
calendar.updatePropertyWithValue('x-wr-calname', options.calname);
|
||||
}
|
||||
if (options.timezone) {
|
||||
calendar.updatePropertyWithValue('x-wr-timezone', options.timezone);
|
||||
}
|
||||
if (options.caldesc) {
|
||||
calendar.updatePropertyWithValue('x-wr-caldesc', options.caldesc);
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (const vevent of cal.getAllSubcomponents('vevent')) {
|
||||
calendar.addSubcomponent(vevent);
|
||||
}
|
||||
}
|
||||
}
|
||||
catch (e) {
|
||||
throw new Error(`Failed to merge: ${e}\n\nWith input: ${input}`);
|
||||
}
|
||||
}
|
||||
|
||||
if (!calendar) {
|
||||
throw new Error('No icals parsed successfully');
|
||||
}
|
||||
|
||||
return calendar.toString();
|
||||
}
|
||||
96
src/tools/ical-merger/ical-merger.vue
Normal file
96
src/tools/ical-merger/ical-merger.vue
Normal file
@ -0,0 +1,96 @@
|
||||
<script setup lang="ts">
|
||||
import { mergeIcals } from './ical-merger.service';
|
||||
|
||||
const fileInputs = ref<Array<File>>([]);
|
||||
const mergedOutput = ref('');
|
||||
const calendarName = ref('');
|
||||
const calendarDescription = ref('');
|
||||
const errors = ref('');
|
||||
|
||||
function onUploads(files: Array<File>) {
|
||||
fileInputs.value = [...fileInputs.value, ...files];
|
||||
}
|
||||
function deleteFile(index: number) {
|
||||
fileInputs.value.splice(index, 1);
|
||||
}
|
||||
async function mergeFiles() {
|
||||
const fileBuffers: Array<string> = [];
|
||||
for (const file of fileInputs.value) {
|
||||
fileBuffers.push(await readFileAsString(file));
|
||||
}
|
||||
errors.value = '';
|
||||
mergedOutput.value = '';
|
||||
try {
|
||||
mergedOutput.value = mergeIcals(fileBuffers);
|
||||
}
|
||||
catch (e: any) {
|
||||
errors.value = e.toString();
|
||||
}
|
||||
}
|
||||
|
||||
function readFileAsString(file: File) {
|
||||
return new Promise<string>((resolve, reject) => {
|
||||
const fr = new FileReader();
|
||||
fr.onload = () => {
|
||||
resolve(fr.result as string || '');
|
||||
};
|
||||
fr.onerror = reject;
|
||||
fr.readAsText(file);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<c-file-upload
|
||||
title="Drag and drop iCal file here, or click to select a file"
|
||||
multiple
|
||||
mb-2
|
||||
@files-upload="onUploads"
|
||||
/>
|
||||
|
||||
<n-form-item label="Title:" label-placement="left">
|
||||
<n-input v-model:value="calendarName" placeholder="Please input merge calendar title..." />
|
||||
</n-form-item>
|
||||
|
||||
<n-form-item label="Description:">
|
||||
<n-input v-model:value="calendarDescription" placeholder="Please input merged calendar description..." />
|
||||
</n-form-item>
|
||||
|
||||
<ul>
|
||||
<li v-for="(file, index) in fileInputs" :key="index" mb-1>
|
||||
<n-button mr-2 @click="deleteFile(index)">
|
||||
Delete
|
||||
</n-button>
|
||||
File to merge: {{ file.name }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div flex justify-center>
|
||||
<n-button @click="mergeFiles">
|
||||
Merge iCal files
|
||||
</n-button>
|
||||
</div>
|
||||
|
||||
<n-divider />
|
||||
|
||||
<c-alert v-if="errors" mb-2>
|
||||
{{ errors }}
|
||||
</c-alert>
|
||||
|
||||
<textarea-copyable
|
||||
v-if="mergedOutput"
|
||||
v-model:value="mergedOutput"
|
||||
download-file-name="merge.ics"
|
||||
download-button-text="Download merged iCal"
|
||||
label="Merged ICAL"
|
||||
mb-2
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="less" scoped>
|
||||
::v-deep(.n-upload-trigger) {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
12
src/tools/ical-merger/index.ts
Normal file
12
src/tools/ical-merger/index.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { CalendarPlus } from '@vicons/tabler';
|
||||
import { defineTool } from '../tool';
|
||||
|
||||
export const tool = defineTool({
|
||||
name: 'iCal Merger',
|
||||
path: '/ical-merger',
|
||||
description: 'Merge many iCal file to a single',
|
||||
keywords: ['ical', 'ics', 'merger'],
|
||||
component: () => import('./ical-merger.vue'),
|
||||
icon: CalendarPlus,
|
||||
createdAt: new Date('2024-08-15'),
|
||||
});
|
||||
96
src/tools/ical-parser/ical-parser.vue
Normal file
96
src/tools/ical-parser/ical-parser.vue
Normal file
@ -0,0 +1,96 @@
|
||||
<script setup lang="ts">
|
||||
import type { Ref } from 'vue';
|
||||
import ICAL from 'ical.js';
|
||||
|
||||
const inputType = ref<'file' | 'content'>('file');
|
||||
const icalContent = ref('');
|
||||
const fileInput = ref() as Ref<File | null>;
|
||||
const icalInfosRaw = computedAsync(async () => {
|
||||
const file = fileInput.value;
|
||||
const content = icalContent.value;
|
||||
try {
|
||||
if (inputType.value === 'file' && file) {
|
||||
const jcal = ICAL.parse(await readFileAsString(file));
|
||||
return new ICAL.Component(jcal);
|
||||
}
|
||||
else {
|
||||
const jcal = ICAL.parse(content);
|
||||
return new ICAL.Component(jcal);
|
||||
}
|
||||
}
|
||||
catch (e: any) {
|
||||
return {
|
||||
error: e.toString(),
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
async function onUpload(file: File) {
|
||||
if (file) {
|
||||
fileInput.value = file;
|
||||
}
|
||||
}
|
||||
|
||||
watch(icalContent, (_, newValue) => {
|
||||
if (newValue !== '') {
|
||||
fileInput.value = null;
|
||||
}
|
||||
});
|
||||
|
||||
function readFileAsString(file: File) {
|
||||
return new Promise<string>((resolve, reject) => {
|
||||
const fr = new FileReader();
|
||||
fr.onload = () => {
|
||||
resolve(fr.result as string || '');
|
||||
};
|
||||
fr.onerror = reject;
|
||||
fr.readAsText(file);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<n-radio-group v-model:value="inputType" name="radiogroup" mb-2 flex justify-center>
|
||||
<n-space>
|
||||
<n-radio
|
||||
value="file"
|
||||
label="File"
|
||||
/>
|
||||
<n-radio
|
||||
value="content"
|
||||
label="Content"
|
||||
/>
|
||||
</n-space>
|
||||
</n-radio-group>
|
||||
|
||||
<c-file-upload
|
||||
v-if="inputType === 'file'"
|
||||
title="Drag and drop iCal file here, or click to select a file"
|
||||
@file-upload="onUpload"
|
||||
/>
|
||||
|
||||
<c-input-text
|
||||
v-if="inputType === 'content'"
|
||||
v-model:value="icalContent"
|
||||
label="iCal Content"
|
||||
placeholder="Paste your iCal content here"
|
||||
multiline
|
||||
mb-2
|
||||
/>
|
||||
|
||||
<n-divider />
|
||||
|
||||
<textarea-copyable
|
||||
label="Parsed iCal"
|
||||
mb-2
|
||||
:value="JSON.stringify(icalInfosRaw, null, 2)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="less" scoped>
|
||||
::v-deep(.n-upload-trigger) {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
12
src/tools/ical-parser/index.ts
Normal file
12
src/tools/ical-parser/index.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { CalendarEvent } from '@vicons/tabler';
|
||||
import { defineTool } from '../tool';
|
||||
|
||||
export const tool = defineTool({
|
||||
name: 'ICAL File Parser',
|
||||
path: '/ical-parser',
|
||||
description: 'Parse ICAL/ICS file to event display',
|
||||
keywords: ['ical', 'ics', 'calendar', 'parser'],
|
||||
component: () => import('./ical-parser.vue'),
|
||||
icon: CalendarEvent,
|
||||
createdAt: new Date('2024-08-15'),
|
||||
});
|
||||
@ -2,6 +2,7 @@ import { tool as base64FileConverter } from './base64-file-converter';
|
||||
import { tool as base64StringConverter } from './base64-string-converter';
|
||||
import { tool as basicAuthGenerator } from './basic-auth-generator';
|
||||
import { tool as emailNormalizer } from './email-normalizer';
|
||||
import { tool as icalMerger } from './ical-merger';
|
||||
|
||||
import { tool as asciiTextDrawer } from './ascii-text-drawer';
|
||||
|
||||
@ -12,6 +13,8 @@ import { tool as jsonToXml } from './json-to-xml';
|
||||
import { tool as regexTester } from './regex-tester';
|
||||
import { tool as regexMemo } from './regex-memo';
|
||||
import { tool as markdownToHtml } from './markdown-to-html';
|
||||
import { tool as icalParser } from './ical-parser';
|
||||
import { tool as icalGenerator } from './ical-generator';
|
||||
import { tool as pdfSignatureChecker } from './pdf-signature-checker';
|
||||
import { tool as numeronymGenerator } from './numeronym-generator';
|
||||
import { tool as macAddressGenerator } from './mac-address-generator';
|
||||
@ -184,6 +187,9 @@ export const toolsByCategory: ToolCategory[] = [
|
||||
textDiff,
|
||||
numeronymGenerator,
|
||||
asciiTextDrawer,
|
||||
icalGenerator,
|
||||
icalParser,
|
||||
icalMerger,
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user