Draggable and Scroll TextBox contenet and MovieClip Content

[muxa]

Hello ,

 

I managed to find solution to drag content of TextBox up and down but its not stable . once you hold down the scroll-bar and start dragging its working but if u leave the scroll and try to do it again its not working

 

Can i use GreenScok draggable to do that professionally ? I really feel sad i bought green-sock membership thinking that draggable will work fine but its been few days no success

 

this is the example code i hope someone with experiance can guide me how to drag content inside Movie Clip at the stage using same concept " am using Adobe animate cc Canvas Project is attached .

---

 

tl = this;

createjs.Touch.enable(tl);

linesOfTextF(200);
function linesOfTextF(n){
    for(var i=0;i<n;i++){
        tl.TextBox.text += 'this is line '+i+'\n';
    }
}



paramF(0, 48, 146-20 , 48+146-tl.TextBox.getBounds().height);


function paramF(x1,y1,x2,y2){
    tl.m = (y1-y2)/(x1-x2);
    tl.b = y1-tl.m*x1;
}




//this
tl.sb.thumb.addEventListener('mousedown',startdragF);

function startdragF(e){
    stage.addEventListener('stagemousemove',dragF);
    stage.addEventListener('stagemouseup',stopdragF);
}
function stopdragF(e){
    stage.removeEventListener('stagemousemove',dragF);
}

function dragF(e){
    if(e.stageY>=48 && e.stageY<=48+146-20){
        tl.sb.thumb.y=Math.floor(e.stageY-tl.sb.y);
        tl.TextBox.y = Math.floor(tl.m*tl.sb.thumb.y+tl.;
    }
}
 

 

 

---

 

Thanks

 

test2.zip

[Carl]

Sorry to hear you are unhappy with your Club GreenSock purchase.

As I tried to explain in your other post: https://greensock.com/forums/topic/15822-adobe-animate-cc-draggable-and-sortable-datagrid-with-scrollpane/, 

Draggable was only intended to work on DOM elements not with the HTML5 <canvas> (Animate CC, createJS, etc).

 

Although folks like Blake may find some clever ways to make it work, It really is not the right tool for the job and it isn't reasonable for us to spend a lot of time trying to find a way to make it work in a way that it wasn't intended to. Perhaps as demand for Animate CC tools grows we will consider that sort of tool, but it isn't something that we see as a priority any time soon. We have a lot to do to meet current market demand.

 

In your other post you linked to a demo from zimjs. I haven't used those tools at all but it seems like that tool would be a better fit for what you want to do.

 

Just so you know, Draggable is one of the tools that doesn't require a Shockingly Green purchase. Its available to all via the public downloads or CDN.

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.1/utils/Draggable.min.js"></script>

We truly want everyone to be happy with GreenSock tools. I'm sorry Draggable wasn't the tool you thought it would be. We will gladly offer a refund, just let us know.

[OSUblake]

I saw the message you sent me, but I honestly don't know my way around AnimateCC or Easel.js, so I wouldn't be of much help

 

And like Carl said, Draggable is designed to work only with DOM elements, not canvas. I've come up with ways to get Draggable to work with different canvas libraries, but those are mostly for special cases, like when I need to drag a DOM element into a canvas element. I know my way around Pixi, so I know what methods to call to make it happen, but there is still a conversion process needed as the coordinates a canvas library uses might not be the same as the coordinates Draggable is using.

 

Your best bet is to just the built-in methods Easel provides for you. I'm sure you could probably get zim.js working nicely with it as it also uses Easel.