Add current time pointer in schedule #21

Merged
ben merged 3 commits from cel/tilderadio-site:pointer into master 2 weeks ago
cel commented 3 weeks ago

This adds to the schedule page an indicator of the current time in the schedule. It is shown as a red line in the table cell of the current time slot, at a vertical position in the cell corresponding to the progess of time through that time block.

For use in browsers without JS, the pointer is produced in PHP. With JS it is then updated periodically along with the timestamp.

To aid the JS to be able to find the table cells and their corresponding timestamps, an id property is added to each schedule table cell that contains the start timestamp for the corresponding time period.

To try to prevent the line from interfering with readability of the DJ names on the schedule, the line is placed beneath the names using z-index.

If this UI is unclear or confusing, I'm open to suggestions to improve it.

Demo: https://tilde.town/~cel/tilderadio/schedule.html

This adds to the schedule page an indicator of the current time in the schedule. It is shown as a red line in the table cell of the current time slot, at a vertical position in the cell corresponding to the progess of time through that time block. For use in browsers without JS, the pointer is produced in PHP. With JS it is then updated periodically along with the timestamp. To aid the JS to be able to find the table cells and their corresponding timestamps, an id property is added to each schedule table cell that contains the start timestamp for the corresponding time period. To try to prevent the line from interfering with readability of the DJ names on the schedule, the line is placed beneath the names using z-index. If this UI is unclear or confusing, I'm open to suggestions to improve it. Demo: https://tilde.town/~cel/tilderadio/schedule.html
cel added 1 commit 3 weeks ago
a731a47f1c
Add current time pointer in schedule
ben commented 3 weeks ago
Owner

Looks nice! The red bar is still kind hard to see - what do you think about highlighting the entire box of the current timeslot?

Looks nice! The red bar is still kind hard to see - what do you think about highlighting the entire box of the current timeslot?
cel commented 3 weeks ago
Poster

@ben yes, I'll try to update that later.

@ben yes, I'll try to update that later.
cel added 1 commit 2 weeks ago
6749b45598
Highlight active half-hour cell
cel force-pushed pointer from 6749b45598 to 1e68d971c8 2 weeks ago
cel added 1 commit 2 weeks ago
05e101f9e8
Misc fixes for time pointer
ben merged commit c006a40edf into master 2 weeks ago
continuous-integration/drone/pr Build encountered an error
The pull request has been merged as c006a40edf.
Sign in to join this conversation.
No reviewers
No Milestone
No Assignees
2 Participants
Notifications
Due Date

No due date set.

Dependencies

This pull request currently doesn't have any dependencies.

Loading…
There is no content yet.