Skip to main content

Notice

Please note that most of the software linked on this forum is likely to be safe to use. If you are unsure, feel free to ask in the relevant topics, or send a private message to an administrator or moderator. To help curb the problems of false positives, or in the event that you do find actual malware, you can contribute through the article linked here.
Topic: foo_uie_webview (Read 18563 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Re: foo_uie_webview

Reply #100
I.e. because the application is attached to the browser it will not work add in window "Text Visualizer" streaks/strips with: slider playback and slider volume? And what about transparency?

Re: foo_uie_webview

Reply #101
But that's pgyt's fault for gluing a browser into the component. It's sad to see everything turning into Electron app or a browser-powered monster.
'Fault' is a rather strong word in this context. What other technology would you have used for text output with colors, fonts and layouts? I merely intended to re-use the power of CSS. What I didn't expect is that people would focus on the JavaScript possibilities.

Re: foo_uie_webview

Reply #102
I.e. because the application is attached to the browser it will not work add in window "Text Visualizer" streaks/strips with: slider playback and slider volume? And what about transparency?
There are 3 technology domains in play: web browsing, scripting, and content rendering with colors, fonts and layout. I re-used the engine of the Chrome and Edge (and possibly other) browsers for the last domain (text rendering) and coupled it with a small interface to fb2k information. You get the other 2 as a package deal.

What you do with those technologies is your choice. I don't have the intention, time and skills (in that order) to create eye candy user interfaces.

But it's a public forum so maybe another user can help you.

Re: foo_uie_webview

Reply #103
What other technology would you have used for text output with colors, fonts

I posted about this before in your other thread...

https://jscript-panel.github.io/gallery/text-display/

Obviously I didn't mention the implementation back then but I use IDWriteTextLayout and DWRITE_TEXT_RANGE for applying colours and fonts to substrings of a string.

To make it ridiculously easy for the end user, I support $rgb title formatting in my component scripts**. This is native to fb2k. I then have my own custom $font function. To implement that, use titleformat_hook from the SDK. It's an extra arg for the usual format_title methods.

** edited for correctness: my component doesn't support $rgb as such. I parse it with javascript.

This screenshot I posted in your other thread is an example of how to use it...



Not as powerful as CSS but somewhat easier for the average user.

No one has to know a single bit of javascript/CSS or know anything about callbacks, All that is managed by me.

Re: foo_uie_webview

Reply #104
What other technology would you have used for text output with colors, fonts

I posted about this before in your other thread...

https://jscript-panel.github.io/gallery/text-display/

Obviously I didn't mention the implementation back then but I use IDWriteTextLayout and DWRITE_TEXT_RANGE for applying colours and fonts to substrings of a string.

Not as powerful as CSS but somewhat easier for the average user.

No one has to know a single bit of javascript/CSS or know anything about callbacks, All that is managed by me.
I should have added: without coding another implementation. In this case I don't suffer from the "Not invented here" syndrome. Great. Now the users have a choice.

Re: foo_uie_webview

Reply #105

But that's pgyt's fault for gluing a browser into the component. It's sad to see everything turning into Electron app or a browser-powered monster.
Case, let me comment.
But fb2k is already powerful out of the box (like a monster) thanks to its plugins.
And this is one of the reasons why I use fb2k every day for a long time and use it with pleasure.
And I can always choose what my fb2k will look like and what it will contain.

Re: foo_uie_webview

Reply #106
Not sure pgyt understands what you are even asking, but I have the impression that people are abusing his text output tool for things it was never meant for. If your baby is abused you are not very keen on helping people abuse it further.

But that's pgyt's fault for gluing a browser into the component. It's sad to see everything turning into Electron app or a browser-powered monster.

A browser is excellent for many things. Check out programs like Obsidian, Visual Studio Code, Slack, Skype, Whatsapp for desktop, etc.

The good thing about having a browser embedded is how powerful it is in terms of design, animations, faders, effects, etc. Everything you see on the www you can have on Foobar for your covers, titles, backgrounds, etc.

What a coincidence that two of the best tools for Foobar2000 use Javascript, in this case JScript Panel 3 and Spider Monkey Panel.

And now, this new plugin (foo_vis_text) that also offers very positive things to the player.

We cannot turn our back on embedding browsers within Foobar.

Re: foo_uie_webview

Reply #107
Yeah this is a great plugin. Love the sample you've uploaded Julero. Currently setting up FIP radio to show what's now playing through their json with the help of ChatGTP  :D

Re: foo_uie_webview

Reply #108
I still haven't figured out how to put different html files into different panels. When I installed the update I saw an extra button appear in the browser menu, but it seems to have stopped appearing. I don't know if it's because of something I touched.
It's a bug caused by a stupid last minute optimization without re-testing. The next version will fix this.

Re: foo_uie_webview

Reply #109
Another pqyt issue, this one is a bit silly, but when I change the Columns UI theme (I have it to do it dynamically when it detects a change in window size) the space where the plugin is stays blank for a couple of seconds and it looks kind of ugly. . How could I modify the color to make it a different color?
I haven't found a way to detect when Layout Edit mode gets turned on or off with CUI. Under DUI turning Layout Edit mode off should trigger a refresh after which EdgeView uses the content of the HTML file.

Re: foo_uie_webview

Reply #110
The Edit button of the Preferences only works if an editor is associated with the shell "Edit" verb. Unfortunately Windows 11 Explorer is so broken that it seems there is no way to change that verb anymore.

Here is a .reg file that fixes that. Beware:

1. Take all the precautions mentioned on Windows support forums when editing the registry.
2. Edit the .reg file before importing it and set the correct full path to your preferred HTML editor.

Re: foo_uie_webview

Reply #111
Work in progress: Javascript gets the sample chunks from the fb2k visualisation stream.

 

Re: foo_uie_webview

Reply #112
Not that I would have the first clue what to with visualisation data but does it have to be a string? Can't you pass raw values? I guess parsing it shouldn't be an issue for anyone wanting to use it, I'm just curious.

Re: foo_uie_webview

Reply #113
Not that I would have the first clue what to with visualisation data but does it have to be a string? Can't you pass raw values? I guess parsing it shouldn't be an issue for anyone wanting to use it, I'm just curious.
It's just a small proof-of-life screenshot: the Left and Right values are the maximum values in a chunk of samples, calculated on the fly in JavaScript. It's the starting point for a peak meter. How to visualize it is up to the JavaScript developer.

Re: foo_uie_webview

Reply #114
Work in progress: Javascript gets the sample chunks from the fb2k visualisation stream.

Marvelous !!!!!!!!!!!!!

So they are two simple decimal variables that are updated.

A lot of crazy things are coming to mind. Like for example doing this, and it wouldn't be difficult to do:



I had one just like it as a child and I still have it in me. It's not difficult to do. A few divs and a few conditionals and it would be done. :))

I have figured out how to put two instances. If you enter the route by hand (without clicking the search route button) it does allow you to click apply and both instances are executed. :))

 
Yeah this is a great plugin. Love the sample you've uploaded Julero. Currently setting up FIP radio to show what's now playing through their json with the help of ChatGTP  :D

Thanks, I have also made one that searches for album covers, thanks to my colleague marc2k3 who gave me the idea.


Code: [Select]
 // Lista de rutas posibles
        let paths = [
            originalPath + "/cover.jpg",
            originalPath + "/cover.png",
            originalPath + "/front.jpg",
            originalPath + "/folder.jpg",
            parts.slice(0, -1).join('/') + "/portada/cover.jpg",
            parts.slice(0, -1).join('/') + "/cover.jpg",
            parts.slice(0, -2).join('/') + "/cover.jpg",
            parts.slice(0, -2).join('/') + "/portada/cover.jpg",
            parts.slice(0, -1).join('/') + "/portada/" + filename + ".jpg"
        ];

This is how I put the possible paths where the cover of each disc can be, sometimes it is inside the folder itself and other times outside. And Javascript searches for them until it finds them. It works very well and now I can show the covers with a fade in effect between them when passing songs or when one ends and another begins.

I've also added more code to the vinyl panel. Now it shows two backgrounds and you can choose the one you like the most, the vinyl one or one with a pentagram.


Re: foo_uie_webview

Reply #115
@Julero
Just wanted to note you can replace the current random disc animation with one showing the actual album art over the vinyl/disc easily in CSS (which is the thing I'm gonna use on my http_control theme).

With something like this applied to the album art (which should be drawn over the vinyl placeholder as you like).
Code: [Select]
.clip {
clip-path: circle(40% at 50% 50%);
mask: radial-gradient(circle 40px, #0000 98%, #fff);
-webkit-clip-path: circle(40% at 50% 50%);
-webkit-mask: radial-gradient(circle 40px, #0000 98%, #fff);
}

You then apply the current animation to both images. My image example is obviously missing the CD/vinyl background image.

Re: foo_uie_webview

Reply #116
@Julero
Just wanted to note you can replace the current random disc animation with one showing the actual album art over the vinyl/disc easily in CSS (which is the thing I'm gonna use on my http_control theme).

With something like this applied to the album art (which should be drawn over the vinyl placeholder as you like).
Code: [Select]
.clip {
clip-path: circle(40% at 50% 50%);
mask: radial-gradient(circle 40px, #0000 98%, #fff);
-webkit-clip-path: circle(40% at 50% 50%);
-webkit-mask: radial-gradient(circle 40px, #0000 98%, #fff);
}

You then apply the current animation to both images. My image example is obviously missing the CD/vinyl background image.

I think it's a great idea, and since I can access all the covers, they will all come out as a round mask/sticker on top of the vinyl. I have also thought about putting a piece of cover to cover the vinyl a bit, as a cover for the album. In the style of what my friend Yeyo did further back with the CD cover and with a shadow on the edge using CSS.

It's amazing how many things you can do. CSS is very crude in design. :D

Re: foo_uie_webview

Reply #117
open"text visualzer",only display "text visualzer" on middle,but nothing at all. and do not createing file in "profile"folder.
How to handle and solve the problem

Re: foo_uie_webview

Reply #118
open"text visualzer",only display "text visualzer" on middle,but nothing at all. and do not createing file in "profile"folder.
How to handle and solve the problem
Did you turn off "Layout Mode"?

Re: foo_uie_webview

Reply #119
I made some changes to adapt @Julero template to my skin.

Text Visualizer

JS3 (Spin Disc)

Re: foo_uie_webview

Reply #120
yes, I have not turn on the "layout mode".  and now one PC normal,other display "text visualzer" (3 pc,system WIN10 and 11)

Re: foo_uie_webview

Reply #121
open"text visualzer",only display "text visualzer" on middle,but nothing at all. and do not createing file in "profile"folder.
How to handle and solve the problem
Did you turn off "Layout Mode"?

yes, I have not turn on the "layout mode".  and now one PC normal,other display "text visualzer" (3 pc,system WIN10 and 11)

Re: foo_uie_webview

Reply #122
yes, I have not turn on the "layout mode".  and now one PC normal,other display "text visualzer" (3 pc,system WIN10 and 11)
Does the log in the console contain any foo_vis_text messages about not being able to initialize WebView?


Re: foo_uie_webview

Reply #124
console display "foo_vis_text failed to find a compatible WebView component."
How to handle and solve the problem. Resetting IE does not work



MOD edit: Removed unnecessary full quoted text. Please use 'REPLY' or 'Quick Reply' when quoting is not needed.