Rounded Artwork

[Haste]

Nice work!

Is it just a binary setting or can you chose a desired value for the opacity?

I ask this because I would probably reduce it below the lighter shadow preset for my use. But I'm sure others might like it a bit stronger. (and it also depends on the skin background, of course)

[Mayibongwe]

Is it just a binary setting or can you chose a desired value for the opacity?
I ask this because I would probably reduce it below the lighter shadow preset for my use. But I'm sure others might like it a bit stronger. (and it also depends on the skin background, of course)

It will be a percentage option - so anything between 0 and 100 will be supported.
I will post here once the update is uploaded - will do that later though once I test things some more.

Also, as a general note to the transparency that is applied on the artwork:
Please note that certain views like the expanded panel here use a .jpg format which unlike .png does not support transparency (hence the enforced black border below):

[aktor]

I see you update Mb to the last version as there are no more borders visible.

[Mayibongwe]

To let y'all know in advance: from Monday, I will start to get busy with life outside the forum again - so my presence here (particularly on plugins) will be limited.
So I've taken the time to make enhancements now beyond the shadow effects we were discussing recently.

The plugin now makes use of an "Image Magick" library - so there is a dependency runtime .dll that will need to accompany the plugin.dll
This extra .dll is included in the usual .zip file from the download link that you will need to extract to MusicBee's plugins folder.

In the code block below are now the default supported operations on a skin:
Below are also screenshots of what can be roughly achieved now - for existing skins, you will have to manually add in the elements of interest.

Another behind-the-scenes amendment is that the image processing will now occur in a separate background thread.
What this means is that this plugin will no longer freeze or lock up MusicBee's GUI whilst the artwork is being processed.

You can now also see the progress on how much artwork is yet to be or has been processed in MB's status bar.
The status bar is located just above the player controls in the below screenshots.

Code

<?xml version="1.0" encoding="utf-8"?>
<root>

<element id="Corners" enabled="true" rd="35" bg="r,g,b"/>   <!-- rounded edges -->
<element id="Shadows" enabled="false" blur="4" opacity="80" fg="0,0,0"/>   <!-- shadow effect -->
<element id="Shear" enabled="false" x="10" y="15"/>   <!-- create parallelogram -->
<element id="Tint" enabled="false" fg="0,0,255" r="60" g="5" b="10"/>   <!-- hue effect -->
<element id="Sharpen" enabled="true"/>   <!-- improve artwork quality -->
<element id="Sepia Tone" enabled="false"/>   <!-- gold-like effect -->
<element id="Grayscale" enabled="false"/>   <!-- black and white effect -->
<element id="ArtistThumbs" enabled="false"/>   <!-- applies the above against artist thumbs -->

</root>

 
 

You could use the c# file watcher to monitor new or updated files in the cache folders

Thanks Steven, the automation will help things a lot. Haven't gotten it to work reliably as yet though.

This I still haven't gotten to, so you will still need to use the Reprocess Artwork hotkey to update any 'new' artwork placed in the cache folders.

[Haste]

What's the correct way to install the plugin?

[karbock]

What's the correct way to install the plugin?

- Download the .ZIP file containing the plugin.
- Within MusicBee, select Preferences -> tab 'Plugin' -> button 'Add Plugin...' -> select the .ZIP file.
The rest will be done for you automatically.

Location of the plugin settings:
* Portable version: (MusicBee application path)\AppData\mb_RoundedArtwork\skins
* Installed version: %APPDATA%\MusicBee\mb_RoundedArtwork\skins

[Haste]

Thanks.

I'll try it that way.

I had unzipped the folder and pointed the rounded artwork dll for install. But that way didn't seem to automatically copy the image magik dll.

[Haste]

Ok I think it's installed correctly this time  


I'm getting this artifact (lighter colors) at the border of the image:




Here are my settings:

Code

<?xml version="1.0" encoding="utf-8"?>
<root>

<element id="Corners" enabled="true" rd="9" bg="192,192,192"/>   <!-- rounded edges -->
<element id="Shadows" enabled="true" blur="4" opacity="255" fg="180,180,180"/>   <!-- shadow effect -->
<element id="Shear" enabled="false" x="10" y="15"/>   <!-- create parallelogram -->
<element id="Tint" enabled="true" fg="255,255,255" r="0" g="0" b="0"/>   <!-- hue effect -->
<element id="Sharpen" enabled="true"/>   <!-- improve artwork quality -->
<element id="Sepia Tone" enabled="false"/>   <!-- gold-like effect -->
<element id="Grayscale" enabled="false"/>   <!-- black and white effect -->
<element id="ArtistThumbs" enabled="false"/>   <!-- applies the above against artist thumbs -->

