Edit Playlist Entry
\n{track.title}
\n\n\n \n
\n\n \n \n
\n \n \n
\n\n \n \n
\n \n \n
\n\n \n \n );\n};\n\nexport default DraftPlaylistTrackModal;\n","import React, { useRef, useState, useEffect } from \"react\";\nimport { useOutletContext, Link } from \"react-router-dom\";\nimport { useFeedback } from \"./FeedbackContext\";\nimport DraftPlaylistTrackModal from \"../modals/DraftPlaylistTrackModal\";\nimport LikeButton from \"./LikeButton\";\nimport TagBadges from \"./TagBadges\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faEllipsis, faShareFromSquare, faCirclePlus, faDownload, faMusic, faCircleChevronLeft, faCircleChevronRight, faTrashAlt, faClock } from \"@fortawesome/free-solid-svg-icons\";\n\nconst TrackContextMenu = ({ track, indexInPlaylist = null, highlight }) => {\n const dropdownRef = useRef(null);\n const { setNotice, setAlert } = useFeedback();\n const [dropdownVisible, setDropdownVisible] = useState(false);\n const [isEditModalOpen, setIsEditModalOpen] = useState(false);\n const { user, draftPlaylist, setDraftPlaylist, setIsDraftPlaylistSaved } = useOutletContext();\n\n const hideDropdown = () => {\n setDropdownVisible(false);\n };\n\n const copyToClipboard = (e) => {\n e.stopPropagation();\n let url = `https://phish.in/${track.show_date}/${track.slug}`;\n navigator.clipboard.writeText(url);\n setNotice(\"URL copied to clipboard\");\n hideDropdown();\n };\n\n const toggleDropdownVisibility = (e) => {\n e.stopPropagation();\n setDropdownVisible(!dropdownVisible);\n };\n\n const handleAddToPlaylist = (e) => {\n e.stopPropagation();\n if (user === \"anonymous\") {\n setAlert(\"You must login to edit playlists\");\n return;\n }\n setDraftPlaylist([...draftPlaylist, track]);\n setNotice(\"Track added to draft playlist\");\n hideDropdown();\n setIsDraftPlaylistSaved(false);\n };\n\n const handleRemoveFromPlaylist = (e) => {\n e.stopPropagation();\n const updatedPlaylist = [...draftPlaylist];\n updatedPlaylist.splice(indexInPlaylist, 1);\n setDraftPlaylist(updatedPlaylist);\n setNotice(\"Track removed from draft playlist\");\n hideDropdown();\n setIsDraftPlaylistSaved(false);\n };\n\n const handleDownload = (e, trackId) => {\n e.stopPropagation();\n const link = document.createElement(\"a\");\n link.href = `/download-track/${trackId}`;\n link.setAttribute(\"download\", true);\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n };\n\n const handlePlaylistEntry = (e) => {\n e.stopPropagation();\n setIsEditModalOpen(true);\n hideDropdown();\n };\n\n // Close dropdown when clicking outside\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n hideDropdown();\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [dropdownRef]);\n\n return (\n <>\n \n \n
\n \n \n
\n \n\n {draftPlaylist.includes(track) && (\n \n \n
\n \n {\n e.stopPropagation();\n handleDownload(e, track.id);\n }}\n >\n
\n\n \n
\n \n
\n\n {track.tags?.length > 0 && (\n \n
\n )}\n\n copyToClipboard(e)}>\n \n
\n\n e.stopPropagation()}\n >\n e.stopPropagation()}\n >\n e.stopPropagation()}\n >\n
\n ))}\n\n \n\n
\n\n \n
\n
\n )}\n\n {albumCoverUrl && (\n \n
\n )}\n\n \n Images generated by DALL-E with prompt assistance from ChatGPT.
\n Browse All Art\n
\n \n );\n openAppModal(modalContent);\n };\n\n const handleImageLoad = () => {\n setIsLoaded(true);\n };\n\n const selectedImage = selectedOption === \"albumCover\" ? albumCoverUrl : coverArtUrls?.[size];\n\n return (\n \n Browse All Art\n
\n {numbering && #{index + 1}}\n \n {viewStyle !== \"show\" && (\n <>\n
\n \n );\n };\n\n return (\n <>\n {tracks.length === 0 ? (\n \n \n {isExcerpt &&
\n No tracks found
\n ) : (\n- \n {viewStyle === \"show\"\n ? Object.entries(\n tracks.reduce((groups, track) => {\n (groups[track.set_name] = groups[track.set_name] || []).push(track);\n return groups;\n }, {})\n ).map(([setName, setTracks]) => (\n
\n
\n ))\n : tracks.map(renderTrackItem)}\n \n
\n {setName}
\n \n {formatDurationShow(\n setTracks.reduce((total, t) => total + t.duration, 0)\n )}\n \n - {setTracks.map(renderTrackItem)}
\n {\n navigator.clipboard.writeText(`https://phish.in/play/${draftPlaylistMeta.slug}`);\n setNotice(\"Playlist URL copied to clipboard\");\n }}\n >\n
\n );\n\n return (\n Draft Playlist
\n\n {!isEmpty && (\n\n {isDraftPlaylistSaved ? (\n \n
\n )}\n\n \n
\n\n \n
\n\n \n
\n\n \n {description || \"No description\"}\n
\n\n {draftPlaylistMeta.id && (\n \n \n
\n )}\n {name || \"(Untitled Playlist)\"}
\n\n\n
\n\n {draftPlaylist.length < 2 && (\n \n
\n
\n
\n )}\n\n Taper Notes
\n{formatDate(show.date)} • {show.venue_name}
\n \") }}>\n \n );\n openAppModal(modalContent);\n hideDropdown();\n };\n\n const toggleDropdownVisibility = (e) => {\n e.stopPropagation();\n setDropdownVisible(!dropdownVisible);\n };\n\n const handleAddToPlaylist = (e) => {\n if (user === \"anonymous\") {\n setAlert(\"You must login to edit playlists\");\n return;\n }\n e.stopPropagation();\n setDraftPlaylist([...draftPlaylist, ...show.tracks]);\n setNotice(\"Show added to draft playlist\");\n hideDropdown();\n setIsDraftPlaylistSaved(false);\n };\n\n // Close dropdown when clicking outside\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n hideDropdown();\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [dropdownRef]);\n\n const handleRequestAlbumZip = async () => {\n const response = await fetch(`/api/v2/shows/request_album_zip`, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ date: show.date })\n });\n\n if (response.status === 204) {\n setNotice(\"Album is being generated - refresh the page in ~30 seconds\");\n } else if (response.status === 409) {\n setAlert(\"Album is already being generated\");\n } else {\n setAlert(\"Sorry - album downloads are currently disabled\");\n }\n };\n\n return (\n\n \n
\n \n );\n};\n\nexport default ShowContextMenu;\n","import React, { useEffect, useState } from \"react\";\nimport { useOutletContext, useNavigate } from \"react-router-dom\";\nimport { formatDurationShow, formatDate, formatNumber } from \"./helpers/utils\";\nimport TagBadges from \"./controls/TagBadges\";\nimport LikeButton from \"./controls/LikeButton\";\nimport ShowContextMenu from \"./controls/ShowContextMenu\";\nimport CoverArt from \"./CoverArt\";\n\nconst Shows = ({ shows, numbering = false, tourHeaders = false, viewMode = \"list\" }) => {\n const { activeTrack } = useOutletContext();\n const navigate = useNavigate();\n const [loadedImages, setLoadedImages] = useState({});\n let itemNumber = 1;\n\n const handleShowClick = (showDate) => {\n navigate(`/${showDate}`);\n };\n\n useEffect(() => {\n if (viewMode === \"grid\") {\n shows.forEach((show) => {\n if (!loadedImages[show.date]) {\n const img = new Image();\n img.src = show.cover_art_urls.medium;\n img.onload = () => {\n setLoadedImages((prev) => ({ ...prev, [show.date]: true }));\n };\n }\n });\n }\n }, [viewMode, shows, loadedImages]);\n\n if (shows.length === 0) {\n return \n \n
\n \n\n \n e.stopPropagation()}\n >\n e.stopPropagation()}\n >\n
\n\n {\n e.stopPropagation();\n hideDropdown();\n }}\n >\n {\n e.stopPropagation();\n hideDropdown();\n }}\n >\n
\n \n
\n \n\n
\n
\n\n {show.tags?.length > 0 && (\n \n
\n )}\n\n copyToClipboard(e, false)}>\n \n \n
No shows found
;\n }\n\n const renderTourHeader = (tourName, tourShowCount) => (\n\n
\n );\n\n const renderListItemsForTour = (tourShows, tourName) => (\n {tourName}
\n {formatNumber(tourShowCount, \"show\")}\n \n {numbering && #{currentItemNumber}}\n \n
\n \n );\n };\n\n const renderGridItem = (show) => {\n const isLoaded = loadedImages[show.date] || false;\n\n return (\n \n {formatDurationShow(show.duration)}\n \n
\n \n
\n \n );\n };\n\n // Group shows by tour\n const tours = shows.reduce((acc, show) => {\n if (!acc[show.tour_name]) {\n acc[show.tour_name] = [];\n }\n acc[show.tour_name].push(show);\n return acc;\n }, {});\n\n return (\n {formatDate(show.date)}
\n{show.venue_name}
\n{show.venue.location}
\n\n {Object.entries(tours).map(([tourName, tourShows]) =>\n renderListItemsForTour(tourShows, tourName)\n )}\n
\n );\n};\n\nexport default Shows;\n","import { authFetch } from \"./helpers/utils\";\nimport React, { useEffect, useState } from \"react\";\nimport { useLoaderData, Link, useOutletContext } from \"react-router-dom\";\nimport { Helmet } from \"react-helmet-async\";\nimport LayoutWrapper from \"./layout/LayoutWrapper\";\nimport Shows from \"./Shows\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faList, faTh, faCircleChevronLeft, faCircleChevronRight, faSortAmountDown, faSortAmountUp } from \"@fortawesome/free-solid-svg-icons\";\n\nexport const eraShowsLoader = async ({ params }) => {\n const { year } = params;\n let url = `/api/v2/shows?per_page=1000`;\n\n if (year.includes(\"-\")) {\n url += `&year_range=${year}`;\n } else {\n url += `&year=${year}`;\n }\n\n const response = await authFetch(url);\n if (!response.ok) throw response;\n const data = await response.json();\n return { shows: data.shows, year };\n};\n\nconst EraShows = () => {\n const { shows: initialShows, year } = useLoaderData();\n const { viewMode, setViewMode, sortOption, setSortOption } = useOutletContext();\n const [yearsData, setYearsData] = useState(null);\n\n const sortedShows = [...initialShows].sort((a, b) => {\n if (sortOption === \"asc\") {\n return new Date(a.date) - new Date(b.date);\n } else {\n return new Date(b.date) - new Date(a.date);\n }\n });\n\n useEffect(() => {\n const fetchYearsData = async () => {\n try {\n const response = await fetch(\"/api/v2/years\");\n if (!response.ok) throw response;\n const data = await response.json();\n setYearsData(data);\n } catch (error) {\n console.error(\"Error fetching years data\", error);\n }\n };\n fetchYearsData();\n }, []);\n\n const renderViewToggleButtons = () => (\n \n setViewMode(\"list\")}\n disabled={viewMode === \"list\"}\n >\n \n setViewMode(\"grid\")}\n disabled={viewMode === \"grid\"}\n >\n \n
\n );\n\n const renderSortButtons = () => (\n \n setSortOption(\"desc\")}\n disabled={sortOption === \"desc\"}\n >\n \n setSortOption(\"asc\")}\n disabled={sortOption === \"asc\"}\n >\n \n
\n );\n\n const yearLinks = () => {\n if (!yearsData) return null;\n const yearIndex = yearsData.findIndex((y) => y.period === year);\n const previousYear = yearsData[yearIndex - 1]?.period;\n const nextYear = yearsData[yearIndex + 1]?.period;\n\n return (\n \n {previousYear && (\n \n
\n );\n };\n\n const sidebarContent = (\n \n
\n );\n\n return (\n <>\n {year}
\n{sortedShows.length} shows
\n\n\n {renderViewToggleButtons()}\n {renderSortButtons()}\n
\n\n {yearLinks()}
\n \n
\n \n {renderViewToggleButtons()}\n {renderSortButtons()}\n
\n \n \n
\n );\n\n return (\n <>\n \n \n\n \n {showIncompleteNotification && infoBox(\"This show's audio is incomplete\", () => handleClose(\"incomplete\"))}\n {showAdminNotesNotification && infoBox(show.admin_notes, () => handleClose(\"adminNotes\"))}\n\n \n
\n \n );\n};\n\nexport default Show;\n","import React from \"react\";\nimport { useRouteError, Link } from \"react-router-dom\";\nimport logo from \"../../images/logo-full.png\";\n\nconst ErrorPage = () => {\n const error = useRouteError();\n\n return (\n \n
\n\n \n
\n \n
\n \n
\n \n {formatDate(show.date)}\n \n {show.venue_name}\n
\n {show.venue.location}\n \n \n
\n \n {show.venue.location}\n \n \n
\n 
\n {error?.status === 404 ? (\n <>\n
\n );\n};\n\nexport default ErrorPage;\n","import React from \"react\";\nimport { useParams, useNavigate } from \"react-router-dom\";\nimport EraShows from \"../EraShows\";\nimport Show from \"../Show\";\nimport ErrorPage from \"../pages/ErrorPage\";\nimport { eraShowsLoader } from \"../EraShows\";\nimport { showLoader } from \"../Show\";\n\nconst normalizeDate = (dateStr) => {\n const [year, month, day] = dateStr.split(\"-\");\n const paddedMonth = month.padStart(2, \"0\");\n const paddedDay = day.padStart(2, \"0\");\n return `${year}-${paddedMonth}-${paddedDay}`;\n};\n\nexport const dynamicLoader = async ({ params, request }) => {\n const { \"*\": fullPath } = params;\n const [firstSegment] = fullPath.split(\"/\");\n\n // Handle year or year range route\n if (/^\\d{4}$/.test(firstSegment) || /^\\d{4}-\\d{4}$/.test(firstSegment)) {\n return eraShowsLoader({ params: { year: firstSegment }, request });\n }\n\n // Handle potentially unnormalized date route\n if (/^\\d{4}-\\d{1,2}-\\d{1,2}$/.test(firstSegment)) {\n const normalizedDate = normalizeDate(firstSegment);\n\n if (firstSegment !== normalizedDate) {\n throw new Response(\"\", {\n status: 302,\n headers: {\n Location: `/${normalizedDate}`,\n },\n });\n }\n\n return showLoader({ params: { date: normalizedDate }, request });\n }\n\n throw new Response(\"Page not found\", { status: 404 });\n};\n\nconst DynamicRoute = () => {\n const { \"*\": fullPath } = useParams();\n const navigate = useNavigate();\n const [firstSegment, secondSegment] = fullPath.split(\"/\");\n\n // Handle year or year range route\n if (/^\\d{4}$/.test(firstSegment) || /^\\d{4}-\\d{4}$/.test(firstSegment)) {\n return 404
\nGot a blank space...
\n \n ) : (\n <>\n500
\nWe are so very sorry...
\n \n )}\n\n {error?.data || \"An unexpected error has occurred\"}\n
\n\n Return Home\n\n \n \n
\n );\n};\n\nexport default MobileApps;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCodeBranch } from \"@fortawesome/free-solid-svg-icons\";\n\nconst GitHubButton = ({ className }) => (\n \n setViewMode(\"list\")}\n disabled={viewMode === \"list\"}\n >\n \n setViewMode(\"grid\")}\n disabled={viewMode === \"grid\"}\n >\n \n
\n );\n\n const renderSortButtons = () => (\n \n setSortOption(\"desc\")}\n disabled={sortOption === \"desc\"}\n >\n \n setSortOption(\"asc\")}\n disabled={sortOption === \"asc\"}\n >\n \n
\n );\n\n const renderListItem = ({ period, shows_count, venues_count, cover_art_urls }) => (\n \n \n \n
\n \n
\n {period}
\n\n {formatNumber(venues_count, \"venue\")} • {formatNumber(shows_count, \"show\")}\n
\n\n
\n );\n\n return (\n \n LIVE PHISH\n AUDIO STREAMS\n
\n\n {formatNumber(totalShows)} shows • {formatNumber(totalHours)} hours of music\n
\n\n\n {renderViewToggleButtons()}\n {renderSortButtons()}\n
\n\n \n
\n\n This project is open source
\nDownload mobile app
\n\n {renderViewToggleButtons()}\n {renderSortButtons()}\n
\n\n \n {Object.keys(eras)\n .sort((a, b) => (sortOption === \"asc\" ? a.localeCompare(b) : b.localeCompare(a)))\n .map((era) => (\n \n \n ))}\n
\n \n
\n {era} Era
\n {formatNumber(eras[era].total_shows, \"show\")}\n - \n {eras[era].periods\n .sort((a, b) =>\n sortOption === \"asc\" ? a.period.localeCompare(b.period) : b.period.localeCompare(a.period)\n )\n .map((periodData) =>\n viewMode === \"list\" ? renderListItem(periodData) : renderGridItem(periodData)\n )}\n
\n
\n );\n};\n\nexport default Loader;\n","import React, { useState, useEffect, useRef } from \"react\";\nimport { Link, useLocation } from \"react-router-dom\";\nimport { formatDate, parseTimeParam } from \"../helpers/utils\";\nimport { useFeedback } from \"./FeedbackContext\";\nimport CoverArt from \"../CoverArt\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faPlay, faPause, faRotateRight, faRotateLeft, faForward, faBackward, faChevronUp, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\nconst Player = ({ activePlaylist, activeTrack, setActiveTrack, audioRef, customPlaylist, openAppModal }) => {\n const location = useLocation();\n const scrubberRef = useRef();\n const progressBarRef = useRef();\n const { setAlert, setNotice } = useFeedback();\n const [fadeClass, setFadeClass] = useState(\"fade-in\");\n const [isFadeOutComplete, setIsFadeOutComplete] = useState(false);\n const [isImageLoaded, setIsImageLoaded] = useState(false);\n const [isPlayerCollapsed, setIsPlayerCollapsed] = useState(false);\n const [firstLoad, setIsFirstLoad] = useState(true);\n const [endTime, setEndTime] = useState(null);\n const [isPlaying, setIsPlaying] = useState(false);\n const [currentTime, setCurrentTime] = useState(0);\n\n\n const togglePlayerPosition = () => {\n setIsPlayerCollapsed(!isPlayerCollapsed);\n };\n\n const togglePlayPause = () => {\n if (audioRef.current.paused) {\n audioRef.current.play();\n navigator.mediaSession.playbackState = 'playing';\n setIsPlaying(true);\n } else {\n audioRef.current.pause();\n navigator.mediaSession.playbackState = 'paused';\n setIsPlaying(false);\n }\n };\n\n const scrubForward = () => {\n audioRef.current.currentTime = Math.min(audioRef.current.currentTime + 10, audioRef.current.duration);\n };\n\n const scrubBackward = () => {\n audioRef.current.currentTime = Math.max(audioRef.current.currentTime - 10, 0);\n };\n\n // Media session hooks\n useEffect(() => {\n if ('mediaSession' in navigator) {\n const handleNextTrack = () => {\n if (activeTrack) skipToNextTrack();\n };\n\n const handlePreviousTrack = () => {\n if (activeTrack) skipToPreviousTrack();\n };\n\n navigator.mediaSession.setActionHandler('previoustrack', handlePreviousTrack);\n navigator.mediaSession.setActionHandler('nexttrack', handleNextTrack);\n navigator.mediaSession.setActionHandler('play', togglePlayPause);\n navigator.mediaSession.setActionHandler('pause', togglePlayPause);\n navigator.mediaSession.setActionHandler('stop', togglePlayPause);\n navigator.mediaSession.setActionHandler('seekbackward', scrubBackward);\n navigator.mediaSession.setActionHandler('seekforward', scrubForward);\n }\n }, [activeTrack]);\n\n // Hande activeTrack change\n useEffect(() => {\n if (activeTrack && audioRef.current) {\n if (typeof window !== \"undefined\") {\n document.title = `${activeTrack.title} - ${formatDate(activeTrack.show_date)} - Phish.in`;\n }\n\n if ('mediaSession' in navigator) {\n navigator.mediaSession.metadata = new MediaMetadata({\n title: activeTrack.title,\n artist: `Phish - ${formatDate(activeTrack.show_date)}`,\n album: `${formatDate(activeTrack.show_date)} - ${activeTrack.venue_name}`,\n artwork: [\n {\n src: activeTrack.show_cover_art_urls.medium,\n sizes: \"256x256\",\n type: \"image/jpeg\",\n }\n ]\n });\n }\n\n setFadeClass(\"fade-out\");\n setIsFadeOutComplete(false);\n setIsImageLoaded(false);\n\n const fadeOutTimer = setTimeout(() => {\n setIsFadeOutComplete(true);\n }, 500);\n\n const newImage = new Image();\n newImage.src = activeTrack.waveform_image_url;\n newImage.onload = () => setIsImageLoaded(true);\n\n audioRef.current.pause();\n audioRef.current.src = activeTrack.mp3_url;\n audioRef.current.load();\n\n audioRef.current.onloadedmetadata = () => {\n const startTime = activeTrack.starts_at_second ?? parseTimeParam(new URLSearchParams(location.search).get(\"t\"));\n const endTime = activeTrack.ends_at_second ?? parseTimeParam(new URLSearchParams(location.search).get(\"e\"));\n\n if (startTime && startTime <= audioRef.current.duration) {\n audioRef.current.currentTime = startTime;\n }\n\n setEndTime(endTime);\n audioRef.current.play().then(() => {\n () => setIsFirstLoad(false);\n }).catch((error) => {\n if (error.name === \"NotAllowedError\") {\n setNotice(\"Press Play to listen\");\n }\n });\n };\n\n audioRef.current.onended = skipToNextTrack;\n\n return () => clearTimeout(fadeOutTimer);\n }\n }, [activeTrack]);\n\n useEffect(() => {\n if (isFadeOutComplete && isImageLoaded) {\n scrubberRef.current.style.backgroundImage = `url(${activeTrack.waveform_image_url})`;\n progressBarRef.current.style.maskImage = `url(${activeTrack.waveform_image_url})`;\n setFadeClass(\"fade-in\");\n }\n }, [isFadeOutComplete, isImageLoaded]);\n\n const skipToNextTrack = () => {\n const currentIndex = activePlaylist.indexOf(activeTrack);\n const nextTrack = activePlaylist[currentIndex + 1];\n if (nextTrack) {\n setActiveTrack(nextTrack);\n } else {\n setAlert(\"This is the last track in the playlist\")\n }\n };\n\n const skipToPreviousTrack = () => {\n const currentIndex = activePlaylist.indexOf(activeTrack);\n\n if (audioRef.current.currentTime > 10) {\n audioRef.current.currentTime = 0;\n } else {\n const previousTrack = activePlaylist[currentIndex - 1];\n if (previousTrack) {\n setActiveTrack(previousTrack);\n } else {\n setAlert(\"This is the first track in the playlist\")\n }\n }\n };\n\n // Keyboard shortcuts\n useEffect(() => {\n const handleKeyDown = (e) => {\n if (typeof document !== \"undefined\" && [\"INPUT\", \"TEXTAREA\"].includes(document.activeElement.tagName) || document.activeElement.isContentEditable) return;\n\n if (e.key === \" \" && !e.shiftKey) {\n e.preventDefault();\n togglePlayPause();\n } else if (e.key === \"ArrowLeft\" && !e.shiftKey) {\n e.preventDefault();\n skipToPreviousTrack();\n } else if (e.key === \"ArrowRight\" && !e.shiftKey) {\n e.preventDefault();\n skipToNextTrack();\n } else if (e.key === \"ArrowLeft\" && e.shiftKey) {\n e.preventDefault();\n scrubBackward();\n } else if (e.key === \"ArrowRight\" && e.shiftKey) {\n e.preventDefault();\n scrubForward();\n }\n };\n\n window.addEventListener(\"keydown\", handleKeyDown);\n return () => window.removeEventListener(\"keydown\", handleKeyDown);\n }, [togglePlayPause, scrubBackward, scrubForward, skipToPreviousTrack, skipToNextTrack]);\n\n const handleTimeUpdate = () => {\n setCurrentTime(audioRef.current.currentTime);\n updateProgressBar();\n\n // Check if the track should skip to the next one at a specific end time\n if (endTime !== null && audioRef.current.currentTime >= endTime) {\n skipToNextTrack();\n }\n };\n\n const updateProgressBar = () => {\n const progress = (audioRef.current.currentTime / audioRef.current.duration) * 100;\n if (progressBarRef.current) {\n progressBarRef.current.style.background = `linear-gradient(to right, #03bbf2 ${progress}%, rgba(255,255,255,0) ${progress}%)`;\n }\n };\n\n const handleScrubberClick = (e) => {\n const clickPosition = e.nativeEvent.offsetX / e.target.offsetWidth;\n const newTime = clickPosition * audioRef.current.duration;\n audioRef.current.currentTime = newTime;\n };\n\n const formatTime = (timeInSeconds) => {\n const minutes = Math.floor(timeInSeconds / 60);\n const seconds = Math.floor(timeInSeconds % 60).toString().padStart(2, \"0\");\n return `${minutes}:${seconds}`;\n };\n\n return (\n \n
\n \n \n
\n \n
\n \n
\n \n
\n \n \n {activeTrack?.title}\n \n
\n \n {customPlaylist ? (\n \n {customPlaylist.name}\n \n ) : (\n <>\n \n {formatDate(activeTrack?.show_date)}\n \n \n {\" \"}•{\" \"}\n \n {activeTrack?.venue_name}\n \n {/* \n {\" \"}•{\" \"}\n \n {activeTrack?.venue_location}\n \n */}\n \n \n )}\n
\n \n
\n \n \n \n \n {audioRef.current?.paused ? \n \n
\n \n \n \n
\n \n {formatTime(currentTime)}\n
\n\n {activeTrack ? `-${formatTime((activeTrack.duration / 1000) - currentTime)}` : \"0:00\"}\n
\n \n \n \n );\n};\n\nexport default Player;\n","import React from \"react\";\nimport Modal from \"react-modal\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleXmark } from \"@fortawesome/free-solid-svg-icons\";\n\nModal.setAppElement(\"#root\");\n\nconst AppModal = ({ isOpen, onRequestClose, modalContent }) => {\n if (!modalContent) return null;\n\n return (\nEdit Playlist Details
\n\n\n \n
\n\n \n
\n \n \n
\n\n \n
\n \n \n
\n\n \n \n {isDescriptionModified && (\n
\n \n {500 - charCount} characters remaining\n
\n )}\n\n
\n\n \n \n
\n \n
\n );\n};\n\nexport default PhoneTiltSuggestion;\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { formatNumber } from \"./helpers/utils\";\nimport Loader from \"./controls/Loader\";\nimport PhoneTiltSuggestion from \"./PhoneTiltSuggestion\";\n\nconst MapView = ({ mapboxToken, coordinates, venues, searchComplete, controls = true }) => {\n const mapContainer = useRef(null);\n const [map, setMap] = useState(null);\n const [mapboxgl, setMapboxgl] = useState(null);\n const navigate = useNavigate();\n\n useEffect(() => {\n if (!coordinates || !mapboxToken || map) return;\n\n import(\"mapbox-gl\").then((mapboxglModule) => {\n const mapboxglInstance = mapboxglModule.default;\n setMapboxgl(mapboxglInstance);\n\n mapboxglInstance.accessToken = mapboxToken;\n\n const mapboxMap = new mapboxglInstance.Map({\n container: mapContainer.current,\n style: \"mapbox://styles/mapbox/streets-v12\",\n center: [coordinates.lng, coordinates.lat],\n zoom: 11,\n attributionControl: false,\n });\n\n mapboxMap.addControl(\n new mapboxglInstance.AttributionControl({\n compact: true,\n })\n );\n\n if (controls) {\n mapboxMap.addControl(new mapboxglInstance.NavigationControl());\n }\n\n setMap(mapboxMap);\n });\n }, [coordinates, mapboxToken, controls, map]);\n\n useEffect(() => {\n if (map && venues && mapboxgl) {\n addMarkersToMap(map, venues, mapboxgl);\n }\n }, [map, venues, mapboxgl]);\n\n const addMarkersToMap = (mapInstance, venues, mapboxglInstance) => {\n if (!mapInstance || venues.length === 0) {\n if (searchComplete) {\n new mapboxglInstance.Popup({ closeButton: false })\n .setLngLat(mapInstance.getCenter())\n .setHTML(\n \"\n
\n \n
No results found for your search.
\"\n )\n .addTo(mapInstance);\n }\n return;\n }\n\n const bounds = new mapboxglInstance.LngLatBounds();\n\n venues.forEach((venue) => {\n let marker;\n\n // If single venue, use custom icon\n if (venues.length === 1) {\n const customIcon = document.createElement(\"div\");\n customIcon.className = \"custom-marker-icon\";\n\n marker = new mapboxglInstance.Marker(customIcon).setLngLat([\n venue.longitude,\n venue.latitude,\n ]);\n } else {\n marker = new mapboxglInstance.Marker().setLngLat([\n venue.longitude,\n venue.latitude,\n ]);\n\n if (venue.shows && venue.shows.length > 0) {\n const popupContent = document.createElement(\"div\");\n popupContent.className = \"map-popup\";\n\n const venueTitle = document.createElement(\"h2\");\n venueTitle.textContent = venue.name;\n popupContent.appendChild(venueTitle);\n\n const venueLocation = document.createElement(\"h3\");\n venueLocation.textContent = `${venue.location} • ${formatNumber(venue.shows_count, \"show\")}`;\n popupContent.appendChild(venueLocation);\n\n venue.shows.forEach((show) => {\n const showLink = document.createElement(\"a\");\n showLink.href = `/${show.date}`;\n showLink.className = \"show-badge\";\n showLink.textContent = show.date.replace(/-/g, \".\");\n showLink.onclick = (e) => {\n e.preventDefault();\n navigate(`/${show.date}`);\n };\n popupContent.appendChild(showLink);\n });\n\n const popup = new mapboxglInstance.Popup({ closeButton: false }).setDOMContent(popupContent);\n marker.setPopup(popup);\n }\n }\n\n marker.addTo(mapInstance);\n bounds.extend([venue.longitude, venue.latitude]);\n });\n\n if (venues.length === 1) {\n mapInstance.setZoom(8);\n mapInstance.setCenter([venues[0].longitude, venues[0].latitude]);\n } else if (venues.length > 0) {\n mapInstance.fitBounds(bounds, {\n padding: 50,\n maxZoom: 12,\n duration: 1000,\n });\n }\n };\n\n return (\n <>\n {!searchComplete &&\n \n
\n );\n\n return (\n <>\n \n
\n \n
\n );\n\n return (\n <>\n Missing and Incomplete Content
\n{totalIssues} total issues
\n{incompleteCount} incomplete shows
\n{missingCount} missing shows
\n- \n {missingContent.map(({ date, venue_name, location, type }) => {\n const currentYear = new Date(date).getFullYear();\n const isNewYear = currentYear !== lastYear;\n\n if (isNewYear) {\n lastYear = currentYear;\n }\n\n return (\n <>\n {isNewYear && (\n
- \n \n \n {date}\n \n {venue_name}\n {location}\n \n {type === \"Incomplete\" ? (\n \n {type}\n \n ) : (\n type\n )}\n \n\n \n \n );\n })}\n
\n
\n )}\n {lastYear}
\n {formatNumber(countShowsForYear(lastYear), \"show\")}\n \n
\n\n \n \n
\n \n
\n );\n\n return (\n <>\n My Shows
\n\n\n
\n \n \n
\n \n
\n );\n\n return (\n <>\n My Tracks
\n\n\n
\n \n \n
\n \n
\n
\n );\n\n return (\n <>\n {playlist.name}
\nBy {playlist.username}
\n\n
\n \n
\n
\n
\n \n
\n\n \n \n \n
\n )}\n \n
\n
\n \n
\n
No playlists found
;\n }\n\n return (\n- \n {playlists.map((playlist) => (\n
\n \n \n
\n\n \n \n {formatDurationShow(playlist.duration)}\n \n \n
\n \n
\n \n ))}\n \n
\n \n
\n\n \n
\n \n
\n
\n
\n );\n\n return (\n <>\n Playlists
\n{formatNumber(totalEntries)} total
\n\n\n
\n\n \n \n
\n\n {user && (\n \n \n
\n )}\n \n
\n
\n \n
- \n {songs.map((song) => (\n \n
- \n \n \n \n\n
\n \n \n \n {song.original ? \"Original\" : \"Cover\"}\n \n \n {formatNumber(song.tracks_count, 'track')}\n \n \n \n ))}\n
\n \n \n
\n \n \n \n {formatNumber(tag.shows_count, \"show\")}\n \n \n {formatNumber(tag.tracks_count, \"track\")}\n \n \n
\n \n
\n {group}
\n {groupedTags[group].length} tags\n - \n {groupedTags[group].map(tag => renderTagItem(tag))}\n
- \n {tags.map(tag => renderTagItem(tag))}\n
- \n {venues.map((venue) => (\n \n
- \n \n \n \n\n
\n \n \n \n \n \n {formatNumber(venue.shows_count, \"show\")}\n \n \n ))}\n
Show on Date
\nMatched Shows
\nSongs
\nTracks
\nTags
\nVenues
\nPlaylists
\nSorry, no results found.
\n )}\n \n );\n};\n\nexport default SearchResults;\n","import React, { useState, useEffect } from \"react\";\nimport { useSearchParams } from \"react-router-dom\";\nimport { authFetch } from \"./helpers/utils\";\nimport SearchResults from \"./SearchResults\";\nimport LayoutWrapper from \"./layout/LayoutWrapper\";\nimport Loader from \"./controls/Loader\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faSearch } from \"@fortawesome/free-solid-svg-icons\";\n\nconst Search = () => {\n const [searchParams, setSearchParams] = useSearchParams();\n const [term, setTerm] = useState(searchParams.get(\"term\") || \"\");\n const [scope, setScope] = useState(searchParams.get(\"scope\") || \"all\");\n const [results, setResults] = useState(null);\n const [submittedTerm, setSubmittedTerm] = useState(searchParams.get(\"term\") || \"\");\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setTerm(searchParams.get(\"term\") || \"\");\n setScope(searchParams.get(\"scope\") || \"all\");\n\n if (searchParams.get(\"term\")) {\n performSearch(searchParams.get(\"term\"), searchParams.get(\"scope\") || \"all\");\n }\n }, [searchParams]);\n\n const performSearch = async (searchTerm, searchScope) => {\n setResults(null);\n setIsLoading(true);\n\n try {\n const response = await authFetch(`/api/v2/search/${searchTerm}?scope=${searchScope}`);\n const data = await response.json();\n setResults(data);\n setSubmittedTerm(searchTerm);\n } catch (error) {\n throw new Response(\"Error performing search\", { status: 500 });\n } finally {\n setIsLoading(false);\n }\n };\n\n const handleSearch = async () => {\n if (!term) return;\n performSearch(term, scope);\n setSearchParams({ term, scope });\n };\n\n const handleKeyDown = (e) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n handleSearch();\n }\n };\n\n const sidebarContent = (\n\n\n
\n );\n\n return (\n \n
\n\n Search Results
\n\n \n setTerm(e.target.value)}\n placeholder=\"Enter search term\"\n onKeyDown={handleKeyDown}\n autoCapitalize=\"off\"\n />\n\n \n
\n \n \n
\n\n \n \n
\n );\n};\n\nexport default PhoneTitle;\n","export const songIndexLoader = async ({ request }) => {\n const url = new URL(request.url);\n const page = url.searchParams.get(\"page\") || 1;\n const sortOption = url.searchParams.get(\"sort\") || \"title:asc\";\n const perPage = url.searchParams.get(\"per_page\") || 10;\n\n try {\n const response = await fetch(`/api/v2/songs?page=${page}&sort=${sortOption}&per_page=${perPage}`);\n if (!response.ok) throw response;\n const data = await response.json();\n return {\n songs: data.songs,\n totalPages: data.total_pages,\n totalEntries: data.total_entries,\n page: parseInt(page, 10) - 1,\n sortOption,\n perPage: parseInt(perPage)\n };\n } catch (error) {\n throw new Response(\"Error fetching data\", { status: 500 });\n }\n};\n\nimport React, { useState } from \"react\";\nimport { useLoaderData, useNavigate } from \"react-router-dom\";\nimport { Helmet } from \"react-helmet-async\";\nimport { formatNumber } from \"./helpers/utils\";\nimport LayoutWrapper from \"./layout/LayoutWrapper\";\nimport Songs from \"./Songs\";\nimport Pagination from \"./controls/Pagination\";\nimport PhoneTitle from \"./PhoneTitle\";\nimport { paginationHelper } from \"./helpers/pagination\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faSearch } from \"@fortawesome/free-solid-svg-icons\";\n\nconst SongIndex = () => {\n const { songs, totalPages, totalEntries, page, sortOption, perPage } = useLoaderData();\n const navigate = useNavigate();\n const [searchTerm, setSearchTerm] = useState(\"\");\n const {\n tempPerPage,\n handlePageClick,\n handleSortChange,\n handlePerPageInputChange,\n handlePerPageBlurOrEnter\n } = paginationHelper(page, sortOption, perPage);\n\n const handleSearchChange = (event) => {\n setSearchTerm(event.target.value);\n };\n\n const handleSearchSubmit = () => {\n if (!searchTerm) return;\n navigate(`/search?term=${encodeURIComponent(searchTerm)}&scope=songs`);\n };\n\n const handleKeyDown = (e) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n handleSearchSubmit();\n }\n };\n\n const sidebarContent = (\n \n
\n {title}
\n \n
\n );\n\n return (\n <>\n Songs
\n{formatNumber(totalEntries)} total
\n\n\n
\n\n \n \n
\n \n
\n
\n \n
\n
\n );\n\n return (\n <>\n {songTitle}
\n\n {originalInfo}
\n Total Tracks: {totalEntries}\n
\n
\n \n \n
\n \n
\n );\n\n return (\n <>\n Content Tags
\n\n Tags are used to annotate and highlight content. The tag associations seen here have been pulled from various Phish.net projects as well as crowd-sourcing through the{\" \"}\n Tagin' Project.\n
\n\n
\n );\n\n return (\n <>\n \"{tag.name}\" Shows
\n\n\n
\n \n \n
\n \n
\n );\n\n return (\n <>\n \"{tag.name}\" Tracks
\n\n\n
\n \n \n
\n \n
\n );\n\n return (\n <>\n Today in History
\n\n\n
\n \n \n
\n\n \n \n
\n\n \n \n
\n No shows found for {getMonthDayDisplay()}.
\n ) : (\n\n
\n );\n\n return (\n <>\n Top 46 Shows
\n\n An aggregated list of the top shows, ranked by user likes from the Phish.in community.\n
\n\n
\n );\n\n return (\n <>\n Top 46 Tracks
\n\n An aggregated list of the top tracks, ranked by user likes from the Phish.in community.\n
\n\n
\n );\n\n return (\n <>\n Venues
\n{formatNumber(totalEntries)} total
\n\n\n
\n\n \n \n
\n \n \n
\n \n
\n
\n \n
\n
\n );\n\n return (\n <>\n {venue.name}
\n\n \n {venue.location}\n \n
\n\n {formatNumber(venue.shows_count, 'show')}\n
\n\n\n
\n\n {/* \n \n
\n \n
*/}\n \n
\n );\n\n return (\n <>\n Cover Art
\n{formatNumber(totalEntries)} total
\n\n \n
\n \n {shows.map((show) => (\n
\n {children}
;\n};\n\nexport default PageWrapper;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faEnvelope } from \"@fortawesome/free-solid-svg-icons\";\n\nconst EmailButton = () => (\n API Documentation
\nPhish.in provides programmatic access to content for free via a RESTful JSON API. There are two versions of the API. Version 2 is the latest stable version and is recommended. However, version 1 will remain supported for the foreseeable future.
\n\n\n\n
API v2
\nRecommended Version
\nVersion 2 of the API was released September 2024 and is the recommended version. Follow the link below for interactive documentation in Swagger. Browse the Grape API source on GitHub. Phish.in (this website) uses v2 of the API so you can also look at the React source on GitHub to see working examples.
\n\nNo API key is required to access v2 of the API.
\n\n\n\n
API v1
\nLegacy Version
\n\n Version 1 of the API was released in 2013 and is considered legacy. It is still available for use, but it is recommended to use the newer version. You can browse the source on GitHub. Below is documentation for the legacy API.\n
\n\n\n API keys can be requested via email:{\" \"}\n
\n\n
\n\n
\n
\n Requests
\n\n All requests must be in the form of\n HTTP GET and must include the\n Accept: application/json header as well as a bearer auth header:\n Authorization: Bearer <your_api_key>\n
\n\nResponses
\n\n Responses will include the header Content-Type: application/json and should be parsed as JSON.\n
\nResponses to successful requests look like this:
\n\n {`{ \"success\": true, \"total_entries\": #, \"total_pages\": #, \"page\": #, \"data\": [response content] }`}\n \n Responses to failed calls look like this:
\n\n {`{ success: false, message: \"Something went wrong!\" }`}\n \n\n Parameters
\nMost routes accept the following optional parameters:
\n- \n
- \n sort_attr: Which attribute to sort on (Ex: \"date\", \"name\")\n \n
- \n sort_dir: Which direction to sort in (asc|desc)\n \n
- \n per_page: How many results to list per page (default: 20)\n \n
- \n page: Which page of results to display (default: 1)\n \n
A few routes also accept the following optional parameters:
\n- \n
- \n tag: [/tracks and /shows] Return only results that have the\n specified tag slug (Example: /shows?tag=sbd)\n \n
Endpoints
\n\n All endpoints can be reached by using the full address of {location.pathname}/api/v1 followed by one of these routes:\n
\n\n\n GET /eras\n Returns all Eras and the Years that belong to each\n
\n\n Examples
\n[1] Requesting \"the song with ID of 40\":
\n \n GET https://phish.in/api/v1/songs/40.json\n \nwill result in this response:
\n\n {`{ \"success\": true, \"total_entries\": 1, \"total_pages\": 1, \"page\": 1, \"data\": { \"id\": 40, \"title\": \"Any Colour You Like\", \"alias\": null, \"tracks_count\": 1, \"slug\": \"any-colour-you-like\", \"updated_at\": \"2012-08-25T15:04:00Z\", \"tracks\": [ { \"id\": 17963, \"title\": \"Any Colour You Like\", \"duration\": 211696, \"show_id\": 904, \"show_date\": \"1998-11-02\", \"set\": \"2\", \"position\": 20, \"likes_count\": 0, \"slug\": \"any-colour-you-like\", \"mp3\": \"https://phish.in/audio/000/017/963/17963.mp3\" } ] } }`}\n \n\n [2] Requesting \"the 3 most recent shows\":
\n \n GET https://phish.in/api/v1/shows.json?per_page=3&page=1&sort_attr=date&sort_dir=desc\n \nwill result in a response that looks like this:
\n\n {`{ \"success\": true, \"total_entries\": 1467, \"total_pages\": 489, \"page\": 1, \"data\": [ /* Shows data */ ] }`}\n \n Contact Info
\n\n\n If you notice a bug, please file an issue or pull request on GitHub:\n
\n\n Join the community discussion on Discord:\n
\n\n Follow on Bluesky:\n
\n\n\n\n
\n Send an Email:\n
\n\n\n
Frequently Asked Questions
\n\nWhat is Phish.in?
\n\n Phish.in is a website and API for discovering, streaming, and sharing live audience recordings of the band Phish. The site has been running since 2013, delivering a reliable and comprehensive resource for fans.\n
\n\nAre there native mobile apps?
\nYes, there are native apps for iOS and Android. Follow the links below.
\nIs this site legal?
\n\n Yes, this site is 100% legal and complies with Phish's official taping policy as described at{\" \"}\n \n https://phish.com/#/faq/taping-guidelines\n .\n If you know any of the material on this site to be in violation of Phish's policy, please send an email:{\" \"}\n
Are there any keyboard shortcuts?
\nYes. To control audio playback, use Spacebar to toggle play/pause, left/right arrow keys to skip tracks, and hold shift and press left/right arrow keys to seek by 10 seconds.
\n\nIs there a dark mode?
\nNo, there's no native dark mode, but the site works well with Dark Reader.
\n\nCan I share excerpts of tracks?
\nYes, there are two ways to share excerpts of tracks.
\n\nYou can add \"t\" and \"e\" params to an individual URL. For example https://phish.in/1993-04-01/llama?t=1:00&e=1:05 would start playing Llama at 1 minute and stop playing five seconds later.
\n\nYou can also create a playlist and set the start and end seconds on each track and then share the playlist.
\n\nHow is the project funded?
\nThis site is funded privately.
\n\nHow are audio sources chosen?
\n\n The general goal of the site is to provide the most complete audio experience for every show in circulation, even if that means mixing different sources in rare cases. Due to hosting costs, there is currently only one recording per show, so the \"best\" source (highly subjective) is chosen from what is available online.\n
\n\n All content before 2013 was imported from the{\" \"}\n \n Phish Spreadsheet\n using a mostly automated process.\n
\n\n Starting in 2013, as new content is generated by the band, it's downloaded from{\" \"}\n \n https://bt.etree.org\n soon after it is uploaded by tapers. This usually occurs 8 to 12 hours after a show takes place. Often, the first source posted will be chosen to get content up as quickly as possible. However, if the first source contains labeling, splitting, or quality issues, an alternate source will be selected. In general, Phish.net setlists are preferred as far as labeling/splitting goes.\n
\n\n Sometimes sources will be replaced later if a better version becomes available, but this is rare. For multi-night runs, the same source is preferred, although not always available.\n
\n\n If you are aware of a source that is superior to the one on the site, please send an email:{\" \"}\n
Is there a list of missing audio content?
\nYes, see the Missing Content Report.
\n\nWhat format is audio encoded in?
\nMP3 format is currently provided. These may be replaced with lossless format at a later time as storage and bandwidth become available.
\n\nWhat technologies power the site?
\nRuby on Rails, React, and Postgres are the primary technologies used.
\n\nHow is album cover art created?
\nAlbum covers are generated with a combination of automation scripts and the assistance of ChatGPT and Dall-E.
\n Browse All Art\n\nHow can I contribute?
\n\n Join the discussion on{\" \"}\n
\n
\n Login with Google\n \n\n \n\n
Login with Email / Password
\n \n\n\n Forgot your password?\n
\n \n\n
Sign Up with Email
\n \nPrivacy Policy
\n\nWhen you login using a third party provider like Google, we collect only the information necessary to provide access to our services. We do not share your email address or any other personal information with anyone for any reason.
\nRequest Password Reset
\n \n\n
\n Reset Password
\n \nSign Up
\n \nTagin' Project
\n\nOverview
\n\n This site provides access to live legal Phish audio recordings. Its goal is to maintain a highly available and comprehensive archive of live performances curated by the community through cooperative effort. Content is discoverable based on available metadata such as performance date, song title, venue name, etc. Additionally, a set of curated tags has been applied; see the{\" \"}\n Tags page.\n
\n\n These have largely been imported from Phish.net projects such as Jam Charts and Teases. Many of these tags need verification and further expansion. Here is the list of tags relevant to the project:\n
\n- \n
- A Cappella \n
- Alt Lyric \n
- Alt Rig \n
- Alt Version \n
- Audience \n
- Banter \n
- Famous \n
- Guest \n
- Narration \n
- Signal \n
- Tease \n
- Unfinished \n
\n See the{\" \"}\n \n Master Tag.in Spreadsheet\n {\" \"}\n for the current state of the project.\n
*/}\n\nContributing
\n\n To contribute, please join the{\" \"}\n
Instructions for Contributors
\nNote: If you notice any issues with content during your listening (track labeling, audio quality, etc.), please enter it in the CONTENT ISSUES tab on the spreadsheet.
\n- \n
- Open the{\" \"}\n \n Master Tag.in Spreadsheet\n .\n \n
- Familiarize yourself with each tag by clicking the workbook tabs at the bottom of the screen (also see specific tag Conventions below). \n
- Listen to audio content on this website. \n
- When you notice a taggable moment that has not yet been captured or an incorrect tag, pause the playback (spacebar or button in upper-right). Note you can also scrub forward and backward in 5-second increments by pressing Shift-LeftArrow and Shift-RightArrow. \n
- Roll the mouse cursor over the track in question and click on the context menu (down arrow) that appears. \n
- Click \"Share\" in the dropdown menu (URL will be copied to clipboard). \n
- Return to the spreadsheet and select the appropriate workbook for the tag you want to add. \n
- Select \"Edit > Find and replace...\" and search for the existing URL to ensure it has not already been tagged. \n
- If it has already been tagged, verify the metadata, make any corrections, and add +1 to Verified column. \n
- If it has not been tagged, paste the URL into the URL column. \n
- If the tag applies only to a section of the track, add start/stop timestamps. If it starts at the beginning of the track, the start time can be omitted; same for the stop timestamp. Certain tags will lend themselves more to timestamps than others (\"Tease\", for example, should generally have start timestamps). \n
- Add text to Notes field, adhering to established conventions within each tag (see below). \n
- If the tag happens to be Banter or Narration, then spoken words should be transcribed and pasted into the Transcript column, ensuring that line breaks are preserved (Shift-Enter or Option-Enter). \n
Tag Conventions
\n\n Each tag entry in the spreadsheet consists of a URL (pointing to the track the tag is associated with) and optionally has Starts At, Ends At, and Notes fields. If a tag applies to the entire track, then Starts At and Ends At should be omitted. If the tag refers to the first half of the track, omit the Starts At value but enter the Ends At value; same for the second half accordingly. The Notes field should contain details about that tag instance.\n
\n\n Narration and Banter tags also include a Transcript field which contains a full transcript of all spoken words.\n
\n\n Below we outline conventions for each tag; these are subject to change as the project develops.\n
\n\nAudience
\n- \n
- Includes significant collective crowd response such as \"woo,\" \"polo,\" etc. \n
- Excludes random individuals caught on audience mics and Secret Language Signal responses, which should be tagged as \"Signal.\" \n
Famous
\n- \n
- Well-known (named) performances of songs like \"Prague Ghost,\" \"Tahoe Tweezer,\" etc. \n
Guest
\n- \n
- Any time another artist or group joins the band on stage. \n
- Past guests have been imported from the Phish.net Guest Chart. \n
Narration
\n- \n
- Any spoken word related to storytelling, such as Gamehendge narration or \"Harpua.\" \n
- Include a brief summary in the Notes section and a full transcript in the Transcript field. \n
Signal
\n- \n
- Any time one of the band members invokes a Secret Language signal. \n
- Past signals have been imported from Phish.net setlist notes but need to be split if they are combined. \n
- Apply Starts At timestamps to each Signal instance. \n
Tease
\n- \n
- The band members frequently reference other musical works during improvisation. \n
- Past teases have been imported from the Phish.net Tease Chart and setlist API, though they require verification and correction. \n
- Each tease should be input separately with specific timestamps and detailed Notes, especially if the tease is not listed on Phish.net. \n
Terms of Service
\n\nWe reserve the right to revoke user accounts or API access at any time, without prior notice, for any reason. This includes, but is not limited to, abusive behavior, sharing of copyrighted material, or any other behavior that is deemed inappropriate. By using this site, you agree to these terms.
\nSettings
\n\n\n
\n Change Username
\n {isCooldown ? (\n <>\n\n
\n
\n