Custom FLAT Piano Keyboard 2 Method [ Panel Script By @d.healey & Project File ]

[Natan]

Also By Clicking And Moving The mouse Over The Keys, Notes Gets Stucked :/

[d.healey]

@Natan Looks like you're doing quite well! I'm not getting any stuck notes with your snippet.

[Natan]

@d-healey Ah Thank You Sir :)
Click On The Circles, Not Your midi Keyboard.
The Graphics Make The Notes Getting Stucked

HiseSnippet 1556.3oc4X01aaaCDVJNpqIsouLTLrOxUrUHu35Jkkl1trf7pcWvZZLhSeYnqnfQh1lHxjZRzIwnn.C6S6m09ar+E8i6aaGIkrjbbxbc61.1X.RDu6H4yc73wGlFQbORbLOxvbl86GRLLurUy9LQmM6foLis2xv7JVGR5e.GG46S5xM1neHNNl3aXZV5gRaLmYZCU6sqtAN.y7HYhLLdJm5QdDsKUjIswZeGMHnN1mrOsaNqWbss83rM4A7d.dJY4XDh8ND2l7XrzrorLLuPMepfG0TfEjXCyo2f62uYG9wLs8OkFSOHfH63ZzDlHs357.eIhkRM1rCMvuQpeGaXXZ0HKJTRGEtg0NTe5.4YQiqoTfxFQ93g4TmG7b+qgmynf2TmFdWRghc5IHQJTc4r9tEQTohHpz3gnSiBiM4LAgIj3Q9YDO.LUnPyUrZ5EQCEazSH3LCpuTDsMiGQRDcDNnWgzBiwXNtpUK5IME87N7wbI3GZRd6pF4BLSqCLWOYZxzHCOWxZa.7QsvPtY9ni1Vio98KXk3dU6hOjTOB5LXD1tN22oB5tNNkWdtYmaV0wip9jVjnMwAAG.onw1hndDsZHCNVfHGAS119wnUP0XsoLRUuHBrEH2ldDMVXKMN0npsfiC129AOH+LbDNB0.yHAtvbjht1Dwl7tgbFzw9lZ02TOJcmpwDQCHWUrGum.VV6V8XdBJmY2tL50R6PPSN2G2gJHvT+Bv2VnBZQvCqftWEzCpfbce4xZC0+tsBfqCXz440q6nZkKXQKdDxlBylyxHJ5aPtK.+c94UKIJok8EsExVs7UAWU.nM1lVtfsxlnCMtpOVfq5CoqnacKsDHD7TYhfcYzJq.K1p.7hkgEYUCamSpW+.W4OkQe8oznaoPOy0pEDPCiI1ufh9xAqxyn9hNvpbGvaPyeWYF.pxn0daWmLMeKg1tCrAeGk7Wle0JFFJ16MYeRBhIevhFKnZiJZjDmFBeuSQj22.RhSmjV9F02uY374c38hIoG0xRnUmdRyZxxqgKqf7vPbTLANBqsp5I.rFFneI.zhYwx7Rs8dATuCI9ExIGbZMNMlCKUEjtbPX.turJk8RNn4QJEKsX47t5PafqfjkLVd1bQggAQWoe+jvBfXfVIPZmCHkQe1JHYIjgSbz3iAXa2Vs1neM8fOiIY3jgyvmSJUcN4mqfZggr3ky1oOsmpFR9INcNUJhHgx5XPgRYFQ5tNhyjg4cY1km80yNSVRhdR1Ap4C7EjNkzrG2q6AjHXu9KPKopXkNfSsOjoJ+5NKZ30sUK0BKQ4Gh0VGjFiEO45x.4LJc7gTK4QMZMICzlofSEj5RzAFB2aVjef03wOvSeeTNC4rsYTwtgD1YQyJiAgwS1dKHH.TILSjA1ERhDTIDL2hbDvYTee9LVaQhOTvCU1lbymg4GoIMLW5s8xnmhyvEszQRiSxy1n+fN+zOr1wxy+CD7q+7ZcT0mxr+6WCp0vOdvk6RlHvkenLAif3AvKj62K.KJRVTxPNQAreTf7gjfAKlJ5mmRy6.CRmwlf63B2qa0fJ75LZ7N0HvqjL3ey3Mgv6bV0Z0h3Ix.6zV0e9jR9dxfxUR4d2DHVoJqp.xmn5idF9HB5gDFIRFTcOy2I8aW8WF22IEN1uSZWOAr76GgYwg73BSbSRW59vwl37BeRLPxk7i6I2kyKeSt7dyQn5sqVGbxQNllXQuHU5x5vMVLQgziRumOHZjuWa5+Edu1G9Sau+EGJMdvcDQPyFm5c+WCRi6FFPpwNhD.UiUX7igxusv8BDoRKlWuCmwC6vYTu7a56QDQz1sIQ4w9Hcn0EBndZljar1dj.BNeB7mu1ifDObDDmHSXrvc7iEm290mZogKRdXD8eih5k9+YQc8iiauCFRTAhBV.WslPsTOBfDFPePRDxbJY8PceGYecwTlupye.sDktx9lIJcSU9OxZzE6EwekmlhmLW9hJIfeyT+GylwZGYeja5+6DKKmpNFcgJhuxySFtuMDeF8XVXBFyWMAiYwIXL2cBFyRSvXt2DLl6etiQdYz58D7t5ihffF0TbgMMqwvPlrJq23OozUCSM

