Making a Line Tool? ie point to point

OMG fantast ic (not) Ive had trouble all night, and now Ive lost my last few postings??? ARGH! Oh well :sigh: I wanted to show you what I had done lost/ senoc. I’ll have to post it tommorow as Im not on my own computer atm.

Yeah, due to complications in the move we lost the past 5 days worth of posts :frowning:

But I think it was worth it in the long run.

Sen needs to post his circle code again!!!

My latest version, check it out. As you can see you can choose between circle and line tools. Not very optimized :/, what do you think of my AS, any imporvements?

Yeah I guess that the new servers will make everything run a little faster, but yeah Senocs circle code has gone, and thank god I have a few versions of the line code you put up!.

One thing you may notice about my movie is that I u cant move the circles while there on the canvas anymore, it just keeps dupliacting them. I like being able to choose the initial pos of the circles by cliccking there pos on the canvas, but I dont like the fact I cant move them anymore once they are on the stage. There is something Im deffintly missing in the AS, it jus hasnt clikced yet

Ok, Ok, Havent heard a reply for a while. I guess Ive asked to much already. :confused: … But if there was one last thing I could ask, its regarding relative and absolute paths. I tried to take the entire movie and sit it inside an MC, I figured that all I had to do was change all the ‘_root’ references to a ‘this’ references, BUT of course that didnt work ;( ARrgghh!!!

Sorry. Been busy :hat:

Did you try _parent as well?

Nah thats fine, I was just getting worried with the whole change of servers, I have to keep logging in, and sometimes because of stoopid IE rememberring too much I occassionally get the old thread (ie the one that doesnt have the missing posts). And sometimes when Im online it says im not lol. Its nice to hear your reply :slight_smile:

‘_parent’ has never really been my friend but where slowly starting to get aquainted. I just didnt understand the def in the AS dictionary. ATm Im trying to redo all the code so that it is using relative paths and not absolute (hence so it can work within a clip). Ive only just got a few things working. Its **** tiresome and Im working on trial and error.heh

Yeah, I know it is tiresome. I am working on something else right now and it is making me angry… :sigh: But alas, we must persist.

And I have not experienced any problems with the new switched forums. Weird.

Quick question though, from AS within a clip, the relative path back to _root, is something like



this._parent //?????


?? I mean im trying to convert the absolute paths in this part of your famous ‘line tool’ code to realtive paths


function drawProcess() {
	
	 if(_root.canvas.hitTest(_root._xmouse, _root._ymouse, true)) {
		xPos = _xmouse;
		yPos = _ymouse;
		point1._x = point2._x=xPos;
		point1._y = point2._y=yPos;
		point1._visible = point2._visible=true;
		line.moveTo(xPos, yPos);
		 
	 
		this.onMouseMove = function() {
			
			tempLine.clear();
			tempLine.lineStyle(2, 0xE6E6E6, 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);
			}
			
		};
	 }

circle:


MovieClip.prototype.drawCircle = function (x,y,r) {
	var c1=r*(Math.SQRT2-1);
	var c2=r*Math.SQRT2/2;
	this.moveTo(x+r,y);
	this.curveTo(x+r,y+c1,x+c2,y+c2);
	this.curveTo(x+c1,y+r,x,y+r);
	this.curveTo(x-c1,y+r,x-c2,y+c2);
	this.curveTo(x-r,y+c1,x-r,y);
	this.curveTo(x-r,y-c1,x-c2,y-c2);
	this.curveTo(x-c1,y-r,x,y-r);
	this.curveTo(x+c1,y-r,x+c2,y-c2);
	this.curveTo(x+r,y-c1,x+r,y);
	return this;
}

Wahoo! Thanks for posting that again Sen. But even more wahooish is that Kirupa got the AS tag working!

[AS]MovieClip.prototype.drawCircle = function(x, y, r) {
var c1 = r*(Math.SQRT2-1);
var c2 = r*Math.SQRT2/2;
this.lineStyle(1, 0x000000, 100);
this.beginFill(0xE6E6E6, 100);
this.moveTo(x+r, y);
this.curveTo(x+r, y+c1, x+c2, y+c2);
this.curveTo(x+c1, y+r, x, y+r);
this.curveTo(x-c1, y+r, x-c2, y+c2);
this.curveTo(x-r, y+c1, x-r, y);
this.curveTo(x-r, y-c1, x-c2, y-c2);
this.curveTo(x-c1, y-r, x, y-r);
this.curveTo(x+c1, y-r, x+c2, y-c2);
this.curveTo(x+r, y-c1, x+r, y);
this.endFill();
return this;
};
this.createEmptyMovieClip(“container”, 1).drawCircle(100, 100, 50);[/AS]

woohoo!
try this for specifying lines/fills


MovieClip.prototype.drawCircle = function(x, y, r, lstyle, fstyle) {
        var c1 = r*(Math.SQRT2-1);
        var c2 = r*Math.SQRT2/2;
        if (lstyle) lineStyle.apply(this, lstyle);
        if (fstyle) beginFill.apply(this, fstyle);
        this.moveTo(x+r, y);
        this.curveTo(x+r, y+c1, x+c2, y+c2);
        this.curveTo(x+c1, y+r, x, y+r);
        this.curveTo(x-c1, y+r, x-c2, y+c2);
        this.curveTo(x-r, y+c1, x-r, y);
        this.curveTo(x-r, y-c1, x-c2, y-c2);
        this.curveTo(x-c1, y-r, x, y-r);
        this.curveTo(x+c1, y-r, x+c2, y-c2);
        this.curveTo(x+r, y-c1, x+r, y);
        this.endFill();
        return this;
};
this.createEmptyMovieClip("container", 1).drawCircle(100, 100, 50, [1,0x00000,100], [0xff0000,100]);

woohoo as

now we just need a quick reply :wink:

Hey Sen, do you know how to make this so you can click and drag to resize (on original creation not afterwards)?

I have something now, but it is way buggy, and since your an AS god and stuff I figured you could figure it out :stuck_out_tongue:

like this?


Math.distance = function(x1,y1,x2,y2){
	var x = x1-x2;
	var y = y1-y2;
	return Math.sqrt(x*x + y*y);
}
MovieClip.prototype.drawCircle = function(x, y, r, lstyle, fstyle) {
        var c1 = r*(Math.SQRT2-1);
        var c2 = r*Math.SQRT2/2;
        if (lstyle) lineStyle.apply(this, lstyle);
        if (fstyle) beginFill.apply(this, fstyle);
        this.moveTo(x+r, y);
        this.curveTo(x+r, y+c1, x+c2, y+c2);
        this.curveTo(x+c1, y+r, x, y+r);
        this.curveTo(x-c1, y+r, x-c2, y+c2);
        this.curveTo(x-r, y+c1, x-r, y);
        this.curveTo(x-r, y-c1, x-c2, y-c2);
        this.curveTo(x-c1, y-r, x, y-r);
        this.curveTo(x+c1, y-r, x+c2, y-c2);
        this.curveTo(x+r, y-c1, x+r, y);
        this.endFill();
        return this;
};
this.onMouseDown = function(){
	if (this.circ.onMouseMove) delete this.circ.onMouseMove;
	var x1 = this._xmouse, y1 = this._ymouse;
	this.circ = this.createEmptyMovieClip("circ"+this.depth, this.depth++);
	this.circ.onMouseMove = function(){
		this.clear();
		this.drawCircle(x1,y1,Math.distance(x1,y1,this._parent._xmouse,this._parent._ymouse), [1,0,100]);
		updateAfterEvent();
	}
}
this.onMouseUp = function(){
	delete this.circ.onMouseMove;
}

=) as is almost twice as fast to type too… its just grand!

