Please Help me Lostinbeta!

Hey Lost :slight_smile:

Long time, just wanted to ask something in regard to the post which we made a line tool (see below) using the draw API

http://www.kirupaforum.com/forums/showthread.php?s=&threadid=16658&perpage=15&pagenumber=4

The line tool works fabulously as I mentioned, but I was wondering how I would go about making it so that the lines created can be individually manipulated again after they are drawn, ie clicked and dragged to another position??

Ive thought about this long and hard, and all I can think of is making it so that each line that is drawn is created inside an emptyclip or attached to an empty clip which itself has a drag method. But Ive got no real idea how to do this properly with your code. Could provide me with any help?

Thanks in advance :tb:

If only I knew :stuck_out_tongue:

I have to go soon so I don’t have time to figure it out now, but if I have time later tonight I will see what I can do.

LOL yeah “if only i knew” too :P, but if you could take a look at it later tonight that would be great :D.

Thanks, any help would be great

couldnt you just use the bezier curve principle on that line?

Hmmmzz, looked at a few of those bezie curve examples in the posts, and I tried to incoroprate it into my code, but Im having heaps of trouble


function createEdge()
{
	tool.text="EDGE";
	nodeMode=false;
	edgeMode=true;
	createEdgeButt.gotoAndPlay("down");
	createNodeButt.gotoAndStop("up");
	
	
	_root.z+=1;
	//The 'holder' clip which will contain the line.
	this._parent.createEmptyMovieClip("lineHolder", _root.z);
	this._parent.lineHolder._focusrect = true;
	_root.z+=1;
	this._parent[lineHolder].createEmptyMovieClip("line", _root.z);
	_root.z+=1;
	this._parent[lineHolder].createEmptyMovieClip("tempLine", _root.z);
	_root.z+=1;
	this._parent[lineHolder].createEmptyMovieClip("point1", _root.z).buildPoint(3);
	_root.z+=1;
	this._parent[lineHolder].createEmptyMovieClip("point2", _root.z).buildPoint(3);
	this._parent[lineHolder].point1._visible = false;
	this._parent[lineHolder].point2._visible = false;//same as point1._visible=false;  point2._visible=false
	

	this._parent._parent.onMouseDown = drawProcess;//25/3
	this._parent._parent.onMouseUp = drawFinalLine;
	this._parent._parent.onEnterFrame = clearMe;
}

function drawProcess() {
	if(edgeMode==true)
	{
		 if(canvas.hitTest(this._parent._xmouse, this._parent._ymouse, true)) {
			 xPos = _xmouse;
			 yPos = _ymouse;
			 this._parent[lineHolder].point1._x = this._parent[lineHolder].point2._x=xPos
			 this._parent[lineHolder].point1._y = this._parent[lineHolder].point2._y=yPos
			 this._parent[lineHolder].point1._visible = this._parent[lineHolder].point2._visible=true;
			 this._parent[lineHolder].line.moveTo(Xpos, Ypos);
			 
		 	 this.onMouseMove = function() {
				 this._parent[lineHolder].tempLine.clear();
				 this._parent[lineHolder].tempLine.lineStyle(2, 0xC9C9FC, 50);
				 this._parent[lineHolder].tempLine.moveTo(_xmouse, _ymouse);
				 if (Key.isDown(Key.SHIFT)) {
					 if (_ymouse<=yPos-100 || _ymouse>=yPos+100) {
						this._parent[lineHolder].point2._x = xPos;
						this._parent[lineHolder].point2._y = _ymouse;
						this._parent[lineHolder].tempLine.lineTo(xPos, _ymouse);
					} else {
						this._parent[lineHolder].point2._x = _xmouse;
						this._parent[lineHolder].point2._y = yPos;
						this._parent[lineHolder].tempLine.lineTo(_xmouse, yPos);
					}
				} else {
					this._parent[lineHolder].point2._x = _xmouse;
					this._parent[lineHolder].point2._y = _ymouse;
					this._parent[lineHolder].tempLine.lineTo(_xmouse, _ymouse);
				}
				
			};
		 }
	}
}

