@d-healey

Understood...

Done.

Thank you!

L

@d-healey

Got it working...

For others who many be interested, here is code that will apply local look and feel to 'p' pages of sliders in 'r' rows, and 'c' columns.

var number_rows = 1;
var number_cols = 3;
var slider_id = [];
var slider_name = [];
var slider_count = 0;
var faderLineWidth = 3;
var slider_image_height = 30;
for (p = 0; p < number_of_rhythm_players; p++)
{
    player_counter = 1;
    for (r = 0; r < number_rows; r++)
    {
        for (c = 0; c < number_cols; c++)
        {
            slider_name[slider_count] = "Slider" + (p + 1) + (r + 1) + (c + 1);
            
            slider_id[slider_count] = Content.createLocalLookAndFeel();

            slider_id[slider_count].loadImage("{PROJECT_FOLDER}SliderKnob.png", "SliderKnob");

            slider_id[slider_count].registerFunction("drawLinearSlider", function(g, obj)
            {
                // get the slider area
                var a = obj.area;
                var x1 = a[0];
                var x2 = a[1];
                var y1 = a[2];
                var y2 = a[3] - slider_image_height;
                var midway = y1 * 0.5;

                // set color and draw the slider line
                g.setColour(0xFF777777);
                g.drawLine(x1 + midway, x2 + midway, y1 - y1, y2 + slider_image_height, faderLineWidth);

                // draw the fader image on the line
                g.drawImage("SliderKnob", [x1, 190 - x2 + (y2 * -obj.value), y1, y2], 0, 0);
            });

            slider_name[slider_count] = Content.getComponent(slider_name[slider_count]);
            slider_name[slider_count].setLocalLookAndFeel(slider_id[slider_count]);

            slider_count++;
        }
    }
    player_counter++;
}

@d-healey

Ha!

No, that is my code unfortunately...

Guess I should consider that a compliment? But I'm not sure.

