Animate panel open/close from R to L

[gorangrooves]

I am trying to animate a panel to open from R to L instead of the default L to R (and close it).

@d-healey I am trying to repurpose your script while adding the X location, but I am not managing to accomplish that.

Here is the script I came up with that is NOT giving me satisfactory results. In this case, I am just trying to expand/contract the width of the panel to the left while keeping the right side stationary.

Content.makeFrontInterface(600, 500);


// btnOpen
const var btnOpenClose = Content.getComponent("btnOpenClose");

btnOpenClose.setValue(0);

inline function onbtnOpenCloseControl(component, value)
{
    pnlAni.data.open = value;
    pnlAni.startTimer(10);
};

Content.getComponent("btnOpenClose").setControlCallback(onbtnOpenCloseControl);

// pnlAni
const var pnlAni = Content.getComponent("pnlAni");
pnlAni.setPosition(150, 138, 100, 145);
var pnArray = pnlAni.getLocalBounds(0);

var x = pnArray[0];
var y = pnArray[1];

pnlAni.setTimerCallback(function(){
       
    if (this.data.open)
 
	this.setPosition(x - 10, 138, this.getWidth() + 10, 145);
        
    else
        
        this.setPosition(x - 10, 138, this.getWidth() - 10, 145);
    
    if (this.getWidth() > 250 || this.getWidth() < 100)
        this.stopTimer();
});

What am I missing here/ doing wrong, please?

[d.healey]

HiseSnippet 987.3ocsV0saaaCElxIJq1aoXcn2N.gbkyVZfbaW1FLFparS5L5RpvTRatKfVhxlvTjBhTIwon2smm8FLr8pr2f8FrcHkrE8pQVqAluvvme9H+NjmyGcPtHhHkhbjSyylkQPNela3LtZR+IXJGMb.x49tmfkJRtWoqCmkgkRRLxwYiWnc3zbSj4ye8rCwLLOhT6BgdsfFQ9IZJUU6Mn2KoL1w3XxYzTqreZugQBdeAST.7YCWeTFNZJdL4TrNsFtHmsNJlpD4gJrhHgbNTDOKbh3ZdY9ulJoiXDsQGTHrPktQ8mPYwAyqUIB4rYPckuQYk+P2SnwzE9qOA9bS.uZD1mANMtKJ04ifRNVTZyRJ8.2vnbZlpNhlOep6PNbgjfgiZapTlKpwW1vsu.xfq1OEOkbbNXr.Q6C782yC9Z2tsZAG2Rk2IO+hKeyvAm8id+f2S786V49Bvry26uHsqv4dAXNg0ABLeCFST8EoYBNXzdmxv6nWZJmQ4DujBdjhJ3dB9K4hQcz3xEr1QyAsGrtrBxtsdaqlLQDl4wIW+FZrZBrK0L6qJSqqURZ9cg2WakziVfsqWqVMKYy9RBvra1YOCFfZK4+Zc1kwL.g3uCX+pKOSErytZjU0QeLiMBZRaub4AqhUgepPQdEusoDa8tVd+6PIIqLV0ZwH4qLrd1I+t.1lWjNhjae.qSDZtVticqOrN1nxiDqDE7gbp5UYjJ6iErXcmn92ue+Mp5LE904CGfUXcKekOHuLRthpoiy.xUflQ4.PS2AD4TkHCF+WbQ.tUlnaOe7PeghnvVeO2xKWzMKjU9iw8lUqwLnm4FuNZduID53IJaOiFOWDp4VyExnJRZs2C9stmur2Ga6FYw0sK458q3ZHiFSxMj8SbM8LVb0K2hq8tsmTMSeQrkIQTJMNlQBDRp9h1R382A84rP5sFsz29ve8E+4s+xyRs0lQnT7M1R0xhjD5MFQ0DJKUp.tMLEzZQNeg64RhWLIAWvTdxov5.ixSIwmIL4KwWQFxCxIvXfV1A895VfhoHtfgUKKipeunJft.r0tz5SbnvlYSxOBsU+6Ta8CkhOvMfphlrZN1XEbD5g++fiUuHss6QIIjHUMA2z83KV2me9O19eVTnn7wmfgVAnwv8zhzPnuNh.6NGlofE20ogt2tz1WaqOABI7XiweCepB1Qa6TEry7fPSXTt3xnR8I8ad2y3A3D27DeS3+Z.1dcPFMK.mq+995Fe5kQQ5x+QcPnUi4wqAlmrFXd5Zf4aVCLGrFX910.y2cmXz+ymmWnDokiCfifiLh2NNGwwPmkoKD8O.8Jfrg

[gorangrooves]

@d-healey Wow, man. You are too fast! :beaming_face_with_smiling_eyes: I shall give this a try now. Thank you so much!

[gorangrooves]

@d-healey I managed to combine your scripts to achieve the desired results!

Here it is, should someone else need it.