function drawFinalLine() {
	if(edgeMode==true)
	{
		if(canvas.hitTest(this._parent._xmouse, this._parent._ymouse, true)) {
			this._parent[lineHolder].tempLine.clear();
			delete this.onMouseMove;
			this._parent[lineHolder].point1._visible = this._parent[lineHolder].point2._visible=false;
			//this._parent.createEmptyMovieClip("lineHolder" + _root.lineNum, _root.lineNum);
			this._parent[lineHolder].line.lineStyle(.25, 0x2525F3, 100);
			if (Key.isDown(Key.SHIFT)) {
				if (_ymouse<=yPos-100 || _ymouse>=yPos+100) {
					this._parent[lineHolder].line.lineTo(_xmouse, _ymouse);
				} else {
					tthis._parent[lineHolder].line.lineTo(_xmouse, yPos);
				}
			} else {
				this._parent[lineHolder].line.lineTo(_xmouse, _ymouse);
			}
			_root.lineNum = _root.lineNum + 1;
			_root.p1x[_root.lineNum] = this._parent[lineHolder].point1._x;
			_root.p1y[_root.lineNum] = this._parent[lineHolder].point1._y;
			_root.p2x[_root.lineNum] = this._parent[lineHolder].point2._x;
			_root.p2y[_root.lineNum] = this._parent[lineHolder].point2._y;
			
		}
		else
		{
			this._parent[lineHolder].point1._visible = this._parent[lineHolder].point2._visible=false;
		}
	}
	
}

And here’s the function which is called to enable the lines (and nodes) to be moved


function moveStuff()
{
	edgeMode=false;
	nodeMode=true;
	tool.text="MOVE";
	//remove any existing event handlers
	delete this._parent._parent.onMouseDown;
	delete this._parent._parent.onMouseUp;
	delete this._parent._parent.onEnterFrame;
	createEdgeButt.gotoAndStop("up");
	createNodeButt.gotoAndStop("up");
	
	for(var i=0; i < _root.nodeNum; i++)
	{
		this._parent["node" + i].nodeBody.onPress = newPress;
		this._parent["node" + i].nodeBody.onRelease = this._parent["node" + i].nodeBody.onReleaseOutside=newRelease;
	}
	
	for(var j=0; j < _root.lineNum; j++)
	{
		this._parent["lineHolder" + j].onPress = startDrag(this, false);
		this._parent["lineHolder" + j].onRelease = this._parent["lineHolder" + j].onReleaseOutside= this.stopDrag();
	}
	
}

Heres my new version which im still having problems with


function createEdge()
{
	tool.text="EDGE";
	nodeMode=false;
	edgeMode=true;
	createEdgeButt.gotoAndPlay("down");
	createNodeButt.gotoAndStop("up");
		
	_root.z+=1;
	this._parent.createEmptyMovieClip("tempLine", _root.z);
	_root.z+=1;
	this._parent.createEmptyMovieClip("point1", _root.z).buildPoint(3);
	_root.z+=1;
	this._parent.createEmptyMovieClip("point2", _root.z).buildPoint(3);
	point1._visible = false;
	point2._visible = false;//same as point1._visible=false;  point2._visible=false
	
	delete this._parent._parent.onMouseDown;
	this._parent._parent.onMouseDown = drawProcess;//25/3
	this._parent._parent.onMouseUp = drawFinalLine;
	this._parent._parent.onEnterFrame = clearMe;
}

function drawProcess() {
	if(edgeMode==true)
	{
		 if(canvas.hitTest(this._parent._xmouse, this._parent._ymouse, true)) {
			 _root.lineNum++;
			 _root.z+=1;
			 //create a seperate mc for each line
			 this._parent.createEmptyMovieClip("line"+_root.lineNum, _root.z);
			 		 
			 xPos = _xmouse;
			 yPos = _ymouse;
			 
			 trace("_xmouse: " + xPos + " _ymouse: " + yPos);
			 point1._x = point2._x=xPos
			 point1._y = point2._y=yPos
			 point1._visible = point2._visible=true;
			 
			 this._parent["line"+ _root.lineNum].moveTo(xPos, yPos);
			 trace("x: " + this._parent["line" + 1]._x);
		 
		 	 this.onMouseMove = function() {
				 tempLine.clear();
				 tempLine.lineStyle(2, 0xC9C9FC, 50);
				 tempLine.moveTo(xPos, yPos);
				 if (Key.isDown(Key.SHIFT)) {
					 if (_ymouse<=yPos-100 || _ymouse>=yPos+100) {
						point2._x = xPos;
						point2._y = _ymouse;
						tempLine.lineTo(xPos, _ymouse);
					} else {
						point2._x = _xmouse;
						point2._y = yPos;
						tempLine.lineTo(_xmouse, yPos);
					}
				} else {
					point2._x = _xmouse;
					point2._y = _ymouse;
					tempLine.lineTo(_xmouse, _ymouse);
				}
				
			};
		 }
	}
}

