Wanted to add something here. I’m able to remove components from the player by injecting a js script into my WKWebView. It looks good and it solves a number of issues:
-
The settings button on the embed is for desktop, and has irrelevant settings. Also, the quality is always set on auto anyways.
-
The twitch logo button in the embed doesn’t actually link to twitch when embedded via WKWebView on iOS, its completely broken so it is also removed.
-
The title area has most of its stuff removed because it fails to lay out in a way that actually fits.
-
The streamers image is way too small to really see what it is.
This is obviously against the developer agreement, but I thought it might be helpful in addressing the issue that a simple mobile=true parameter can use the same script that I have to remove these elements that don’t work on mobile.
Then I can then include those elements natively by creating my own view to display the title, viewer count from the API, streamer name and image, follow/sub buttons, etc. I have no problem with twitch requiring this functionality in their embed, I just have a problem with it not working.
This makes for a very interesting idea with the best of both worlds. We can create a very simple iOS SDK that does a few things:
- Provide it a URL for your embed on your website (like what I did in my post initially)
- Provide it a channel or clip
- It can return a view with the embedded stream in a webview, but with the problematic elements removed. And then it can provide a native view to display the removed functionality properly.
This is essentially how some native ads work. You give it something to load a video ad into, and it gives you back the information to display alongside it (like a CTA button, advertiser name, etc).
I would love to build a maintain a community repo on the iOS side, if that were ever allowed.
