I am definitely doing something stupid with this panel but can't figure out what

Dan Korneff

Maybe this?:

HiseSnippet 962.3ocsV0saaaCElJIpqQadaEnO.p8J6gBC6DG2DDLr1XmrZr4Ti4zfcWAizQQDghTfjJYFE418HrGm8DrGlg8BrcnjbjcrW9wCSWHny47c34SGR9QNRIC.sVpHNdmLIEHNeg63IBSbuXJSPFzm37ktCoZCn7KbcvjTpVCgDGm0+dqCmM2fj+7me2ATNUD.UtHjSkr.3GYILSk2Qu4GXb9QzP3DVxLn67lAARQOIWlg7Yc2VjTZvEzygioVXq4RdGUGSb9F2c1Z6fNguNbqs1YutAztvdQznn1aG1oS2c2q816Q6raWn0NDmmbXHyHUiMTCnwA8.Y3jwwxqDEE3TllcFGrFsIiwJW3lzKlwCGMs4nIDmMFU0pVunU8b2grP1M9qZYecd.+pLlso4r1cQo1OBJ4LCk1nfROycbfhkZphX4ym6NPfyfQTbtYVpTfkr1ertaOIhPXZlPu.NRgF2jQ8tsZ8Je7Ui887v4Gsw+RpxejfeBnMGjYLRg+25Oc.NGL8jIoRAZT+kyg5kM1ulWMu470TClgxLMzix4mgS20ixDAFlTTGtDGhF079TMOe7gE4W3pYhEeerg0nHRI.6iIloaFRMzlgXbjVFUFreUbjkZIGZlpXV5YGjbVMMtBLYJQoiqWZg+P5CnrQTtd15lC.+UOkxyf5sa7uSodbVvEOBNEKuDTKxHKfWTQqYQcKjyy+bfK12VBQemE4bD856myu3dI8+ANe6l9RH8fPN7v3b9auaJjBRo1Qvl601WSWl5KEGKMv6E0a38IuM8vDucnnnkFytiQI4bPszvVsQ0ckXcQVxYf5U31QbQ0M.Qsf4EXdxCSfInXC7L.khABl48oPo8QRdnU3v98hxQjRE.7qOLnONuXUnJ8g3RAkgYoiSe3R7LgB8pMc6C5KLxzbrkxFDmOyjGs1T0Lp.3DFV5uxcN0CxuPbbc9KrjSre7q3GWwBMwVieGMhA14wFq0ugVnBi7po5LZ6f8VN2uxAYQ8TTIWFlwol4k2sG7UF.mRlSS0paJzLyjYOX7Qn425N07enT7YtiXlf3kyw0VBGwIq+O3X4Ik0bOLJBBLUDbC2i94U8Xw6o7+jLyvDmOjZTL65iiyRFi2nH.vpKvERZ65g0rKXKraYsscfwfHL23uwmxfss1NkAaOMHIgFnjeLnXin8r3ml6A4jH+tJahWZBs8aSx2bNaeNAuZvGCBlenVHwsV0D2dUSrypl3NqZhcW0De8pl3t2eh1at81LiLoXaCgLbzg4pYNNGJn3Jv7Uqj+ADO7LzG

rglides

@rzrsharpeprod A few ways to do it, I like to do it like this so you can define a specific area, which will be useful if you have multiple buttons in a panel, or just have the entire panel area react

HiseSnippet 1074.3ocsVs0aaaCElxIZs1aEaEXuz2T8CAxXAF181Fl6kj33rZr5DiZ2f3MLXPKQaSDJRAJpjZTj+y6ev1gRxVTNNcCFs7AAyyM94y46vC6KEdjnHgDYUd3hPBx56rGrfql2dNlxQcOFY8HaLd7aO67Nue7QeX3vyNcbmKNrW+20AczhPbTDwGYYsyuoM2p7tnj0e+livLL2ijKBgNWP8HuiFPU4R6evuSYrSv9jgz.Cqe1Ac8D71BlHFf1N1MPgXuKwyHmh0lUxFY8Mc7oJgbfBqHQHqcOR3uXvbw07T6OmFQmvH5MMQCf.kJ9DAyWiXsTT64Tle+kofHDDk94IjcRSH+ncOpOck77DyOjnvI2Cy7gUohvamBvqoI7ZX.uM.IKCHsaJjdn8.OIMTkqQimu0tKWQjSwPZ2DJo1hJ011ts.rfqpGfujbhD1rxC2m1nw9NvmZspTAR8QJmqvRmrJ9ft+QGmW47hFststK.EOYSJFkovPSeLmvZBxWBjYDUaQPnfCabqlptpFBZqmDqTB9aEWQjDevooXVDokgpghYyXlppjFg5QDUenLoduHVQ4D2owbOEUvcmUqxmp3.q7fnIYRvUsT5TG2BgtVh3TWzKCWfSsH.eiSJeMpNiNatZBKl37qqj4s.yakDmaR9R..+EK3yjjElAO4yLcZH0BWiPWqUtI4YgCkDLbn+4xh59qph6aRBJr4uZYdXSgF4NLFMLh3lGS3ztoVgBSOQbDoMlwl.cz4UFxU.Evr5DnsSStRzT+isJpYzJMKV6Oz03nbNSgrXVUdcdka1Q85Wkyo2auk.3kFR+oBMD6s2pRm4JCd4QazpnMxHZiJFMyxhlFZ7u3wq82XcRYVtURB0bd2rHoWPaVjfQpGJ0Jpl3e0ZKYJqNqz7nGi5cIbb.X+rG258dOtff67vaqCeUCvsYXeilurjU3H3mJTjy3tZlQ4J.6dcUSmtQc5KXjBFiH2nZ8zF4myQWdbvDhbefQAsZqLDtBt38512885lic7RuuyvPAuKmpNKjvuqgQnrKIge8gtGiUX8vfLYfcgDohpgf0wjqfIqoiFJaeLI5RkHLw1raVQV2Skn8AKGbnS8HJLd391okAzGyG9N5fElatl5qlaJXNQeEjoDnaVb8xdZ.Reu8gLlSt.zsmgASOE9wLrp3HU86HxT.0iBywzyp3QT0By2Y7EaN6+WH9P69Tk27MiwRa.iPU6qAFydcxCr6LcJwSkCvcsO4huNOEAkNNcVOrRRA9h8owACfoKdD3z4.KR2OXURybS22PuWmAFP39Ia9GXkoroduUlxlKUhBvdRwXuztP86etehD.S7jm9U1tmduSSTRmoYdN.dN1XOuhg5VN9js0wmtsN9rs0wmusN9hs0wedac7W9ucT+Z4CiUhfz1FDpW+NIWqYY0giAFXBaE8uv0NnXz