[d.healey]

Notes only get stuck when you click and drag the mouse off the note. If you just click there is no stuck note. So you need to keep track of the last pressed key and turn that off whenever the mouse up event triggers.

[Natan]

@d-healey That's Too Complex For Me :/

[d.healey]

@Natan How are you turning off the note currently?

[Natan]

@d-healey
Sir
Let Me Finish With The Keys, Then Go For The Stucking Script :folded_hands:

I Managed To Make 36 Keys, Thanks To Your Loop Script, Everything Works Just Fine, But How To Go A 2 Octave Down, Like Start From C0 To C5?

Panel1.setPaintRoutine(function(g) {

    var white = [
                0, 2, 4, 5, 7, 9,11,
                12,14,16,17,19,21,23,
                24,26,28,29,31,33,35,
    ];
    
    g.fillAll(0xFF000000);
    
    for (i = 0; i < 36; i++) {
        
        if (white.contains(i)) {
            this.data.down && this.getValue() == i ? g.setColour(0xFFAAAAAA) : g.setColour(0xFFFFFFFF);
        }
        else {
            this.data.down && this.getValue() == i ? g.setColour(0xFF222222) : g.setColour(0xFF000000);
        }
        
        g.fillRect([i * this.getWidth() / 36, 0, this.getWidth() / 36, this.getHeight()]);
    }    
});

