First "oh god what am I doing" stable release is online: http://mrponiator.github.io/ponkaclock/
Imgur gallery for the different ponka pictures can be found here: http://imgur.com/a/Efmi6
Here's a quick feature/changes list:
1. Data.txt is fully compatible with the current flash-based ponka clock. However, there's a few additions:
- Support for episode synopses via 'ep#_synopsis'. Click on the '?' button to view given episode's synopsis in the clock.
ex: ep1_synopsis=Ponies being ponies.
- You can set the default scaling via 'scale'. Similarly you can set the maximum scale with 'scale_max' (I recommend keeping this value at 2~4, default in my example is 3). If mobile device is detected, 'scale_mobile' is used instead.
- You can set the initial volume with 'volume'. Keep this between 0.0 (muted) and 1.0 (maxed).
- Flash ponka clock ignores these values, so they shouldn't cause any conflict. Similarly, this clock does not read the 'startTypeToggles', as it's not needed.
2. Instead of immediately saying "Already aired!", it will say how long ago the episode started if it has been less then 30 minutes.
3. Instead of clicking anywhere inside the clock, you turn alarms off by clicking on the corresponding alarm icon (small alarm clock for episode alarms, bigger for alarm clock). Toggling mute and looping will also stop the alarm.
4. You can change the default alarm sounds by changing 'alarm1.ogg/mp3/wav' and 'alarm2.ogg/mp3/wav' files inside the src folder. By default the clock checks for OGG, MP3 or WAV support in that order. Whatever responds first to true will be loaded. If none of those is supported, a message will be displayed above the clock with the "audio_compability" [sic] div element.
5. Mobile version only supports cycling between episodes and synopses. It has a slightly different UI from the regular view, too. I decided not to support alarm sounds on Android/iOS due to not having an iPhone, or sufficient testing tools.
6. You can change the ponka .png files in the src folder to whatever you'd like. I'd recommend keeping them 50x67 so that they'll display properly, and keep the file names the same.
7. There's a plain text version available. It only displays the countdown, next episode's name and automatically switches to the next as time passes.
I will write more formal instructions on the github page later, but here's a quick run-down:
- Link jQuery 1.11.1* in your HTML file of choice. My github version uses google hosted one, but you may just use your own local copy or download one.
- From the index.html, copy lines 44 through 53 and place them in your HTML file's <body>.
- Optional, but for centering on your HTML page you could also copy the CSS code.
- Download data.txt and the 'src' directory, and place them in the same directory as your HTML file.
- You should be done. It should be noted that because the clock loads a couple of files via AJAX, it will not work in chrome if opened locally. Firefox plays it fine locally, however.
*= This version was chosen due to jQuery mobile, which I dropped at the last minute. Oops.
Hopefully it works for you fellows.