|Stream time||Channel||Name||Duration||Collab with 🐙Ina|
|Stream time||Description in Schedule||Name of Stream|
Ninomae Ina'nis is a virtual YouTuber with hololive production. She publishes her weekly streaming schedules on her Twitter. Since there are many different time zones, Ina can't create an image for all time zones. Instead, she only creates a weekly schedule for the zones PT, GMT and JST. Viewers from different time zones have to calculate the start times of Ina's streams for their local times themselves. This can get especially error-prone with daylight saving time.
Even Ina herself sometimes makes small mistakes when creating the schedules for the other time zones. While this is most of the time only a small copy-and-paste mistake like wrong time zone labels, in very rare cases the times themselves were calculated wrong. With this website, you can convert the times from the PST-Schedules to your local time zone to see the start times at a single glance without manually having to calculate the times and still being able to enjoy the beautiful art.
As soon as you open the website, the latest schedule should be loaded automatically. To see the image of the schedule and Ninomae Ina'nis original tweet, you will have to consent to the usage of twitter. The times on the schedule will then be replaced with the stream time in your local time zone. By default, like in Ina's original PT schedule, the month of the date is listed first and the day second.
Below the image of Ina's schedule, you will see three configurations you can change: The date format, the time format, and the time zone. For the date and time format, you can look up the different tokens in the momentjs documentation. Next to each input field is a reset button to revert the specific configuration to the default value.
The most important ones for the date are
M for the month
D for the day of the month. By using
DD you can tell the formatter to add a
leading 0 for values less than 10. The default format is
M.DD, meaning the month comes first, then a dot and then
the day of the month. To show the day before the month, you can use
The most important tokens for the time are
h for the hour
of day in a 12-hour format,
A for am/pm,
H for the hour of day in a 24-hour format,
m for the minute, and
z for the time zone.
Like with the day and month, duplicating the code adds a leading 0 if
the value is less than 10. Minutes will be automatically removed if
the stream starts at a full hour. The default format is
h:mmA z, meaning the 12-hour hour comes first, then a
colon, the minutes, AM or PM, and then the time zone. To use the
24-hour format, you can use
To get Ninomae Ina'nis' latest schedules, my server uses the Twitter API to listen for new tweets from her that contain images. If the notification about a new tweet arrives, the image from that tweet will be downloaded. By using optical character recognition (OCR) on that image, which could be Ina's new schedule, the server then tries to read the times and where they are located on the image. If at least three dates were found, the server stores the tweet's id, image-URL, and the extracted times in a database.
When a user now opens this website, the browser will ask my server to send you the data of the latest schedule. After being told which tweet contains Ina's current schedule, the browser will load the image from Twitter. The original dates and times on the image will then be hidden behind text overlays containing Ina's stream times that were read from the image adjusted to the selected time zone.
Added support for twitter spaces. They should be detected, added to the schedule and used for notifications automatically when they are created.
Fixed an encoding problem in the configuration files that prevented channel mentions in youtube video descriptions from being detected correctly as collabs for youtube channel names with japanese characters.
Fixed an issue where tba schedule times weren't converted to normal times when the youtube time exactly matches the predicted stream time.
Added highlights for mentions of other Hololive talents, which colors their name with their color and adds their emoji. The highlights can be disabled with a checkbox.
Added option to hide break days. Break days are now also shown in the text-only-view, when they are not set to hidden.
The color of the schedule title can now be set independently of the text color.
The duration of streams and videos is now collected and displayed.
Quick hack to support non-Youtube-links (for example Twitter spaces).
Schedule times with a video now show a preview of the thumbnail and the links to/thumbnails of the perspectives of the collaborators in a tooltip.
The collab detection now looks if a video owner was mentioned in the schedule description for the matching timeslot.
Added a container between the container of the background image and the contaier of the schedule for some css magic to hide the image overflow while the tooltip-overflow is still visible.
Fixed a performance problem when loading the current schedules. It was caused by an inefficient query when loading the streams from other channels.
Fixed tooltips for the schedule not being cleared when changing the schedule configuration.
Improved mobile-friendliness of the tooltips showing the related youtube videos.
Set most images to load lazily in order to reduce used bandwidth, especially when using the text-only mode.
Fixed some parsing problems that occured for the latest schedule.
Added an improved collab detection for streams on other channels. Previously, Ina had to tweet about the stream and be mentioned in the description for a stream to automatically be recognized as a collab. Now, instead of only looking for Ina's videos on youtube, the channels of all HoloEN members are not watched. If a new stream is scheduled, my server searches for indicators that this might be a collab with Ina. These indicators are currently:
Sadly this wouldn't have helped with the off-collab Karaokes, since Ina didn't have a schedule and wasn't mentioned in the video titles or descriptions. Only the second one would have been recognized as very unlikely, since Ina tweeted about it. For the future, a voting system is planned, where users can vote which streams are collabs, but since it is directly tied to notifications, I have to make sure that it can't be abused. Initially I might manually approve "moderators" who can vote for them while I am unavailable.
Added support for Ina's background/tentacle pattern from the older schedules.
Added Yellow box for background artists in V3 schedules.
Added more configuration options for the text-only schedule.
Now also stalking Hololive ID members on youtube.
Improved the search functionality to allow queries that are more complex than just a simple "contains exactly":
Song -chattingwill return all original songs or song covers without the aftertalk-stream that Ina did with Kiara.
"half life"will return the "Half-Life 2"-Streams.
+song +coverwill return all "Song Cover" and "Cover Song" streams.
These operators can be combined to more complex queries.
("half life" "black mesa") for example returns all
Half-Life and all Black Mesa streams. The second black mesa stream can
be excluded by using
("half life" "black mesa") -call. To
additionally include the call of cthulhu streams,
cthul* (("half life" "black mesa") -call) can be used.
The exclusion of "call" is grouped together with black mesa/half life
and does not apply to cthul*. If we furthermore wanted to include all
song covers/cover songs, we could also append their condition to the
cthul* (("half life" "black mesa") -call) (+song +cover
The search now also supports an empty search, which will return all streams that are known to contain Ina. Some of the older collabs may be missing, since the schedules for them haven't been added. If you find a missing stream for which the schedule was already created, feel free to contact me and I will add it.
Videos that don't match an existing scheduled stream are now added as guerilla streams automatically. TBA-Entries will now be matched to streams and the title filled in.
Added support for the Ina's inital schedule style.
Added additional coordinates to support that the time is not located directly next to the date.
Started implementing a basic Discord bot, that can post notifications to discord servers. For a first experimental setup, you can join https://discord.gg/Z5Ddu8CAUC.
Ina is very good at finding bugs... The ones around moving streams should now be fixed.
Added TBA-Entries for rendering. They currently wont be automatically replaced with published videos, but I still have a few days until that should be needed.
Fixed an issue causing preview images not to be rendered correctly for discord.
Set up server-side-rendering for search engines with the help of https://prerender.io/. This should make it easier for google and other search engines to index the latest versions of the schedule and maybe some more of the past schedules.
Added playlist links for search results. These playlists are auto-generated and limited to 50 videos. If there were more search results, they will be split up into multiple playlists accordingly. Three types of links will be created: "Play all" contains all videos, "Play only from Ina's channel" only contains videos from Ina's channel and "Play only full Ina" only contains videos from Ina's channel or collabs on other channels where Ina was present for the entire stream (excluding, for example, Call-ins or short ingame encounters).
Added option to enable or disable notifications for member only streams. For existing subscriptions, they will be enabled until explicitly disabled.
Long text in the schedule now finally gets resized automatically to fit into the allocated space instead of being cut off or wander into the background image.
Added dark mode to protect those poor eyes. The dark mode doesn't use the original colors from the schedule, but will instead use a black background with white text. Images will receive a transparent black overlay. By default, the light/dark mode depends of the system settings, but can be changed in the footer.
Fixed an issue where videos mentioned in Ina's tweets were always interpreted as collabs with her instead of checking if Ina is mentioned in the description. Furthermore, collab streams on other channels can't replace streams on Ina's channel. Furthermore, collab streams have to start within 15 minutes of the scheduled time to avoid interpreting previous/next relay streams as collabs and marking the stream as moved. I'm sorry about the wrong "Stream moved" notifications for the Mario Kart and outfit reveal.
Fixed an issue where tweeted collab videos on other channels sometimes weren't recognized as having Ina in it.
Added many smaller quality of life improvements:
Fixed error in the calculation of the number of rows and the missing dates caused by the year change.
The stream description now supports embedding images. These are sadly not automatically extracted from the schedule that was posted by Ina, but have to be added manually afterwards.
This update should finally fix the alignment issue for the stream description on small screens. The texts should now be properly aligned and the links properly clickable.
Added a search function. The results are displayed in a beautiful table...
Added a new
fullscreen page, where
only the schedule is shown in fullscreen. It uses the settings from
the main page or can be configured with the query parameters
language. This could, for example. be used for live
wallpapers that support websites.
Added two new buttons to the top right/left of the schedule that show up when hovering over it: fullscreen and download. The fullscreen button redirects to above mentioned page and the download button downloads the current schedule as an image.
We now check Ina's tweets for links to youtube videos or if she quotes a tweet, that contains a youtube link, which mentions her channel in the descriptions. That way the server is able to detect collabs on other channels and member-only streams, if Ina announces that the stream will start in x minutes.
Fixed notification issues where sometimes the stream title would be missing and notifications were sent for the start of cancelled streams.
Someone forgot some numbers in the OCR training data... This should now be fixed. Fixed an issue where the first line could be skipped in some special cases.
Added automatic translations for the content of the schedules. The
parsed descriptions will be translated with the help of the DeepL API.
A language can be chosen from the language dropdown with a quick
selection for english and automatically detecting the best language
based on the browser settings.
The schedule builder currently does not support multiple languages. While any language can be written into the input fields, when publishing them to the server, it assumes that the language is english and starts the automatic translation process. I am planning to add manual translations in the future.
The number of rows in the layout-adjusted schedule will now automatically increase, if more than the default number of lines are required.
Added support for new divider styles between dates, times, and descriptions.
Fixed parsing of schedules in the new layout when the table is to the right of the background image. The calendar now allows clicking on break days.
By using a bit of magic and promising my first born child to the Ancient Ones (also known as retraining the OCR-Model and reprogramming the parsing process), the server should now be able to parse the entirety of the schedule image, including the description of the scheduled streams. This allows the website to completely rearrange and customize the table, allowing it for example to group streams on the same day and adjust breaks if streams land on a different day than in the PT timezone.
Apart from many smaller improvements to the schedule builder, this update introduces a serviceworker. This adds limited offline capabilities for schedules you visited previously. Mobile and Chrome-based browsers will furthermore allow you to add the website to your home screen and use it like a native app. Lastly, with most commonly used browsers (except for safari), you can now enable web push notifications to be reminded about upcoming streams or be notified when Ina publishes a new schedule or stream.
Tried to adjust the automatic parser for the schedule times for the new layout. Since there are currently only two schedules with that layout available, the parsing may not be as reliable as with the old one.
This update adds a builder to create schedules structured like Ina's schedules with full timezone support. While only authorized users are allowed to save or publish the created schedules to the server, everyone can use the builder and create images. Schedules can be saved to and loaded from the local hard drive as well.
With the help of the YouTube Data API, the server can now fetch Ina's VODs and scheduled or currently active streams. If the start time of the stream is close to one of the times of the schedule, the two will be linked. All scheduled streams in the time-zone-adjusted schedule, that could be linked to a video, will have a box around the name. Hovering over that box will show the name of the stream or VOD and clicking on it opens it in a new tab.
This update adds a calendar which can be used to navigate the different schedules and shows the days for which the server knows stream times. When hovering over a day in the calendar, it lists the known times and if a stream on that day was cancelled or moved. Some days may be shown as not having a stream even if Ina streamed on that day. This can happen if the schedule wasn't/couldn't be parsed, if Ina didn't post a schedule containing the stream or if it was an unscheduled "Guerilla Stream". The dates and times are shown for the currently selected time zone and not the dates from the original schedule.
The schedules on this website can now show when Ina cancels a stream or moves them to a different time or date. These changes have to be added manually and it may take a few hours before they show up.
My server now uses Twitter's filtered streams to get notified in real-time about new tweets from Ina. Instead of having to regularly poll twitter for new tweets, the filtered streams allow Twitter to inform my server about new tweets nearly immediately after they were sent. New schedules should now be parsed and ready to be displayed in different time zones within a few seconds after Ina tweeted them.
This update adds the ability to view older schedules. Below the
embedded tweet are now links to the previous and the next schedule.
Additionally it is possible to search for the schedule of a specific
date by adding
?date=<iso-date> to the URL. Future
versions will probably add a more user-friendly way to jump to
This update adds accent-colors for the time zones. It also fixes the detection of the main text color where the color of the time zones was used as the primary color. The detected font sizes should now be more accurate. This also fixes a problem where the first date was not detected correctly.