Content.makeFrontInterface(600, 500);


// btnOpen
const var btnOpenClose = Content.getComponent("btnOpenClose");

btnOpenClose.setValue(0);

inline function onbtnOpenCloseControl(component, value)
{
    pnlAni.data.open = value;
    pnlAni.startTimer(10);
};

Content.getComponent("btnOpenClose").setControlCallback(onbtnOpenCloseControl);

// pnlAni
const var pnlAni = Content.getComponent("pnlAni");
const pnlX = 180;
const pnlMaxWidth = 100;

pnlAni.setTimerCallback(function(){
       
    if (this.data.open)
        {
	        
        	this.set("width", this.getWidth() + 10);
        	this.set("x", pnlX + pnlMaxWidth - this.getWidth());
        
        }

        
    else
        {
	        
        	this.set("width", this.getWidth() - 10);
        	this.set("x", pnlX + pnlMaxWidth - this.getWidth());
        }

    
    if (this.getWidth() > pnlMaxWidth - 1)
        {
            this.set("width", pnlMaxWidth);
            this.stopTimer();
        }
    
    else if (this.getWidth() < 1)
        {
            this.set("width", 0);
            this.stopTimer();
        }
        
});

And here is the HiseSnippet

HiseSnippet 1052.3ocsV8taaaCDmxIJH1ctXEXO.D4SxnINxcscEH6OtwIovcyoFycY8aEzRzwbQhTPhNIFE4cYOD6AauAsGIkrnbcJRMZn+h4u6Nd+3oi2cCSEAzrLQJxo9ammPQNem6n4b4zdSILNp+QHmG5NfjIooXCzgySHYYzPjiyFuRA3TeSjd8++1gjHBOfVBgPmIXAz+fEyjknC696rnnSHgz2xhsz9oc6GH38DQhY.e1v0GkPBtfbN8ThRsZtHmsNNjIEoijDIMC4r4ghv4ilJthaz+LVFabDUsoCZDbPF3SDQgJFqPQ8lxhBGVbuyPvoLrLJrgIJ7CtCXgrE3kQiuWK.WZgc7vo1Whdcrom+cmdNVzaSC8dj6nfTVhrThhaOvsOG9PMg.eBrokQWTMrqaOAnAW1NlbA8jTXyBK7dtu+t3m4625flMT+1ee7XI+MITdyFvmkLI9RRZATuHQFE+K3hy6bprmHNQvgMd6XqzNlyyFpcFUdFIZF0K2YLdDiSwSlwCjLAGK31pq7QpHxKnvA6BLArtUyFenYCLrR3QujyZGRjj1BvLfXZMNnh3LIIUpx3R85nc7MZmeWtBJFmSidjnnwPZo2JIo49.gNiOsibFjaMlYDqiVFa.f2AZ24E91PCHW+2rP4TkDees2JtdTykaAAKBmdsxCSvx7G1DrmbJKqLh0ZgFXP453JpqV005C9vamqT9emcwZD3Rn4iWK7iwlv5JL4ZPc884wUtC6s7YXad4+tQcKqBSixneCn7deao7BhtTX1xi+5RmVmpQdr05youko1tsTYoHwjfuDqpF3VIw94uNp3+0S.CIto0AVuyOUHouAxPa7gF0abSC7xhlLYkxxesEobzJDmSga2PO9r3wzzhBIEJB0WqV.281Kfa2eIv7h1RQAuOmIUUGtsx5n7x.v+9q9GAuCUU5yw.8RnoRlhBNGQuDZgZp6W28HZ1EPPF5Ftn1AzUTpk9v7tBGNSJEbDKTAYWjBc8hls+6+zcdYm29ckzqkpl+Jc22nbF4RZe9vTJ7gW0FAY4wsMdrYQeHBmFoc31tlxQZWs0+kOEPoq5R5pSgTRCykNkxNeZ47A3wcYRZbwb.0250WM3iJAknOwFF848GgtzhvYQDY0V2p4UxE.oCU5Qp5CxyXx41yybuzO+tR2G4NjICltZ9VaE7ERftu4a9zQMcOdxDZfrjra5dx6t+GEB8mhYRF+7ADYJCRvbOcV7HHcHfBLgCofpmrN0TOtL68U6UQlQTdndyGgUtvNp8N4B6THDESBREuOvTnPM+01ZDfSb8Xn0g4gg83NHcwCvNW+19nXXrv2GDnBE6Abe017j0vlebMr4oqgMOaMr44qgM+zZXyK9h1nlH+kyjhXyyD.X3w5JpNNGyIPVlNiD8ILCOy0H

Thanks to you, @d-healey, I am getting stuff done and learning simultaneously. Thanks a million!

[gorangrooves]

Edit: Added a failsafe rule to reset the panel size if it falls outside of the set perimeters and stops the timer, as on subsequent script recompiles, the panel can keep shifting position until it is outside of the interface and can not show up.