rzrsharpeprod

@Dan-Korneff That's interesting as presumably it worked at your end? I tried it on Hise 4.1.0 and the paint routine didn't trigger. Not sure why?

rzrsharpeprod

@rglides That changes when I hover over it and also changes colour when I click it so I should be able to look at your code and transpose it to mine, thankyou

rzrsharpeprod

@rzrsharpeprod can I just say, this forum is great as people are very forthcoming with suggestions and help. It is much appreciated and quite rare in a forum I find so thanks everyone

rglides

@rzrsharpeprod yes exactly, you can pick it apart and figure it out

d.healey

Not sure if you solved it but you have some weird bracket issues going on in your commented out bit.

Keep else if on the same line

PnlTestButton.setPaintRoutine(function(g)
{
    var a = obj.area;
    g.drawRoundedRectangle([0, 0, this.getWidth(), this.getHeight()], 3.0, 2);
    { // What is this curly brace for?
        if (this.data.hover == 1)
        {
            g.setColour(0x50E5EEFF);
        }
	    else if (this.data.mouseUp == 1)
	    {
		    g.setColour(0x50FFFFFF);
	    }
    	else // Missing an opening curly brace, be consistent so all clauses either use braces or don't
	        g.setColour(0x00);
	    }
		} // What's this one for?
		); // What's this for?	
});

rzrsharpeprod

@d-healey I didn't realise that not having the else if on the same line would make a difference?

Not sure what is going on with the brackets - I'd copy and pasted stuff in and out so many times I lost the plot in the end I think.

Regardless I have looked at your code and tidied mine up a bit. It is now firing off to the console as it should off the mouse events with the other code uncommented so thankyou for the assist there.

I have added further console prints to the paint routine and for some reason it looks like the

this.data.mouseUp

is never being called.

this.data.hover

gets called ok and returns "I am hovering" when the mouse event prints "hover" but I never see "I am being clicked" when it prints "click" from tee mouse event.

Here is my 'cleaned up' code.

const var PnlTestButton = Content.getComponent("PnlTestButton");
const var BUTTON_H = 31;
const var BUTTON_W = 114;
const var BUTTON_X = 0;
const var BUTTON_Y = 0;

PnlTestButton.setPaintRoutine(function(g)
{
	var buttonArea = [BUTTON_X, BUTTON_Y, BUTTON_W, BUTTON_H];
	g.drawRoundedRectangle(buttonArea, 4,3);
	g.setColour(0xFFFE007A);
	
		if (this.data.hover==1)
		{
			g.setColour(0x50E5EEFF);
			Console.print("I am hovering");
		}
		else if (this.data.mouseUp == 1)
		{
			g.setColour(0x50FFFFFF);
			Console.print("I am being clicked");
		}
		else
		{
		g.setColour(0x30E5EEFF);
		}
	
}); 

PnlTestButton.setMouseCallback(function(event)
{
	if (event.mouseUp ==1)
	{
		this.data.mouseUp = event.mouseUp;
		Console.print("Click");
		this.repaint();
		
	}
	if (event.hover ==1)
	{
		this.data.hover = event.hover; 
		this.repaint();
		Console.print("Hover");
		
	}
	else
	{
		Console.print("Idle");
	}
});

d.healey

@rzrsharpeprod said in I am definitely doing something stupid with this panel but can't figure out what:

I didn't realise that not having the else if on the same line would make a difference?

Logically it doesn't, it just makes it harder to read.

@rzrsharpeprod said in I am definitely doing something stupid with this panel but can't figure out what:

"I am hovering" when the mouse event prints "hover" but I never see "I am being clicked" when it prints "click" from tee mouse event.

You are using else if so that means it will only trigger the this.data.mouseUp part if this.data.hovering is false. You probably need to use two separate ifs instead.

rzrsharpeprod

@rzrsharpeprod as soon as I posted it I realised I needed to switch the order of the hover and the click ifs in the paint routine as the click would never get called because it was always triggering hover.
The fact the click is called once and then remains active is an issue for tomorrow but at least that part makes sense now

ustk

@rzrsharpeprod As Dave said. The mouse CB can be tricky sometimes because the order of event you need is often very project dependent. I use it a lot, and I still have to try/fail/succeed until I have no hair anymore and the light can shine through the skull directly, and boom I get it...

what can be really helpful is to keep a Console.print(trace(event)); a the top of the CB to understand better the order of events

rzrsharpeprod

@ustk That's a good shout - I should implement that as part of my logging/troubleshooting as it sounds like good practice. Thankyou

I am definitely doing something stupid with this panel but can't figure out what

22

1.9k

12.3k

107.1k