Almost finished my first FX plugin! Just 1 small animation problem...

SteveRiggs

I'm finally almost there on my first FX plugin!!

One small thing though... I've made an 84 frame LED animation filmstrip to use for the master output level, but the animation seems to be glitching.

I've set it to 84 frames in the script editor, and the dimensions are right, but the animation is still playing the frames out of sequence.

I've put a 10 second video below to show, and my code below that.

I tested my animation just as a slider first as you'll see in the video, and it works fine there. It's just when it's linked to the master output that it's playing up.

Any idea what I'm doing wrong?

https://youtu.be/YMtXYEX9qvs

Content.makeFrontInterface(600, 500);

const var NoiseGenerator1 = Synth.getChildSynth("Noise Generator1");

/** Creates a VU-Meter from a filmstrip for the master volume. */
/** Creates a VU-Meter from a filmstrip for the master volume. */
inline function createFilmStripVuMeter(name, x, y, isLeft)
{
	local widget = Content.addPanel(name, x, y);
    
    Content.setPropertiesFromJSON(name, {
      "width": 127, // this uses the exact dimensions of one filmstrip
      "height": 167,
      "opaque": true // opaque is important in order to increase the drawing performance
    });
    
    // Put the image in your image folder
    widget.loadImage("{PROJECT_FOLDER}LED Output Meter V1_84 Frames_127 x 167 pixels.png", "filmstrip");
    
    widget.data.value = 0.0;
    widget.data.isLeft = isLeft;
    
    // Set the initial image 
    widget.setImage("filmstrip", 0, 0);
    
    widget.setTimerCallback(function()
    {
    	// Get the peak value from the master output
    	var newValue = Engine.getMasterPeakLevel(this.data.isLeft ? 0 : 1);
    	
    	if(newValue > this.data.value)
    		this.data.value = newValue;
    	else
    		// Just decay the current value (0.92 controls the decay time)
    		this.data.value = this.data.value * 0.92;
    	
    	// Calculate the filmstrip index
    	// this must be an integer value
    	// 84 is used instead of 128 because 84 is ~0dB which is
    	// more accurate for this example filmstrip
    	var index = parseInt(this.data.value * 84.0);
    	
    	// If you just want to paint one image, 
    	// you don't need the paint routine, but
    	// just use this method
    	// the yOffset is index * heightOfFilmstrip
    	this.setImage("filmstrip", 0, index * 65);	
    });
    
    widget.startTimer(30);
    return widget;
};

const var VuMeterLeft = createFilmStripVuMeter("VuMeterLeft", 11, 10, false);

Dan Korneff

@SteveRiggs I've seen this happen when the dimensions aren't lining up with what you've defined in hise.
Double check the physical dimensions of your animation.

orange

@SteveRiggs

You can see this project file in the attachment below. In this example there is an image strip with 128 frames and the 0dB point is set to 84.
If your image strip has 84 frames, then you need to set the 0dB point below the 84 that represents your zero value. Also be careful about the image sizes in the code. You need to enter the size of the each frames carefully.
If you do the coding right and the problem still persists; You need to scale down your image till the glitch gone. if your image is too big, this glitch can happen.

VU.zip

SteveRiggs

@dustbro @orange

That's what I thought. The dimensions are definitely right though.

I've made a couple more animations now at 128 frames and set the 0db point at 84 but still no joy.

(I assume this is where you set the 84?)

// Calculate the filmstrip index
    	// this must be an integer value
    	// 84 is used instead of 128 because 84 is ~0dB which is
    	// more accurate for this example filmstrip
    	var index = parseInt(this.data.value * 84.0);

I also tried scaling it up and down to every size I can but the same problem occurs.

When you say about scaling, do you have to change the dimensions in the code for it to work, or resize using the box on the interface? I have tried both but just wondered.

Lindon

@SteveRiggs it might not be your dimensions, it looks a lot like its the numStrips is wrong, are you sure you have that correct?

orange

@SteveRiggs just send your image stip file, I can try when I am available. Don't forget to write how many frame you used.

SteveRiggs

@orange

Thanks mate. I made a new version of the animation with 128 frames now as the 84 frames one wouldn't be accurate at 0db. I still can't get it either to work though.

I've uploaded the filmstrip here: LED Output Meter V1_128 Frames_127 x 167 pixels.png.zip

@Lindon That's what I thought as well but I've checked and triple checked all the dimensions and numStrip amounts and they all should be right, unless I'm missing something in the code.

SteveRiggs

@orange

I'll put the updated code in here as well in case you need to see

Content.makeFrontInterface(600, 500);

const var NoiseGenerator1 = Synth.getChildSynth("Noise Generator1");

