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: JS3 Universal Text Display + JS3 Thumbs - Defender (Read 4012 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

JS3 Universal Text Display + JS3 Thumbs - Defender

Made some changes for streaming and using blur in my skin. Therefore also changes to the modified version of Thumbs I'm using, which I included.

NOTE: The main part of the script is now part of cui-configs.

1.34   2025-02-13

Moved some more code from config to main script.
Reshuffled declarations of vars (colours and button stuff) in more logical block (eg. extra user config "lite").

Show rating button when button is selected in config and currently streaming but non-streaming item is selected.
When rating button has to be hidden (stream selected and shown) align and display other buttons filling the 'gap'.
Some other rating/stream related optimizations.

Changed default mousewheel on prev/next buttons to a 1 sec instead of 5sec. CTRL-MWHEEL has 5 sec now.

BUNDLING this release with my modified JS3_Thumbs script, which is another raw diamond by Marc2k3.
This modified version has transparency (in case of no art found), bezel, accent, gradient and blur support.
Needed to make some adjustments to this script since I do not want to see folder.jpg and cover_blur.jpg in the grid or shown.
In config you can enter (part of file) patterns to exclude from being read.
Added optional display of YTTM artist images.
Added optional NowPlaying selection button.

-------------------------

1.33   2025-02-09

Reshuffled presets. I only use 3 and 4. Both have saveBlur=2 and work in conjunction.

Splitted the source in configuration/main part and function part in cui_configs.
This saves 85KB in a skin per instance of UTD.

-------------------------

1.32   2025-02-05

Only write cover_blur.jpg/STATION_blur.jpg files when cover/station pic in cover/station folder is found and saveBlur=2.
Only write stub_blur.jpg when cover/station pic is found, saveBlur=2 failed (write access denied) and selection mode is Follow NowPlaying.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #1 –
Quote from: Defender on
Made some changes for streaming and using blur in my skin. Therefore also changes to the modified version of Thumbs I'm using, which I included.

NOTE: The main part of the script is now part of cui-configs.

1.34   2025-02-13

Moved some more code from config to main script.
Reshuffled declarations of vars (colours and button stuff) in more logical block (eg. extra user config "lite").

Show rating button when button is selected in config and currently streaming but non-streaming item is selected.
When rating button has to be hidden (stream selected and shown) align and display other buttons filling the 'gap'.
Some other rating/stream related optimizations.

Changed default mousewheel on prev/next buttons to a 1 sec instead of 5sec. CTRL-MWHEEL has 5 sec now.

BUNDLING this release with my modified JS3_Thumbs script, which is another raw diamond by Marc2k3.
This modified version has transparency (in case of no art found), bezel, accent, gradient and blur support.
Needed to make some adjustments to this script since I do not want to see folder.jpg and cover_blur.jpg in the grid or shown.
In config you can enter (part of file) patterns to exclude from being read.
Added optional display of YTTM artist images.
Added optional NowPlaying selection button.

-------------------------

1.33   2025-02-09

Reshuffled presets. I only use 3 and 4. Both have saveBlur=2 and work in conjunction.

Splitted the source in configuration/main part and function part in cui_configs.
This saves 85KB in a skin per instance of UTD.

-------------------------

1.32   2025-02-05

Only write cover_blur.jpg/STATION_blur.jpg files when cover/station pic in cover/station folder is found and saveBlur=2.
Only write stub_blur.jpg when cover/station pic is found, saveBlur=2 failed (write access denied) and selection mode is Follow NowPlaying.
The bit error "dd_rating_x" is undefined when the rating button is clicked
File: C:\Users\sq33\Downloads\foobar2000\profile\cui-configs\Defender\JS3\JS3_UTD.js
Line: 703, Col: 49

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #2 –
Quote from: sq68 on
The bit error "dd_rating_x" is undefined when the rating button is clicked
File: C:\Users\sq33\Downloads\foobar2000\profile\cui-configs\Defender\JS3\JS3_UTD.js
Line: 703, Col: 49
This fixes it among things.

1.35   2025-02-14

Windows scaling: fixed rating bar size.
Windows scaling: fixed volume bar height.
Windows scaling: fixed tooltip size.

Fixed rating and dropdown bugs that were introduced in 1.34.

Preset 4: Changed blur display and overlay, because of UTD not knowing correct station names. Blur is handled in skin for this panel.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #3 –
Quote from: sq68 on
Quote from: Defender on
1.31b   2025-02-01
Can I ask that everything works fine in x64 bit applications, but always crashes when closing B2K in x86 bit? Thank you!
You know you are reacting to an old version?

I assume you are referring to fooBar 32bit crashing upon exit.

I don't have that experience and I've using 2 (even 3) UTD panels and one Thumbs simultaneously for more than a month on fooBar 32bit CUI.
I know people are also using it on 32bit DUI and 64bit DUI without crashing upon exit.

So I don't have a clue why your fooBar crashes upon exit and why that should be related to this (simple) JS3 script. Sending a screenshot or logfile would help.
I have had plenty of (controlled) fooBar exit crashes in my skin (skin, not a simple UTD scrip!) the past time but those were related by old/beta versions of new plugins and solved.

Quote from: Defender on
Quote from: sq68 on
The bit error "dd_rating_x" is undefined when the rating button is clicked
File: C:\Users\sq33\Downloads\foobar2000\profile\cui-configs\Defender\JS3\JS3_UTD.js
Line: 703, Col: 49
This fixes it among things.

1.35   2025-02-14
Fixed rating and dropdown bugs that were introduced in 1.34.

Did this fix the issues for you?

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #4 –
How do I go about stopping the ratings info popup every time I adjust any settings ??

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #5 –
Quote from: MusicHound on
How do I go about stopping the ratings info popup every time I adjust any settings ??
You obviously don't use ratings obviously from within UTD.
Have you disabled the rtaing button and rating bar in the configuration?

Otherwise just select one of the ratings methods I guess. It will be saved whether you use rating or not.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #6 –


Getting this even after disabling rating button and rating bar

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #7 –
Quote from: MusicHound on


Getting this even after disabling rating button and rating bar
You only get access to setting for rating mode when either the rating bar of rating button is enabled.
So best way to proceed is enable the button. Then rightclick on it and select File Tag. After that you can disable the button again.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #8 –
Thank you Defender that worked perfect and thank you for the awesome script

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #9 –
Quote from: MusicHound on
Thank you Defender that worked perfect and thank you for the awesome script
You are welcome.

Thanks for the headsup.

I made a small adjustment in the code.
The popup won't come up anymore when rating bar & rating button are off. The moment one of both is enabled and the rating mode is not set you will get the popup.

In your case now not an issue anymore, since you did set the rating mode (although you are not going to do any ratings of tracks).

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #10 –
Minor change.

1.35a   2025-02-17

Minor change. Don't show the "rating method not set" popup, when rating method is not set and rating bar + rating button are set to off in configuration.
NB. In order to activate the new main script the panel SCRIPT has to be loaded again or freshly applied.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #11 –
New version.

1.36   2025-02-22

Added Love/Unlove buttons.
One Love/Unlove button is optional right of Ratingbar.
One Love/Unlove button is optional in buttonbar between Rating and NowPlaying button.
Foo_playcount_2003 and/or foo_lastfm_playcount_sync needs to be installed otherwise a broken heart will be displayed and a (right)click will give a popup.
When a track is loved also rating will be set to the maximum value.
For integration with Last.fm the second component needs to be installed. Either use the love/unlove button in UTD or use the love/unlove button in your Last.fm webpage.
Buttons work both in NowPlaying and Follow selected track mode.

Radio stations can be loved/unloved too, but cannot be rated (streaming tracks on the active radio station cannot be rated too).

Disabled "rating mode not set" popup altogether.
If rating bar is on but no rating mode is set, display stars with slash.
When you left click on rating bar but no mode is set, show rating dropdown for rating mode selection (same as rightclick).

Custom text has also been modified to optionally display Last.fm component values.

Enjoy

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #12 –
@Majestyk

This is the latest version of the component you were asking about. I changed the documentation a bit and included it in the changes file. If you have any questions/suggestions feel free.

Cheers

UNIVERSAL TEXT DISPLAY (UTD)

REQUIREMENTS/OPTIONALS
======================
Script            : JS3 3.8.5                     by Marc2k3      : https://web.archive.org/web/20241208095928/https://jscript-panel.github.io/docs/
Script            : font Segoe Fluent Icons                     : https://learn.microsoft.com/en-us/windows/apps/design/downloads/#fonts
Optional component   : Last.fm Playcount Sync         by Marc2k3      : https://marc2k3.github.io/
Optional component   : Playcount 2003               by Marc2k3      : https://marc2k3.github.io/

Custom text         : font Twemoji.Mozilla to display flags            : https://github.com/mozilla/twemoji-colr/releases
Custom text         : optional Cover Utils            by Marc2k3      : https://marc2k3.github.io/
Custom text         : optional Last.fm Playcount Sync   by Marc2k3      : https://marc2k3.github.io/
Custom text         : optional Playcount 2003         by Marc2k3      : https://marc2k3.github.io/
Custom text         : optional SACD                  by manisiutkin   : https://sourceforge.net/projects/sacddecoder/files/foo_input_sacd/
Custom text         : optional SACD/UDSD            by manisiutkin   : https://sourceforge.net/projects/sacddecoder/files/macOS%20+Windows/foo_input_udsd/   - Alternative for SACD
Custom text         : optional HDCD                  by Case         : https://foobar.hyv.fi/foo_hdcd.fb2k-component
Custom text         : optional Output Info            by Case         : https://foobar.hyv.fi/?view=foo_outinfo

Special thanks to Marc2k3 for creating JS3 and sample scripts.

======================
FEATURES

Integrated script containing modified versions of:
Album Art
Menu button
Minimal Seekbar
Playback buttons + Playback Order
Rating
Solid Colour Volume
Text Display

The panel in which this script runs will display the following components:
Album Art
Text Display
Rating(bar)
Seekbar
Buttons

All of these components are optional, configurable and support hover where applicable.

Some snippets of functionality:
Album Art   : Supports mousewheel & doubleclick and will cycle through Cover, Back, Disc, Icon, artist. Priority is on embedded art. If no embedded art is available,
external art will be displayed when available. Folders containing logo's (to use for Icon) and artist pictures are configurable. Streams are supported too.
Album art will fallback to custom stub images.

Text Display: Supports mousewheel & doubleclick. Runs a CUSTOM.txt file containing Title Formatting. A large sample CUSTOM.txt file containing optional sections is included.

Ratingbar   : Also supports an optional loved button.

Seekbar      : Seek on mousewheel (+/- 10sec). Leftclick for seek. Rightclick for seek+play/pause/unpause. Has selectable remaining/elapsed time button.

Buttonbar   : A total of 20 optional buttons can be displayed. Some buttons have mousewheel support. Has two different versions of volumebutton/bar.
Read the header and configuration section of the SCRIPT file for details. It's self explainatory.
Special mention for the NowPlaying button which is imo by far the most important/powerful button.

======================
USAGE EXAMPLE

I use two of these panels simultaneously. The larger upper panel has albumart, textdisplay and just 3 buttons. The smaller lower panel only has textdisplay.
I don't use the ratingbar, I use the single character rating button instead.
I don't use the seekbar, I use wavemini bar in a different part of the skin.

I only defined 3 buttons (my audiocontrol buttons are elsewhere and image based).
First button I use is the single character rating button, which also has mousewheel/dropdown support.
Second button is the loved button and finally the NowPlaying button. With that button you set the selection mode to Prefer NowPlaying or Follow selected track.
When set to Follow selected track you can browse quickly (art and textdisplay) through items in your playlist.

Drawback of looking at an item in your playlist that is not currently playing is that you don't have access to any title formatting fileds that have to do with
what you are hearing. Therefore I use a second smaller instance of this script that is always set to NowPlaying selection mode.
This instance only displays a small section of the CUSTOM script.

Both in the SCRIPT and CUSTOM files I defined presets (3 and 4) to quickly set up the two different instances of UTD.

======================
CHANGES

1.38   2025-03-05

No code changes. Bumped the version after including general info about UTD in the accompanying CHANGES file.

-------------------------

1.37   2025-03-02

CUSTOM.TXT
Changed display for Source line in case of MP3.
Added presets that match the ones from SCRIPT.

SCRIPT.TXT
Added separate configuration settings for playcount_2003 loved and lastfm loved. Enabled playcount_2003 loved and disabled lastfm loved by default.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #13 –
Changes:

1.40   2025-03-15

Button added for Popups.         Default enabled when foo_flowin and/or foo_popup_panels is installed.
                           Leftclick & Rightclick both Toggle Show/hide all popup panels.
Button added for Internet Radio.
Button added for One Way Sync.      Default enabled when foo_onewaysync is installed. Rightclick on One Way Sync Button will opens Configure One Way Sync.

Loved button behavior changed. When item is loved, only rate item to max rating value when item is currently not rated.

Changed the button character for RandomizeSelection to a styled dice.

When saveBlur is enabled blur files will be saved as cover_blur_XXX.jpg, where XXX is the luminance in percentage.

-------------------------
1.39   2025-03-11

Display of AlbumArt brightness/border has changed.
1) fooBar Stopped                           : Brightness 100%   Border bright red.
2) fooBar Playing, but playing item not displayed   : Brightness  70%   Border dim    red.
3) current displayed item Paused               : Brightness  70%   Border dim    yellow.
4) current displayed item Playing               : Brightness 100%   Border bright green.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #14 –
Lot of changes. Most of them because of changed stream support and implementation of optional External Tags. Archive also holds replacement for standard Item Properties with added NowPlaying button.

