44:["$","title",null,{"children":"YouTube Transcriber | Jeremy Ashkenas | Observable"}] 4c:T52a,md`# YouTube Transcriber

Usage: \`import {transcribe, style} from "@jashkenas/youtube-transcriber"\` This is a little library notebook that takes a raw transcription from YouTube, and allows you to automatically link the text, format it, and annotate it with images. Here’s an example: [Against the Current by Chris Granger](https://beta.observablehq.com/@jashkenas/against-the-current-what-we-learned-from-eve-transcript) The transcription text format can be copied and pasted from YouTube’s automatically generated transcript, and looks like this:

\`\`\` 00:01 WELCOME, ONE AND ALL, TO "THE LATE SHOW." 00:01 I'M YOUR HOST, STEPHEN COLBERT. 00:03 IMG-1 LAST NIGHT WAS A MONUMENTAL ELECTION THAT FUNDAMENTALLY 00:08 SHIFTS THE BALANCE OF POWER IN WASHINGTON, D.C. FOR YEARS TO ... \`\`\` Call the \`transcribe(...)\` function with the \`transcript\` text, the \`youtube\` video id, and optionally an \`imageUrl\`, which is the root URL for the image numbers that you’ve (again, optionally) chosen to sprinkle into the transcript at appropriate moments.`4d:[] 48:{"id":"089038cde55fd7aa","slug":"youtube-transcriber","title":"YouTube Transcriber","thumbnail":"4aaa7f9d07c870021876c7176b960f7f18bd4dda46d298cfa4d33963b217aa71","access_level":"public","create_time":"$D2018-11-08T17:42:36.549Z","update_time":"$D2018-11-10T15:28:44.802Z","view_time":null,"first_public_time":"$D2018-11-08T20:37:19.601Z","has_unpublished_edits":null,"fork":false,"stars":14,"starred":false,"owner":{"type":"team","id":"172cc08ef8a18a4b","login":"jashkenas","name":"Jeremy Ashkenas","avatar_url":"https://avatars-next.observableusercontent.com/fa1903f8171d4621ef49de28e0ff1fb965960ec87df175d8b543c4b09508b45b","tier":"starter_2024","bio":"Used to work on @observablehq — still think it rocks.\n🏍 🌎 👶","followed_by_you":false,"follows_you":false},"version":48,"publish_version":48,"role":null,"authored":false,"authors":[{"type":"individual","id":"783616ba9fb55f5d","login":"jashkenas","name":"Jeremy Ashkenas","avatar_url":"https://avatars-next.observableusercontent.com/fa1903f8171d4621ef49de28e0ff1fb965960ec87df175d8b543c4b09508b45b","tier":null,"bio":"Used to work on @observablehq — still think it rocks.\n🏍 🌎 👶","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"783616ba9fb55f5d","login":"jashkenas","name":"Jeremy Ashkenas","avatar_url":"https://avatars-next.observableusercontent.com/fa1903f8171d4621ef49de28e0ff1fb965960ec87df175d8b543c4b09508b45b","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"YouTube Transcriber","cells":[{"id":0,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"function transcribe({ youtube, transcript, imageUrl }) {\n let baseImageUrl;\n const lines = transcript.split(\"\\n\");\n const data = [];\n for (let i = 0; i <= lines.length; i += 2) {\n if (lines[i]) {\n const [time, ...images] = lines[i].split(\" \");\n data.push({\n sec: timeToSeconds(time),\n time,\n text: lines[i + 1],\n images\n });\n }\n }\n const parts = [];\n data.forEach(d => {\n if (d.images) {\n for (let image of d.images) {\n if (image) {\n const num = image.split(\"-\")[1];\n parts.push(html`

`);\n }\n }\n }\n parts.push(\n youtube\n ? html` ${d.text} `\n : ` ${d.text} `\n );\n });\n const view = html`

${parts}

`;\n view.value = data;\n return view;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"style = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"function timeToSeconds(str) {\n if (str == null) throw \"Can't convert time\";\n const [minutes, seconds] = str.split(\":\");\n return +minutes * 60 + +seconds;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4d","stdlib":"1"}} 24:null