Creek Website Toolkit

The Creek Website Toolkit is a set of Vue components for building websites for Creek Studio.

Installation

npm install @creek/studio-website-toolkit

or with yarn:

yarn add @creek/studio-website-toolkit

Usage

Importing Stores

import { useStudioStore, useGlobalPlayerStore, usePlusStore, useReverbStore } from '@creek/studio-website-toolkit'

const studioStore = useStudioStore()

Importing Composables

import { useStudioReverb, useRealtimePlaylist, useRealtimeBroadcast } from '@creek/studio-website-toolkit'

const { ... } = useStudioReverb()

Importing Components

Components can be imported directly from their paths:

import BroadcastPlayer from '@creek/studio-website-toolkit/components/players/BroadcastPlayer.vue'
import ArchivesPanel from '@creek/studio-website-toolkit/components/panels/ArchivesPanel.vue'
import ShowSchedule from '@creek/studio-website-toolkit/components/schedule/ShowSchedule.vue'

Using the Plugin

import CreekStudioPlugin from '@creek/studio-website-toolkit/plugins/CreekStudioPlugin.js'

app.use(CreekStudioPlugin)

Available Components

Players

• BroadcastPlayer - Main broadcast/stream player
• MusicPlayer - Music playback component
• PodcastPlayer - Podcast player

Panels

• ArchivesPanel - Browse archived broadcasts
• BroadcastPanel - Current broadcast information
• PlaylistsPanel - Show playlists
• DonatePanel - Donation interface
• ShowsPanel - Shows listing
• ChatPanel - Chat interface
• VideoPanel - Video playback

Schedule

• ShowSchedule - Weekly schedule display
• ShowScheduleNav - Schedule navigation
• ShowScheduleOccurrence - Individual schedule entry

Cards

• BroadcastCard - Broadcast preview card
• ShowCard - Show preview card

Auth

• CreekPlusLoginButton - Login button
• CreekPlusLoginPanel - Login form
• CreekPlusAccountModal - Account management
• CreekPlusSubscribeModal - Subscription modal

Peer Dependencies

• Vue 3.x
• Pinia 2.x

License

MIT