EXACTLY like that! Thanks man.

Your code is much more optimized than my method. Like half the amount of code :stuck_out_tongue:

I realize my problem though, I was detecting my radius wrong.

edit: I did some reading up on this apply feature you use, very interesting stuff. It will come in handy in the future. Thanks man.

:wink: cool

yeah the apply thing can come in handy. Its something I wish I had in Flash 5 back in the day. the call action is similar though it doesnt convert the array to arguments, it uses normal arguments but is structured the same way

functionName.call(object, arg1, arg2, … argn);

It too can be useful at times, though I might have used it possibly once in practical applications in the past. apply Ive used a lot more.

btw, the free transform script I have might come in handy with all of this drawing stuff.

http://proto.layer51.com/d.aspx?f=636

Hmm Nice tools indeed~ I’ll have to play around with that Senocular, Im sure just a few changes and could change it to work for squares as well :slight_smile:

> Im having problems with paths in my code, all is done and working when my movie sits in the root but not when its put inside a clip. Cant seem to nip it in the bud either could you please take a look if you have time?

Wow, that free transform thing rocks!

BTW Sen: What is up with your title? kuser2867? You replied to my PM with that too. Any special meaning?

Well from what I can tell…

[AS]this.onLoad = function() {
circleTool._visible = false;
};[/AS]

There is no point for an onLoad. I don’t even think that works for clips. Once the frame is entered that code is executed anyway. So just use this…
[AS]circleTool._visible = false;[/AS]

I also changed your newPress() function because the paths were wrong.

[AS]function newPress() {
trace("CIRCLES MODE PRESS??? "+circleMode);
if (circleMode == true) {
//increase swapDepths() variable to switch to a higher depth
z += 2;
//swapDepths() to the higher depth
this._parent.swapDepths(z);
//startDrag(this, true);
//instead of startDrag I just used the _xmouse and _ymouse position
//reason: new method wouldn’t work with startDrag()
this.onEnterFrame = function() {
//if the mouse is over the canvas
if (this._parent._parent.canvas.hitTest(_root._xmouse, _root._ymouse, true)) {
//“drag” the clip
this._parent._x += (this._xmouse-_parent._x)/5;
this._parent._y += (this._ymouse-_parent._y)/5;
}
};
}
}[/AS]

Thanks lost, it didnt work though, turns out the working solution is something like this

function newPress() {
	trace("CIRCLES MODE PRESS??? " + nodeMode);
	if(nodeMode==true)
	{
		//increase swapDepths() variable to switch to a higher depth
		z += 2;
		//swapDepths() to the higher depth
		this._parent.swapDepths(z);
		//startDrag(this, true);
		//instead of startDrag I just used the _xmouse and _ymouse position
		//reason:  new method wouldn't work with startDrag()
					//if the mouse is over the canvas
		this.onEnterFrame = function() {
			trace("ENTER FRAME");
        //if the mouse is over the canvas
		//if (canvas.hitTest(this._xmouse, this._ymouse, true)) {
			if(canvas.hitTest(_parent._xmouse, _parent._ymouse, true)) {
			
				//"drag" the clip
				trace("HIT");
				this._parent._x += (this._xmouse-_parent._x)/2;
				this._parent._y += (this._ymouse-_parent._y)/2;
			
			}
    	};
		
	}

}

Oh call me slow, but hooray for the AS tag. =) … I tell you what there is deffintly more functionality to this vbulletin than flashkits.