These files form the basis of a music player with a simple layout and fast performance. player-generate.js creates player.html which contains data for the music files and loads player.js and player.css. player.js is the music player itself which has the following features:
- Shows "Now Playing" and your music library
- Now Playing is saved in local storage
- Keys: <> move through the Now Playing playlist; SPACE acts as play/pause; arrow keys move through the library; ENTER replaces Now Playing with the current artist or album; SHIFT+ENTER adds the current artist, album, or track to Now Playing; CTRL+0 - CTRL+9 takes you to different spaces or environments
- Full text search of artists in your library: just type the name. Prefers a prefix match, and falls back to an internal match if it can't find one.
A JXA javascript for Mac OS X that recurses through a folder gathering info for movie files (and audio files) and associates them with matching images and external subtitles in SRT, VTT, WEBVTT formats. The code lightly parses the directory structure and filenames to identify Show, Season Number, Episode Number, and Episode Title to produce objects or JSON describing the movies and HTML pages for browsing the collection.
A script to be loaded in an HTML page that adds keyboard control to the first <video> that it finds and keeps track of your current position within the video so that you can start the video at the same spot you left it.
- SPACE: Play/Pause;
- SHIFT+SPACE: Cycle through subtitles;
- S: Turn subtitles on and off;
- ENTER: Toggle Fullscreen;
- SHIFT+ENTER: Toggle PIP;
- ARROWLEFT: back 15s;
- ARROWRIGHT: forward 30s
The currentTime of the video is stored in localStorage using the page address as the key (origin + path only, excluding hash and search).
The current time of the video can be set using a query string like ?t=32m14s or a hash like #t=32m14s.
When starting a video, the playhead is adjusted backwards slightly based on the current subtitle cue to eliminate big gaps with no subtitles and reduce cut-off words when starting a video.
Subtitles are hidden when the video is paused and made visible again when the video starts.
A script to be loaded in an HTML page that adds keyboard control for navigating between <a> links using the up and down arrow keys. Search is enabled - it first looks for a matching prefix and if nothing found, it matches anywhere within the string. or It also looks in localStorage to see which of the <a> links was most recently active (where "active" is defined by some other page that writes to localStorage).
If you:
- Start with a collection of audio, video, and subtitle files
- Create an HTML page that contains links to all those files
- Add SRTVTTGather.js to that page
SRTVTTGather.js will:
- Loop through all the links and match up subtitles with the matching audio or video
- Convert SRT to WEBVTT so that subtitles can be displayed
- Hook up all the links so that a video player with subtitles will open when you click on the links