Support other aspect ratios
Closed this issue · 4 comments
Helper appears to be designed for a fixed aspect ratio of 12:5 (WIDTH_ORIGINAL = 264, HEIGHT_ORIGINAL = 110). That can be fine if it's going to be inserted as a small element of a larger scene, but I was looking to use Helper to be the sole content on a standard 16:9 HDTV screen. I tried increasing HEIGHT_ORIGINAL, which did increase the height of the background rectangle, but the content within the rectangle did not move so it appeared to be aligned to the top which wasn't very pleasing. Perhaps a simple solution could be that the content would be centered vertically within the available space, as it already appears to be centered horizontally.
Thanks for the feedback! I can take a look at this as well. 👍
A friend of mine led a playthrough of Twilight Imperium at a local board game cafe as a precursor to his Extra Life livestream this year. We had Extra Life Helper on a TV in the room to inform onlookers about the event and to keep the players motivated by donations.
Donors could purchase opportunities to influence the game by forcing a die to be rerolled or compelling a faction to vote for a particular outcome.
I had to adjust the positioning of each text element in helper.js to recenter it on its new 16:9 canvas. I also replaced the logo svg with one with more information about the event and how to donate, and here too I had to adjust the script to account for the different dimensions and aspect ratio of the new svg. If the hardcoded positions and sizes could be replaced with percentages, and if the svg were placed and sized based on the svg's actual size, that would make such customization easier.
Thanks for sharing how your friend used the Helper! It always makes me very happy to hear how Extra Lifers are using it to assist with their fundraising efforts. It gets me excited about working on it again.
Yep, the implementation of the Helper is very, very old. Embarrassingly old and using an unnecessary vector library for layout and animation. I've been wanting to rebuild it for a while now using a simple responsive layout and CSS animation that would work for any size and aspect ratio.
Closing this as I am currently re-writing the Extra Life Helper from scratch and will be ensuring that the layout is responsive.