HiseSnippet 1493.3oc4X0saaaCEVJIpqIcoccnXXWxUrUH2n5YYm51rrf5DGmtf0zXDm1NfthBFIJahHSpIQmTihBLrq1i0tZuC6snuAaGRZYI63j4YzVLrwKbLO+P9c9gmywoYL2ijjviMLW7v9QDCyO1pUelnS8NXJyX2sMLup0wj9Gwww99jtbis5GgSRH9Flly+PoLlKtfgZ81GrENDy7HYjLLdJm5QdDsKUjQsYsumFFtC1mbHsaNoWs1tdbVcdHuGfm4sJYDg8NF2l7XrTr4rLLuTCepfG2RfEjDCyE1h62uUG9oLs7OklPOJjH23ZzBNHM4c3g9RDKoZTuCMzuYpcmXXXZ0LyKLu1KbCq8n9zgzy7FehhAJSi79Cy4tH34lGdkld3YlCdKng20sZ4ESiDYbjX6JV6xDj3.LDBxCKsrFy86WxpNGjfIJ1EeLYmXXyPMrqVpjC5tkJUX8kWZ4kTIAE8IAj353vvif.QhsHtGQyFhSIBD4D3r10OAsApAqMkQJ5ES.SW5hdDMQXKENUnhAPP29NqsV9S3DbLpIlQBcgyHEbsIh57tQbFrw9lZ12TqkdSwDhnIDQDGv6Ifq0NnGySP4L61EPuVJGBVxy9zNTAAN5mqIo+L+Br4xNnUAK2AcOGzZNttNmUJ2xNtq53V0w8dNtq4T10obkIHV4UcJW0o78cJulSEWmJUbpb2Ah8h0yif1Jmwlf+nzq1YmRpUgQjHfGiro.xKsNhh9VTkpveWYEk4kdcYeiFfrUlZQvsJ.OShMsvHxJWhNzjh9XAtnOjRht0szT.28Swg8H1EParAbYO.fWhLDHeGp.3lpUAz2bFN5UJzkq2j8URXB4cFFJqVSBCi59FCCYeS6yOf3IreNEc6g26yn9hNv890fO1QlOLYFoT+NBscGHy9EEVWczuQ9wRuY7zy838RHoubxxOUOFRCLYooPEVHTGgiSHvCRsTEeEbyiikaCXYzDEYnWKuWH06Xh+Hg8gO9RRcvvU4fzutiBw8eLWHe5iVAoXTc0B4cjiEs1.Iq.LvtmLH5Js6mDMBHFxUBj14.RAzWrARVQX7rDM9X.11OHXq9MzJeNGRd.eA17fJOWPx3Fn.LjxtdVdzYsTkJ4O3zyTwHlDIKKA08jYDoQcDmIcy6yrKrzqWZwrjD8grGTAGZxIMJoXOtW2iHwPr9qPUUY0oJbl3PFq726Rnwu2f.0EKQ46h6V6jlhKWVOOlGFJOQogOFaYy+IyYfh1LEbbfmH.VGJHzEbz1rVmea17SA3oaujSPNaWFUreDgcdMeMFzSB91S1cavIH6GOfFHWDIVPkPvbaxIvfN5tyKZsMI4XAORI6fFYFlejPwc4zd2RumAE5PeYKsmz3U4mbp+vM+7OV6T46+gD9seoVGUYnLJGTCp0vOcXuZCyqYA8WPYDLN6XDvvLb+dgXwnS3HGqa.CHdLxnDxwEXITQ+7i88dYrmoEtW2pIU30Yx3ctIfWHB99FuCFhbYqFAAP+lLvtf0N+v6+IFyCkqpgxUrZAyIoJqp.xmo1idF9DB5gDFIV5TcO2g6+iq8qS6v8QS8v866Ifq+vXLKIhmLxA2hzkdH7rIIOwmj.irR9oCjQ47zqyk8Mm.q29fc.ibh5zBK5EqRW1D5XwDijdL+TGS9G7iLV3e0+HiObEGle5f6eyuCZwTL1h1MJjzfcBIDpFqv3mBkeCv8BEoTGMudONiG0gynd4C5GPDwz1sIw4w9DMnMEBndZFkaT6.RHAmOA9Kq8HHwCGC9IxL5KbmdewEEu9bKMbQxGin+aTTe9+eVTW+acauGFRTgAErfY0ZA0R8H.RXv3CxAgLmSVOTuujbutXJyWs4Og0.ltx8lCX5lx7CxczE6EyeomdDOYt7kUT.6lo927rn0dx8HWC0XefdVkJVxnKTQ7kddR28c.+yj0o7LnSkYPmUmAct6LnS0YPm6MC5b+KTGYynM6I3c0OEABManlE1zrACCYxprdi+BL+pgML

[d.healey]

Your white keys array doesn't need to contain every single white key. It just needs to contain one octave. Actually I'd do it with black keys instead of white keys because I already have the function on github.

inline function isBlackKey(n)
{
    return [1, 3, 6, 8, 10].indexOf(parseInt(n) % 12) != -1;
}

Then you can just increase your loop from 36 to whatever upper value you like.

[Natan]