function drawFinalLine() {
	if(edgeMode==true)
	{		
		if(canvas.hitTest(this._parent._xmouse, this._parent._ymouse, true)) {
			tempLine.clear();
			delete this.onMouseMove;
			point1._visible = point2._visible=false;
			this._parent["line" + _root.lineNum].lineStyle(.25, 0x2525F3, 100);
			if (Key.isDown(Key.SHIFT)) {
				if (_ymouse<=yPos-100 || _ymouse>=yPos+100) {
					this._parent["line" + _root.lineNum].lineTo(xPos, _ymouse);
				} else {
					this._parent["line" + _root.lineNum].lineTo(_xmouse, yPos);
				}
			} else {
				this._parent["line" + _root.lineNum].lineTo(_xmouse, _ymouse);
			}
			//_root.lineNum = _root.lineNum + 1;
			_root.p1x[_root.lineNum] = point1._x;
			_root.p1y[_root.lineNum] = point1._y;
			_root.p2x[_root.lineNum] = point2._x;
			_root.p2y[_root.lineNum] = point2._y;
			
		}
	}
	
}

Hrmm… sorry, I couldn’t really figure out a good method to do it :-\ :frowning:

Thats ok, thanks anyway lost. … I can get it drawing in individual clips but for some reason it draws offset to the hitTest area (canvas mc), ie I tempLine gets drawn on canvas and the final line appears about 100px to the left lol.

:cyclops:

Actually just a guess from looking at the dictionary, I may need to use somewhere something like this


myMovieClip.globalToLocal(point)
or 
myMovieClip.localToGlobal(point)

to stop that offsetting… but thats way over my head ;(

Heya lost sorry, I found this script in actionscript.org, pretty good and close to the functionality Im trying to achieve. Would this spark you inner mind?

I think the problem is the targetting of the line.

Sometimes _root, this, or _parent doesn’t alway work. In that case sometimes you have to resort to this._parent. And depending on how many clips your final clip is in it can be this._parent._parent._parent, etc, etc…lol.

The offsetting seems to me like you are setting _x and _y coordinate (or possible _xmouse and_ymouse coordinates) by the wrong timelines settings… if you know what I mean.

If you dont understand… then check this to see what I mean…

[AS]this.createEmptyMovieClip(“test”, 1);
test._x = 275;
test._y = 200;
this.onMouseMove = function() {
trace(_root._xmouse);
trace(test._xmouse);
};[/AS]

I created a movie clip and moved it center stage (that is… if your movie is the standard 550x400), then I use an onMouseMove to trace the _xmouse position on the _root timeline and the _xmouse position inside the test clips timeline. You will see they return different results. As you get closer to the upper left, the _root._xmouse returns closer to 0, and as you get closer to the center of the stage the test._xmouse returns closer to 0.

Hmm yeah I know what you mean regarding the timelines. And the targeting is deffintly the problem because the final line appears to be exactly the same size, angle etc its just that its offset as I mentioned, to the left. :hair:
Seems to be it gets the xPos and yPos ok, but when it redraws the line as final line it appears to draw under the coordinates of the ‘outer’ clip and I have no idea which clip is this ‘outer’ clip BAH

And just for kicks… heres another example of a clip inside the test clip…

[AS]this.createEmptyMovieClip(“test”, 1);
test.createEmptyMovieClip(“test2”, 1);
test._x = 275;
test._y = 200;
test.test2._x = 150;
test.test2._y = 100;
this.onMouseMove = function() {
trace("Orig: "+_root._xmouse);
trace("Test: "+test._xmouse);
trace("Test2: "+test.test2._xmouse);
};[/AS]

This time I moved the test2 clip (150, 100) according to the (0,0) of the test clip.

*Originally posted by mindfriction *
**Hmm yeah I know what you mean regarding the timelines. And the targeting is deffintly the problem because the final line appears to be exactly the same size, angle etc its just that its offset as I mentioned, to the left. :hair:
Seems to be it gets the xPos and yPos ok, but when it redraws the line as final line it appears to draw under the coordinates of the ‘outer’ clip and I have no idea which clip is this ‘outer’ clip BAH **

Yeah, the xPos and yPos are probably correct, your just targeting the wrong timeline to draw the final line in, so its creating it in the right coords of the wrong clip, causing the offset.

At least in theory I think thats the problem. Good luck finding out how to target it… that kind of stuff is a PAIN!!!

lol, ‘just for kicks’.

Hey one other thing before I dive into this painful mess just a passing thought, if I clear temp line mc as I do, how can I be sure the final line empty clip i create will register at the same relative position as the temp line empty?

If you want to be sure… then don’t clear your temp line… if thats what you mean. You can always comment out the tempLine clear code while testing then uncomment it when your done.

That is if I understand what you are saying. Its 3am now and I gotta get up early… so I really have to go now and I hope I understood correctly.

Thanks for listening (or reading) my insanity lost.

Usually im on the forums late because it seems thats the best time to be on due to timeline difference, its actually 5.00pm in Melbourne Australia atm.
I’ll let you know how it goes :stuck_out_tongue: