view onlypaths/js/onlypaths.js @ 49:5eb11cf654de laserkard

[svn r50] implemented max text length
author rlm
date Sun, 31 Jan 2010 21:37:24 -0500
parents 26c2b3ad21c7
children
line wrap: on
line source
1 /*----------------------------------------------------------------------------
2 ONLYPATHS 0.1
3 from
4 RICHDRAW 1.0
5 Vector Graphics Drawing Script
6 -----------------------------------------------------------------------------
7 Created by Mark Finkle (mark.finkle@gmail.com)
8 Implementation of simple vector graphic drawing control using SVG or VML.
9 -----------------------------------------------------------------------------
10 Copyright (c) 2006 Mark Finkle
11 2008 Antimatter15
12 2008 Josep_ssv
14 This program is free software; you can redistribute it and/or modify it
15 under the terms of the MIT License.
17 Permission is hereby granted, free of charge, to any person obtaining a
18 copy of this software and associated documentation files (the "Software"),
19 to deal in the Software without restriction, including without limitation
20 the rights to use, copy, modify, merge, publish, distribute, sublicense,
21 and/or sell copies of the Software, and to permit persons to whom the
22 Software is furnished to do so, subject to the following conditions:
23 The above copyright notice and this permission notice shall be included in
24 all copies or substantial portions of the Software.
26 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
27 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
28 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
29 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
30 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
31 FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
32 DEALINGS IN THE SOFTWARE.
33 -----------------------------------------------------------------------------
34 Dependencies: (SVG or VML rendering implementations)
35 History:
36 2006-04-05 | Created richdraw.js
37 2008 | Update content and added framework ExtJS
38 2008-06-08 | Rename onlypaths.js
39 --------------------------------------------------------------------------*/
41 var xpArray=new Array();
42 var ypArray=new Array();
43 var setPoints=new Array();
45 var inout='';//true;
46 var typeTransform='';
48 var contmove=0;
49 var zoomx=0;
50 var zoomy=0;
51 var zoomscale=1;
52 var zoommode='frame'; //more minus frame
54 //
56 var data_path_close=true;
57 var data_text_family='';
58 var data_text_size=19
59 var data_text_messaje='';
60 var data_image_href='';
62 var numClics=0;
64 ////////////
66 function RichDrawEditor(elem, renderer) {
67 this.container = elem;
68 this.gridX = 10;
69 this.gridY = 10;
70 this.mouseDownX = 0;
71 this.mouseDownY = 0;
72 this.clicX = 0;
73 this.clicY = 0;
74 this.nowDraw=false;
75 this.mode = '';
76 this.fillColor = '';
77 this.lineColor = '';
78 this.lineWidth = '';
79 this.selected = null;
80 this.squareSelect = null;
81 this.focusin = null;
82 this.lineOpac = 1;
83 this.fillOpac = 1;
84 this.gridWidth = 1;
85 this.opac = 1;
86 //++ ;
87 this.text_messaje="";
88 this.text_size=19;
89 this.text_family="Arial";
91 this.pathsEdit = false;
92 this.previusBox=null;
93 this.initialPath='';
94 this.clipboard=null;
95 this.moveNow=true;
97 this.selectedBounds = { x:0, y:0, width:0, height: 0 };
98 this.onselect = function() {}
99 this.onunselect = function() {}
101 this.logtext = "";
103 this.renderer = renderer;
104 this.renderer.init(this.container);
105 this.renderer.editor = this;
107 this.initialUnit=1;
108 this.unit=this.initialUnit;
111 this.inputxy = [];
112 this.viewInputxy = [];
113 this.onViewInputXY = function(){};
114 this.onInputXY = function(){};
117 //Ext.get(this.container).on('keypress', function(e){alert(e.keyCode);});
119 Ext.get(this.container).on( "mousedown", this.onMouseDown,this);
120 Ext.get(this.container).on( "mouseup", this.onMouseUp,this);
121 Ext.get(this.container).on( "mousemove", this.onMouseMove,this);
122 //Ext.get(this.container).on( "dblclick", this.onEndLine,this);
123 Ext.get(this.container).on( "selectstart", this.onSelectStart,this);
127 }
129 RichDrawEditor.prototype.log = function(logtext){
130 if(document.forms[0].code){
131 document.forms[0].code.value = logtext
132 }
133 }
136 RichDrawEditor.prototype.getshapes = function(){
137 return this.renderer.getshapes();
138 }
140 RichDrawEditor.prototype.info = function(shape){
141 return this.renderer.info(shape)
142 }
145 RichDrawEditor.prototype.clearWorkspace = function() {
146 this.container.innerHTML = '';
147 };
149 RichDrawEditor.prototype.deleteSelection = function() {
150 if (this.selected) {
151 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
152 this.renderer.remove(this.selected);
153 this.selected = null;
154 }
155 };
157 RichDrawEditor.prototype.toFront = function(order) {
158 if (this.selected) {
159 this.renderer.index(this.selected, order);
160 }
161 };
163 RichDrawEditor.prototype.deleteAll = function() {
164 this.renderer.removeAll();
165 };
168 RichDrawEditor.prototype.select = function(elem) {
169 if (elem == this.selected){ return; }
170 this.selected = elem;
171 this.renderer.showTracker(this.selected,this.pathsEdit);
172 this.onselect(this);
173 };
176 RichDrawEditor.prototype.unselect = function() {
177 if (this.selected) {
178 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
179 this.selected = null;
180 this.onunselect(this);
181 }
182 };
184 RichDrawEditor.prototype.getSelectedElement = function() {
185 return this.selected;
186 };
188 RichDrawEditor.prototype.toCurve = function() {
189 this.renderer.tocurve();
190 }
192 RichDrawEditor.prototype.submitShape = function(data) {
193 if (this.mode != 'select') {
194 setMode('path', 'Path');
195 this.actualStyle();
196 onColorChange();
197 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref, data, '', '');
198 this.selected.id = 'shape:' + createUUID();
199 Ext.get(this.selected).on("mousedown", this.onHit,this);
200 setMode('select', 'Select');
201 } else {
202 this.renderer.transformShape(this.selected,data,null);
203 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
204 this.renderer.showTracker(this.selected,this.pathsEdit);
205 }
206 };
208 RichDrawEditor.prototype.setGrid = function(horizontal, vertical) {
209 this.gridX = horizontal;
210 this.gridY = vertical;
211 this.gridWidth = (vertical+horizontal)/2; //average. ideally, it should be the same
212 };
216 RichDrawEditor.prototype.actualStyle = function()
217 {
218 this.textMessaje=$('option_text_message').value;
219 this.textSize=parseFloat($('option_text_size').value);
220 this.textFamily=$('option_text_family').value;
221 this.pathClose = $('option_path_close').checked;
222 this.imageHref = $('option_image_href').value;
224 return;
225 };
228 RichDrawEditor.prototype.editCommand = function(cmd, value)
229 {
230 if (cmd == 'mode')
231 {
232 this.mode = value;
233 }
234 else if (this.selected == null)
235 {
236 if (cmd == 'fillcolor')
237 {
238 this.fillColor = value;
239 }
240 else if (cmd == 'linecolor')
241 {
242 this.lineColor = value;
243 }
244 else if (cmd == 'linewidth')
245 {
246 this.lineWidth = parseInt(value) + 'px';
247 }
248 else if (cmd == 'fillopacity') {
249 this.fillOpac = parseInt(value);
250 }
251 else if (cmd == 'lineopacity') {
252 this.lineOpac = parseInt(value);
253 }
254 }
255 else
256 {
257 this.renderer.editCommand(this.selected, cmd, value);
258 }
259 }
262 RichDrawEditor.prototype.queryCommand = function(cmd)
263 {
264 if (cmd == 'mode')
265 {
266 return this.mode;
267 }
268 else if (this.selected == null)
269 {
270 if (cmd == 'fillcolor')
271 {
272 return this.fillColor;
273 }
274 else if (cmd == 'linecolor')
275 {
276 return this.lineColor;
277 }
278 else if (cmd == 'linewidth')
279 {
280 return this.lineWidth;
281 }
282 else if (cmd == 'fillopacity')
283 {
284 return this.fillOpac;
285 }
286 else if (cmd == 'lineopacity')
287 {
288 return this.fillOpac;
289 }
290 }
291 else
292 {
293 return this.renderer.queryCommand(this.selected, cmd);
294 }
295 }
300 RichDrawEditor.prototype.onSelectStart = function(event) {
301 return false
302 }
304 RichDrawEditor.prototype.onMouseDown = function(event) {
306 clockdata();
308 //MODE NO SELECT
309 if (this.mode != 'select')
310 {
311 var modeUsed=0;
312 if (this.mode == 'zoom')
313 {
314 var width=this.gridWidth;
315 contmove=0;
316 this.setGrid(width, width);
317 this.unselect();
318 xpArray=new Array();
319 ypArray=new Array();
320 this.mouseDownX = this.viewInputxy[0];
321 this.mouseDownY = this.viewInputxy[1];
322 xpArray.push(this.mouseDownX);
323 ypArray.push(this.mouseDownY);
324 if(zoommode=='window'){
325 this.squareSelect= this.renderer.create('rect', 'none', "#000000", 1, 1, 1, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref,'M0,0 1,1', '', '');
326 this.squareSelect.id = 'squareSelectID';
327 Ext.get(this.squareSelect).on( "mousedown", this.onHit,this);
328 Ext.get(this.squareSelect).on( "mousemove", this.onDraw,this);
330 }else{
331 this.renderer.zoom(this.mouseDownX, this.mouseDownY);
332 }
333 modeUsed=1;
334 } //end zoom
335 if (this.mode == 'controlpath')
336 {
337 this.actualStyle();
338 onColorChange();
339 if(numClics<=0)
340 {
341 this.nowDraw=true;
342 setPoints=new Array();
343 var width=this.gridWidth;
344 contmove=0;
345 this.setGrid(width, width);
346 this.unselect();
347 xpArray=new Array();
348 ypArray=new Array();
349 this.mouseDownX = this.viewInputxy[0];
350 this.mouseDownY = this.viewInputxy[1];
351 xpArray.push(this.mouseDownX);
352 ypArray.push(this.mouseDownY);
353 setPoints.push(this.mouseDownX+','+this.mouseDownY);
354 onColorChange();
355 this.actualStyle();
356 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref, 'M0,0 1,1', '', '');
358 this.selected.id = 'shape:' + createUUID();
359 Ext.get(this.selected).on( "mousedown", this.onHit,this);
360 this.log(this.selected.id);
362 Ext.get(this.selected).on( "dblclick", this.onEndLine,this);
363 Ext.get(this.container).on( "mousemove", this.onDraw,this);
364 numClics++;
365 }
366 else
367 {
368 var coord=this.viewInputxy;
369 var X=parseFloat(coord[0]);
370 var Y=parseFloat(coord[1]);
371 setPoints.push(X+','+Y);
372 this.renderer.clic(this.selected);
373 numClics++;
374 }
375 modeUsed=1;
376 } //end mode controlpath
377 if (modeUsed == 0)
378 {
379 var width=this.gridWidth;
380 contmove=0;
381 this.setGrid(width, width);
382 this.unselect();
383 xpArray=new Array();
384 ypArray=new Array();
385 this.mouseDownX = this.viewInputxy[0];
386 this.mouseDownY= this.viewInputxy[1];
388 xpArray.push(this.mouseDownX);
389 ypArray.push(this.mouseDownY);
391 this.unselect();
392 onColorChange();
393 this.actualStyle();
394 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref,'M0,0 1,1', '', '');
395 this.selected.id = 'shape:' + createUUID();
396 Ext.get(this.selected).on( "mousedown", this.onHit,this);
397 Ext.get(this.container).on( "mousemove", this.onDraw,this);
398 }
399 }
400 else //----- MODE SELECT
401 {
402 if(this.container.ownerDocument.getElementById('tracker')) this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
405 var snappedX=this.viewInputxy[0];
406 var snappedY=this.viewInputxy[1]
408 if (this.mouseDownX != snappedX || this.mouseDownY != snappedY)
409 {
410 if(this.selected!=null && typeTransform=='Translate' )
411 {
413 Ext.get(this.container).un("mousemove", this.onDrag);
414 this.unselect();
415 }
416 }
418 if(typeTransform=='Translate')
419 {
420 inout='move';//true;
421 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
423 }
424 if(typeTransform=='Scale' || typeTransform=='Rotate')
425 {
426 inout='rotate_escale';//false
427 Ext.get(this.container).on( "mousemove", this.onDrag,this);
428 //Ext.get(this.selected).on( "mousedown", this.onHit,this);
429 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
430 }
431 } //end mode select
432 return false;
433 };
436 RichDrawEditor.prototype.onMouseUp = function(event)
437 {
438 //MODE NO SELECT
439 if (this.mode != 'select')
440 {
441 if(this.mode == 'controlpath')
442 {
444 }
445 else
446 {
447 //ZOOM
448 if (this.mode == 'zoom')
449 {
450 var snappedX=this.viewInputxy[0];
451 var snappedY=this.viewInputxy[1];
452 this.renderer.zoom(snappedX, snappedY);
453 this.renderer.remove(this.container.ownerDocument.getElementById('squareSelectID'));
454 Ext.get(this.container).un("mousemove", this.onDraw);
455 this.squareSelect = null;
456 this.selected = null;
457 }else{
458 Ext.get(this.container).un("mousemove", this.onDraw);
459 this.selected = null;
460 }
461 }
462 }
463 else //MODE SELECT
464 {
465 Ext.get(this.container).un("mousemove", this.onDraw); //or drag
466 Ext.get(this.container).un("mousemove", this.onDrag);
467 moveNow=false;
468 contmove=0;
469 if(typeTransform=="Rotate" || typeTransform=="Scale" )
470 {
471 this.renderer.showTracker(this.selected,this.pathsEdit);
472 typeTransform=='';
473 }
474 if(typeTransform=="Translate" )
475 {
476 this.renderer.showTracker(this.selected,this.pathsEdit);
477 typeTransform='';
478 contmove=0;
480 }
482 if(inout=='multiSelect')
483 {
485 }
487 typeTransform='';
488 }
489 };
492 RichDrawEditor.prototype.onDrag = function(event) {
494 moveNow=true;
495 //var offset = Ext.get(this.selected).getXY()
496 //var deltaX = this.viewInputxy[0] - (this.viewInputxy[0] - this.mouseDownX);
497 //var deltaY = this.viewInputxy[1] - (this.viewInputxy[1] - this.mouseDownY);
498 //var deltaX = offset[0] ;
499 //var deltaY = offset[1] ;
501 var deltaX = this.viewInputxy[0] ;
502 var deltaY = this.viewInputxy[1] ;
503 var deltaX= this.selectedBounds['x']-this.mouseDownX + this.viewInputxy[0];
504 var deltaY= this.selectedBounds['y']-this.mouseDownY + this.viewInputxy[1];
506 //var deltX = this.viewInputxy[0]+(this.mouseDownX-this.viewInputxy[0]);
507 //var deltY = this.viewInputxy[1]+(this.mouseDownY-this.viewInputxy[1]);
509 var modeUsed=0;
510 if(this.mode == 'zoom')
511 {
512 Ext.get(this.container).getXY();
513 this.renderer.resize(this.squareSelect, this.clicX,this.clicY, this.viewInputxy[0], this.viewInputxy[1]);
514 modeUsed=1;
515 }
516 if(this.mode == 'controlpath')
517 {
518 modeUsed=1;
519 }
521 if(modeUsed==0)
522 {
523 if(inout=='multiSelect')
524 {
525 this.renderer.showMultiSelect(this.mouseDownX, this.mouseDownY);
526 }
527 if(typeTransform=="Translate")
528 {
529 Ext.get(this.container).getXY();
530 //this.log(this.mouseDownX+' '+event.getXY()[0]+' '+ this.selectedBounds.x +'contmove'+contmove);
531 //this.renderer.move(this.selected, this.viewInputxy[0],this.viewInputxy[1],this.clicX,this.clicY);
532 //this.renderer.move(this.selected, this.viewInputxy[0],this.viewInputxy[1], this.mouseDownX, this.mouseDownY);
533 this.renderer.move(this.selected, deltaX, deltaY, this.mouseDownX, this.mouseDownY);
534 }
535 if(typeTransform=="Rotate")
536 {
537 this.renderer.rotateShape(this.selected, this.previusBox,deltaX, deltaY);
538 }
539 if(typeTransform=="Scale")
540 {
541 this.renderer.scaleShape(this.selected, this.previusBox, this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY);
542 }
543 }
544 };
547 RichDrawEditor.prototype.onResize = function(event) {
548 var deltaX = this.viewInputxy[0] - this.mouseDownX;
549 var deltaY = this.viewInputxy[1] - this.mouseDownY;
550 this.renderer.track(handle, deltaX, deltaY);
551 show_tracker();
552 };
555 RichDrawEditor.prototype.onDraw = function(event) {
556 if (this.selected == null)
557 {
558 if(this.squareSelect != null)
559 {
560 var offset = Ext.get(this.container).getXY()
561 var snappedX = this.viewInputxy[0];//Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
562 var snappedY = this.viewInputxy[1];//Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
563 this.renderer.resize(this.squareSelect, this.mouseDownX, this.mouseDownY, snappedX, snappedY);
564 }
565 else
566 {
567 return;
568 }
569 }
570 else
571 {
573 var snappedX = this.viewInputxy[0];//Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
574 var snappedY = this.viewInputxy[1];// Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
575 this.renderer.resize(this.selected, this.mouseDownX, this.mouseDownY, snappedX, snappedY);
577 }
578 };
580 RichDrawEditor.prototype.onRotate = function(event) {
581 if (this.selected == null)
582 {
584 }else{
585 }
586 };
588 RichDrawEditor.prototype.onScale = function(event) {
589 if (this.selected == null)
590 {
592 }else{
593 }
594 };
596 RichDrawEditor.prototype.onTransform = function(event) {
597 if (this.selected == null)
598 {
600 }else{
601 }
602 };
604 RichDrawEditor.prototype.onMouseMove = function(event) {
605 var offset = Ext.get(c.container).getXY()
606 var x = Math.round(event.getXY()[0] - offset[0]);
607 var y = Math.round(event.getXY()[1] - offset[1]);
608 if (ie || opera)
609 {
610 proporx =1;
611 propory =1;
612 zoominit2='1 1 1 1';
613 this.inputxy = [x,y];
614 this.viewInputxy = [x,y];
615 this.onInputXY(x,y);
616 this.onViewInputXY(x,y);
617 }
618 else
619 {
620 ////////////
622 var X = x ; // x cursor on canvas
623 var Y = y ; // y cursor on canvas
625 var Ex = parseFloat(tokensCanvas[2]) ; // (end) width canvas. Corner down-left
626 var Ey = parseFloat(tokensCanvas[3]) ; // (end) height canvas. Corner up-right
628 var zoomX = 0 ; // ? x unknown
629 var zoomY = 0 ; // ? y unknown
631 var sx = parseFloat(tokensZoom[0]) ; // (start) x origin of the coord zoom.
632 var sy = parseFloat(tokensZoom[1]) ; // (start) y origin of the coord zoom.
633 var Wz = parseFloat(tokensZoom[2]) ; // width zoom
634 var Hz = parseFloat(tokensZoom[3]) ; // height zoom
636 var ex = parseFloat(sx + Wz) ; // (end) x width zoom. Corner down-left
637 var ey = parseFloat(sy + Hz) ; // (end) y height zoom. Corner up-right
639 var r = X / Ex ; // 0 to 1
640 var s = Y / Ey ; // 0 to 1
641 this.unit = this.initialUnit * (Hz/Ey) ; // 0 to 1
642 zoomX= (1 - r) * sx + ex * r;
643 zoomY= (1 - s) * sy + ey * s;
645 this.inputxy = [x,y];
646 this.viewInputxy = [zoomX,zoomY];
647 this.onInputXY(x,y);
648 this.onViewInputXY(zoomX,zoomY);
649 }
651 };
654 RichDrawEditor.prototype.onHit = function(event) {
655 Ext.get(this.container).un("mousemove", this.onDrag);
657 if(this.mode == 'select')
658 {
659 if (event.stopPropagation) event.stopPropagation(); // DOM Level 2
660 else event.cancelBubble = true; // IE
661 // Now prevent any default action.
662 if (event.preventDefault) event.preventDefault(); // DOM Level 2
663 else event.returnValue = false; // IE
665 if(inout=='multiSelect')
666 {
668 }
669 else
670 {
671 //Ext.get(this.container).un("mousemove", this.onDrag);
672 typeTransform="Translate";
673 contmove=0;
674 var width=this.gridWidth;
676 this.setGrid(width, width);
678 this.select(event.getTarget());
679 this.previusBox=this.selected;
681 this.renderer.getProperties(this.selected);
682 //var offset = Ext.get(this.container).getXY();
684 this.selectedBounds = this.renderer.bounds(this.selected);
686 this.mouseDownX =this.viewInputxy[0];//x;// offset[0];//zoomx+snappedX;
687 this.mouseDownY =this.viewInputxy[1];//y;// offset[1];//zoomy+snappedY;
688 this.log(this.gridX);
689 this.renderer.info(this.selected);
690 if(this.container.ownerDocument.getElementById('tracker'))
691 {
692 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
693 }
694 Ext.get(this.container).on( "mousemove", this.onDrag,this);
695 }
696 }
697 else
698 {
699 this.mouseDownX = this.viewInputxy[0];//Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
700 this.mouseDownY = this.viewInputxy[1];//Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
701 Ext.get(this.container).on( "mousemove", this.onDrag,this);
703 }
704 };
707 RichDrawEditor.prototype.onClic = function(event) {
708 if(this.mode == 'controlpath')
709 {
711 }
712 else
713 {
715 }
716 };
718 RichDrawEditor.prototype.reflect = function(HorV) {
719 this.selected=this.renderer.reflect(HorV);
720 this.selected.id = 'shape:' + createUUID();
721 Ext.get(this.selected).on( "mousedown", this.onHit,this);
722 }
724 RichDrawEditor.prototype.onEndLine = function(event) {
726 if(this.mode == 'controlpath')
727 {
728 //alert(numClics);
729 numClics=0;
730 Ext.get(this.container).un("mousemove", this.onDraw);
731 //Ext.get(this.selected).un( "mousedown", this.onHit,this);
732 //Ext.get(this.selected).un( "dblclick", this.onEndLine);
733 //Ext.get(this.container).un( "mousemove", this.onDraw,this);
734 //Ext.get(this.container).un( "mousemove", this.onDrag,this);
735 // Ext.get(this.selected).un( "mousedown", this.onHit);
737 // Ext.get(this.container).un("mousemove", this.onDraw,this);
738 //Ext.get(this.container).un("mousemove", this.onDrag,this);
739 this.selected = null;
742 }
743 else
744 {
746 this.nowDraw=false;
747 typeTransform='';
748 }
749 };
751 function noselect(){
752 }
754 function createUUID()
755 {
756 return [4, 2, 2, 2, 6].map(function(length) {
757 var uuidpart = "";
758 for (var i=0; i<length; i++) {
759 var uuidchar = parseInt((Math.random() * 256)).toString(16);
760 if (uuidchar.length == 1)
761 uuidchar = "0" + uuidchar;
762 uuidpart += uuidchar;
763 }
764 return uuidpart;
765 }).join('-');
766 }
769 //----------------------------------------------------------------------------
770 // AbstractRenderer
771 //
772 // Abstract base class defining the drawing API. Can not be used directly.
773 //----------------------------------------------------------------------------
775 function AbstractRenderer() {
777 };
779 AbstractRenderer.prototype.init = function(elem) {};
780 AbstractRenderer.prototype.bounds = function(shape) { return { x:0, y:0, width:0, height: 0 }; };
781 AbstractRenderer.prototype.create = function(shape, fillColor, lineColor, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, transform) {};
782 AbstractRenderer.prototype.datacreate = function(fillColor, lineColor, lineWidth, fillOpac, strokeOpac, left, top, width, height,data) {};
783 AbstractRenderer.prototype.index = function(shape, order) {};
784 AbstractRenderer.prototype.remove = function(shape) {};
785 AbstractRenderer.prototype.copy = function(shape) {};
786 AbstractRenderer.prototype.paste = function(left,top) {};
787 AbstractRenderer.prototype.duplicate = function(shape) {};
788 AbstractRenderer.prototype.move = function(shape, left, top) {};
789 AbstractRenderer.prototype.endmove = function(shape) {};
790 AbstractRenderer.prototype.transform= function(shape, left, top) {};
791 AbstractRenderer.prototype.scale = function(shape, left, top) {};
792 AbstractRenderer.prototype.rotate = function(shape, left, top) {};
793 AbstractRenderer.prototype.track = function(shape) {};
794 AbstractRenderer.prototype.restruct = function(shape) {};
795 AbstractRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) {};
796 AbstractRenderer.prototype.editCommand = function(shape, cmd, value) {};
797 AbstractRenderer.prototype.queryCommand = function(shape, cmd) {};
798 AbstractRenderer.prototype.showTracker = function(shape,value) {};
799 AbstractRenderer.prototype.getMarkup = function() { return null; };
800 AbstractRenderer.prototype.info = function(shape){};
801 AbstractRenderer.prototype.editShape = function(shape,data){};
802 AbstractRenderer.prototype.onKeyPress = function(){};
804 AbstractRenderer.prototype.getshapes = function(){};
807 //-----------------------------
808 // Geometry - string functions
809 //-----------------------------
811 //two point angle deg
812 function ang2v(x1,y1,x2,y2)
813 {
814 /*
815 var k=0;
817 var sum1=u1+v1;
818 var sum2=u2+v2;
820 var res1=u1-v1;
821 var res2=u2-v2;
823 var ku1=k*u1;
824 var ku2=k*u2;
826 var mu= Math.sqrt(u1*u1+u2*u2);
827 var mv= Math.sqrt(v1*v1+v2*v2);
829 var pesc= u1*v1+u2*v2;
830 //var ang=Math.acos(pesc/(mu*mv))*180/Math.PI;
831 var ang=Math.acos(pesc/(mu*mv));
832 */
833 var resx=x2-x1;
834 var resy=y2-y1;
835 var ang=Math.atan2(resy,resx);
836 //alert(ang);
837 return ang;
838 }
840 function dist2p(a,b,c,d)
841 {
842 with (Math)
843 {
844 //var d2p=sqrt(abs(((d-b)*(d-b) )+((c-a)*(c-a)))); //decimas(d2p,3); return d2p;
845 return sqrt(abs((d-b)*(d-b)+ (c-a)*(c-a)));
847 }
848 }
849 function pmd2pb(a,b,c,d,q) {
850 pmdx= (1-q)*a+c*q;
851 pmdy= (1-q)*b+d*q;
852 //pmdx=decimas(pmdx,3);
853 //pmdy=decimas(pmdy,3);
854 var cad=pmdx+','+pmdy;
855 var sol= new Array();
856 sol= [cad,pmdx,pmdy];
857 return sol
859 }
861 function getAngle(dx,dy) {
862 var angle = Math.atan2(dy, dx);
863 //angle *= 180 / Math.PI;
864 return angle;
866 }
868 /*
870 A = y2-y1
871 B = x1-x2
872 C = A*x1+B*y1
873 Regardless of how the lines are specified, you should be able to generate two different points along the line, and then generate A, B and C. Now, lets say that you have lines, given by the equations:
874 A1x + B1y = C1
875 A2x + B2y = C2
876 To find the point at which the two lines intersect, we simply need to solve the two equations for the two unknowns, x and y.
878 double det = A1*B2 - A2*B1
879 if(det == 0){
880 //Lines are parallel
881 }else{
882 double x = (B2*C1 - B1*C2)/det
883 double y = (A1*C2 - A2*C1)/det
884 }
889 */
890 // interseccion 2 rectas
891 function ntrsccn2rb(a,b,c,d,e,f,g,h){
892 var solution= new Array();
893 var i2rx=0;var i2ry=0;
894 var w= (c-a)*(f-h)-(e-g)*(d-b);
895 if(w==0){
896 n=1;
897 i2rx= (1-n)*a+n*c;
898 i2ry= (1-n)*b+n*d;
899 solution= ['',i2rx,i2ry];
900 //Lines are parallel
901 return solution
902 //return (i2rx+' '+i2ry);
903 }
904 var n = (((e-a)*(f-h))-((e-g)*(f-b)))/w;
905 i2rx=(1-n)*a+n*c;
906 i2ry=(1-n)*b+n*d;
907 //return (i2rx+' '+i2ry);
908 solution= ['',i2rx,i2ry];
909 return solution
911 }
913 //ecuacion implicita de la recta
914 function ccnmplct(a,b,c,d) {
915 var solution= new Array();
916 //a1 a2, b1 b2 vector direccion b1-a1 , b2-a2
917 var v1m=c-a;
918 var v1n=d-b;
919 var c1x= v1m;
920 var c1y= v1n;
921 // ecuacion continua (x - a) /c -a = (y - b)/d - b
922 //(x - a) * v1n = (y - b) * v1m
923 //x * v1n - v1n*a = y * v1m - b* v1m
924 eia= v1n ;
925 eib= - v1m;
926 eic= (b* v1m) - ( v1n*a)
927 solution= [eia,eib,eic];
928 return solution
929 }
930 function GetString(source, start, end){
931 var st = source.indexOf(start) + start.length;
932 var en = source.indexOf(end, start);
933 return source.substring(st, en);//trimAll(source.substring(st, en));
934 }
936 function deg2rad(angle){
937 return (angle/180) * Math.PI;
938 }
940 String.prototype.trim = function(){ return this.replace(/^\s+|\s+$/g,'') }
942 function objectOffset(obj)
943 {
944 var posX=0;
945 var posY=0;
946 if(typeof(obj.offsetParent) != "undefined")
947 {
948 for(var x=0, y=0;obj; obj=obj.offsetParent)
949 {
950 x += obj.offsetLeft;
951 y += obj.offsetTop;
952 }
953 posX=x;
954 posY=y;
955 }
956 else
957 {
958 posX=obj.offsetLeft;
959 posY=obj.offsetTop;
960 }
961 alert(obj.id+" "+"X: "+posX+" Y: "+posY);
962 }
964 function generateJSON(cssEnv)
965 {
966 //string=string.replace(/;/g,'",') ;
967 //string=string.replace(/:/g,':"') ;
968 //style="fill:#7e0000;fill-opacity:1"
970 var css=cssEnv.split(';')
972 var strJSON = '{';
973 ch = ',';
974 for (i = 0 ; i < css.length; i++)
975 {
976 var data=css[i].split(':');
977 if(data[0]!=''){
978 //if(i == (css.length-2)){ ch = ''; }
979 strJSON += "'"+data[0].trim()+"':'"+data[1].trim()+"'"+",";
980 }
983 }
984 var num= strJSON.length;
985 strJSON=strJSON.substr(0, num-1);
987 strJSON += '}';
989 return strJSON;
990 }