{"id":15146107,"url":"https://github.com/anthonyandroulakis/soundcloudtranscriptsmadeeasy","last_synced_at":"2025-04-28T13:41:26.053Z","repository":{"id":111808274,"uuid":"239927202","full_name":"AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy","owner":"AnthonyAndroulakis","description":"soundcloud transcript, subtitles, captions; html,css,js","archived":false,"fork":false,"pushed_at":"2020-02-13T18:59:10.000Z","size":966,"stargazers_count":4,"open_issues_count":0,"forks_count":3,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-30T10:11:15.178Z","etag":null,"topics":["captions","css","html","js","podcast","soundcloud","soundcloud-api","soundcloud-captions","soundcloud-podcast","soundcloud-subtitles","soundcloud-transcript","subtitles","transcript","waveform"],"latest_commit_sha":null,"homepage":"https://transferrablesndcld.anthonyandroula.repl.co/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/AnthonyAndroulakis.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-02-12T04:31:37.000Z","updated_at":"2022-01-29T06:35:28.000Z","dependencies_parsed_at":"2023-06-03T21:15:14.278Z","dependency_job_id":null,"html_url":"https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnthonyAndroulakis%2FSoundcloudTranscriptsMadeEasy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnthonyAndroulakis%2FSoundcloudTranscriptsMadeEasy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnthonyAndroulakis%2FSoundcloudTranscriptsMadeEasy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnthonyAndroulakis%2FSoundcloudTranscriptsMadeEasy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AnthonyAndroulakis","download_url":"https://codeload.github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251321255,"owners_count":21570704,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["captions","css","html","js","podcast","soundcloud","soundcloud-api","soundcloud-captions","soundcloud-podcast","soundcloud-subtitles","soundcloud-transcript","subtitles","transcript","waveform"],"created_at":"2024-09-26T12:00:57.114Z","updated_at":"2025-04-28T13:41:26.030Z","avatar_url":"https://github.com/AnthonyAndroulakis.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SoundcloudTranscriptsMadeEasy\njust as the title says: Soundcloud Transcript displays made easy, in html    \ntranscript, subtitles, captions, call it whatever you wish - this repo allows you to put these under a soundcloud track (potentially for a podcast)    \nDEMO CODE: https://repl.it/@AnthonyAndroula/transferrablesndcld     \nDEMO PAGE: https://transferrablesndcld.anthonyandroula.repl.co        \n\u003cimg src='https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/blob/master/examples/screenshotpic.png' alt='screenshot'\u003e     \n\n# Motivation\nWhile thinking of how to improve the display of a \"soundcloud podcast\", I noticed the cool-looking scrolling transcripts that YouTube, Khan Academy, and TED used. Such a design on a soundcloud track would (1) increase comprehension, (2) allow the audience to look at which words come next, and (3) allow the audience to read the transcript as they wish. So I set my eyes on achieving this. \n\n# Credit where credit is due\nWhen I started this project, I knew next to nothing about html, css, and js. I started by stumbling across X-Raym codepen titled \"SoundCloud Widget API - Subtitles and Interactive Transcripts\" (https://codepen.io/X-Raym/pen/QdwEgJ). The main idea of my code is in his/her code. The bulk of what I did was change the design and presentation of this code to make it easier to implement.\n\n# Quickstart (just tell me how to use this) \n(example implementation: https://repl.it/@AnthonyAndroula/transferrablesndcld)               \n1) get python (https://www.python.org/)\n2) create your transcript.csv file (an example can be found here: \n\u003ca href=\"https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/blob/master/examples/transcript.en.csv\"\u003etranscript.en.csv\u003c/a\u003e)   \nThe general format of a transcript csv file is\n```\nTRACK; tracknumber    \nDESCRIPTION; descriptiongoeshere    \nLENGTH; hh:mm:ss:deciseconds    \nhh:mm:ss:deciseconds; transcripttext1    \nhh:mm:ss:deciseconds; transcripttext2    \nhh:mm:ss:deciseconds; transcripttext3    \n.     \n.     \n.     \n```\n  -----\\*how to find track number:     \n  -----1. go to the track on the soundcloud website (for example, https://soundcloud.com/varlam/haydn-1)   \n  -----2. click the share button   \n  -----3. click the Embed tab   \n  -----4. copy the code in the code textbox   \n  -----5. now analyze this text: you will find a part that looks a bit like api.soundcloud.com/tracks/139528931 (the last number is your track number)       \nafter you've created your tracknum.html file, upload it onto your website   \n3) upload \u003ca href=\"https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/blob/master/sndcldscript.js\"\u003esndcldscript.js\u003c/a\u003e and \u003ca href=\"https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/blob/master/sndcldstyle.css\"\u003esndcldstyle.css\u003c/a\u003e onto your website (__must be in same directory as tracknum.html file__)    \n4) okay so the fun part: wherever you want to place a transcript file, add the following line (change according to your tracknumber): `\u003ciframe src=\"tracknumber.html\" width=\"100%\" height=\"444px\" frameborder=\"0\"\u003e\u003c/iframe\u003e`\n\n# Code formatting specifics\n- note: do not place semicolons(;) in your transcripts. This will make parsetranscript.py mess up.\n- How multiple soundcloud tracks are handled: soundcloud tracks and transcripts are put into iframes in order to minimize class, variable, and function conflicts. This also makes the code simpler to look at. However, iframes do have some downsides\nI'd recommend doing a bit of iframe research before implementing my code directly.       \n- How transcripts are displayed: I tried to make something inbetween TED's transcript and YouTube's transcript. I ended up making an invisible html table to put the time values and transcript text.      \n- this code is changable. I've added a repl.it page so you can play around with the code and change it as you wish\n\n# License\nMIT License: https://github.com/AnthonyAndroulakis/SoundcloudTranscriptsMadeEasy/blob/master/LICENSE\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fanthonyandroulakis%2Fsoundcloudtranscriptsmadeeasy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fanthonyandroulakis%2Fsoundcloudtranscriptsmadeeasy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fanthonyandroulakis%2Fsoundcloudtranscriptsmadeeasy/lists"}