@d-healey said in Custom FLAT Piano Keyboard 2 Method [ Panel Script By @d.healey & Project File ]:

inline function isBlackKey(n)
{
return [1, 3, 6, 8, 10].indexOf(parseInt(n) % 12) != -1;
}

Thank You Sir, Now I'm Confused Again :/
So Where is Supposed To Add this Up?

[d.healey]

@Natan

Call the function, pass a note number, and it will tell you if it's a black key or not.

isBlackKey(60); // false
isBlackKey(61); //  true

[Natan]

@d-healey no Idea, This Is Pretty Easy For You Sir, But I've Go No Clue On What Notes And Functions Can Do

[d.healey]

@Natan

Instead of if (white.contains(i)) which only works if you put every singe white note in the array, you can use if (isBlackKey(i)) The only difference is this will trigger true on black keys not white keys.

[Natan]

@d-healey Sir Could you please help to finish The Full range keyboard.
What i reported On Other forum, Forces Us To Use A Painted version :/

[d.healey]

@Natan said in Custom FLAT Piano Keyboard 2 Method [ Panel Script By @d.healey & Project File ]:

Forces Us To Use A Painted version

Isn't the problem only when a user clicks on the keyboard? Or is when they use a MIDI keyboard too?

[Natan]

@d-healey
Play with your Computer keyboard Instead of A Midi Controller, You Will Get Shocked.
Computer players Something, While the Ui Send Another Notes,
If You Don't Use any Hise Midi Keyboard On Your GUI, It Solves,
And I believe the Issue is Because of Hise Midi Keyboard, So Having A Painting One Will Help To Get Rid of the issue.

Check The Video:
https://youtu.be/ir3cx4OqSjg

[Natan]

You may Ask why using Computer Keyboard, Well not All Kids Out there have access to Midi Controllers, Also On The Go Producers, Do Not Carry A Midi Keyboard, And They use The Computer Midi Keyboard Instead,

I Didn't Touch My Midi Controller For Around 2 Years, And What Ever I Made, I Used My Computer Keyboard.

[Natan]

Just 127 Notes, and The Hanging Issue From This Needs to be Changed, And We are good to Go:

HiseSnippet 1456.3oc4X8taaTDDeujbklTRKEUg3iKUP04FWicHMkRHpNwwtDQSiUbZKhRU0l61ydUNu6wcqSpUUkP7Idr30f2h9F.ytqOe24bM0XJfDreH814O67amY1YF21QBWZbrHBYs3gCCoHq22tyPtrWidDFGs6NHqKaeLc3QBRjmGsu.s8vPRbL0CYYM+8UxXs3BH8502aaR.g6RSIgPOVvboOf0mISo1t92xBBZQ7nGx5mQ50puqqf2PDHF.3Yd6pnPh6wjtzGRThMmMx5BM8XRQTGIQRiQVKrsvaXmdhS4F4eLKlcT.UsoFpCbPFxsDAdJDq9F0nGKvqcx8NFgrram5El23Etl8dLO1X5odiOPy.mpQV+g0bmG7pMivyJC7Vv.uqZ2wMhEJS4nv1kr2kKoQ9DHDjEVFYQy88Wvtg.jfKqzmbLsUDrYrFNqWsZY7sqVszFKuzxKoSBp3Q8oQMHAAGAAhXGYz.pgMDmhkX5IvYsqWLdSbSdWFmVwMhBWckK5ArXoiR3Dgp3CAcmac26l8DNgDgaS3zfZvYj.ttTYCQ+PAG13bcC6qazxroRLU1FhHxCDCjfYc7GvckLA2oaI7KUxggk5rOsGSRgi9ovca0x30faXY7cJiuaYbsZOaCifl+1UCvs.LV8EsZUUuJkSBeQD1gAmV0MvL7WiqsJ7uqrh1j3QqzuX9XGs4q.WUIf1XGVobxpVxdr3JdDIohGjlfuwMLT.WviIACnNkvatIXr6AvKV4VTuMz.bK8pD9qNCGyJA5p0qR+jFDSemggU0qhvPd22DXH8KiO+.pqz4oL7MGa2mv7j8.694fOtLFhcEyHg52PYc6AYaOqzF5i9Up+rzqlLkYOwfXZR1bZNiNAMIvjl5.U8fPcHIJlBORLRU4EfkmDK2DvR9DEUn2Hua.y8XpWtv93GDwINXvTkwlWbgAjgOTHUOGwqf0LVesRYcjSDs1DqdUN5dWLH5qt2OJLGHFyUAjtY.RI7mrIV8JcxrDC93.1122e6gMMJ+FNjr.9btyipFbNIiah8IPJ6Fo4Qm8lpUI6AmblZFQzPUoBnVjJiHIpiEbkadetSokd4RKlljXNj8fppPiG0kRI1CGz+HZDDq+L755r5DENSbHkUV6tDdR656qMrBkuKrswIMEFWUiMRDDnNQ0EeB1pFxEyYjhNbMbJCOQ.rNVPnyT9VeWX5Z84ZJ4mQPAeWNSteHcz9zli0Jn4HZTOC3qGs6NfCQ0ubDMPtPZjjofi0NzSfAQLcOWzdGZ7wRQnV1QMZPVumTyc4jdqJOIhAl9h1FuJ5EYmrY33M+zOT+TUsfwD90etdOcIoTJGTGp6HNcbuTj0UrgdM3TBny1lGF1P3MHfHyOAhZrqQLfXStV8p147XlbX1wx9SLVR0BGKoPO+TB2qZ2lIc6ULdmq.7BQv+tw6ng7V1touOz6IErKX256l0I5lMnbYCTtjcGXNFcIVMP9H8d7SHmPw2mxoQJmZs23v2+1U9koc36vod368ckf4OLhviCEw4N3Nz9rCgmMwYI9nXXjR5OdfJJmkdCgpGZArd88ZAWxB0oCQNHRmtrEz8hKykdL+LMkc9WMYjufQtW3egeQv69md+0qTL+zA22xOZYwDL1g0OLf1jeBM.JMqw3GB0h8ICBjITymjumfKB6I3L2rY.GPkQrtcoQYwdgWnsjRn3ZJkqU+.Z.kjMa9Sq+.HKjDA9I5L5KpM89hyKd8w1F3hUuLw+2nB+7++rBu4Gl1cOBjnBSMXCCw0AJr5RAjvgYI.CYaMmp3nYeU0dSkUtmdyuCqQLqo1aMhYsDl+iXi9D2HwycMy9oxkunlBbu45+OYVzdO0dbMjddPPO6pUph5CUDetqqxceKv+TrNqNC57EyfNqMC5b6YPm0mActyLnyWdt5nZFs0.onu4oHPncS8fwVVM4DHSVm0i9CWXWVdB

[Natan]

@d-healey Sir Could You Please Fix The Stocking Notes
I'm Happy With this 48 Buttons :)