/** Creates a VU-Meter from a filmstrip for the master volume. */
/** Creates a VU-Meter from a filmstrip for the master volume. */
inline function createFilmStripVuMeter(name, x, y, isLeft)
{
	local widget = Content.addPanel(name, x, y);
    
    Content.setPropertiesFromJSON(name, {
      "width": 127, // this uses the exact dimensions of one filmstrip
      "height": 167,
      "opaque": true // opaque is important in order to increase the drawing performance
    });
    
    // Put the image in your image folder
    widget.loadImage("{PROJECT_FOLDER}LED Output Meter V1_128 Frames_127 x 167 pixels.png", "filmstrip");
    
    widget.data.value = 0.0;
    widget.data.isLeft = isLeft;
    
    // Set the initial image 
    widget.setImage("filmstrip", 0, 0);
    
    widget.setTimerCallback(function()
    {
    	// Get the peak value from the master output
    	var newValue = Engine.getMasterPeakLevel(this.data.isLeft ? 0 : 1);
    	
    	if(newValue > this.data.value)
    		this.data.value = newValue;
    	else
    		// Just decay the current value (0.92 controls the decay time)
    		this.data.value = this.data.value * 0.92;
    	
    	// Calculate the filmstrip index
    	// this must be an integer value
    	// 84 is used instead of 128 because 84 is ~0dB which is
    	// more accurate for this example filmstrip
    	var index = parseInt(this.data.value * 84.0);
    	
    	// If you just want to paint one image, 
    	// you don't need the paint routine, but
    	// just use this method
    	// the yOffset is index * heightOfFilmstrip
    	this.setImage("filmstrip", 0, index * 65);	
    });
    
    widget.startTimer(30);
    return widget;
};

const var VuMeterLeft = createFilmStripVuMeter("VuMeterLeft", 11, 10, false);

d.healey

Did you try this Console.print(index); ? all I get is 0.

Another thing I noticed . The timer is running constantly, wouldn't it be better to only run it while the value > 0?

d.healey

Because of this thread I assume something must have changed in HISE.

Anyway it seems that

    	var index = parseInt(this.data.value * 84.0);

    	// If you just want to paint one image, 
    	// you don't need the paint routine, but
    	// just use this method
    	// the yOffset is index * heightOfFilmstrip
    	this.setImage("filmstrip", 0, index * 64);

Is where the problem lies. Firstly var index = parseInt(this.data.value * 84.0); always returns 0, I think that if you increase 84 to 19000 it might be better.

And this this.setImage("filmstrip", 0, index * 64); You need to change 64 to be the height of your filmstrip frame 167

orange

@SteveRiggs
The project is in the attachment below, both right and left channel meters are working now ;)

alt text

VU.zip

SteveRiggs

@orange @d-healey Boom! Thanks guys. Very much appreciated!

@orange Out of interest (so I know for next time), was it just the line David mentioned below that was the problem? Or did I mess up anything else?

And this this.setImage("filmstrip", 0, index * 64); You need to change 64 to be the height of your filmstrip frame 167

orange

@SteveRiggs Yeah index value must be height of the each frames ;)

SteveRiggs

@orange Excellent. Thanks man

Natan

@orange said in Almost finished my first FX plugin! Just 1 small animation problem...:

Thank You @orange For The Project. But Somehow The Example Won't Work After I Compiled The Plugin, Any Idea?
NOTE: ENABLE_ALL_PEAK_METERS=1 Enabled
Meter Works In Hise, But Does Nothing In Compiled Fx Plugin :(

orange

@Natanr said in Almost finished my first FX plugin! Just 1 small animation problem...:

@orange said in Almost finished my first FX plugin! Just 1 small animation problem...:

Thank You @orange For The Project. But Somehow The Example Won't Work After I Compiled The Plugin, Any Idea?
NOTE: ENABLE_ALL_PEAK_METERS=1 Enabled
Meter Works In Hise, But Does Nothing In Compiled Fx Plugin :(

Have you enabled "Embed Image Files" & "Embed Audio Files" in the preferences section?

Natan

@orange If You Mean This CheckBox, It Is Already Ticked :/
Screen Shot 2019-11-04 at 12.51.11 PM.png

orange

@Natanr What about "Embed Image Files" ? Did you enabled it too?

Also are you sure that your image strip is in your project's image folder?

Natan

@orange Mate, There Is No Such An Option In My Preferences :(

d.healey

@Natanr Should be right under embed audio files, I see it is not there in your screen shot. What version of HISE are you using?

Almost finished my first FX plugin! Just 1 small animation problem...

30

1.8k

10.2k

89.2k