</root>

The background of the panel is 192,192,192

[Mayibongwe]

I'm getting this artifact (lighter colors) at the border of the image:

I almost called you crazy. It wasn't until I maxed out the zoom where I ended up noticing it.
Are you positive that it is not a border generated by MusicBee?
Go to your cache folder and examine the artwork from there to see if the frame's present.

[Haste]

Dang it! You're right. It's MusicBee's fault:



left= rendered

right=image in cache

I also verified that my skin has no artwork frame:

Code

<element id="UseArtworkBorders">false</element>

[Haste]

Some more investigation:

I think it's some kind of hardcoded filter MusicBee overlays on top of the image to make it pop more. It seems to render where it's not fully transparent.

For example here I replaced the cached image (on the right) and made it so it's resized from 265x265 to 200x200 but still on a 265x265 canvas. And the effect overlayed on the image (left)

But it doesn't take into account potential rounded corners or shadows/glow unfortunately.

[Haste]

With some googling and help from chatgpt I got an Image Magick command that seems to work to round corners without the "fuzzy lines" issue.

Since you are making use of Image Magick now, maybe this can be implemented?

Code

magick Cover.jpg ( +clone -alpha extract -draw "fill black polygon 0,0 0,15 15,0 fill white circle 15,15 15,0" ( +clone -flip ) -compose Multiply -composite ( +clone -flop ) -compose Multiply -composite ) -alpha off -compose CopyOpacity -composite Cover_with_rounded_corners.png

Results:

[Mayibongwe]

With some googling and help from chatgpt I got an Image Magick command that seems to work to round corners without the "fuzzy lines" issue.
Since you are making use of Image Magick now, maybe this can be implemented?

Code

magick Cover.jpg ( +clone -alpha extract -draw "fill black polygon 0,0 0,15 15,0 fill white circle 15,15 15,0" ( +clone -flip ) -compose Multiply -composite ( +clone -flop ) -compose Multiply -composite ) -alpha off -compose CopyOpacity -composite Cover_with_rounded_corners.png

It's something I had looked at when I first started using their library, but had decided to drop the idea due to its complexity.
As short as the command line arguments are, the translation to .NET is painfully difficult for someone starting out.

I have a little understanding of it now though. So for comparison, here's the C# method for the same function above:
I will let you know once I upload an updated plugin version (right now I'm going to integrate the skin settings).

Code

using (MagickImage orig = new MagickImage(imageToByte(origFile)))
{
	IMagickImage clone = orig.Clone();
	clone.Alpha(AlphaOption.Extract);

	clone.Draw(new DrawableFillColor(MagickColors.Black), 
	           new DrawablePolygon(new PointD[] { new PointD(0, 0), new PointD(0, 15), new PointD(15, 0) }),
	           new DrawableFillColor(MagickColors.White),
	           new DrawableCircle(15, 15, 15, 0));

	IMagickImage clone2 = ((MagickImage)clone).Clone();
	clone2.Flip();
	clone.Composite(clone2, CompositeOperator.Multiply);

	IMagickImage clone3 = ((MagickImage)clone).Clone();
	clone3.Flop();
	clone.Composite(clone3, CompositeOperator.Multiply);
	
	clone.Alpha(AlphaOption.Off);
	orig.Composite(clone, CompositeOperator.CopyAlpha);
	orig.Write(origFile);

	clone.Dispose();
	clone2.Dispose();
	clone3.Dispose();
}

[Mayibongwe]

Since you are making use of Image Magick now, maybe this can be implemented?

This has been done in v1.7 up for download.
Oh and it turns out I don't have to make use of a temporary folder anymore, so that's gone too.

And yes, the edges are looking much more sharper than earlier.

[Artesoll]

Is it possible that the function is not applied to the album as shown in figure 1. or that these borders can use the skin color?



Are these edges as shown in the figure part of the Plugin or the skin?




I would appreciate it if you could help, if you can't that's no problem.