HiseSnippet 1544.3oc4XstaaaCEVJIZcwcoccnXX+X+fqnqPtU0Sx141xBZRbr6BVSSPb5EfhhBFIZahHSpIQmTih9m8q8hr2i8Zr2h9FrcHokkriSlWPawvFCfs44B424BO7vreL2mjjviMLm+v9QDCyOypYelnSsNXJyXmsMLul0wj9GwwwAAjtbis5GgSRHAFlly9PoLlyOmgZ7tGrENDy7IYjLLdJm5SdDsKUjQc+M9IZXXCb.4PZ2bRWcic74rZ7PdO.OyZ4ZDg8OF2l7XrTrYrLL+j5ATAOto.KHIFlysEOneyN7SYZ4eJMgdTHQNwynIrPZxM3gARDKoZTqCMLX+T6NwvvzZ+LuvrZuvMs1kFPGROya74JFnLMx6OLm4hfmWd34N8vyLG7lSCuaX0zOlFIx3Hw1Us1gIHwsvPHHOrzxZLyucEqZbPBlnTW7wjFwvjgZXujqqCZQW2hqsPgEJnRBJEPZQhqgCCOBBDI1h3dDMaHNkHPjSf0ZmfDz5n5r1TFojeLALcoK5QzDgsT3TgJ0BB512e0UyuBmfiQ6SwL9OMHGCVpTL1lHpw6FwYvD6aMhT2RuFiPqTBQrODlDGv6I.rX2pGyWP4L61EQuQJNBFxM7zNTAA1nWnIke.tfxNnpfivAsrCZUGOOmyJkWYGupNdK43sri2pNk8bJWYBhUtpS4kbJuhS4Ucp34TohSkEmfXUVxoxJNUccp54TshS0Ecpt7.wd4Z5u0e1V4B2D7htOuQixKK+q3HRzhGirofo4tFhh9AT0Ufuu28T1e51k8KZKjsxWTBBFBv0kXSKNhrxgnCMoT.VfKE.Ixn6bGMEH57TbXOhcQz5qCa1C.3kHiXxSu1tutQiMUihnu+LbzCcLL+VoMPH9wfyCGP7EXV6Ph8Knn6NbSeFMPzA1zuCLNGY7ZBLVMi5ORns6.IhuzwM0UIGuM6mjvDx6MatrZLIa1UMxigOxVr5WuU9Qg2dNGe1k2KgjdbO67i5DbZdQ1wH3ZAHSKBGmPfpHZoJ8Z.Miiu6B.ez7TYlmVd+Pp+wjfQx5FVwHI0eCakCRWRJJD2+wbAwt5Jn6gTLVpZw7V5XAu0QxxVqUHWXebPzUZ2OIZDPLjqDHsyAjhnuYcjrL13IMZ7w.rsWqVa0utV4yYQFOQ3br4AkKufby0QsvPF7ZiGnyaoJUxuvoqohQLIRV1DJVKSLRi5HNS5l2iYWrvaJL+YxUzq0tvsOvEzRaSJ8i608HRLDx+VzRpruwz6LQkyHQdvT.MNXZ0RgFIze+CHseb5Qj7dpXdXnb8ktnwXK6sYxbFnnMSANG3vDf7gBBWxOZWDVmeWD4axwWesYNA4rcXTwdQD140agwf6Zge8jc1F7Ex1MFPCjKhDKnRHXtM4DnONcyGyasMI4XAORI6fKnMLuhPwcgzVSvLRnAEZ.45Vi3PMdcVGe2di9Cm763MNUVvXHgneYiNpZYfKv7qABPgI9oC6FQtvvcgnLBFmsQIncMdPuPrXzd3jMtNfADRFoYIYCQrDpne9Fa+fzX2zB2a.9OgemIi2Yl.dgf3GZ7NnM4Erp2pEbqUFXmypwy+v2SbdnbMMTtpUSnoOUMXEP9R0bzyvmPPOjvHwRmp2497k+35+5z97kno94K6A2meB4vXLKIhmLxB2jzkdHbxIIOwmj.MkS94CjQ47zqwkWxNAVu6AM.ibh5zDK5EqRW1DtdiIFI8X1oNl7O3YTy8u5mQ8wq3vrSGb+ado27oXrIsaTHoN6DRHTPVgwu.p.2B2KTjRcz75c4LdTGNi5mOne.QDSa2lDmG6Szf1THf5oYTt4FGPBI37Iv2diGAId3XvOQtj9Buo2WbQwquxRCWj7vH5+FE0m8+mE00Obu8tXHQEZRvBZdqITK0m.HgAcSH6ExbFY8P8bW4bcwTVfZxeBiAL8jyMGvzKk4Gk8nK1Ol+JecWdxb4OUQAral5ej07V6Jmi7LTc9A5Y4Vx0nKTQ7U99R288A+yj0o7kPmJWBcpdIzYwKgNKcIzY4KgNqbg5HuLZydBdW8QQfv90UsCaZVmggLYUVuweAbu0rZI

[Natan]

Also, You Can't Make Chords On Painted Version, Only One Note Shows Up On The Graphics