pardoman / twitchtvchat Goto Github PK
View Code? Open in Web Editor NEWA 2d canvas overlay that display chat text
A 2d canvas overlay that display chat text
This happens because chaning the current channel may happen through ajax, and a new video player is created. However, the extension is still loaded and keeping a reference to a no-longer-in-stage canvas2d.
Solution: detect when the cached player gets removed from dom and clear extension's internal variables.
Might be cool to have.
Maybe have an option to toggle it on/off
Finally, using some sort of color to distinguish the name from the message could be nice. Will have to try and see if it actually works.
This is because it relies on some simple Math.random() logic, which will never be great.
What we need is some sort of priority queue, that takes into account the length of the text, so that short text can co-live in the same line while long text can occupy a line without any other new text jumping on it.
To better repro this issue, inject overlay to an active stream chat.
For example, a tournament event
Repro steps:
RESULT: Notice that new text will show up and pilled up to the left.
EXPECTED: Chats should not be piled to the right. Some texts should be midway through their path, other leaving the screen on the left.
Canvas is actually not great when it comes to performance.
There's way too much re-rendering of the whole area, specially in fullscreen mode.
A better approach is to leverage browser's native text rendering.
Ideally this extension should work on fullscreen mode. The problem is that the video player is flash, and drawing html on top of flash is not doable afaik.
Maybe when the html5 video player is available we can look into it.
Steps:
RESULT: The extension fails to re-inject itself to the rehosted stream
EXPECTED: The extension re-injects to the rehosted steam smoothly.
WORKAROUND: Refresh the page.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.