noeal-dac / animated-lower-thirds Goto Github PK
View Code? Open in Web Editor NEWAnimated Lower Thirds with dockable Control Panel - OBS Tool
License: MIT License
Animated Lower Thirds with dockable Control Panel - OBS Tool
License: MIT License
Describe the bug
Lower thirds does not scale to the screen DPI.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
Lower Thirds scales to the screen DPI.
Actual behavior
Lower Thirds does not scale and thus appears too small.
Desktop (please complete the following information):
$ lsb_release -a
No LSB modules are available.
Distributor ID: Ubuntu
Description: Ubuntu 20.04.2 LTS
Release: 20.04
Codename: focal
In Design 2, with the same settings, the first and second line of LT1 is not at the same height as on the other LTs. For demonstration I put it both on left side. But it is the same on Left/Right or any other orientation.
LT2, LT3 and LT4 are perfectly aligned.
Design 1 and 3 are also fine.
Version 1.6 (latest)
{"alt-2-style-color-2":"rgba(59,59,59,0)","alt-1-inverse-ratio":"8","alt-3-border-thickness":"false","lower-thirds-switch2":"true","alt-4-inverse-ratio":"8","alt-4-autoload":"false","alt-1-style":"2","alt-1-logo-default":"../logos/logo_1.png","alt-4-style-color-1":"rgba(213,65,65,0)","alt-2-align-left":"true","alt-1-preview":"false","alt-4-margin-h":"22","alt-1-style-color-1":"#E76000","alt-1-logo-2":"","alt-1-margin-v":"1","alt-3-margin-v":"1","alt-1-info-weight":"false","alt-3-style-color-1":"rgba(213,65,65,0)","set-tooltips":"false","alt-2-logo-preview":"../logos/logo_2.png","alt-1-shadow-amount":"5","alt-1-border-color":"false","alt-4-name-color":"#F2F2F2","alt-3-logo":"false","alt-2-align-right":"false","global-animation-time":"","alt-1-info-transform":"false","alt-2-logo":"false","alt-1-margin-h":"22","alt-1-lock-active":"true","alt-1-name-1":"","alt-1-active-time":"","alt-3-lock-active":"true","alt-1-logo-1":"","alt-1-inactive-time":"","alt-4-logo-preview":"../logos/logo_4.png","alt-4-style":"2","set-preview":"false","alt-1-name":"John Doe","alt-2-autotrigger":"false","alt-3-margin-h":"22","alt-1-style-color-3":"#E76000","alt-3-info":"","alt-3-name":"","alt-2-line-spacing":"1","alt-1-align-right":"false","alt-1-font":"'Open Sans', sans-serif","global-active-time":"15","alt-1-name-weight":"true","alt-2-info-color":"#F2F2F2","alt-1-logo-preview":"../logos/logo_1.png","set-slot-numbers":"false","alt-3-border-color":"false","lower-thirds-masterswitch":"true","alt-4-line-spacing":"1","alt-2-style-color-3":"#E76000","alt-3-info-color":"#F2F2F2","alt-3-logo-preview":"../logos/logo_1.png","lower-thirds-switch1":"true","alt-2-inverse-ratio":"8","alt-1-corners":"0","alt-1-logo":"false","alt-2-name-color":"#14CC1F","alt-1-border-thickness":"false","alt-2-shadows":"false","alt-1-logo-size":"-2","global-lock-active":"false","alt-4-info":"","alt-1-info-2":"","alt-1-shadows":"false","alt-1-name-2":"","alt-4-logo-9":"","alt-2-style-color-1":"#6300E7","alt-2-logo-size":"-2","alt-3-name-color":"#F2F2F2","alt-1-info":"Professional Services Consultant","alt-1-line-spacing":"1","alt-3-line-spacing":"1","alt-4-lock-active":"true","alt-2-info":"Professional Services Consultant","alt-2-name":"John Doe","alt-1-style-color-2":"rgba(59,59,59,0)","alt-4-margin-v":"1","alt-4-name":"","alt-3-inverse-ratio":"8","alt-1-background":"true","alt-1-name-transform":"true","alt-1-info-1":"","alt-4-logo-default":"../logos/logo_4.png","lower-thirds-switch3":"false","alt-1-oneshot":"true","alt-2-lock-active":"true","alt-3-logo-default":"../logos/logo_3.png","alt-3-style":"2","alt-2-logo-default":"../logos/logo_2.png","lower-thirds-switch4":"false","theme":"dark","alt-4-info-9":"","alt-2-font":"'Open Sans', sans-serif","alt-1-align-center":"false","alt-1-animation-time":"","alt-2-background":"true","alt-4-logo":"false","alt-2-name-transform":"true","sorted":"alt[]=1&alt[]=2&alt[]=3&alt[]=4","alt-4-info-color":"#F2F2F2","set-switch-position":"false","alt-1-align-left":"true","alt-2-margin-h":"22","alt-4-style-color-3":"rgba(213,65,65,0)","alt-3-style-color-3":"rgba(213,65,65,0)","alt-2-align-center":"false","alt-2-corners":"0","alt-1-autotrigger":"false","alt-4-name-9":"","alt-2-style":"2","alt-1-size":"24","alt-1-info-color":"#F2F2F2","alt-2-margin-v":"1"}
Is your feature request related to a problem? Please describe.
Unless I am mistaken, it is not possible to control lower thirds through networking, control panel and viewing page have to be in the same CEF environment.
Describe the solution you'd like
Reaching the control panel on an IP address via http and source browser also uses the viewer on the same principle, hosted like nodecg or nginx-php solution.
Is it possible?
Thank you.
Hello @noeal-dac!
I was searching for a dynamic scoreboard solution and found this one: https://obsproject.com/forum/resources/versus-c-obs-scoreboard.1339/
With this solution, I'll have to run a separated app in order to change the scoreboard information. This got me thinking: hey, imagine if there's a way to use a scoreboard just like this amazing lower thirds system? That would be perfect :)
Have you thought of that before? Do you think this would be a nice "side-project"?
Thanks a lot, have a great Sunday!
Describe the bug
When exiting OBS 27.1.3 with the LT 1.6 dockable browser window active and running a Companion 2.2.x beta, the LT 1.6 browser window will clear and either show all black or white. OBS will then crash.
If you remove the LT1.6 browser pane, wait for 30 seconds (for the process to complete) then exit, OBS won't crash.
To Reproduce
Have OBS 27.1.3 / LT 1.6 / Websocket 4.9.1 / Companion Beta (companion-2.2.0-86711173-3681-win64.exe) installed
Desktop (please complete the following information):
It would be nice to be able to insert the TIME or DATE into a Lower third. Maybe set this as Right justify from the Right side of the screen.
A way to request variables might be something like:
{@Date} - {@time}
There may be other variables like System Name, IP Address, etc so this feature might be best as a generic implementation for future improvement.
Another thought hit me as well, some tools like with StreamDeck will drop information into a File, such as a Song Title. So another variable might be a filename:
{@file:D:\mystuff\song.txt}
Great OBS tool!
Is your feature request related to a problem? Please describe.
Not at all :)
Describe the solution you'd like
Hello sir! First of all, thanks for this great solution, you had delivered an incredible addon for the OBS community. I was wondering if this could be a nice foundation for an important addon only found on expensive broadcast solutions:
vMix Social. The way you've managed to create a command panel and how elegant it is, your solution has the best path of doing it, in my opinion. I know that this would a lot of work, specially creating a safe way of users to connect to their social accounts and making it all possible just using HTML code.
Describe alternatives you've considered
vMix Social? haha
Additional context
https://www.vmix.com/products/vmix-social.aspx
I know this is asking for too much maybe, but there's nothing else available at the moment. Thanks again for your great work here, it is top notch. just brilliant :)
Can we get more styles or make our own style?
Great work on this plug in, very simple to get going.
I cant seem to insert a logo - have tried PNG/TIFF/JPEG all with the same result.
Each time I select one, it shows the file missing icon - i'm selecting a file from a local folder (not network)
Have I configured something incorrectly, do they need to be copied to a specific location?
Describe the bug
Some dialogs are not working on Linux. Specifically, I found the following dialogs to not work on Linux:
There might be other dialogs that don't work that I'm not aware of.
To Reproduce
Steps to reproduce the behavior regarding "CHOOSE IMAGE" (1):
+
, click on show more
, click on a logo. The logo view opens (without delete symbol).Expected behavior: a dialog appears that allows choosing one of the four logos.
Steps to reproduce the behavior regarding "CHOOSE IMAGE" (2):
Expected behavior: a dialog appears that allows choosing one of the four logos.
Steps to reproduce the behavior regarding fonts:
Expected behavior: a dropdown appears that allows choosing one of the installed fonts.
Expected behavior
(See section To Reproduce)
Screenshots
Wouldn't be helpful, but I can record a video if that helps.
Desktop (please complete the following information):
Additional context
Add any other context about the problem here.
Is your feature request related to a problem? Please describe.
Nop. Only a New Feature.
Describe the solution you'd like
Hello, I would like to be able to modify the width of LT to make a Banner that occupies 100% of the screen.
Like this.
At the moment I put a div in browser-source.html and styled it with width in px to the exact size that I will like.
I like to modify the width of LT or be able to put this div and be able to modify in the panel control.
Describe alternatives you've considered
The First idea i had is put a div into the text, and put style with width in px to exactly size i will like it. But dont like it.
Great Job. Thank for this solution.
is it possible to add which LT and slot to load on startup of each scene ?
Describe the bug
All works as expected, but
i can add title and subtitles to the memory slots of each of the 4 instances
But once added, they cannot be changed or deleted.
when button "clear text fields"pressed, the memory slots get greyed out and title and subtitle can be changed,
but as soon as a memory slot number is clicked, it all (all slots) get restored to the first entered name. so all slots are filled with the same name and subtitle
i have made sure all files have read/write access, further i have no idea where the entered fields get stored
Desktop (please complete the following information):
Additional context
Add any other context about the problem here.
When i am choosing logo from another dir, it doesn't display correctly
Attached an youtube video
https://youtu.be/CE3Nqo0x7EY
Currently the 3 lower-thirds styles do very nice motion animations coming in and out.
I would like an option to instead have a simple fade-in and fade-out (with configurable fade times). Maybe it could be a slider/checkbox in the configuration.
It would be good to have scrolling texts on either these or new styles...
Describe the bug
If you first select style number 2 (No logo) and then select any of the others (1 or 3) the logo selector does not appear.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
Activate the logo selector
Screenshots
And also in style 1
Desktop (please complete the following information):
Additional context
I've fixed it temporarily by exporting the plugin settings and clearing "alt-3-logo: false" and then re-importing the settings.
Is your feature request related to a problem? Please describe.
I'm trying to add the lower thirds in my streaming using another streaming software (lightstream), on lightstream they have an option to put a website, or anything hosted online, as a content.
I uploaded the files of lower thirds to a bucket on GCP, and configured the permissions to the browser file and controls, this works at the some point, before I put the streaming "live" the lower thirds work very well, but after that, did not work and not show on the livestream.
Describe the solution you'd like
I think this is a configuration of javascript, I don't know very well where is this configuration, I think is something like "embed".
Describe alternatives you've considered
I really don't know :(
Is your feature request related to a problem? Please describe.
A user might face permission error when writing and/or reading .js
file
Describe the solution you'd like
Use obs_source_send_key_click
function provide via API
Describe alternatives you've considered
Provide two .lua
scripts, if one fails use the other.
Additional context
Key event must be passed to browser source, there is not yet API to send it to dock.
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.