1.42   2025-03-30

Added support for external tags.
When streaming code will check for manually added external tags %station% and %station swap%.
Stream name can be stored in %station% and is available not only in JS3 but everywhere within fooBar whether playing or not.
Tag %station swap% when defined means that when playing %title% and %artist% need to be swapped.
External tags can also contain art for streams which will have priority over external search for art (exception for Disc).

Changed detection of streams because of the addition of external tags support.
Changed colour of Loved button to green instead of red when it actually refers to a stream instead of a playing artist/title.
Removed disabling of Ratingbar when streaming, therefore available by default.

Albumart wheel type   : var albumart_mwheel_type    - 0=OFF   1=ON.   Default ON.
Albumart tooltip   : var albumart_tooltip       - 0=OFF   1=ON.   Default ON.

Albumart art      : In case of stream always display Station Image to albumart Front, Station Icon to albumart Back regardless of selection mode and regardless whether selected item is playing or not.
Albumart art      : Fully support embedded art for streams via external tags. When no embedded art found revert to old method retrieving art from radioPath folder.
Albumart art      : In case of stream and selected art type is Disc show Artist Namelogo when playing and available otherwise Station Namelogo. Don't remap any other art.
Albumart art      : Support %station swap%, when added via external tags, to swap %title% and %artist% for streams that swap those tags while playing.
Albumart art alpha   : Current item playing has alpha 1.0. Current item paused 0.7. Other item playing 0.9. Other item paused 0.6. Stop 0.7.
Albumart art border   : Bright green when current item playing. Dim green when current item paused. Bright yellow when other item playing. Dim yellow when other item paused. Bright red when stopped.
Albumart wheel type   : Optimized art type display font size based on height and width of albumart display.
Albumart wheel type   : Increased art type display timeout to 1.5 sec.
Albumart tooltip   : Show which art type is selected, what is mapped (in case of streams) and show whether embedded/url/file.

To summarize art display for normal items:
Front   - Cover                              (embedded or external).
Back   - Back                              (embedded or external).
Disc   - Disc                              (embedded or external).
Icon   - Artist Bandlogo                     (embedded or external).
Artist   - Artist image                        (embedded or external).
Fallback to stubs when no art found.

To summarize art display for streams:
Front   - Station Image                        (embedded or external).
Back   - Station Bandlogo                     (embedded or external).
Disc   - Artist Namelogo   when playing and found   (embedded or external). Otherwise Artist Namelogo   (external).
Icon   - Artist Bandlogo   when playing         (embedded or external).
Artist   - Artist image      when playing         (embedded or external).
Fallback to stubs when no art found.

Note: Embedded has priority and can be provided by external tags. Only exception is Disc when streaming. Tooltips will always show specific details.

Fixed button refresh to full refresh after metadb changes (because of possible switching between stream/normal item or vice versa).


CUSTOM.TXT:
When streaming show %station%, when added via external tags, as top line. Bright green when current item playing. Dim green when current item paused. Yellow when item not playing.
Colours of audiochain section match colours of border of albumart in main script.
Support %station swap%, when added via external tags, to swap %title% and %artist% for streams that swap those while playing.
Changed display for Source line in case of AAC (similar to MP3 section).

-------------------------
1.41   2025-03-21

Albumart mousewheel   : Show selected art type centered in displayed image for 0.75 sec.

Illegal filename characters from %artist%/%album artist% will be replaced before checking for external art.
Illegal filename characters from stream station name will be replaced before checking/writing blur.
Do not save blur image if any cover_blur_XXX.jpg / STATION_blur_XXX.jpg exists.

Fixed rating button not disappearing when switching display from normal item to stream item.
Fixed incorrect center alignment of ratingbar loved button when streaming.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #15 –
As a sample to accompany UTD 1.42:
1) FPL containing 139 streams.
2) foo_external hotfix version by Case. Install it to use the accompanying external tags.
3) External tags including ART and TruePeak Scanner info. Extract it to your Foobar roaming folder.

Enjoy!

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #16 –
I just finalized a new revision of my skin, which has been changed to benefit from various changes made because of supporting external tags and truepeakscanner for streams.

The skin works in conjunction with UTD, so this means also a lot of changes have been made to UTD.

1.43   2025-04-05

Added Albumart type Logo.
The sequence of art display on mousewheel has changed.

SEQUENCE   NORMAL      STREAM
Front      Cover      Station Image
Back      Back      Station   Icon
Disc      Disc      Station Logo
Artist      Artist      Artist Image
Icon      BandLogo   Artist BandLogo
Logo      NameLogo   Artist NameLogo

