Mercurial > laserkard

comparison onlypaths/js/vmlrenderer.js @ 46:26c2b3ad21c7 laserkard

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[svn r47] saving progresswww.cinemassacre.com/new/?page_id=30
author rlm
date Sun, 31 Jan 2010 12:33:33 -0500
parents
children
comparison
equal deleted inserted replaced
45:bff96abdddfa 46:26c2b3ad21c7
1 //----------------------------------------------------------------------------
2 // VMLRENDERER 1.0
3 // VML Renderer For RichDraw
4 // Dependencies:
5 // History:
6 // 2006-04-05 | Created
7 // --------------------------------------------------------------------------*/
8
9
10 function VMLRenderer() {
11 this.base = AbstractRenderer;
12 }
13
14
15 VMLRenderer.prototype = new AbstractRenderer;
16
17 VMLRenderer.prototype.bounds = function(shape) {
18 var rect = new Object();
19 rect['x'] = shape.offsetLeft;
20 rect['y'] = shape.offsetTop;
21 rect['width'] = shape.offsetWidth;
22 rect['height'] = shape.offsetHeight;
23 return rect;
24 }
25
26 VMLRenderer.prototype.init = function(elem)
27 {
28 this.container = elem;
29 // this.container.style.overflow = 'hidden';
30 this.container.unselectable = "on";
31 // Add VML includes and namespace
32 elem.ownerDocument.namespaces.add("v", "urn:schemas-microsoft-com:vml");
33 var style = elem.ownerDocument.createStyleSheet();
34 style.addRule('v\\:*', "behavior: url(#default#VML); display:inline-block");
35 //NOT VML biewBox
36 //http://blogs.msdn.com/ie/archive/2008/03/18/webbrowser-control-rendering-modes-in-ie8.aspx
37
38 }
39
40
41
42
43 var proporx=1;
44 var propory=1;
45
46 VMLRenderer.prototype.view = function(left,top,width,height,viewBox,bgcolor) {
47 var tokens = viewBox.split(' ');
48
49 var margin=100;
50 var wFront=parseInt(document.getElementById('FRONT').style.width)
51 var hFront=parseInt(document.getElementById('FRONT').style.height)
52 var tC=0 + ' ' + 0 + ' ' + wFront + ' ' + hFront;
53 tokensCanvas= tC.split(' ');
54
55 var w=parseFloat(tokens[2]);
56 var h=parseFloat(tokens[3]);
57 var wImage = w - parseFloat(tokens[0]);
58 var hImage = h - parseFloat(tokens[1]);
59 var wCanvas = wFront;
60 var hCanvas = hFront;
61 proporImage = hImage / wImage;
62 proporCanvas = hCanvas / wCanvas;
63
64 document.title= initialFile +' '+wImage+' x '+hImage;
65
66
67 if(bgcolor != '')
68 {
69 this.container.style.backgroundColor=bgcolor;
70 } else{
71 this.container.style.backgroundColor="#ffffff";
72 }
73 if(viewMode=='preview')
74 {
75 if(proporCanvas==proporImage)
76 {
77 this.container.style.width =wFront+'px';
78 this.container.style.height =hFront+'px';
79 this.container.style.left =0+'px'
80 this.container.style.top =0+'px'
81 canvasLeft = 0;
82 canvasTop = 0;
83 canvasWidth =wFront ;
84 canvasHeight = hFront;
85 zoominit1= 0+' '+0+' '+wFront+' '+hFront;
86 zoominit = viewBox;
87 zoominit2 = zoominit1;
88
89
90 proporx = 1;
91 propory = 1;
92
93 }
94 if(proporCanvas<proporImage)
95 {
96 var proportion= wFront/hFront;
97 //var image_proportion= width/height;
98 var image_proportion= w/h;
99 var W=hFront*image_proportion;
100 var leftover=(wFront-W)/2;
101
102 this.container.style.width =W+'px';
103 this.container.style.height =hFront+'px';
104 this.container.style.left =leftover+'px'
105 this.container.style.top =0+'px'
106 //alert('Horizontal '+wFront+','+hFront+' '+image_proportion+' '+W+' '+leftover+' ____'+ this.container.style.width)
107 canvasLeft = leftover;
108 canvasTop = 0;
109 canvasWidth =W ;
110 canvasHeight = hFront;
111 zoominit1= viewBox;//leftover+' '+0+' '+W+' '+hFront;
112 zoominit1=0+' '+0+' '+W+' '+hFront;
113 zoominit = viewBox;
114 zoominit2 = zoominit1;
115
116
117 proporx = W/w;
118 propory = hFront/h;
119
120
121 }
122 if(proporCanvas>proporImage)
123 {
124 var proportion= hFront/wFront;
125 //var image_proportion= width/height;
126 var image_proportion= h/w;
127 var H=wFront*image_proportion;
128 var leftover=(hFront-H)/2;
129
130 this.container.style.width =wFront+'px';
131 this.container.style.height =H+'px';
132 this.container.style.left =0+'px'
133 this.container.style.top =leftover+'px'
134
135 canvasLeft = 0;
136 canvasTop = leftover;
137 canvasWidth = wFront;
138 canvasHeight = H;
139 //zoominit1 = 0+' '+leftover+' '+wFront+' '+H;
140 zoominit1 = 0+' '+0+' '+wFront+' '+H;
141 zoominit = viewBox;
142 zoominit2 = viewBox;//zoominit1;
143
144 proporx = wFront/w;
145 propory = H/h;
146
147 }
148 // proporx = width/tokens[2];
149 //propory = height/tokens[2];
150
151
152
153 }
154 if(viewMode=='canvas')
155 {
156 this.container.style.left = 0 + 'px';
157 this.container.style.top = 0 + 'px';
158 this.container.style.width = wFront + 'px';
159 this.container.style.height = hFront + 'px';
160
161 // margins 10%
162 var percent=10;
163 var percentX = wImage / percent;
164 var percentY = hImage / percent;
165 var cornerNEx = parseFloat(tokens[0])-percentX;
166 var cornerNEy = parseFloat(tokens[1])-percentY;
167 var percentRectW=wImage + percentX*2;
168 var percentRectH=hImage + percentY*2;
169
170 document.title= initialFile +' '+wImage+' x '+hImage;
171 // ajust proporImage to proporCanvas
172 if(proporCanvas==proporImage)
173 {
174 cornerNEx = parseFloat(tokens[0])-percentX
175 cornerNEy = parseFloat(tokens[1])-percentY
176 var wi=percentRectW;
177 var he=percentRectH;//hImage+percentY+addHimage;
178 zoominit=viewBox;
179 zoominit1 = (-percentX) +' '+(-percentY)+' '+wi+' '+he;
180 proporx =(w*(100-percent*2)/100)/w;
181 propory =( h*(100-percent*2)/100)/h;
182 zoominit2=zoominit1;
183 tokensZoom=tokensCanvas;//viewBox.split(' '); ;//zoominit1.split(' ');
184
185 }
186
187 if(proporCanvas<proporImage)
188 {
189
190 // add to hImage
191 var newWimage = percentRectW * ((wCanvas * percentRectH) / (hCanvas * percentRectW)) ;//newRectH *
192 var diffImages=newWimage-w;
193 cornerNEx = parseFloat(tokens[0]) - (diffImages / 2);
194 var wi=newWimage;
195 var he=percentRectH;//hImage+percentY+addHimage;
196 zoominit=viewBox;
197 //zoominit1 = cornerNEx+' '+cornerNEy+' '+wi+' '+he;
198 //zoominit1 = (-percentX) +' '+(-percentY)+' '+wi+' '+he;
199 proporx =wFront/wi;
200 propory = wFront/wi;
201 var invPropor =wi/ wFront;
202 zoominit1 = (proporx*cornerNEx) +' '+(propory*cornerNEy)+' '+wi+' '+he;
203 zoominit2=zoominit1;
204 var tZ = (invPropor*cornerNEx) +' '+(invPropor*cornerNEy)+' '+wi+' '+he;
205
206
207 tokensZoom=tokensCanvas;//tZ.split(' ');//viewBox.split(' '); ;//zoominit1.split(' ');
208 }
209 if(proporCanvas>proporImage)
210 {
211 // add to hImage
212 var newHimage = percentRectH * ((hCanvas * percentRectW) / (wCanvas * percentRectH)) ;//newRectH *
213 var diffImages=newHimage-h;
214 cornerNEy = parseFloat(tokens[1]) - (diffImages / 2);
215 var wi=percentRectW;
216 var he=newHimage;//hImage+percentY+addHimage;
217 zoominit=viewBox;
218 proporx =wFront/wi;
219 propory = wFront/wi;
220
221 zoominit1 = (proporx*cornerNEx) +' '+(propory*cornerNEy)+' '+wi+' '+he;
222 zoominit2=zoominit1;
223 tokensZoom=zoominit1.split(' ');
224
225 }
226
227
228 }
229 }
230
231
232
233 VMLRenderer.prototype.zoomFrame = function(zoom){
234 myOPF.viewBox=zoom;
235 load(myOPF,c);
236 document.getElementById("source").value=myOPF.toJSONString();
237 }
238 VMLRenderer.prototype.rectDoc = function(viewBox) {
239 var tokens2 = zoominit2.split(' ');
240 var tokens = zoominit.split(' ');
241 var shape = document.getElementById('rectDoc');
242 if (shape) {
243 this.remove(shape);
244 }
245 var rect=this.container.ownerDocument.createElement('v:rect');
246 rect.id='rectDoc';
247 rect.style.position = 'absolute';
248 rect.style.left =-parseInt(tokens2[0]);
249 rect.style.top = -parseInt(tokens2[1]);
250 rect.style.width = parseInt(tokens[2]);
251 rect.style.height = parseInt(tokens[3]);
252 rect.setAttribute('filled', 'false');
253 rect.setAttribute('stroked', 'true');
254 rect.setAttribute('strokeweight', 2);
255 rect.setAttribute('strokecolor',"#ff0000");
256 //this.container.appendChild(rect);
257 //this.container.insertBefore(rect, this.container.firstChild );
258 //alert(docx+' '+docy+' '+docw+' '+doch+' '+viewBox)
259 }
260 VMLRenderer.prototype.rectCanvas = function(docx,docy,docw,doch,viewBox) {
261
262 var tokens = zoominit1.split(' ');
263 var shape = document.getElementById('rectCanvas');
264 if (shape) {
265 this.remove(shape);
266 }
267
268 var rect=this.container.ownerDocument.createElement('v:rect');
269 rect.id='rectBackground';
270 rect.style.position = 'absolute';
271 rect.style.left = tokens[0] ;
272 rect.style.top =tokens[1];
273 rect.style.width=tokens[2];
274 rect.style.height= tokens[3] ;
275 rect.setAttribute('filled', 'true');
276 rect.setAttribute('fillcolor',"#666666");
277 rect.setAttribute('stroked', 'false');
278
279 this.container.insertBefore(rect, this.container.firstChild );
280
281 }
282
283 VMLRenderer.prototype.removeAll = function(){
284 while (this.container.hasChildNodes()) {
285 this.container.removeChild(this.container.firstChild);
286 }
287 }
288
289 function VMLviewBox(container,left,top,width,height){
290 var tokens = zoominit2.split(' ');
291 left *= proporx;
292 left = left - parseFloat(tokens[0]);
293 top *= propory;
294 top = top - parseFloat(tokens[1]);
295 width *= proporx;
296 height *= propory;
297
298 return {"x":parseFloat(Math.round(left)), "y":parseFloat(Math.round(top)), "w":parseFloat(Math.round(width)), "h":parseFloat(Math.round(height))};
299 }
300 function VMLviewBox1(container,left,top,width,height){
301 var tokens = zoominit2.split(' ');
302 left *= proporx;
303 left = left - parseFloat(tokens[0]);
304 top *= propory;
305 top = top - parseFloat(tokens[1]);
306 width *= proporx;
307 height *= propory;
308
309 return {"x":parseFloat(Math.round(left)), "y":parseFloat(Math.round(top)), "w":parseFloat(Math.round(width)), "h":parseFloat(Math.round(height))};
310 }
311
312 VMLRenderer.prototype.create = function(shape, fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, points, transform, parent) {
313 var tokens = zoominit2.split(' ');
314
315 var zoom=VMLviewBox(this.container,left,top,width,height);
316
317 left=zoom.x;
318 top=zoom.y;
319 width=zoom.w;
320 height=zoom.h;
321
322 var zoom=VMLviewBox(this.container,left,top,textSize,textSize);
323 //if(zoom.w<1){zoom.w=1}
324 if(zoom.y== undefined){left=0}
325 if(zoom.x== undefined){top=0}
326 if(zoom.w== undefined){width=0}
327 if(zoom.h== undefined){height=0}
328 textSize=zoom.h;
329
330 var zoom=VMLviewBox(this.container,left,top,lineWidth*2/3,lineWidth);
331 //if(zoom.w<1){zoom.w=1}
332 lineWidth=zoom.w;
333 var vml;
334 var shap=1;
335 if (shape == 'rect') {
336
337 vml = this.container.ownerDocument.createElement('v:rect');
338 vml.style.position = 'absolute';
339 vml.style.left = left;
340 vml.style.top = top;
341 vml.style.width = width;
342 vml.style.height = height;
343 }
344 else if (shape == 'roundrect') {
345 vml = this.container.ownerDocument.createElement('v:roundrect');
346 vml.style.position = 'absolute';
347 vml.style.left = left;
348 vml.style.top = top;
349 vml.style.width = width;
350 vml.style.height = height;
351 vml.setAttribute('arcsize', '20%');
352
353 }
354 else if (shape == 'ellipse') {
355 vml = this.container.ownerDocument.createElement('v:oval');
356 vml.style.left = left;
357 vml.style.top = top;
358 vml.style.width = width;
359 vml.style.height = height;
360 vml.style.position = 'absolute';
361 }
362 else if (shape == 'line') {
363
364 vml = this.container.ownerDocument.createElement('v:line');
365 vml.setAttribute('from', left + 'px,' + top + 'px');
366 vml.setAttribute('to', (left+width) + 'px,' + (top+height) + 'px');
367
368 }
369 else if (shape == 'polyline') {
370 vml = this.container.ownerDocument.createElement('v:polyline');
371 vml.setAttribute("points", points);
372
373 }
374 else if (shape == 'path')
375 {
376 vml = this.container.ownerDocument.createElement('v:shape');
377 var tokens = zoominit1.split(' ');
378 var tokens1 = zoominit1.split(' ');
379 var tokens2 = zoominit2.split(' ');
380 tokens[0]=0;
381 tokens[1]=0;
382 var path=points;
383 path=path.replace(/, /g, ',');
384 path=path.replace(/ ,/g, ',');
385 var ps =path.split(" ")
386 var pcc = "";
387
388 var re = /^[-]?\d*\.?\d*$/;
389 var contArc=0;
390 var isArc=false;
391 for(var i = 0; i < ps.length; i++)
392 {
393 if(ps[i].indexOf(',')>0){
394
395 var point =ps[i].split(",");
396 var char1=point[0].substring(0,1);
397
398 if (!char1.match(re))
399 {
400 var num0prev= parseFloat(point[0].substring(1));
401 var zoom=VMLviewBox(this.container,num0prev*1+(parseInt(tokens2[0])*0),0,parseInt(tokens2[2]),parseInt(tokens2[3]));
402 num0=zoom.x;
403
404 var text=char1;
405 }else{
406 var num0prev= parseFloat(point[0]);
407 var zoom=VMLviewBox(this.container,num0prev*1+(parseInt(tokens2[0])*0),0,parseInt(tokens2[2]),parseInt(tokens2[3]));
408 num0=zoom.x;
409
410 }
411 point[1]= parseFloat(point[1]);
412 var zoom=VMLviewBox(this.container,0,point[1],parseInt(tokens2[2]),parseInt(tokens2[3]));
413 point[1]=zoom.y;
414 var cx=num0+parseInt(tokens2[0]);
415 var cy=point[1]+parseInt(tokens2[1]);
416 pcc+=text+cx+','+cy+' ';
417 }
418 else
419 {
420 pcc+=ps[i]+' ';
421 }
422
423 }
424 ////////////////////
425 var thispath=pcc;
426 thispath=thispath.replace(/M/g,'m');
427 thispath=thispath.replace(/C/g,'c');
428 thispath=thispath.replace(/L/g,'l');
429 thispath=thispath.replace(/z/g,'x');
430
431 //document.getElementById('source').value=points+'\r\n'+thispath +'\r\n'+'________'+'\r\n'
432 var zoom=VMLviewBox(this.container,tokens[0],tokens[1],tokens[2],tokens[3]);
433
434 vml.style.position="absolute";
435 vml.style.width= zoom.w+"px";
436 vml.style.height=zoom.h+"px";
437 vml.style.left=zoom.x+"px";
438 vml.style.top=zoom.y+"px";
439 vml.setAttribute('coordsize', zoom.w+','+zoom.h);
440
441 var path01 = this.container.ownerDocument.createElement('v:path');
442 path01.setAttribute("v", thispath+' e');
443
444
445
446 vml.appendChild(path01)
447
448 }
449
450 else if (shape == 'controlpath')
451 {
452
453 vml = this.container.ownerDocument.createElement('v:shape');
454 vml.style.position="absolute";
455 vml.style.width= 700+"px";
456 vml.style.height=500+"px";
457 vml.style.left=left+"px";
458 vml.style.top=top+"px";
459 vml.setAttribute('coordsize', '700,500');
460
461 var path01 = this.container.ownerDocument.createElement('v:path');
462 path01.setAttribute('v', 'm '+left+','+top+' c'+(left+1)+','+(top+1)+' e ');
463
464 vml.appendChild(path01)
465 }
466 else if (shape == 'image') {
467 var data =imageHref;//document.forms[0].option_text_message.value;
468 vml = this.container.ownerDocument.createElement('v:image');
469 vml.setAttribute('src',imageHref);
470 vml.style.position="absolute";
471 vml.style.width=width+"px";
472 vml.style.height=height+"px";
473 vml.style.left=left+"px";
474 vml.style.top=top+"px";
475 vml.style.margin=0+"px";
476 vml.style.padding=0+"px";
477 if (fillColor != '' || fillColor != 'none') {
478 vml.setAttribute('filled', 'false');
479 vml.setAttribute('fillcolor', fillColor);
480 }
481 else {
482 vml.setAttribute('filled', 'false');
483 }
484 vml.setAttribute('strokeweight','0px');// parseFloat(lineWidth)+'px');
485 vml.setAttribute('stroked', 'false');
486 vml.setAttribute('strokecolor','#000000');//lineColor);
487
488
489 }
490
491 else if (shape == 'text')
492 {
493
494 var data =textMessaje;
495 vml = this.container.ownerDocument.createElement('v:shape');
496 vml.style.position="absolute";
497 //vml.setAttribute('coordorigin',left+', '+top);
498 //vml.style.coorsize= '';
499 coordorigin="0, 0"
500
501 var ts=isNaN(textSize)
502 if(ts==true){
503 textSize=10;
504 }
505 vml.style.width= textSize+'px';//tokens[2]+'px'
506 vml.style.height=textSize+'px';
507 vml.style.left=(left+"px");
508 vml.style.top=(top-(textSize*1/4)+"px");
509 vml.style.margin=0+"px";
510 vml.style.padding=0+"px";
511 vml.setAttribute('path','m '+0+' '+0+' r '+(textSize*data.length)+' '+0+' e');
512 var textPathObj = this.container.ownerDocument.createElement("v:textpath");
513 textPathObj.setAttribute('string', data);
514 textPathObj.setAttribute('fitshape','false');
515 textPathObj.setAttribute('trim', 'false');
516 textPathObj.setAttribute('fitpath', 'false');
517 textPathObj.setAttribute('on','true');
518 textPathObj.style.fontFamily=textFamily;
519 textPathObj.style.fontSize=textSize+'px';
520 textPathObj.setAttribute('vTextKern','true');
521 textPathObj.setAttribute('text-align','center');
522
523 var pathObj = this.container.ownerDocument.createElement("v:path");
524 pathObj.setAttribute('textpathok', 'true');
525 vml.appendChild(textPathObj);
526 vml.appendChild(pathObj);
527
528
529 }
530
531
532
533 else if (shape == 'texto')
534 {
535 vml = this.container.ownerDocument.createElement('v:shape');
536 vml.style.position="absolute";
537
538 vml.style.coordsize=1000+', '+1000;
539 vml.style.width= 1000;
540 vml.style.height=1000;
541 vml.style.left=left;
542 vml.style.top=top-parseFloat(textSize);
543
544 vml.style.padding=0;
545 var textBox = this.container.ownerDocument.createElement("v:textbox");
546 textBox.setAttribute('mso-rotate-with-shape',true)
547 var divtext = this.container.ownerDocument.createElement("div");
548 divtext.style.coordorigin=0+', '+(0);
549 divtext.style.margin=0;
550 divtext.style.fontFamily=textFamily;
551 divtext.style.margin=0;
552 divtext.style.padding=0;
553 divtext.style.vRotateLetters=true;
554 divtext.style.fontSize=parseFloat(textSize);
555
556
557
558
559
560
561 divtext.style.color=fillColor;
562
563
564
565
566
567 //divtext.setAttribute('v-rotate-letters','true');
568 if(transform.indexOf('rotate')>=0)
569 {
570
571 myRotate1=transform.split('rotate(');
572 myRotate2=myRotate1[1].split(')');
573 myRotate3=myRotate2[0].split(',');
574
575 //divtext.setAttribute('mso-rotate',myRotate3[0]);
576 //textBox.style.msoRotate= myRotate3[0];
577 //textBox.style.centerX=myRotate3[1];
578 //textBox.style.centerY=myRotate3[2];
579 //vml.style.rotation= myRotate3[0];
580 //vml.style.centerX=myRotate3[1];
581 //vml.style.centerY=myRotate3[2];
582 vml.setAttribute('rotation',myRotate3[0]+'Deg');
583 }
584
585 divtext.innerHTML=textMessaje;
586 textBox.appendChild(divtext);
587
588 vml.appendChild(textBox);
589
590 }
591 else if (shape == 'defs') {
592 var vml;
593
594 }
595
596 else if (shape == 'group') {
597 vml = this.container.ownerDocument.createElement('v:group');
598 vml.style.left=left+"px";
599 vml.style.top=top+"px";
600 }
601
602 if(shape == 'zoom' || shape == 'defs')
603 {
604
605 }else
606 {
607 if(transform.indexOf('rotate')>=0)
608 {
609 myRotate1=transform.split('rotate(');
610 myRotate2=myRotate1[1].split(')');
611 myRotate3=myRotate2[0].split(',');
612
613 vml.style.rotation= myRotate3[0]+'Deg';
614 vml.style.centerX=myRotate3[1];
615 vml.style.centerY=myRotate3[2];
616
617 }
618
619 if(shape != 'image' )
620 {
621 if (lineColor.length == 0){lineColor = 'none';}
622 if (fillColor.length == 0){fillColor = 'none';}
623 (fillColor!=''|| fillColor!=null )?vml.setAttribute('fillcolor', fillColor):vml.setAttribute('filled', 'true');
624
625 if (fillColor != '' || fillColor != 'none' )
626 {
627 vml.setAttribute('filled', 'true');
628 vml.setAttribute('fillcolor', fillColor);
629
630 }
631 else
632 {
633 vml.setAttribute('filled', 'false');
634 }
635
636
637 if(lineWidth==0 || lineWidth=='none' || lineColor== 'none' )
638 {
639 vml.setAttribute('stroked', 'false');
640 }
641 else
642 {
643 //if(isNaN(lineColor)==false){alert('-'+lineColor+'-');lineColor='#000000';lineWidth=1;}
644 vml.setAttribute('stroked', 'true');
645 vml.setAttribute('strokecolor', lineColor);
646 vml.setAttribute('strokeweight', lineWidth);
647 var stroke = this.container.ownerDocument.createElement('v:stroke');
648 stroke.setAttribute("opacity", parseFloat(lineOpac));
649 vml.appendChild(stroke);
650
651 }
652
653 if (fillOpac != '')
654 {
655 if (fillOpac == 'none' || fillColor=='none'){fillOpac=0;}
656 var fill = this.container.ownerDocument.createElement('v:fill');
657 fill.setAttribute("opacity",parseFloat(fillOpac));
658 //alert(fillOpac)
659 vml.appendChild(fill);
660 }
661 }
662 }
663 if(parent==''){
664 if(vml){
665 this.container.appendChild(vml);}
666 }else{
667 if(document.getElementById(parent)){
668 var parentShape = document.getElementById(parent);
669 if(vml||vml!=null ){
670 parentShape.appendChild(vml);
671 }
672 }
673 }
674 //var parentDoc = document.getElementById('mydraw');
675 //parentDoc.appendChild(vml);
676 return vml;
677 };
678
679 VMLRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) {
680 var deltaX = toX - fromX;
681 var deltaY = toY - fromY;
682 if (shape.tagName == 'rect' )
683 {
684
685
686 if (deltaX < 0) {
687 shape.style.left=toX + 'px';
688 shape.style.width=-deltaX + 'px';
689 }
690 else
691 {
692 shape.style.width= deltaX + 'px';
693 }
694
695 if (deltaY < 0)
696 {
697 shape.style.top=toY + 'px';
698 shape.style.height=-deltaY + 'px';
699 }
700 else
701 {
702 shape.style.height=deltaY + 'px';
703 }
704 }
705 }
706 VMLRenderer.prototype.duplicate = function(shape)
707 {
708 var vml;
709 vml =shape.cloneNode(false);
710 //vml.setAttribute('fillcolor', "#aa00aa");
711 vml.setAttribute('filled', "false");
712 this.container.appendChild(vml);
713 return vml;
714
715 };
716 VMLRenderer.prototype.querySelected = function(shape,centerx,centery,width,height)
717 {
718 var result = true;
719 var shapes='names: group, image, rect, path, ellipse, circle, text, line, ';
720
721 //if(shape.getBBox && shape)
722 if( shapes.indexOf(' '+shape.tagName+',')>0)
723 {
724
725 var box = this.bounds(shape);
726 }else
727 {
728 return false;
729 }
730 var p1x = box.x;
731 if(Math.abs(p1x-centerx)>width){result = false}
732
733 var p1y = box.y;
734 if(Math.abs(p1y-centery)>height){result = false}
735
736 var p2x = box.x+box.width;
737 if(Math.abs(p2x-centerx)>width){result = false}
738
739 var p2y = box.y;
740 if(Math.abs(p2y-centery)>height){result = false}
741
742 var p3x = box.x+box.width;
743 if(Math.abs(p3x-centerx)>width){result = false}
744
745 var p3y = box.y+box.height;
746 if(Math.abs(p3y-centery)>height){result = false}
747
748 var p4x = box.x;
749 if(Math.abs(p4x-centerx)>width){result = false}
750
751 var p4y = box.y+box.height;
752 if(Math.abs(p4y-centery)>height){result = false}
753
754 if(result)
755 {
756 return { 'in':result, 'cornersx': p1x+','+p2x+','+p3x+','+p4x+',' ,'cornersy': p1y+','+p2y+','+p3y+','+p4y+',' };
757 }
758 else
759 {
760 return { 'in':result }
761 }
762 //center.distanceFrom(point1);
763
764
765 }
766
767 VMLRenderer.prototype.searchBoxes = function()
768 {
769 var base = this.container;
770
771 var NumNodes = base.childNodes.length;
772 var chain= '';
773 for(i = 0;i < NumNodes;i++)
774 {
775 if (this.bounds(base.childNodes[i]))
776 {
777 chain+=base.childNodes[i].id + ';'
778 }
779 }
780 chain+=''
781 return chain;
782
783 }
784
785 VMLRenderer.prototype.DrawBorder= function(numNode, targetElement )
786 {
787 var shapes='names: group, image, rect, path, ellipse, circle, text, line, ';
788
789 //if(shape.getBBox && shape)
790 if( shapes.indexOf(' '+targetElement.tagName+',')>0)
791 {
792 var bbox = this.bounds(targetElement);
793
794 var outline = this.container.ownerDocument.createElement('v:rect');
795 outline.setAttribute('x', bbox.x - 2 );
796 outline.setAttribute('y', bbox.y - 2 );
797 outline.setAttribute('width', bbox.width + 4 );
798 outline.setAttribute('height', bbox.height + 4 );
799 outline.setAttribute('stroke', '#ff00ff' );
800 outline.setAttribute('fill', 'none' );
801 outline.setAttribute('id', 'shapeBoxed'+numNode );
802
803 targetElement.parentNode.insertBefore( outline, targetElement );
804 return 'shapeBoxed'+numNode;
805 }
806 else
807 {
808 return false
809 }
810 }
811
812
813 VMLRenderer.prototype.getMarkup = function() {
814
815 //return this.container.parentNode.innerHTML;
816 return this.container.innerHTML;
817 }
818
819 VMLRenderer.prototype.remove = function(shape) {
820 if(shape!=null){ shape.removeNode(true); }
821 }
822
823 VMLRenderer.prototype.removeAll = function() {
824 while( this.container.hasChildNodes () ){
825 this.container.removeChild( this.container.firstChild );
826 //this.container.removeNode( this.container.firstChild );
827 }
828 }
829
830 VMLRenderer.prototype.editCommand = function(shape, cmd, value)
831 {
832 if (shape != null) {
833 if (cmd == 'fillcolor') {
834 if (value == '' || value =='none')
835 shape.style.fill='none';
836 else
837 shape.style.fill=value;
838 }
839 else if (cmd == 'linecolor') {
840 if (value != '')
841 shape.style.stroke=value;
842 else
843 shape.style.stroke='none';
844 }
845 else if (cmd == 'linewidth') {
846 if( value=='none' || value=='')
847 {
848 shape.style.strokeWidth=0;
849 }else{
850 shape.style.strokeWidth=parseInt(value) + 'px';
851 }
852 }
853 else if (cmd == 'fillopacity') {
854 if(shape.tagName=='image')
855 {
856 shape.style.opacity=parseFloat(value);
857 }
858 else
859 {
860 shape.style.fillOpacity=parseFloat(value);
861 }
862
863 }
864 else if (cmd == 'lineopacity') {
865
866 shape.style.strokeOpacity=parseFloat(value);
867
868 }
869 else if (cmd == 'filter')
870 {
871 if (value != '')
872 {
873 //shape.style.setProperty("filter", value) ;
874 shape.style.filter=value;
875 //alert(value)
876 }
877 }
878 else if (cmd == 'textContent')
879 {
880 if (value != '')
881 {
882 shape.textContent=value;
883 }
884 }
885 else if (cmd == 'textSize')
886 {
887 if (value != '')
888 {
889 shape.style.fontSize=parseFloat(eval(value));
890 }
891 }
892 else if (cmd == 'textFamily')
893 {
894 if (value != '')
895 {
896 shape.style.fontFamily=value;
897 }
898 }
899 else if (cmd == 'textSpacing')
900 {
901 if (value != '')
902 {
903 shape.style.letterSpacing=''+value+'em';
904 //alert(value) //bad letter-spacing word-spacing
905 }
906 }
907 else if (cmd == 'textLength')
908 {
909 if (value != '')
910 {
911 //shape.style.=''+value+'';
912 shape.style.lengthAdjust='spacing';//spacing spacingAndGlyphs
913 //alert(value) //bad textLength
914 }
915 }
916
917
918 else if (cmd == 'textAnchor')
919 {
920 if (value != '')
921 {
922 shape.style.textAnchor=value;
923 }
924 }
925 else if (cmd == 'textWeight')
926 {
927 if (value != '')
928 {
929 shape.style.fontWeight=value;
930 }
931 }
932 else if (cmd == 'textStyle')
933 {
934 if (value != '')
935 {
936 shape.style.fontStyle=value;
937 }
938 }
939 else if (cmd == 'textDecoration')
940 {
941 if (value != '')
942 {
943 shape.style.textDecoration=value;
944 }
945 //alert(value) //bad textDecoration
946 }
947 else if (cmd == 'textMode')
948 {
949 if (value != '')
950 {
951 shape.style.writingMode=value;
952 }
953 }
954 else if (cmd == 'textDirection')
955 {
956 if (value != '')
957 {
958 shape.style.direction=value;
959 }
960 }
961 else if (cmd == 'textOrientation')
962 {
963 if (value != '')
964 {
965 shape.style.glyphOrientationVertical=value;
966 }
967 }
968 else if (cmd == 'stopcolor')
969 {
970 if (value != '')
971 {
972 shape.style.stopColor=value;
973 }
974 }
975 else if (cmd == 'linearGradient')
976 {
977 if (value != '')
978 {
979 shape.style.x1=value.x1;
980 shape.style.y1=value.y1;
981 shape.style.x2=value.x2;
982 shape.style.y2=value.y2;
983 }
984 }
985 else if (cmd == 'radialGradient')
986 {
987 if (value != '')
988 {
989 shape.style.x1=value.x1;
990 shape.style.y1=value.y1;
991 shape.style.x2=value.x2;
992 shape.style.y2=value.y2;
993 }
994 }
995 else if (cmd == 'leftTop')
996 {
997 if (value != '')
998 {
999 shape.style.left=parseInt(value.left)+'px';
1000 shape.style.top=parseInt(value.top)+'px';
1001
1002 }
1003 }
1004 else if (cmd == 'cxcy')
1005 {
1006 if (value != '')
1007 {
1008 shape.style.cx=value.cx;
1009 shape.style.cy=value.cy;
1010
1011 }
1012 }
1013
1014 }
1015 }
1016
1017
1018 VMLRenderer.prototype.queryCommand = function(shape, cmd)
1019 {
1020 var result = '';
1021
1022 if (shape != null) {
1023 if (cmd == 'fillcolor') {
1024 result = shape.style.fill;
1025 if (result == 'none')
1026 result = '';
1027 }
1028 else if (cmd == 'linecolor') {
1029 result = shape.style.stroke;
1030 if (result == 'none')
1031 result = '';
1032 }
1033 else if (cmd == 'linewidth') {
1034 result = shape.style.stroke;
1035 if (result == 'none')
1036 result = '';
1037 else
1038 result = shape.style.strokeWidth;
1039 }
1040 else if (cmd == 'fillopacity') {
1041 if(shape.tagName=='image')
1042 {
1043 result= shape.style.opacity;
1044 }
1045 else
1046 {
1047 result= shape.style.fillOpacity;
1048 }
1049
1050 }
1051 else if (cmd == 'lineopacity') {
1052
1053 result= shape.style.strokeOpacity;
1054
1055 }
1056 else if (cmd == 'text') {
1057 var text1=shape.textContent;
1058 var text2=shape.style.fontFamily;
1059 var text3=parseInt(shape.style.fontSize);
1060
1061 result= {"data":text1,"family":text2,"size":text3};
1062
1063 }
1064 else if (cmd == 'points') {
1065 result=shape.style,d;
1066
1067 }
1068 else if (cmd == 'stopcolor') {
1069 result=shape.style.stopColor
1070
1071 }
1072 else if (cmd == 'box') {
1073 result= this.bounds(shape);
1074
1075 }
1076 else if (cmd == 'linearGradient') {
1077 var x1=shape.style.x1;
1078 var y1=shape.style.y1;
1079 var x2=shape.style.x2;
1080 var y2=shape.style.y2;
1081 result= {"x1":x1,"y1":y1,"x2":x2,"y2":y2};
1082
1083 }
1084
1085
1086 }
1087
1088 return result;
1089 }
1090
1091 VMLRenderer.prototype.showTracker01 = function(shape) {
1092 var box = this.bounds(shape);
1093
1094 var tracker = document.getElementById('tracker');
1095 if (tracker) {
1096 this.remove(tracker);
1097 }
1098
1099 tracker = this.container.ownerDocument.createElement('v:rect');
1100 tracker.id = 'tracker';
1101 tracker.style.position = 'absolute';
1102 tracker.style.left = box.x - 10;
1103 tracker.style.top = box.y - 10;
1104 tracker.style.width = box.width + 20;
1105 tracker.style.height = box.height + 20;
1106 tracker.setAttribute('filled', 'false');
1107 tracker.setAttribute('stroked', 'true');
1108 tracker.setAttribute('strokecolor', 'blue');
1109 tracker.setAttribute('strokeweight', '1px');
1110 this.container.appendChild(tracker);
1111 }
1112
1113
1114 VMLRenderer.prototype.showTracker = function(shape) {
1115 var box = this.bounds(shape);
1116 //alert(box.width+' '+shape.id)
1117 var trshape = parseFloat(shape.getAttribute('rotation'));
1118 var tracker = document.getElementById('tracker');
1119
1120 if (tracker) {
1121 this.remove(tracker);
1122 }
1123
1124 if (shape.tagName == 'shape')
1125 {
1126 shap=2;
1127 if(shape.children[0].tagName == 'path')
1128 {
1129
1130 /* $('option_path_trx').value= box.x;
1131 $('option_path_try').value= box.y;
1132 $('option_path_sclx').value= box.width;
1133 $('option_path_scly').value= box.height;
1134 $('option_path_rot').value= shape.style.rotation;
1135 */
1136 //var path=shape.children[0].getAttribute('v');
1137 // $('control_codebase').value=path;
1138 }
1139 }
1140 if (shape.tagName == 'rect') {
1141 /*
1142 $('option_rect_rot').value= shape.getAttribute('rotation');
1143 $('option_rect_trx').value= box.x;
1144 $('option_rect_try').value= box.y;
1145 $('option_rect_sclx').value= box.width;
1146 $('option_rect_scly').value= box.height;
1147 */
1148 }
1149
1150 if (shape.tagName == 'image'){
1151 /* $('option_img_trx').value= box.x;
1152 $('option_img_try').value= box.y;
1153 $('option_img_sclx').value= box.width;
1154 $('option_img_scly').value= box.height;
1155 $('option_img_rot').value= T.b* (Math.PI * 2 / 360);
1156 */
1157 }
1158 if (shape.tagName == 'text'){
1159 /* f$('option_text_trx').value= box.x;
1160 $('option_text_try').value= box.y;
1161 $('option_text_sclx').value= box.width;
1162 $('option_text_scly').value= box.height;
1163 $('option_text_rot').value= T.b* (Math.PI * 2 / 360);
1164 */
1165 }
1166 if (shape.tagName == 'line'){
1167 /*
1168 $('option_line_trx').value= box.x;
1169 $('option_line_try').value= box.y;
1170 */
1171 }
1172 if (shape.tagName == 'oval'){
1173 /*$('option_ellipse_trx').value= putx;
1174 $('option_ellipse_try').value= puty;
1175 $('option_ellipse_sclx').value= box.width;
1176 $('option_ellipse_scly').value= box.height;
1177 $('option_ellipse_rot').value= T.b* (Math.PI * 2 / 360);
1178 */
1179 }
1180
1181
1182
1183 /*var matrix = shape.getScreenCTM();
1184 var trshape= shape.getAttribute('transform');
1185 var shap=1;
1186 if (shape.tagName == 'path') { shap=2;
1187
1188
1189
1190 }
1191 */
1192 //if (shape.getAttribute('transform') ) { shap=2; }
1193 //var svgNamespace = 'http://www.w3.org/2000/svg';
1194
1195 tracker = this.container.ownerDocument.createElement('v:group');
1196 tracker.id = 'tracker';
1197 //tracker.setAttribute('rotation',trshape);
1198 tracker.setAttribute('coordorigin','0, 0');
1199 //tracker.setAttribute('wrapcoords',true);
1200
1201
1202 tracker.setAttribute('coordsize',box.width+','+ box.height);
1203 tracker.style.position = 'absolute';
1204 tracker.style.left = box.x ;
1205 tracker.style.top = box.y;
1206 tracker.style.width = box.width ;
1207 tracker.style.height = box.height ;
1208
1209
1210 ////////////////
1211
1212
1213 var corners = [];
1214 var point = createPoint(box.x, box.y, box.width, box.height);
1215 //point = {x:box.x, y:box.y, width: box.width, height:box.height};
1216 //point = createPoint(box.x, box.y, box.width, box.height);
1217 //1
1218 corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) );
1219 point.x = box.x + box.width;
1220 point.y = box.y;
1221 //2
1222 corners.push( createPoint(box.x + box.width, box.y + box.height, box.width, box.height) );
1223 point.x = box.x + box.width;
1224 point.y = box.y + box.height;
1225 //3
1226 //corners.push( point.matrixTransform(matrix) );
1227 corners.push( createPoint(box.x , box.y + box.height, box.width, box.height) );
1228 point.x = box.x;
1229 point.y = box.y + box.height;
1230 //4
1231 corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) );
1232
1233 var max = createPoint(corners[0].x, corners[0].y);
1234 var min = createPoint(corners[0].x, corners[0].y);
1235
1236 for (var i = 1; i < corners.length; i++) {
1237 var x = corners[i].x;
1238 var y = corners[i].y;
1239 if (x < min.x) {
1240 min.x = x;
1241 }
1242 else if (x > max.x) {
1243 max.x = x;
1244 }
1245 if (y < min.y) {
1246 min.y = y;
1247 }
1248 else if (y > max.y) {
1249 max.y = y;
1250 }
1251 }
1252
1253
1254 var border_square = this.container.ownerDocument.createElement('v:rect');
1255
1256 border_square.style.position = 'relative';
1257 border_square.style.left = 0 - 10;
1258 border_square.style.top = 0 - 10;
1259 border_square.style.width = box.width + 20;
1260 border_square.style.height = box.height + 20;
1261 border_square.setAttribute('filled', 'false');
1262 border_square.setAttribute('stroked', 'true');
1263 border_square.setAttribute('strokecolor', 'blue');
1264 border_square.setAttribute('strokeweight', '1px');
1265
1266
1267 var border_angle = this.container.ownerDocument.createElement('v:polyline');
1268 border_angle.style.position = 'relative';
1269
1270 border_angle.setAttribute('filled', 'false');
1271 border_angle.setAttribute('stroked', 'true');
1272 border_angle.setAttribute('strokecolor', 'blue');
1273 border_angle.setAttribute('strokeweight', '1px');
1274 border_angle.setAttribute("points", (box.width+10)+","+((box.height/2))+", "+(box.width+10+25)+","+((box.height/2)) );
1275
1276
1277 var circle1 = this.container.ownerDocument.createElement('v:oval');
1278 circle1.style.position = 'relative';
1279 circle1.style.left = ( (box.width+40)-5);
1280 circle1.style.top = ( (box.height / 2) -5);
1281 circle1.style.width = (10);
1282 circle1.style.height = (10);
1283 circle1.setAttribute('filled', 'true');
1284 circle1.setAttribute('stroked', 'true');
1285 circle1.setAttribute('fillcolor', '#ffffff');
1286 circle1.setAttribute('strokecolor', 'green');
1287 circle1.setAttribute('strokeweight', '1px');
1288
1289
1290 var rect1 = this.container.ownerDocument.createElement('v:rect');
1291 rect1.style.position = 'relative';
1292 rect1.style.left = - 10-5;
1293 rect1.style.top = - 10-5;
1294 rect1.style.width = 10;
1295 rect1.style.height = 10;
1296 rect1.setAttribute('filled', 'true');
1297 rect1.setAttribute('stroked', 'true');
1298 rect1.setAttribute('fillcolor', '#ffffff');
1299 rect1.setAttribute('strokecolor', 'green');
1300 rect1.setAttribute('strokeweight', '1px');
1301
1302
1303 var rect2 = this.container.ownerDocument.createElement('v:rect');
1304 rect2.style.position = 'relative';
1305 rect2.style.left = box.width +5;
1306 rect2.style.top = -10 -5;
1307 rect2.style.width = 10;
1308 rect2.style.height = 10;
1309 rect2.setAttribute('filled', 'true');
1310 rect2.setAttribute('stroked', 'true');
1311 rect2.setAttribute('fillcolor', '#ffffff');
1312 rect2.setAttribute('strokecolor', 'green');
1313 rect2.setAttribute('strokeweight', '1px');
1314
1315
1316 var rect3 = this.container.ownerDocument.createElement('v:rect');
1317 rect3.style.position = 'relative';
1318 rect3.style.left = box.width+5;
1319 rect3.style.top = box.height+5;
1320 rect3.style.width = 10;
1321 rect3.style.height = 10;
1322 rect3.setAttribute('filled', 'true');
1323 rect3.setAttribute('stroked', 'true');
1324 rect3.setAttribute('fillcolor', '#ffffff');
1325 rect3.setAttribute('strokecolor', 'green');
1326 rect3.setAttribute('strokeweight', '1px');
1327
1328 var rect4 = this.container.ownerDocument.createElement('v:rect');
1329 rect4.style.position = 'relative';
1330 rect4.style.left = -10-5;
1331 rect4.style.top = box.height+5;
1332 rect4.style.width = 10;
1333 rect4.style.height = 10;
1334 rect4.setAttribute('filled', 'true');
1335 rect4.setAttribute('stroked', 'true');
1336 rect4.setAttribute('fillcolor', '#ffffff');
1337 rect4.setAttribute('strokecolor', 'green');
1338 rect4.setAttribute('strokeweight', '1px');
1339
1340
1341
1342 var rectmid12 = this.container.ownerDocument.createElement('v:rect');
1343 rectmid12.style.position = 'relative';
1344 rectmid12.style.left = (box.width/2) -5;
1345 rectmid12.style.top =- 10-5;
1346 rectmid12.style.width = 10;
1347 rectmid12.style.height = 10;
1348 rectmid12.setAttribute('filled', 'true');
1349 rectmid12.setAttribute('stroked', 'true');
1350 rectmid12.setAttribute('fillcolor', '#ffffff');
1351 rectmid12.setAttribute('strokecolor', 'green');
1352 rectmid12.setAttribute('strokeweight', '1px');
1353
1354 var rectmid23 = this.container.ownerDocument.createElement('v:rect');
1355 rectmid23.style.position = 'relative';
1356 rectmid23.style.left = box.width +5;
1357 rectmid23.style.top = (box.height/2)-5;
1358 rectmid23.style.width = 10;
1359 rectmid23.style.height = 10;
1360 rectmid23.setAttribute('filled', 'true');
1361 rectmid23.setAttribute('stroked', 'true');
1362 rectmid23.setAttribute('fillcolor', '#ffffff');
1363 rectmid23.setAttribute('strokecolor', 'green');
1364 rectmid23.setAttribute('strokeweight', '1px');
1365
1366 var rectmid34 = this.container.ownerDocument.createElement('v:rect');
1367 rectmid34.style.position = 'relative';
1368 rectmid34.style.left = (box.width/2)-5;
1369 rectmid34.style.top = box.height+5;
1370 rectmid34.style.width = 10;
1371 rectmid34.style.height = 10;
1372 rectmid34.setAttribute('filled', 'true');
1373 rectmid34.setAttribute('stroked', 'true');
1374 rectmid34.setAttribute('fillcolor', '#ffffff');
1375 rectmid34.setAttribute('strokecolor', '#000000');
1376 rectmid34.setAttribute('strokeweight', '1px');
1377
1378
1379 var rectmid41 = this.container.ownerDocument.createElement('v:rect');
1380 rectmid41.style.position = 'relative';
1381 rectmid41.style.left = -10-5 ;
1382 rectmid41.style.top =(box.height/2)-5;
1383 rectmid41.style.width = 10;
1384 rectmid41.style.height = 10;
1385 rectmid41.setAttribute('filled', 'true');
1386 rectmid41.setAttribute('stroked', 'true');
1387 rectmid41.setAttribute('fillcolor', '#ffffff');
1388 rectmid41.setAttribute('strokecolor', 'green');
1389 rectmid41.setAttribute('strokeweight', '1px');
1390
1391
1392
1393
1394 var colorin="#ff0000";
1395 var colorout="#ffffff"
1396
1397 circle1.attachEvent("onmouseover", function(event) {circle1.style.cursor= 's-resize'; circle1.setAttribute('fillcolor', colorin ); typeTransform='Rotate'; scaleType='nw'; }, false);
1398 circle1.attachEvent("onmouseout", function(event) {circle1.style.cursor= 'default'; circle1.setAttribute('fillcolor', colorout ); typeTransform='Rotate'; }, false); //typeTransform='rotate'
1399
1400
1401 rect1.attachEvent("onmouseover", function(event) {rect1.style.cursor= 'nw-resize'; rect1.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='nw'; }, false);
1402 rect1.attachEvent("onmouseout", function(event) {rect1.style.cursor= 'default'; rect1.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false); //typeTransform='rotate'
1403
1404 rect2.attachEvent("onmouseover", function(event) {rect2.style.cursor= 'ne-resize'; rect2.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='ne';}, false);
1405 rect2.attachEvent("onmouseout", function(event) {rect2.style.cursor= 'default'; rect2.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1406
1407 rect3.attachEvent("onmouseover", function(event) {rect3.style.cursor= 'se-resize'; rect3.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='se';}, false);
1408 rect3.attachEvent("onmouseout", function(event) {rect3.style.cursor= 'default'; rect3.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1409
1410 rect4.attachEvent("onmouseover", function(event) {rect4.style.cursor= 'sw-resize'; rect4.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='sw';}, false);
1411 rect4.attachEvent("onmouseout", function(event) {rect4.style.cursor= 'default'; rect4.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1412
1413 rectmid12.attachEvent("onmouseover", function(event) {rectmid12.style.cursor= 'n-resize'; rectmid12.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='n';}, false);
1414 rectmid12.attachEvent("onmouseout", function(event) {rectmid12.style.cursor= 'default'; rectmid12.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1415
1416 rectmid23.attachEvent("onmouseover", function(event) {rectmid23.style.cursor= 'e-resize'; rectmid23.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='e';}, false);
1417 rectmid23.attachEvent("onmouseout", function(event) {rectmid23.style.cursor= 'default'; rectmid23.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1418
1419 rectmid34.attachEvent("onmouseover", function(event) {rectmid34.style.cursor= 's-resize'; rectmid34.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='s';}, false);
1420 rectmid34.attachEvent("onmouseout", function(event) {rectmid34.style.cursor= 'default'; rectmid34.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1421
1422 rectmid41.attachEvent("onmouseover", function(event) {rectmid41.style.cursor= 'w-resize'; rectmid41.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='w'; }, false);
1423 rectmid41.attachEvent("onmouseout", function(event) {rectmid41.style.cursor= 'default'; rectmid41.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1424 //tracker.setAttribute('transform',trshape);
1425
1426
1427
1428 tracker.appendChild(border_square);
1429 tracker.appendChild(border_angle);
1430
1431 tracker.appendChild(circle1);
1432
1433 tracker.appendChild(rect1);
1434 tracker.appendChild(rect2);
1435 tracker.appendChild(rect3);
1436 tracker.appendChild(rect4);
1437 tracker.appendChild(rectmid12);
1438 tracker.appendChild(rectmid23);
1439 tracker.appendChild(rectmid34);
1440 tracker.appendChild(rectmid41);
1441
1442 /*
1443
1444
1445
1446 */
1447
1448 //alert(shape.id)
1449 this.container.appendChild(tracker);
1450
1451
1452
1453 }