How would you suggest I improve it (other than using REG instead of VAR?

L

I'm making a custom look and feel for all sliders in my project.

Do I have to create a look and feel object for each slider like I'm currently doing or can I use a global one instead?

I've tried to do a global one previously, but it doesn't seem to work.

This is what I've come up with so far.

This works, even though the slider image operates backwards (still working on that problem)

I'm open to suggestions, comments, and ways to improve this code.

var slider_id = [];
var slider_name = [];
var number_rows = 1;
var number_cols = 3;
var slider_count = 0;
var faderLineWidth = 3;
for (var p = 0; p < number_of_rhythm_players; p++)
{
    player_counter = 1;
    for (var r = 0; r < number_rows; r++)
    {
        for (var c = 0; c < number_cols; c++)
        {
            slider_name[slider_count] = "Slider" + (p + 1) + (r + 1) + (c + 1);
            slider_id[slider_count] = Content.createLocalLookAndFeel();

            slider_id[slider_count].loadImage("{PROJECT_FOLDER}SliderKnob.png", "SliderKnob");

            slider_id[slider_count].registerFunction("drawLinearSlider", function(g, obj)
            {
                // get the slider area
                var a = obj.area;
                var x1 = a[0];
                var x2 = a[1];
                var y1 = a[2];
                var y2 = a[3];
                var midway = y1 * 0.5;

                // set color and draw the slider line
                g.setColour(0xFF777777);
                g.drawLine(x1 + midway, x2 + midway, y1 - y1, y2, faderLineWidth);

                // draw the fader image on the line
                // This is showing up at the top of the fader instead of bottom
                // and works backwards... still working on this issue
                g.drawImage("SliderKnob", [x1, (y2 * obj.value) - x2, y1, y2], 0, 0);
            });

            slider_name[slider_count] = Content.getComponent(slider_name[slider_count]);
            slider_name[slider_count].setLocalLookAndFeel(slider_id[slider_count]);

            slider_count++;
        }
    }
    player_counter++;
}

@d-healey

It seems to me that if the host is controlling keyboard input and passing it along to the plugin, it would be up to the DAW to not start/stop playback when a text window is opened in the plugin.

At least, that's what makes sense to me.

Thoughts?

@d-healey

I have the same issue...

But it's not limited to HISE plugins.

It also happens with Surge.

I think it may be a Reaper issue.

L

@d-healey

No, it's a little more complicated than that.

I just became a Patreon supporter highest tier.

Can I send you a message there with more detailed code?

@d-healey

I understand that... and it does.

But when I run your code, and click on the logo button, button 4 activates even if button 1 was activated before the logo button was pushed.

I want whatever button was active before to return to being active when the logo is pressed a 2nd time and the splash screen goes away.

Maybe a better way to explain this is I want to 'push' the state of the buttons onto a stack/array and then 'pop' their state after the splash screen goes away.

@d-healey

No.

I'll explain further...

The splash screen happens when the program loads.

AND

It happens when the logo button is clicked on.

When program first loads, I want button 1 to be active.

But when the logo button is clicked, I want whatever button was active to return to being active.

@d-healey

Thank you for the code... it is much simpler.

However, using this code leaves the last button activated instead of the first.

Any idea how I can have the first button be activated/highlighted and NOT switch to the last one?

//! pnlTab
const pnlTab = Content.getAllComponents("StylesPanel");

//! btnHideAll
const btnHideAll = Content.getComponent("SplashScreenTriggerButton");
btnHideAll.setControlCallback(onbtnHideAllControl);

inline function onbtnHideAllControl(component, value)
{
    setTabVisibility();
}

//! btnTab
const btnTab = Content.getAllComponents("Rhythm_Button");

for (x in btnTab)
{
    x.setControlCallback(onbtnTabControl);
}

inline function onbtnTabControl(component, value)
{
    local index = btnTab.indexOf(component);

    for (i = 0; i < btnTab.length; i++)
        btnTab[i].setValue(index == i);

    setTabVisibility();
}

//! Functions
inline function setTabVisibility()
{
    for (i = 0; i < btnTab.length; i++)
    {
        pnlTab[i].showControl(btnTab[i].getValue() && !btnHideAll.getValue());
    }
    rhythmDisplayid.set("visible", !btnHideAll.getValue());
    spashScreenNameID.set("visible", btnHideAll.getValue());    
}

Thank you David!

You are awesome!

L

I have 4 panels controlled by 4 buttons... they work great. No issues.

However, I want to hide all 4 of the panels when I hit a 5th button which is not part of the 4 original buttons (for a logo screen)

In my custom callback I have the following code:

It hides the panels just fine, but will not restore the panels visibility when the logo goes away.

What am I doing wrong?

                if (value)
                {
                    for (i = 0; i < NUM_TABS; i++)
                    {
                        panels[i] = Content.getComponent("StylesPanel" + (i + 1));
                        buttons[i] = Content.getComponent("Rhythm_Button" + (i + 1));
                        values[i] = panels[i].get("visible");
                        for (l = 0; l < panels.length; l++)
                        {
                            panels[l].set("visible", false);
                        }
                    }
                    panels[NUM_TABS] = Content.getComponent("RhythmDisplayNumber");
                    panels[NUM_TABS].set("visible", false);
                }
                else
                {
                    for (i = 0; i < NUM_TABS; i++)
                    {
                        if (buttons[i].getValue() == 1);
                        {
                            panels[i].set("visible", true);
                        }
                    }
                    panels[NUM_TABS] = Content.getComponent("RhythmDisplayNumber");
                    panels[NUM_TABS].set("visible", true);
                }

@d-healey

This is very exciting news!

@ustk

Understood.

I'll re-compile HISE today.

I appreciate the information.

Thank you!

@d-healey

Found the typo... fixed it...

Thanks for the video.

I've been watching your videos ever since I first found out about HISE (which was only a couple of weeks ago)

Funny thing is, looks like I've already watched that particular video.

I'll watch it more closely this time.

Thanks for all your help and rapid response.

BTW, also I really appreciate the work you've done with the instructional videos...

Great job!

All the very best to you!

L

@d-healey

Not sure I understand exactly what you mean.

Let me repeat it back to you and see if this is correct...

Set all panels off except for 1st one (the one I want to be active)
Put buttons into an array (not quite sure how to do this yet)
Set all buttons 'off' initially, but when a button is pressed, it is set to 'on' in the array.

Is that right?

@d-healey

Code Looks better but I get errors:

Interface:! AssignRhythmButtonsToPanels.js (10): Found 'return' when expecting ')' {SW50ZXJmYWNlfEFzc2lnblJoeXRobUJ1dHRvbnNUb1BhbmVscy5qc3wxODZ8MTB8MTM=}
Interface:! AssignRhythmButtonsToPanels.js (10): Found 'return' when expecting ')' {SW50ZXJmYWNlfEFzc2lnblJoeXRobUJ1dHRvbnNUb1BhbmVscy5qc3wxODZ8MTB8MTM=}

@d-healey

I'm all ears...

Please share how the getActiveRadioButton could be improved. I'm interested.

I'll check the save in preset settings.

I do want the buttons saved in preset, but I need to be able to set the button's states during init.

[edit]

Just tried toggling save in preset - makes no difference

I have the following code.

No matter what order I place the buttons and panels, panel 4 is always visible and the rest are invisible.

The buttons work just fine manually. But they don't initialize properly.

I want panel 1 to be visible and the rest to not be when the program loads... not after a button is pressed.

How can this be done?

const var Rhythm_Button4 = Content.getComponent("Rhythm_Button4");
const var Rhythm_Button3 = Content.getComponent("Rhythm_Button3");
const var Rhythm_Button2 = Content.getComponent("Rhythm_Button2");
const var Rhythm_Button1 = Content.getComponent("Rhythm_Button1");

const var StylesPanel4 = Content.getComponent("StylesPanel4");
const var StylesPanel3 = Content.getComponent("StylesPanel3");
const var StylesPanel2 = Content.getComponent("StylesPanel2");
const var StylesPanel1 = Content.getComponent("StylesPanel1");

const var RhythmDisplayNumber = Content.getComponent("RhythmDisplayNumber");

function getActiveRadioButton() {
    if (Rhythm_Button4.getValue()) {
        return "4";
    }
    else if (Rhythm_Button3.getValue()) {
        return "3";
    }
    else if (Rhythm_Button2.getValue()) {
        return "2";
    }
    else if (Rhythm_Button1.getValue()) {
        return "1";
    }
    else {
        return "1";
    }
}

inline function onRhythm_Button4Control(component, value)
{
    RhythmDisplayNumber.set("text", getActiveRadioButton());
    StylesPanel1.set("visible", 0);
    StylesPanel2.set("visible", 0);
    StylesPanel3.set("visible", 0);
    StylesPanel4.set("visible", 1);

};
Content.getComponent("Rhythm_Button4").setControlCallback(onRhythm_Button4Control);

inline function onRhythm_Button3Control(component, value)
{
    RhythmDisplayNumber.set("text", getActiveRadioButton());
    StylesPanel1.set("visible", 0);
    StylesPanel2.set("visible", 0);
    StylesPanel3.set("visible", 1);
    StylesPanel4.set("visible", 0);

};
Content.getComponent("Rhythm_Button3").setControlCallback(onRhythm_Button3Control);

inline function onRhythm_Button2Control(component, value)
{
    RhythmDisplayNumber.set("text", getActiveRadioButton());
    StylesPanel1.set("visible", 0);
    StylesPanel2.set("visible", 1);
    StylesPanel3.set("visible", 0);
    StylesPanel4.set("visible", 0);

};
Content.getComponent("Rhythm_Button2").setControlCallback(onRhythm_Button2Control);

inline function onRhythm_Button1Control(component, value)
{
	RhythmDisplayNumber.set("text", getActiveRadioButton());
    StylesPanel1.set("visible", 1);
    StylesPanel2.set("visible", 0);
    StylesPanel3.set("visible", 0);
    StylesPanel4.set("visible", 0);
};
Content.getComponent("Rhythm_Button1").setControlCallback(onRhythm_Button1Control);

@ustk

Thank you.

Where can I set "CONFIRM_PRESET_OVERWRITE" and "READ_ONLY_FACTORY_PRESETS"?

I don't see that in preferences.

Also, the reason for 3&4 is time and muscle memory. (for me, not product)