Embedded art has priority, except for Logo which can only be external.

var stubStyle 0 sets style of stubimages. 0=Dark 1=Bright. Default Dark. All albumart stub art has been refreshed.

Doubleclicking on art:
1) When a stub is displayed, open explorer in current path when not streaming, otherwise no action.
2) Opens internal foobarviewer when art is embedded, otherwise opens external viewer.

Albumart border          0=OFF   1=ON         Default ON. Follows playing and selection mode.
Albumart fade            0=OFF   1=ON.         Default ON. Follows playing and selection mode.
Albumart wheel art type      0=OFF    1=ON. Dead center on displayed art in large font   2=ON. Centered on bottom of art in rightclick art type font size.   Default 1.

NOTE: Because of the above changes, I finally replaced the original JS2_Cover panel. New preset 5 created, which only displays albumart and replaces
the original JS2/JS3 Albumart scripts.

Fixed blur saving for streams with embedded cover.
Fixed rating button going dark for a split second while switching to a stream with no available metadata yet.
Fixed time button ghost tooltip when seekbar disabled.

Re: JS3 Universal Text Display + JS3 Thumbs - Defender

Reply #17 –
Hereby the updated JS3 components I used in the new released of my skin.

These are the changes:
1.44   2025-04-16

Rightclick on Library Search button now Shows Recently added.

Changed default blur overlay value blur_ovl to 160 from 120 which ensures a bit more contrast. Especially with bright images in combination with a high blur factor.

Added optional dynamic blur (instead of standard blur with overlay) for non-artist logo images. Enable by setting blur_dyn to a value other than 0. Default DISABLED.
Entered value is the maximum alpha you want for very bright images. I use 0.35 as an absolute maximum with the standard colourscheme.
NB. When dynamic blur is activated, blur overlay which is still active for artist logo's can be lowered.

Preset 3 uses dynamic blur 0.35 for non-logo's and has blur 1.0 and blur overlay lowered to 80 from 120 for artist logo's.
Preset 4 has blur disabled fully now and uses scaled margin 4 instead of scaled margin 12, because after a small generic adjustment in the skin panel code now.
   no further adjustments have to be made for different windows scalings (100/125/150/175/200/225/250/300/350).

Small fix in JS3_Thumbs retrieving artistpics from YTTM for artists with dots in the name. This requires updating the Custom folders.

Updated JS3_Properties+Info to use dropshadow on tags and values for better contrast against light backgrounds.
Added JS3_Smooth Playlist Manager which also uses dropshadow now.