Mercurial > laserkard

comparison onlypaths/js/vmlrendererPrev.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 -----------------------------------------------------------------------------
5 Created by Mark Finkle (mark.finkle@gmail.com)
6 Implementation of VML based renderer.
7 -----------------------------------------------------------------------------
8 Copyright (c) 2006 Mark Finkle
9
10 This program is free software; you can redistribute it and/or modify it
11 under the terms of the MIT License.
12
13 Permission is hereby granted, free of charge, to any person obtaining a
14 copy of this software and associated documentation files (the "Software"),
15 to deal in the Software without restriction, including without limitation
16 the rights to use, copy, modify, merge, publish, distribute, sublicense,
17 and/or sell copies of the Software, and to permit persons to whom the
18 Software is furnished to do so, subject to the following conditions:
19 The above copyright notice and this permission notice shall be included in
20 all copies or substantial portions of the Software.
21
22 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
23 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
24 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
25 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
26 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
27 FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
28 DEALINGS IN THE SOFTWARE.
29 -----------------------------------------------------------------------------
30 Dependencies:
31 History:
32 2006-04-05 | Created
33 --------------------------------------------------------------------------*/
34
35
36
37 function VMLRenderer() {
38 this.base = AbstractRenderer;
39 }
40
41
42 VMLRenderer.prototype = new AbstractRenderer;
43
44
45 VMLRenderer.prototype.init = function(elem)
46 {
47 this.container = elem;
48 // this.container.style.overflow = 'hidden';
49 this.container.unselectable = "on";
50 // Add VML includes and namespace
51 elem.ownerDocument.namespaces.add("v", "urn:schemas-microsoft-com:vml");
52 var style = elem.ownerDocument.createStyleSheet();
53 style.addRule('v\\:*', "behavior: url(#default#VML); display:inline-block");
54 //NOT VML biewBox
55 //http://blogs.msdn.com/ie/archive/2008/03/18/webbrowser-control-rendering-modes-in-ie8.aspx
56 }
57
58 var proporx=1;
59 var propory=1;
60
61 VMLRenderer.prototype.view = function(left,top,width,height,viewBox,bgcolor) {
62 var tokens = viewBox.split(' ');
63
64 var margin=100;
65 var wFront=parseInt(document.getElementById('FRONT').style.width)
66 var hFront=parseInt(document.getElementById('FRONT').style.height)
67 var tC=0 + ' ' + 0 + ' ' + wFront + ' ' + hFront;
68 tokensCanvas= tC.split(' ');
69
70 var w=parseFloat(tokens[2]);
71 var h=parseFloat(tokens[3]);
72 var wImage = w - parseFloat(tokens[0]);
73 var hImage = h - parseFloat(tokens[1]);
74 var wCanvas = wFront;
75 var hCanvas = hFront;
76 proporImage = hImage / wImage;
77 proporCanvas = hCanvas / wCanvas;
78
79 document.title= initialFile +' '+wImage+' x '+hImage;
80
81
82 if(bgcolor != '')
83 {
84 this.container.style.backgroundColor=bgcolor;
85 } else{
86 this.container.style.backgroundColor="#ffffff";
87 }
88 if(viewMode=='preview')
89 {
90 if(proporCanvas==proporImage)
91 {
92 this.container.style.width =wFront+'px';
93 this.container.style.height =hFront+'px';
94 this.container.style.left =0+'px'
95 this.container.style.top =0+'px'
96 canvasLeft = 0;
97 canvasTop = 0;
98 canvasWidth =wFront ;
99 canvasHeight = hFront;
100 zoominit1= 0+' '+0+' '+wFront+' '+hFront;
101 zoominit = viewBox;
102 zoominit2 = zoominit1;
103
104
105 proporx = 1;
106 propory = 1;
107
108 }
109 if(proporCanvas<proporImage)
110 {
111 var proportion= wFront/hFront;
112 //var image_proportion= width/height;
113 var image_proportion= w/h;
114 var W=hFront*image_proportion;
115 var leftover=(wFront-W)/2;
116
117 this.container.style.width =W+'px';
118 this.container.style.height =hFront+'px';
119 this.container.style.left =leftover+'px'
120 this.container.style.top =0+'px'
121 //alert('Horizontal '+wFront+','+hFront+' '+image_proportion+' '+W+' '+leftover+' ____'+ this.container.style.width)
122 canvasLeft = leftover;
123 canvasTop = 0;
124 canvasWidth =W ;
125 canvasHeight = hFront;
126 zoominit1= viewBox;//leftover+' '+0+' '+W+' '+hFront;
127 zoominit1=0+' '+0+' '+W+' '+hFront;
128 zoominit = viewBox;
129 zoominit2 = zoominit1;
130
131
132 proporx = W/w;
133 propory = hFront/h;
134
135
136 }
137 if(proporCanvas>proporImage)
138 {
139 var proportion= hFront/wFront;
140 //var image_proportion= width/height;
141 var image_proportion= h/w;
142 var H=wFront*image_proportion;
143 var leftover=(hFront-H)/2;
144
145 this.container.style.width =wFront+'px';
146 this.container.style.height =H+'px';
147 this.container.style.left =0+'px'
148 this.container.style.top =leftover+'px'
149
150 canvasLeft = 0;
151 canvasTop = leftover;
152 canvasWidth = wFront;
153 canvasHeight = H;
154 //zoominit1 = 0+' '+leftover+' '+wFront+' '+H;
155 zoominit1 = 0+' '+0+' '+wFront+' '+H;
156 zoominit = viewBox;
157 zoominit2 = viewBox;//zoominit1;
158
159 proporx = wFront/w;
160 propory = H/h;
161
162 }
163 // proporx = width/tokens[2];
164 //propory = height/tokens[2];
165
166
167
168 }
169 if(viewMode=='canvas')
170 {
171 this.container.style.left = 0 + 'px';
172 this.container.style.top = 0 + 'px';
173 this.container.style.width = wFront + 'px';
174 this.container.style.height = hFront + 'px';
175
176 // margins 10%
177 var percent=10;
178 var percentX = wImage / percent;
179 var percentY = hImage / percent;
180 var cornerNEx = parseFloat(tokens[0])-percentX;
181 var cornerNEy = parseFloat(tokens[1])-percentY;
182 var percentRectW=wImage + percentX*2;
183 var percentRectH=hImage + percentY*2;
184
185 document.title= initialFile +' '+wImage+' x '+hImage;
186 // ajust proporImage to proporCanvas
187 if(proporCanvas==proporImage)
188 {
189 cornerNEx = parseFloat(tokens[0])-percentX
190 cornerNEy = parseFloat(tokens[1])-percentY
191 var wi=percentRectW;
192 var he=percentRectH;//hImage+percentY+addHimage;
193 zoominit=viewBox;
194 zoominit1 = (-percentX) +' '+(-percentY)+' '+wi+' '+he;
195 proporx =(w*(100-percent*2)/100)/w;
196 propory =( h*(100-percent*2)/100)/h;
197 zoominit2=zoominit1;
198 tokensZoom=tokensCanvas;//viewBox.split(' '); ;//zoominit1.split(' ');
199
200 }
201
202 if(proporCanvas<proporImage)
203 {
204
205 // add to hImage
206 var newWimage = percentRectW * ((wCanvas * percentRectH) / (hCanvas * percentRectW)) ;//newRectH *
207 var diffImages=newWimage-w;
208 cornerNEx = parseFloat(tokens[0]) - (diffImages / 2);
209 var wi=newWimage;
210 var he=percentRectH;//hImage+percentY+addHimage;
211 zoominit=viewBox;
212 //zoominit1 = cornerNEx+' '+cornerNEy+' '+wi+' '+he;
213 //zoominit1 = (-percentX) +' '+(-percentY)+' '+wi+' '+he;
214 proporx =wFront/wi;
215 propory = wFront/wi;
216 var invPropor =wi/ wFront;
217 zoominit1 = (proporx*cornerNEx) +' '+(propory*cornerNEy)+' '+wi+' '+he;
218 zoominit2=zoominit1;
219 var tZ = (invPropor*cornerNEx) +' '+(invPropor*cornerNEy)+' '+wi+' '+he;
220
221
222 tokensZoom=tokensCanvas;//tZ.split(' ');//viewBox.split(' '); ;//zoominit1.split(' ');
223 }
224 if(proporCanvas>proporImage)
225 {
226 // add to hImage
227 var newHimage = percentRectH * ((hCanvas * percentRectW) / (wCanvas * percentRectH)) ;//newRectH *
228 var diffImages=newHimage-h;
229 cornerNEy = parseFloat(tokens[1]) - (diffImages / 2);
230 var wi=percentRectW;
231 var he=newHimage;//hImage+percentY+addHimage;
232 zoominit=viewBox;
233 proporx =wFront/wi;
234 propory = wFront/wi;
235
236 zoominit1 = (proporx*cornerNEx) +' '+(propory*cornerNEy)+' '+wi+' '+he;
237 zoominit2=zoominit1;
238 tokensZoom=zoominit1.split(' ');
239
240 }
241
242
243 }
244 }
245
246
247
248 VMLRenderer.prototype.zoomFrame = function(zoom){
249 myOPF.viewBox=zoom;
250 load(myOPF,c);
251 document.getElementById("source").value=myOPF.toJSONString();
252 }
253 VMLRenderer.prototype.rectDoc = function(viewBox) {
254 var tokens2 = zoominit2.split(' ');
255 var tokens = zoominit.split(' ');
256 var shape = document.getElementById('rectDoc');
257 if (shape) {
258 this.remove(shape);
259 }
260 var rect=this.container.ownerDocument.createElement('v:rect');
261 rect.id='rectDoc';
262 rect.style.position = 'absolute';
263 rect.style.left =-parseInt(tokens2[0]);
264 rect.style.top = -parseInt(tokens2[1]);
265 rect.style.width = parseInt(tokens[2]);
266 rect.style.height = parseInt(tokens[3]);
267 rect.setAttribute('filled', 'false');
268 rect.setAttribute('stroked', 'true');
269 rect.setAttribute('strokeweight', 2);
270 rect.setAttribute('strokecolor',"#ff0000");
271 //this.container.appendChild(rect);
272 //this.container.insertBefore(rect, this.container.firstChild );
273 //alert(docx+' '+docy+' '+docw+' '+doch+' '+viewBox)
274 }
275 VMLRenderer.prototype.rectCanvas = function(docx,docy,docw,doch,viewBox) {
276
277 var tokens = zoominit1.split(' ');
278 var shape = document.getElementById('rectCanvas');
279 if (shape) {
280 this.remove(shape);
281 }
282
283 var rect=this.container.ownerDocument.createElement('v:rect');
284 rect.id='rectBackground';
285 rect.style.position = 'absolute';
286 rect.style.left = tokens[0] ;
287 rect.style.top =tokens[1];
288 rect.style.width=tokens[2];
289 rect.style.height= tokens[3] ;
290 rect.setAttribute('filled', 'true');
291 rect.setAttribute('fillcolor',"#666666");
292 rect.setAttribute('stroked', 'false');
293
294 this.container.insertBefore(rect, this.container.firstChild );
295
296 }
297
298 VMLRenderer.prototype.removeAll = function(){
299 while (this.container.hasChildNodes()) {
300 this.container.removeChild(this.container.firstChild);
301 }
302 }
303
304 function VMLviewBox(container,left,top,width,height){
305 var tokens = zoominit2.split(' ');
306 left *= proporx;
307 left = left - parseFloat(tokens[0]);
308 top *= propory;
309 top = top - parseFloat(tokens[1]);
310 width *= proporx;
311 height *= propory;
312
313 return {"x":parseFloat(Math.round(left)), "y":parseFloat(Math.round(top)), "w":parseFloat(Math.round(width)), "h":parseFloat(Math.round(height))};
314 }
315 function VMLviewBox1(container,left,top,width,height){
316 var tokens = zoominit2.split(' ');
317 left *= proporx;
318 left = left - parseFloat(tokens[0]);
319 top *= propory;
320 top = top - parseFloat(tokens[1]);
321 width *= proporx;
322 height *= propory;
323
324 return {"x":parseFloat(Math.round(left)), "y":parseFloat(Math.round(top)), "w":parseFloat(Math.round(width)), "h":parseFloat(Math.round(height))};
325 }
326
327 VMLRenderer.prototype.create = function(shape, fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, points, transform, parent) {
328 var tokens = zoominit2.split(' ');
329
330 var zoom=VMLviewBox(this.container,left,top,width,height);
331
332 left=zoom.x;
333 top=zoom.y;
334 width=zoom.w;
335 height=zoom.h;
336
337 var zoom=VMLviewBox(this.container,left,top,textSize,textSize);
338 //if(zoom.w<1){zoom.w=1}
339 if(zoom.y== undefined){left=0}
340 if(zoom.x== undefined){top=0}
341 if(zoom.w== undefined){width=0}
342 if(zoom.h== undefined){height=0}
343 textSize=zoom.h;
344
345 var zoom=VMLviewBox(this.container,left,top,lineWidth*2/3,lineWidth);
346 //if(zoom.w<1){zoom.w=1}
347 lineWidth=zoom.w;
348 var vml;
349 var shap=1;
350 if (shape == 'rect') {
351
352 vml = this.container.ownerDocument.createElement('v:rect');
353 vml.style.position = 'absolute';
354 vml.style.left = left;
355 vml.style.top = top;
356 vml.style.width = width;
357 vml.style.height = height;
358 }
359 else if (shape == 'roundrect') {
360 vml = this.container.ownerDocument.createElement('v:roundrect');
361 vml.style.position = 'absolute';
362 vml.style.left = left;
363 vml.style.top = top;
364 vml.style.width = width;
365 vml.style.height = height;
366 vml.setAttribute('arcsize', '20%');
367
368 }
369 else if (shape == 'ellipse') {
370 vml = this.container.ownerDocument.createElement('v:oval');
371 vml.style.left = left;
372 vml.style.top = top;
373 vml.style.width = width;
374 vml.style.height = height;
375 vml.style.position = 'absolute';
376 }
377 else if (shape == 'line') {
378
379 vml = this.container.ownerDocument.createElement('v:line');
380 vml.setAttribute('from', left + 'px,' + top + 'px');
381 vml.setAttribute('to', left + 'px,' + top + 'px');
382
383 }
384 else if (shape == 'polyline') {
385 vml = this.container.ownerDocument.createElement('v:polyline');
386 vml.setAttribute("points", points);
387
388 }
389 else if (shape == 'path')
390 {
391 vml = this.container.ownerDocument.createElement('v:shape');
392 var tokens = zoominit1.split(' ');
393 var tokens1 = zoominit1.split(' ');
394 var tokens2 = zoominit2.split(' ');
395 tokens[0]=0;
396 tokens[1]=0;
397 var path=points;
398 path=path.replace(/, /g, ',');
399 path=path.replace(/ ,/g, ',');
400 var ps =path.split(" ")
401 var pcc = "";
402
403 var re = /^[-]?\d*\.?\d*$/;
404 var contArc=0;
405 var isArc=false;
406 for(var i = 0; i < ps.length; i++)
407 {
408 if(ps[i].indexOf(',')>0){
409
410 var point =ps[i].split(",");
411 var char1=point[0].substring(0,1);
412
413 if (!char1.match(re))
414 {
415 var num0prev= parseFloat(point[0].substring(1));
416 var zoom=VMLviewBox(this.container,num0prev*1+(parseInt(tokens2[0])*0),0,parseInt(tokens2[2]),parseInt(tokens2[3]));
417 num0=zoom.x;
418
419 var text=char1;
420 }else{
421 var num0prev= parseFloat(point[0]);
422 var zoom=VMLviewBox(this.container,num0prev*1+(parseInt(tokens2[0])*0),0,parseInt(tokens2[2]),parseInt(tokens2[3]));
423 num0=zoom.x;
424
425 }
426 point[1]= parseFloat(point[1]);
427 var zoom=VMLviewBox(this.container,0,point[1],parseInt(tokens2[2]),parseInt(tokens2[3]));
428 point[1]=zoom.y;
429 var cx=num0+parseInt(tokens2[0]);
430 var cy=point[1]+parseInt(tokens2[1]);
431 pcc+=text+cx+','+cy+' ';
432 }
433 else
434 {
435 pcc+=ps[i]+' ';
436 }
437
438 }
439 ////////////////////
440 var thispath=pcc;
441 thispath=thispath.replace(/M/g,'m');
442 thispath=thispath.replace(/C/g,'c');
443 thispath=thispath.replace(/L/g,'l');
444 thispath=thispath.replace(/z/g,'x');
445
446 //document.getElementById('source').value=points+'\r\n'+thispath +'\r\n'+'________'+'\r\n'
447 var zoom=VMLviewBox(this.container,tokens[0],tokens[1],tokens[2],tokens[3]);
448
449 vml.style.position="absolute";
450 vml.style.width= zoom.w+"px";
451 vml.style.height=zoom.h+"px";
452 vml.style.left=zoom.x+"px";
453 vml.style.top=zoom.y+"px";
454 vml.setAttribute('coordsize', zoom.w+','+zoom.h);
455
456 var path01 = this.container.ownerDocument.createElement('v:path');
457 path01.setAttribute("v", thispath+' e');
458
459
460
461 vml.appendChild(path01)
462
463 }
464
465 else if (shape == 'controlpath')
466 {
467
468 vml = this.container.ownerDocument.createElement('v:shape');
469 vml.style.position="absolute";
470 vml.style.width= 700+"px";
471 vml.style.height=500+"px";
472 vml.style.left=left+"px";
473 vml.style.top=top+"px";
474 vml.setAttribute('coordsize', '700,500');
475
476 var path01 = this.container.ownerDocument.createElement('v:path');
477 path01.setAttribute('v', 'm '+left+','+top+' c'+(left+1)+','+(top+1)+' e ');
478
479 vml.appendChild(path01)
480 }
481 else if (shape == 'image') {
482 var data =imageHref;//document.forms[0].option_text_message.value;
483 vml = this.container.ownerDocument.createElement('v:image');
484 vml.setAttribute('src',imageHref);
485 vml.style.position="absolute";
486 vml.style.width=width+"px";
487 vml.style.height=height+"px";
488 vml.style.left=left+"px";
489 vml.style.top=top+"px";
490 vml.style.margin=0+"px";
491 vml.style.padding=0+"px";
492 if (fillColor != '' || fillColor != 'none') {
493 vml.setAttribute('filled', 'false');
494 vml.setAttribute('fillcolor', fillColor);
495 }
496 else {
497 vml.setAttribute('filled', 'false');
498 }
499 vml.setAttribute('strokeweight','0px');// parseFloat(lineWidth)+'px');
500 vml.setAttribute('stroked', 'false');
501 vml.setAttribute('strokecolor','#000000');//lineColor);
502
503
504 }
505
506 else if (shape == 'text')
507 {
508
509 var data =textMessaje;
510 vml = this.container.ownerDocument.createElement('v:shape');
511 vml.style.position="absolute";
512 //vml.setAttribute('coordorigin',left+', '+top);
513 //vml.style.coorsize= '';
514 coordorigin="0, 0"
515
516 var ts=isNaN(textSize)
517 if(ts==true){
518 textSize=10;
519 }
520 vml.style.width= textSize+'px';//tokens[2]+'px'
521 vml.style.height=textSize+'px';
522 vml.style.left=(left+"px");
523 vml.style.top=(top-(textSize*1/4)+"px");
524 vml.style.margin=0+"px";
525 vml.style.padding=0+"px";
526 vml.setAttribute('path','m '+0+' '+0+' r '+(textSize*data.length)+' '+0+' e');
527 var textPathObj = this.container.ownerDocument.createElement("v:textpath");
528 textPathObj.setAttribute('string', data);
529 textPathObj.setAttribute('fitshape','false');
530 textPathObj.setAttribute('trim', 'false');
531 textPathObj.setAttribute('fitpath', 'false');
532 textPathObj.setAttribute('on','true');
533 textPathObj.style.fontFamily=textFamily;
534 textPathObj.style.fontSize=textSize+'px';
535 textPathObj.setAttribute('vTextKern','true');
536 textPathObj.setAttribute('text-align','center');
537
538 var pathObj = this.container.ownerDocument.createElement("v:path");
539 pathObj.setAttribute('textpathok', 'true');
540 vml.appendChild(textPathObj);
541 vml.appendChild(pathObj);
542
543
544 }
545
546
547
548 else if (shape == 'texto')
549 {
550 vml = this.container.ownerDocument.createElement('v:shape');
551 vml.style.position="absolute";
552
553 vml.style.coordsize=1000+', '+1000;
554 vml.style.width= 1000;
555 vml.style.height=1000;
556 vml.style.left=left;
557 vml.style.top=top-parseFloat(textSize);
558
559 vml.style.padding=0;
560 var textBox = this.container.ownerDocument.createElement("v:textbox");
561 textBox.setAttribute('mso-rotate-with-shape',true)
562 var divtext = this.container.ownerDocument.createElement("div");
563 divtext.style.coordorigin=0+', '+(0);
564 divtext.style.margin=0;
565 divtext.style.fontFamily=textFamily;
566 divtext.style.margin=0;
567 divtext.style.padding=0;
568 divtext.style.vRotateLetters=true;
569 divtext.style.fontSize=parseFloat(textSize);
570
571
572
573
574
575
576 divtext.style.color=fillColor;
577
578
579
580
581
582 //divtext.setAttribute('v-rotate-letters','true');
583 if(transform.indexOf('rotate')>=0)
584 {
585
586 myRotate1=transform.split('rotate(');
587 myRotate2=myRotate1[1].split(')');
588 myRotate3=myRotate2[0].split(',');
589
590 //divtext.setAttribute('mso-rotate',myRotate3[0]);
591 //textBox.style.msoRotate= myRotate3[0];
592 //textBox.style.centerX=myRotate3[1];
593 //textBox.style.centerY=myRotate3[2];
594 //vml.style.rotation= myRotate3[0];
595 //vml.style.centerX=myRotate3[1];
596 //vml.style.centerY=myRotate3[2];
597 vml.setAttribute('rotation',myRotate3[0]+'Deg');
598 }
599
600 divtext.innerHTML=textMessaje;
601 textBox.appendChild(divtext);
602
603 vml.appendChild(textBox);
604
605 }
606 else if (shape == 'defs') {
607 var vml;
608
609 }
610
611 else if (shape == 'group') {
612 vml = this.container.ownerDocument.createElement('v:group');
613 vml.style.left=left+"px";
614 vml.style.top=top+"px";
615 }
616
617 if(shape == 'zoom' || shape == 'defs')
618 {
619
620 }else
621 {
622 if(transform.indexOf('rotate')>=0)
623 {
624 myRotate1=transform.split('rotate(');
625 myRotate2=myRotate1[1].split(')');
626 myRotate3=myRotate2[0].split(',');
627
628 vml.style.rotation= myRotate3[0]+'Deg';
629 vml.style.centerX=myRotate3[1];
630 vml.style.centerY=myRotate3[2];
631
632 }
633
634 if(shape != 'image' )
635 {
636 //alert(fillColor)
637 if (fillColor != '' || fillColor != 'none' )
638 {
639 vml.setAttribute('filled', 'true');
640 vml.setAttribute('fillcolor', fillColor);
641
642 }
643 else
644 {
645 vml.setAttribute('filled', 'false');
646 }
647
648
649 if(lineWidth==0 || lineWidth=='none' || lineColor== 'none' )
650 {
651 vml.setAttribute('stroked', 'false');
652 }
653 else
654 {
655 //if(isNaN(lineColor)==false){alert('-'+lineColor+'-');lineColor='#000000';lineWidth=1;}
656 vml.setAttribute('stroked', 'true');
657 vml.setAttribute('strokecolor', lineColor);
658 vml.setAttribute('strokeweight', lineWidth);
659 var stroke = this.container.ownerDocument.createElement('v:stroke');
660 stroke.setAttribute("opacity", parseFloat(lineOpac));
661 vml.appendChild(stroke);
662
663 }
664
665 if (fillOpac != '')
666 {
667 if (fillOpac == 'none' || fillColor=='none'){fillOpac=0;}
668 var fill = this.container.ownerDocument.createElement('v:fill');
669 fill.setAttribute("opacity",parseFloat(fillOpac));
670 //alert(fillOpac)
671 vml.appendChild(fill);
672 }
673 }
674 }
675 if(parent==''){
676 if(vml){
677 this.container.appendChild(vml);}
678 }else{
679 if(document.getElementById(parent)){
680 var parentShape = document.getElementById(parent);
681 if(vml||vml!=null ){
682 parentShape.appendChild(vml);
683 }
684 }
685 }
686 //var parentDoc = document.getElementById('mydraw');
687 //parentDoc.appendChild(vml);
688 return vml;
689 };
690
691
692
693 VMLRenderer.prototype.zoom = function(clicx,clicy)
694 {
695 }
696
697 VMLRenderer.prototype.datacreate = function(fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, transform)
698 {
699 }
700
701 VMLRenderer.prototype.duplicate = function(shape)
702 {
703 var vml;
704 vml =shape.cloneNode(false);
705 //vml.setAttribute('fillcolor', "#aa00aa");
706 //vml.setAttribute('filled', "false");
707 this.container.appendChild(vml);
708 return vml;
709
710 };
711
712 VMLRenderer.prototype.querySelected = function(shape,centerx,centery,width,height)
713 {
714 var result = true;
715 var shapes='names: group, image, rect, path, ellipse, circle, text, line, ';
716
717 //if(shape.getBBox && shape)
718 if( shapes.indexOf(' '+shape.tagName+',')>0)
719 {
720
721 var box = this.bounds(shape);
722 }else
723 {
724 return false;
725 }
726 var p1x = box.x;
727 if(Math.abs(p1x-centerx)>width){result = false}
728
729 var p1y = box.y;
730 if(Math.abs(p1y-centery)>height){result = false}
731
732 var p2x = box.x+box.width;
733 if(Math.abs(p2x-centerx)>width){result = false}
734
735 var p2y = box.y;
736 if(Math.abs(p2y-centery)>height){result = false}
737
738 var p3x = box.x+box.width;
739 if(Math.abs(p3x-centerx)>width){result = false}
740
741 var p3y = box.y+box.height;
742 if(Math.abs(p3y-centery)>height){result = false}
743
744 var p4x = box.x;
745 if(Math.abs(p4x-centerx)>width){result = false}
746
747 var p4y = box.y+box.height;
748 if(Math.abs(p4y-centery)>height){result = false}
749
750 if(result)
751 {
752 return { 'in':result, 'cornersx': p1x+','+p2x+','+p3x+','+p4x+',' ,'cornersy': p1y+','+p2y+','+p3y+','+p4y+',' };
753 }
754 else
755 {
756 return { 'in':result }
757 }
758 //center.distanceFrom(point1);
759
760
761 }
762
763 VMLRenderer.prototype.searchBoxes = function()
764 {
765 var base = this.container;
766
767 var NumNodes = base.childNodes.length;
768 var chain= '';
769 for(i = 0;i < NumNodes;i++)
770 {
771 if (this.bounds(base.childNodes[i]))
772 {
773 chain+=base.childNodes[i].id + ';'
774 }
775 }
776 chain+=''
777 return chain;
778
779 }
780
781 VMLRenderer.prototype.DrawBorder= function(numNode, targetElement )
782 {
783 var shapes='names: group, image, rect, path, ellipse, circle, text, line, ';
784
785 //if(shape.getBBox && shape)
786 if( shapes.indexOf(' '+targetElement.tagName+',')>0)
787 {
788 var bbox = this.bounds(targetElement);
789
790 var outline = this.container.ownerDocument.createElement('v:rect');
791 outline.setAttribute('x', bbox.x - 2 );
792 outline.setAttribute('y', bbox.y - 2 );
793 outline.setAttribute('width', bbox.width + 4 );
794 outline.setAttribute('height', bbox.height + 4 );
795 outline.setAttribute('stroke', '#ff00ff' );
796 outline.setAttribute('fill', 'none' );
797 outline.setAttribute('id', 'shapeBoxed'+numNode );
798
799 targetElement.parentNode.insertBefore( outline, targetElement );
800 return 'shapeBoxed'+numNode;
801 }
802 else
803 {
804 return false
805 }
806 }
807
808
809 VMLRenderer.prototype.index = function(shape,order) {
810
811 if(order==-1)
812 {
813 this.container.appendChild( shape );
814 }
815 if(order==0){
816
817 this.container.insertBefore( shape, shape.parentNode.firstChild );
818 }
819
820 if(order==1 || order==2)
821 {
822 var id=shape.getAttribute('id');
823 //alert(id);
824
825
826 var numNodes=this.container.childNodes.length;
827 //alert(numNodes);
828
829 var num=0;
830 for(var i = 1; i < numNodes; i++)
831 {
832
833 var etiq=this.container.childNodes[i].getAttribute('id');
834 if (etiq==id)
835 {
836 num=i;
837
838 }
839 }
840 //alert(num);
841 if(order==1)
842 {
843 if((num-1)>=-1)
844 {
845 this.container.insertBefore( shape, this.container.childNodes[num-1]);
846 }
847 }
848 if(order==2){
849 if((num+1)<numNodes)
850 {
851 this.container.insertBefore( shape, this.container.childNodes[num+2]);
852 }
853 }
854
855 }
856
857
858
859 }
860 VMLRenderer.prototype.remove = function(shape) {
861 if(shape!=null){ shape.removeNode(true); }
862 }
863
864
865 VMLRenderer.prototype.copy = function(shape)
866 {
867 var vml;
868 vml =shape.cloneNode(false);
869 //vml.setAttribute('fillcolor', "#aa00aa");
870 return vml;
871 };
872
873
874 VMLRenderer.prototype.paste = function(clipboard,left,top)
875 {
876 this.container.appendChild(clipboard);
877 return clipboard;
878 };
879
880
881
882 VMLRenderer.prototype.undo = function()
883 {
884 this.container.removeChild( this.container.lastChild );
885 };
886
887
888 var xshe=0;
889 var yshe=0;
890 var isArc=false;
891 var contArc=0;
892
893 VMLRenderer.prototype.move = function(shape, left, top,fromX,FromY) {
894 var box = this.bounds(shape);
895 var angle=0;
896 var dist=0;
897 var rotated=false;
898
899
900
901
902
903 //contmove++;
904 if (shape.tagName == 'line') {
905 shape.style.marginLeft = left;
906 shape.style.marginTop = top;
907 }
908 if (shape.tagName == 'polyline') {
909 shape.style.marginLeft = left;
910 shape.style.marginTop = top;
911
912 }
913 if (shape.tagName == 'oval') {
914 shape.style.left = left;
915 shape.style.top = top;
916 }
917 if (shape.tagName == 'rect') {
918 shape.style.left = left;
919 shape.style.top = top;
920 }
921
922 if (shape.tagName == 'image') {
923 shape.style.left = left;
924 shape.style.top = top;
925 }
926 if (shape.tagName == 'shape') {
927
928 shape.style.left=left+"px";
929 shape.style.top=top+"px";
930
931 }
932
933
934 };
935
936
937 VMLRenderer.prototype.track = function(shape) {
938 // TODO
939 };
940
941 VMLRenderer.prototype.clic = function(shape) {
942 var end='';
943 if(data_path_close==true){end=' ';}
944
945 var thispath='m '+setPoints[0]+' l';
946 var maxcont=setPoints.length;
947
948 for(var conta=1;conta< maxcont;conta++){
949 thispath+=setPoints[conta]+' ';
950
951
952 }
953 var path=thispath+end+' e';
954 shape.style.position="absolute";
955 shape.style.width= 700+"px";
956 shape.style.height=500+"px";
957 shape.style.left="0px";
958 shape.style.top="0px";
959
960
961 shape.children[0].setAttribute("v",path);
962 document.forms[0].control_codebase.value=path;
963
964 }
965
966
967 VMLRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) {
968 //var vml;
969 var deltaX = toX - fromX;
970 var deltaY = toY - fromY;
971 var shap=1;
972 if (shape.tagName == 'line') { shap=0; }
973 if (shape.tagName == 'polyline') { shap=2; }
974
975 if (shape.tagName == 'line') {
976 shape.setAttribute('to', toX + 'px,' + toY + 'px');
977 }
978 if (shap == 1) {
979 if (deltaX < 0) {
980 shape.style.left = toX + 'px';
981 shape.style.width = -deltaX + 'px';
982 }
983 else {
984 shape.style.width = deltaX + 'px';
985 }
986
987 if (deltaY < 0) {
988 shape.style.top = toY + 'px';
989 shape.style.height = -deltaY + 'px';
990 }
991 else {
992 shape.style.height = deltaY + 'px';
993 }
994 }
995 if (shap == 2) {
996 xpArray.push(toX);
997 ypArray.push(toY);
998
999 //xpArray.push(finetoX);
1000 //ypArray.push(finetoY);
1001
1002 var thispath=' '+xpArray[1]+','+ypArray[1];
1003 var maxcont=xpArray.length;
1004 //alert(maxcont);
1005 for(var conta=2;conta< maxcont;conta++){
1006 thispath+=' '+xpArray[conta]+','+ypArray[conta];
1007 }
1008 //alert(shape.points[1]);
1009 //shape.setAttribute("points",thispath);
1010 shape.points.Value = thispath;
1011
1012 /*
1013 var thispath=''+xpArray[0]+','+ypArray[0];
1014 var thispatho=new Array();
1015 thispatho.push(toX);
1016 thispatho.push(toY);
1017 var maxcont=xpArray.length;
1018 //alert(maxcont);
1019 for(var conta=2;conta< maxcont;conta++){
1020 thispath+=','+xpArray[conta]+','+ypArray[conta];
1021 }
1022 //alert(shape.points[1]);
1023 shape.setAttribute("points",thispath);
1024 */
1025 }
1026 if(shape.tagName == 'shape')
1027 {
1028
1029 if (selectmode == 'controlpath')
1030 {
1031
1032 var end='';
1033 if(data_path_close==true){end=' ';}
1034
1035 var thispath='m '+setPoints[0]+' l';
1036 var maxcont=setPoints.length;
1037
1038 for(var conta=1;conta< maxcont;conta++){
1039 thispath+=setPoints[conta]+' ';
1040
1041
1042 }
1043 var path=thispath+toX+','+toY+end+' e';
1044
1045 shape.style.position="absolute";
1046 shape.style.width= 700+"px";
1047 shape.style.height=500+"px";
1048 shape.style.left="0px";
1049 shape.style.top="0px";
1050
1051 shape.children[0].setAttribute("v",path);
1052 document.forms[0].control_codebase.value=path;
1053
1054
1055 }
1056 else
1057 {
1058
1059 xpArray.push(toX);
1060 ypArray.push(toY);
1061
1062 //xpArray.push(finetoX);
1063 //ypArray.push(finetoY);
1064 var thispath2='';
1065 var thispath1=' '+xpArray[1]+','+ypArray[1];
1066 var maxcont=xpArray.length;
1067 //alert(maxcont);
1068 for(var conta=2;conta< maxcont ;conta++){
1069 thispath2+=''+xpArray[conta]+','+ypArray[conta]+',';
1070 if((conta+2)%3==0){thispath2+='';}
1071 }
1072 thispath2+=''+xpArray[maxcont]+','+ypArray[maxcont]+'';
1073
1074 //alert(shape.points[1]);
1075 //appendChild(path01)
1076 //var path01=shape.getFirstChild();
1077 var path01 = this.container.ownerDocument.createElement('v:path');
1078 path01.setAttribute("v", "m"+thispath1+" l"+ thispath2+" e");
1079 //shape.margin-left="300px";
1080 //shape.margin-top="200px";
1081
1082 //shape.setAttribute('path','m '+thispath1+ ' c'+thispath2+' e');
1083 if(shape.children[0].tagName=='textpath')
1084 {
1085 var path01 = this.container.ownerDocument.createElement('v:path');
1086 path01.setAttribute("v", 'm 100 100 l 600 100 e');
1087
1088 //if(xpArray.length>1)
1089 //{ shap.style.position="absolute";
1090 shape.style.width=100+"px";
1091 shape.style.height=100+"px";
1092 shape.style.left=toX+"px";
1093 shape.style.top=toY+"px";
1094 shape.style.margin=0+"px";
1095 shape.style.padding=0+"px";
1096 shape.appendChild(path01);
1097 //}
1098 }
1099 else
1100 {
1101 shape.style.position="absolute";
1102 shape.style.width= 700+"px";
1103 shape.style.height=500+"px";
1104 shape.style.left="0px";
1105 shape.style.top="0px";
1106 //shape.setAttribute('coordsize', '700,500');
1107 shape.appendChild(path01);
1108 }
1109
1110 //shape.setAttribute('position', 'absolute');
1111 //shape.translate(xpArray[conta+1]+','+ypArray[conta+1]);
1112 //shape.setAttribute('coordsize', '700,500');
1113 // shape.v.Value ='M '+thispath1+ ' C'+thispath2+' x e';
1114 //shape.v.Value = 'M '+thispath+ ' c '+thispath2;
1115 //shape.setAttribute("v", 'M '+thispath+ ' C '+thispath2);
1116 //shape.setAttribute('path','M '+thispath+ ' C '+thispath2);
1117 }
1118 }
1119
1120 };
1121
1122
1123 VMLRenderer.prototype.tocurve = function() {
1124
1125
1126 };
1127
1128
1129 VMLRenderer.prototype.info = function(shape)
1130 {
1131 var shInfo = {};
1132 shInfo.id = shape.id;
1133 shInfo.type = shape.tagName;
1134 if (shape.tagName == 'rect')
1135 {
1136 shInfo.left = parseFloat(shape.getAttribute( 'x'));
1137 shInfo.top = parseFloat(shape.getAttribute( 'y'));
1138 shInfo.width = parseFloat(shape.getAttribute('width'));
1139 shInfo.height = parseFloat(shape.getAttribute('height'));
1140 //++
1141 //shInfo.rotate = parseFloat(shape.getAttribute('rotation'));
1142 }
1143 else if (shape.tagName == 'oval')
1144 {
1145 shInfo.width = parseFloat(shape.getAttribute('rx'))*2;
1146 shInfo.height = parseFloat(shape.getAttribute('ry'))*2;
1147 shInfo.left = (shInfo.width * 2) - parseFloat(shape.getAttribute('rx'));
1148 shInfo.top = (shInfo.height * 2) - parseFloat(shape.getAttribute('ry'));
1149
1150 }
1151 else if (shape.tagName == 'roundrect')
1152 {
1153 shInfo.left = parseFloat(shape.getAttribute('x'));
1154 shInfo.top = parseFloat(shape.getAttribute('y'));
1155 shInfo.width = parseFloat(shape.getAttribute('width'));
1156 shInfo.height = parseFloat(shape.getAttribute('height'));
1157
1158 }
1159 else if (shape.tagName == 'line')
1160 {
1161 shInfo.left = parseFloat(shape.getAttribute('x1'));
1162 shInfo.top = parseFloat(shape.getAttribute('y1'));
1163
1164 }
1165 else if (shape.tagName == 'polyline')
1166 {
1167 shInfo.points = shape.getAttribute('points');
1168 }
1169 else if (shape.tagName == 'image')
1170 {
1171 shInfo.left = parseFloat(shape.getAttribute('x'));
1172 shInfo.top = parseFloat(shape.getAttribute('y'));
1173 shInfo.width = parseFloat(shape.getAttribute('width'));
1174 shInfo.height = parseFloat(shape.getAttribute('height'));
1175 shInfo.src = shape.getAttribute('src');
1176 }
1177 else
1178
1179 if (shape.tagName == 'shape')
1180 {
1181 if(shape.children[0].tagName=='path') {
1182 shInfo.d = shape.getAttribute('v');
1183 this.editor.log(shape.getAttribute('v'));
1184
1185 }
1186 if(shape.children[0].tagName=='textpath') {
1187 shInfo['font-family'] = shape.children[0].getAttribute('font-family')
1188 shInfo['font-size'] = parseInt(shape.children[0].getAttribute('font-size'))
1189 shInfo.top = parseFloat(shape.children[0].getAttribute('y'))
1190 shInfo.left = parseFloat(shape.children[0].getAttribute('x'))
1191 shInfo.text = shape.textContent
1192
1193 }
1194 }
1195 return shInfo;
1196
1197
1198 }
1199 VMLRenderer.prototype.transformShape = function(shape,data,transform)
1200 {
1201
1202 if(shape.tagName == 'rect')
1203 {
1204
1205 var box = this.bounds(shape);
1206 var sdata=data.split(';');
1207
1208 //alert(data[0]);
1209 shape.style.top = parseFloat(sdata[0]) + 'px';
1210 shape.style.left = parseFloat(sdata[1]) + 'px';
1211 shape.style.width = parseFloat(sdata[2]) + 'px';
1212 shape.style.height = parseFloat(sdata[3]) + 'px';
1213
1214
1215
1216 // var centerx=parseFloat(sdata[0])+parseFloat(box.width/2);
1217 // var centery=parseFloat(sdata[1])+parseFloat(box.height/2);
1218 shape.style.rotation=parseFloat(sdata[4]);
1219
1220 //shape.nodparseFloatue=data;
1221 }
1222 else
1223 if(shape.tagName == 'text')
1224 {
1225 if(data.indexOf('<;>',0)==-1 )
1226 {
1227 shape.textContent = data;
1228 }
1229 else
1230 {
1231 var sdata=data.split('<;>'); //?????????
1232 shape.textContent = sdata[0];
1233 shape.setAttribute('font-size',parseFloat(sdata[1]));
1234 shape.setAttribute('font-family',sdata[2]);
1235 }
1236 //shape.nodparseFloatue=data;
1237 }
1238 else
1239 if (shape.tagName == 'polyline')
1240 {
1241 shape.setAttribute('points',data);
1242 }
1243 else
1244 if (shape.tagName == 'image')
1245 {
1246 //alert(data);
1247 if(data.indexOf(';',0)==-1 )
1248 {
1249 shape.setAttribute('src',data);
1250 }
1251 else
1252 {
1253 var box = this.bounds(shape);
1254 var sdata=data.split(';');
1255 shape.style.top = parseFloat(sdata[0]) + 'px';
1256 shape.style.left = parseFloat(sdata[1]) + 'px';
1257 shape.style.width = parseFloat(sdata[2]) + 'px';
1258 shape.style.height = parseFloat(sdata[3]) + 'px';
1259 var centerx=parseFloat(sdata[0])+parseFloat(box.width/2);
1260 var centery=parseFloat(sdata[1])+parseFloat(box.height/2);
1261 shape.style.rotation=parseFloat(sdata[4]);
1262
1263
1264 }
1265
1266 }
1267 else
1268 if (shape.tagName == 'path')
1269 {
1270 if(data.indexOf(';',0)==-1 )
1271 {
1272 //shape.setAttribute( 'd', data); //????????
1273 //shape.setAttribute( 'transform', transform);
1274 }
1275 else
1276 {
1277 var box = this.bounds(shape);
1278 var sdata=data.split(';');
1279 var centerx=parseFloat(sdata[0])+parseFloat(box.width/2);
1280 var centery=parseFloat(sdata[1])+parseFloat(box.height/2);
1281 //++shape.setAttribute( 'transform','scale('+parseFloat(sdata[2])+','+parseFloat(sdata[3])+')'+' rotate('+parseFloat(sdata[4])+','+centerx+','+centery+')'+' translate('+parseFloat(sdata[0])+','+parseFloat(sdata[1])+')');
1282
1283
1284 }
1285 }
1286
1287
1288 }
1289 VMLRenderer.prototype.editShape = function(shape,data)
1290 {
1291 if(shape.tagName == 'text'){
1292 shape.textContent = data
1293 }else
1294 if (shape.tagName == 'polyline')
1295 {
1296 shape.setAttribute('points',data);
1297 }
1298 else
1299
1300 if (shape.tagName == 'path')
1301 {
1302 shape.setAttribute('v', data);
1303
1304 }
1305
1306
1307 }
1308 VMLRenderer.prototype.editCommand = function(shape, cmd, value)
1309 {
1310 if (shape != null) {
1311 if (cmd == 'fillcolor') {
1312 if (value != '') {
1313 shape.filled = 'true';
1314 shape.fillcolor = value;
1315 }
1316 else {
1317 shape.filled = 'false';
1318 shape.fillcolor = '';
1319 }
1320 }
1321 else if (cmd == 'linecolor') {
1322 if (value != '') {
1323 shape.stroked = 'true';
1324 shape.strokecolor = value;
1325 }
1326 else {
1327 shape.stroked = 'false';
1328 shape.strokecolor = '';
1329 }
1330 }
1331 else if (cmd == 'linewidth') {
1332 shape.strokeweight = parseInt(value) + 'px';
1333 }
1334 else if (cmd == 'fillopacity') {
1335
1336 shape.fill.opacity= parseFloat(value);
1337 //shape.style.fill.setAttribute("opacity", parseFloat(value));
1338
1339 }
1340 }
1341 }
1342
1343
1344 VMLRenderer.prototype.queryCommand = function(shape, cmd)
1345 {
1346 if (shape != null) {
1347 if (cmd == 'fillcolor') {
1348 if (shape.filled == 'false')
1349 return '';
1350 else
1351 return shape.fillcolor;
1352 }
1353 else if (cmd == 'linecolor') {
1354 if (shape.stroked == 'false')
1355 return '';
1356 else
1357 return shape.strokecolor;
1358 }
1359 else if (cmd == 'linewidth') {
1360 if (shape.stroked == 'false') {
1361 return '';
1362 }
1363 else {
1364 // VML always transforms the pixels to points, so we have to convert them back
1365 return (parseFloat(shape.strokeweight) * (screen.logicalXDPI / 72)) + 'px';
1366 }
1367 }
1368 }
1369 }
1370
1371 VMLRenderer.prototype.getProperties = function(shape)
1372 {
1373 var result = '';
1374
1375 if (shape != null)
1376 {
1377 result = shape.getAttribute('fillcolor');
1378 if (result == 'none')
1379 {
1380 mefillColor.visible = 'hidden';
1381 mefillColor.hex = '#000000';
1382 filldraw=true;
1383 setbe(1,'img_okfill');
1384 }
1385 else
1386 {
1387 //alert(mefillColor.hex+' '+result);
1388 mefillColor.visible = 'visible';
1389 mefillColor.hex = result;
1390 var rgb=hex2rgb(result)
1391 mefillColor.r=rgb[0];
1392 mefillColor.g=rgb[1];
1393 mefillColor.b=rgb[2];
1394 filldraw=false;
1395 setbe(1,'img_okfill');
1396
1397 }
1398
1399 result = shape.getAttribute('strokecolor');
1400 if (result == 'none')
1401 {
1402 mestrokeColor.visible = 'hidden';
1403 mestrokeColor.hex = '#000000';
1404 mestrokeColor.width = 0;
1405 strokedraw=true;
1406 setbe(2,'img_okstroke');
1407
1408 }
1409 else
1410 {
1411 mestrokeColor.visible = 'visible';
1412 mestrokeColor.hex = result;
1413 var rgb=hex2rgb(result)
1414 mestrokeColor.r=rgb[0];
1415 mestrokeColor.g=rgb[1];
1416 mestrokeColor.b=rgb[2];
1417 strokedraw=false;
1418 setbe(2,'img_okstroke');
1419
1420 }
1421
1422 result = shape.getAttribute('strokeweight');
1423 mestrokeColor.width = result;
1424
1425 result = shape.fill.getAttribute('opacity');
1426 mefillColor.opacity = result;
1427
1428 result = shape.stroke.getAttribute('opacity');
1429 mestrokeColor.opacity = result;
1430
1431 setProperties();
1432 }
1433 }
1434
1435
1436 VMLRenderer.prototype.showMultiSelect = function(iniX,iniY) {
1437 var tracker = document.getElementById('trackerMultiSelect');
1438 if (tracker) {
1439 this.remove(tracker);
1440 }
1441 var coord=this.editor.inputxy;
1442 toX=parseFloat(coord[0]);
1443 toY=parseFloat(coord[1]);
1444
1445 tracker = this.container.ownerDocument.createElement('v:rect');
1446
1447 tracker.style.position = 'relative';
1448 tracker.style.left = iniX;
1449 tracker.style.top = iniY;
1450 tracker.style.width = toX ;
1451 tracker.style.height = toY;
1452 tracker.setAttribute('filled', 'false');
1453 tracker.setAttribute('stroked', 'true');
1454 tracker.setAttribute('strokecolor', 'blue');
1455 tracker.setAttribute('strokeweight', '1px');
1456
1457 this.container.appendChild(tracker);
1458 }
1459
1460 function mouseCoord()
1461 {
1462 var coord=this.editor.inputxy;
1463 coord[0]=parseFloat(coord[0]);
1464 coord[1]=parseFloat(coord[1]);
1465 return coord
1466 }
1467
1468 var memoNode=null;
1469 var memoPrevControl=new Array();
1470 var memoNextControl=new Array();
1471 VMLRenderer.prototype.nodeMove = function(newx,newy) {
1472 var mypath=$('control_codebase').value;
1473 var x= $('option_path_x').value;
1474 var y= $('option_path_y').value;
1475 var precoord=x+','+y;
1476
1477 $('option_path_x').value=newx;
1478 $('option_path_y').value=newy;
1479
1480 var cadx= newx;
1481 var cady= newy;
1482
1483 var coord=cadx+','+cady;
1484 var cad1=new RegExp(precoord,"g");
1485
1486
1487 var result=mypath.replace(cad1, coord);
1488
1489
1490 $('control_codebase').value=result;
1491
1492 $('someinfo').value=precoord;
1493 setShape();
1494
1495 }
1496
1497 function drawNodeControl(vml,numId){
1498 var color1='#0066ff';
1499 // if(parseInt(memoNode.id)==a){
1500
1501 var pointprev=memoPrevControl[numId].split(',');
1502 var controlNode1 = this.container.ownerDocument.createElement('v:rect');
1503 controlNode1.setAttribute('x', pointprev[0]-2);
1504 controlNode1.setAttribute('y', pointprev[1]-2);
1505
1506 controlNode1.setAttribute('width', 4);
1507 controlNode1.setAttribute('height', 4);
1508 controlNode1.setAttribute('fillcolor', color1);
1509 controlNode1.setAttribute('strokecolor', '#000000');
1510 controlNode1.setAttribute('strokeweight', '0');
1511 controlNode1.setAttribute('id', 'controlNode1');
1512 controlNode1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttribute('strokeweight', 0 );} memoNode=this; this.setAttribute('fillcolor', '#ffff00' );this.setAttribute('strokeweight', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttribute('x'))+2; $('option_path_y').value=parseFloat(this.getAttribute('y'))+2; }, false);
1513 vml.appendChild(controlNode1);
1514
1515 var pointnext=memoNextControl[numId].split(',');
1516
1517
1518 var controlNode2 =this.container.ownerDocument.createElement('v:rect');
1519 controlNode2.setAttribute('x', pointnext[0]-2);
1520 controlNode2.setAttribute('y', pointnext[1]-2);
1521
1522 controlNode2.setAttribute('width', 4);
1523 controlNode2.setAttribute('height', 4);
1524 controlNode2.setAttribute('fillcolor', color1);
1525 controlNode2.setAttribute('strokecolor', '#000000');
1526 controlNode2.setAttribute('strokeweight', '0');
1527 controlNode2.setAttribute('id', 'controlNode1');
1528 controlNode2.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttribute('strokeweight', 0 );} memoNode=this; this.setAttribute('fillcolor', '#ffff00' );this.setAttribute('strokeweight', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttribute('x'))+2; $('option_path_y').value=parseFloat(this.getAttribute('y'))+2; }, false);
1529 vml.appendChild(controlNode2);
1530
1531 //}
1532
1533
1534 }
1535
1536 VMLRenderer.prototype.showNodesCurve = function(path){
1537 var points=path.split('c');
1538 var chain='';
1539 var segment=' ';
1540 var numpoints=points.length-1;
1541 for(var a=1;a<numpoints;a++)
1542 {
1543 segment=points[a].split(' ');
1544 chain+=segment[0]+' ';
1545 }
1546
1547 $('someinfo').value=numpoints+ ' nodes ';
1548 return chain;
1549
1550 };
1551
1552
1553
1554 VMLRenderer.prototype.showTracker = function(shape) {
1555 var box = this.bounds(shape);
1556 var trshape = parseFloat(shape.getAttribute('rotation'));
1557 var tracker = document.getElementById('tracker');
1558 if (tracker) {
1559 this.remove(tracker);
1560 }
1561
1562 if (shape.tagName == 'shape')
1563 {
1564 shap=2;
1565 if(shape.children[0].tagName == 'path')
1566 {
1567
1568 /* $('option_path_trx').value= box.x;
1569 $('option_path_try').value= box.y;
1570 $('option_path_sclx').value= box.width;
1571 $('option_path_scly').value= box.height;
1572 $('option_path_rot').value= shape.style.rotation;
1573 */
1574 var path=shape.children[0].getAttribute('v');
1575 $('control_codebase').value=path;
1576 }
1577 }
1578 if (shape.tagName == 'rect') {
1579
1580 $('option_rect_rot').value= shape.getAttribute('rotation');
1581 $('option_rect_trx').value= box.x;
1582 $('option_rect_try').value= box.y;
1583 $('option_rect_sclx').value= box.width;
1584 $('option_rect_scly').value= box.height;
1585
1586 }
1587
1588 if (shape.tagName == 'image'){
1589 /* $('option_img_trx').value= box.x;
1590 $('option_img_try').value= box.y;
1591 $('option_img_sclx').value= box.width;
1592 $('option_img_scly').value= box.height;
1593 $('option_img_rot').value= T.b* (Math.PI * 2 / 360);
1594 */
1595 }
1596 if (shape.tagName == 'text'){
1597 /* f$('option_text_trx').value= box.x;
1598 $('option_text_try').value= box.y;
1599 $('option_text_sclx').value= box.width;
1600 $('option_text_scly').value= box.height;
1601 $('option_text_rot').value= T.b* (Math.PI * 2 / 360);
1602 */
1603 }
1604 if (shape.tagName == 'line'){
1605 /*
1606 $('option_line_trx').value= box.x;
1607 $('option_line_try').value= box.y;
1608 */
1609 }
1610 if (shape.tagName == 'oval'){
1611 /*$('option_ellipse_trx').value= putx;
1612 $('option_ellipse_try').value= puty;
1613 $('option_ellipse_sclx').value= box.width;
1614 $('option_ellipse_scly').value= box.height;
1615 $('option_ellipse_rot').value= T.b* (Math.PI * 2 / 360);
1616 */
1617 }
1618
1619
1620
1621 /*var matrix = shape.getScreenCTM();
1622 var trshape= shape.getAttribute('transform');
1623 var shap=1;
1624 if (shape.tagName == 'path') { shap=2;
1625
1626
1627
1628 }
1629 */
1630 //if (shape.getAttribute('transform') ) { shap=2; }
1631 //var svgNamespace = 'http://www.w3.org/2000/svg';
1632
1633 tracker = this.container.ownerDocument.createElement('v:group');
1634 tracker.id = 'tracker';
1635 //tracker.setAttribute('rotation',trshape);
1636 tracker.setAttribute('coordorigin','0, 0');
1637 //tracker.setAttribute('wrapcoords',true);
1638
1639
1640 tracker.setAttribute('coordsize',box.width+','+ box.height);
1641 tracker.style.position = 'absolute';
1642 tracker.style.left = box.x ;
1643 tracker.style.top = box.y;
1644 tracker.style.width = box.width ;
1645 tracker.style.height = box.height ;
1646
1647
1648
1649
1650
1651
1652
1653
1654
1655 ////////////////
1656
1657 /*
1658
1659 var trshape='translate (0,0) rotate(0) translate(0,0) ';
1660 var trshape_split=trshape.split(') ');
1661
1662 // get_between (trshape, s1, s2) ;
1663 if(shape.getAttribute('transform')){
1664 var trshape=shape.getAttribute('transform') ;
1665 //var spl=trshape.replace(', ',' ');
1666 //var spl1=spl.replace(')',' ');
1667 var trshape_split=trshape.split(') ');
1668
1669
1670 }
1671 */
1672
1673 var corners = [];
1674 var point = createPoint(box.x, box.y, box.width, box.height);
1675 //point = {x:box.x, y:box.y, width: box.width, height:box.height};
1676 //point = createPoint(box.x, box.y, box.width, box.height);
1677 //1
1678 corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) );
1679 point.x = box.x + box.width;
1680 point.y = box.y;
1681 //2
1682 corners.push( createPoint(box.x + box.width, box.y + box.height, box.width, box.height) );
1683 point.x = box.x + box.width;
1684 point.y = box.y + box.height;
1685 //3
1686 //corners.push( point.matrixTransform(matrix) );
1687 corners.push( createPoint(box.x , box.y + box.height, box.width, box.height) );
1688 point.x = box.x;
1689 point.y = box.y + box.height;
1690 //4
1691 corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) );
1692
1693 var max = createPoint(corners[0].x, corners[0].y);
1694 var min = createPoint(corners[0].x, corners[0].y);
1695
1696 // identify the new corner coordinates of the
1697 // fully transformed bounding box
1698
1699 for (var i = 1; i < corners.length; i++) {
1700 var x = corners[i].x;
1701 var y = corners[i].y;
1702 if (x < min.x) {
1703 min.x = x;
1704 }
1705 else if (x > max.x) {
1706 max.x = x;
1707 }
1708 if (y < min.y) {
1709 min.y = y;
1710 }
1711 else if (y > max.y) {
1712 max.y = y;
1713 }
1714 }
1715
1716
1717 var border_square = this.container.ownerDocument.createElement('v:rect');
1718
1719 border_square.style.position = 'relative';
1720 border_square.style.left = 0 - 10;
1721 border_square.style.top = 0 - 10;
1722 border_square.style.width = box.width + 20;
1723 border_square.style.height = box.height + 20;
1724 border_square.setAttribute('filled', 'false');
1725 border_square.setAttribute('stroked', 'true');
1726 border_square.setAttribute('strokecolor', 'blue');
1727 border_square.setAttribute('strokeweight', '1px');
1728
1729
1730 var border_angle = this.container.ownerDocument.createElement('v:polyline');
1731 border_angle.style.position = 'relative';
1732
1733 //border_angle.setAttribute('from',(box.width+10) + 'px,' + (box.height/2) + 'px');
1734 //border_angle.setAttribute('to', (box.width+10+25) + 'px,' + (box.width+10) + 'px');
1735 border_angle.setAttribute('filled', 'false');
1736 border_angle.setAttribute('stroked', 'true');
1737 border_angle.setAttribute('strokecolor', 'blue');
1738 border_angle.setAttribute('strokeweight', '1px');
1739 border_angle.setAttribute("points", (box.width+10)+","+((box.height/2))+", "
1740 +(box.width+10+25)+","+((box.height/2)) );
1741
1742
1743 /* var path01 = this.container.ownerDocument.createElement('v:path');
1744 //path01.setAttribute("v", "m "+thispath+" c"+ thispath2+" e ");
1745 path01.setAttribute("v", "m"+(min.x-10)+","+ (min.y-10)+" r"+(box.width+20)+","+(0)+" r"+(0)+","+(box.height+20)+" r"+(-box.width-20)+','+(0)+"x e m"+(box.x+box.width+10)+","+ (box.y+(box.height/2))+" r"+(25)+",0 e ");
1746 border.appendChild(path01)
1747 */
1748 //border.setAttribute('stroke-width', '1');
1749
1750 // createRect(min.x, min.y, max.x - min.x, max.y - min.y);
1751
1752
1753 /* tracker = this.container.ownerDocument.createElement('v:rect');
1754 tracker.id = 'tracker';
1755 tracker.style.position = 'absolute';
1756 tracker.style.left = box.x - 10;
1757 tracker.style.top = box.y - 10;
1758 tracker.style.width = box.width + 20;
1759 tracker.style.height = box.height + 20;
1760 tracker.setAttribute('filled', 'false');
1761 tracker.setAttribute('stroked', 'true');
1762 tracker.setAttribute('strokecolor', 'blue');
1763 tracker.setAttribute('strokeweight', '1px');
1764 this.container.appendChild(tracker);
1765 */
1766 var circle1 = this.container.ownerDocument.createElement('v:oval');
1767 circle1.style.position = 'relative';
1768 circle1.style.left = ( (box.width+40)-5);
1769 circle1.style.top = ( (box.height / 2) -5);
1770 circle1.style.width = (10);
1771 circle1.style.height = (10);
1772 circle1.setAttribute('filled', 'true');
1773 circle1.setAttribute('stroked', 'true');
1774 circle1.setAttribute('fillcolor', '#ffffff');
1775 circle1.setAttribute('strokecolor', 'green');
1776 circle1.setAttribute('strokeweight', '1px');
1777
1778
1779 var rect1 = this.container.ownerDocument.createElement('v:rect');
1780 rect1.style.position = 'relative';
1781 rect1.style.left = - 10-5;
1782 rect1.style.top = - 10-5;
1783 rect1.style.width = 10;
1784 rect1.style.height = 10;
1785 rect1.setAttribute('filled', 'true');
1786 rect1.setAttribute('stroked', 'true');
1787 rect1.setAttribute('fillcolor', '#ffffff');
1788 rect1.setAttribute('strokecolor', 'green');
1789 rect1.setAttribute('strokeweight', '1px');
1790
1791
1792 var rect2 = this.container.ownerDocument.createElement('v:rect');
1793 rect2.style.position = 'relative';
1794 rect2.style.left = box.width +5;
1795 rect2.style.top = -10 -5;
1796 rect2.style.width = 10;
1797 rect2.style.height = 10;
1798 rect2.setAttribute('filled', 'true');
1799 rect2.setAttribute('stroked', 'true');
1800 rect2.setAttribute('fillcolor', '#ffffff');
1801 rect2.setAttribute('strokecolor', 'green');
1802 rect2.setAttribute('strokeweight', '1px');
1803
1804
1805 var rect3 = this.container.ownerDocument.createElement('v:rect');
1806 rect3.style.position = 'relative';
1807 rect3.style.left = box.width+5;
1808 rect3.style.top = box.height+5;
1809 rect3.style.width = 10;
1810 rect3.style.height = 10;
1811 rect3.setAttribute('filled', 'true');
1812 rect3.setAttribute('stroked', 'true');
1813 rect3.setAttribute('fillcolor', '#ffffff');
1814 rect3.setAttribute('strokecolor', 'green');
1815 rect3.setAttribute('strokeweight', '1px');
1816
1817 var rect4 = this.container.ownerDocument.createElement('v:rect');
1818 rect4.style.position = 'relative';
1819 rect4.style.left = -10-5;
1820 rect4.style.top = box.height+5;
1821 rect4.style.width = 10;
1822 rect4.style.height = 10;
1823 rect4.setAttribute('filled', 'true');
1824 rect4.setAttribute('stroked', 'true');
1825 rect4.setAttribute('fillcolor', '#ffffff');
1826 rect4.setAttribute('strokecolor', 'green');
1827 rect4.setAttribute('strokeweight', '1px');
1828
1829
1830
1831 var rectmid12 = this.container.ownerDocument.createElement('v:rect');
1832 rectmid12.style.position = 'relative';
1833 rectmid12.style.left = (box.width/2) -5;
1834 rectmid12.style.top =- 10-5;
1835 rectmid12.style.width = 10;
1836 rectmid12.style.height = 10;
1837 rectmid12.setAttribute('filled', 'true');
1838 rectmid12.setAttribute('stroked', 'true');
1839 rectmid12.setAttribute('fillcolor', '#ffffff');
1840 rectmid12.setAttribute('strokecolor', 'green');
1841 rectmid12.setAttribute('strokeweight', '1px');
1842
1843 var rectmid23 = this.container.ownerDocument.createElement('v:rect');
1844 rectmid23.style.position = 'relative';
1845 rectmid23.style.left = box.width +5;
1846 rectmid23.style.top = (box.height/2)-5;
1847 rectmid23.style.width = 10;
1848 rectmid23.style.height = 10;
1849 rectmid23.setAttribute('filled', 'true');
1850 rectmid23.setAttribute('stroked', 'true');
1851 rectmid23.setAttribute('fillcolor', '#ffffff');
1852 rectmid23.setAttribute('strokecolor', 'green');
1853 rectmid23.setAttribute('strokeweight', '1px');
1854
1855 var rectmid34 = this.container.ownerDocument.createElement('v:rect');
1856 rectmid34.style.position = 'relative';
1857 rectmid34.style.left = (box.width/2)-5;
1858 rectmid34.style.top = box.height+5;
1859 rectmid34.style.width = 10;
1860 rectmid34.style.height = 10;
1861 rectmid34.setAttribute('filled', 'true');
1862 rectmid34.setAttribute('stroked', 'true');
1863 rectmid34.setAttribute('fillcolor', '#ffffff');
1864 rectmid34.setAttribute('strokecolor', 'green');
1865 rectmid34.setAttribute('strokeweight', '1px');
1866
1867
1868 var rectmid41 = this.container.ownerDocument.createElement('v:rect');
1869 rectmid41.style.position = 'relative';
1870 rectmid41.style.left = -10-5 ;
1871 rectmid41.style.top =(box.height/2)-5;
1872 rectmid41.style.width = 10;
1873 rectmid41.style.height = 10;
1874 rectmid41.setAttribute('filled', 'true');
1875 rectmid41.setAttribute('stroked', 'true');
1876 rectmid41.setAttribute('fillcolor', '#ffffff');
1877 rectmid41.setAttribute('strokecolor', 'green');
1878 rectmid41.setAttribute('strokeweight', '1px');
1879
1880
1881
1882
1883 var colorin="#ff0000";
1884 var colorout="#ffffff"
1885
1886 circle1.attachEvent("onmouseover", function(event) {circle1.style.cursor= 's-resize'; circle1.setAttribute('fillcolor', colorin ); typeTransform='Rotate'; scaleType='nw'; }, false);
1887 circle1.attachEvent("onmouseout", function(event) {circle1.style.cursor= 'default'; circle1.setAttribute('fillcolor', colorout ); typeTransform='Rotate'; }, false); //typeTransform='rotate'
1888
1889
1890 rect1.attachEvent("onmouseover", function(event) {rect1.style.cursor= 'nw-resize'; rect1.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='nw'; }, false);
1891 rect1.attachEvent("onmouseout", function(event) {rect1.style.cursor= 'default'; rect1.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false); //typeTransform='rotate'
1892
1893 rect2.attachEvent("onmouseover", function(event) {rect2.style.cursor= 'ne-resize'; rect2.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='ne';}, false);
1894 rect2.attachEvent("onmouseout", function(event) {rect2.style.cursor= 'default'; rect2.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1895
1896 rect3.attachEvent("onmouseover", function(event) {rect3.style.cursor= 'se-resize'; rect3.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='se';}, false);
1897 rect3.attachEvent("onmouseout", function(event) {rect3.style.cursor= 'default'; rect3.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1898
1899 rect4.attachEvent("onmouseover", function(event) {rect4.style.cursor= 'sw-resize'; rect4.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='sw';}, false);
1900 rect4.attachEvent("onmouseout", function(event) {rect4.style.cursor= 'default'; rect4.setAttribute('fillcolor', colorout ); typeTransform='Scale'; }, false);
1901
1902 rectmid12.attachEvent("onmouseover", function(event) {rectmid12.style.cursor= 'n-resize'; rectmid12.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='n';}, false);
1903 rectmid12.attachEvent("onmouseout", function(event) {rectmid12.style.cursor= 'default'; rectmid12.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1904
1905 rectmid23.attachEvent("onmouseover", function(event) {rectmid23.style.cursor= 'e-resize'; rectmid23.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='e';}, false);
1906 rectmid23.attachEvent("onmouseout", function(event) {rectmid23.style.cursor= 'default'; rectmid23.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1907
1908 rectmid34.attachEvent("onmouseover", function(event) {rectmid34.style.cursor= 's-resize'; rectmid34.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='s';}, false);
1909 rectmid34.attachEvent("onmouseout", function(event) {rectmid34.style.cursor= 'default'; rectmid34.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1910
1911 rectmid41.attachEvent("onmouseover", function(event) {rectmid41.style.cursor= 'w-resize'; rectmid41.setAttribute('fillcolor', colorin ); typeTransform='Scale'; scaleType='w'; }, false);
1912 rectmid41.attachEvent("onmouseout", function(event) {rectmid41.style.cursor= 'default'; rectmid41.setAttribute('fillcolor', colorout ); typeTransform=''; }, false);
1913 //tracker.setAttribute('transform',trshape);
1914
1915
1916
1917 tracker.appendChild(border_square);
1918 tracker.appendChild(border_angle);
1919
1920 tracker.appendChild(circle1);
1921
1922 tracker.appendChild(rect1);
1923 tracker.appendChild(rect2);
1924 tracker.appendChild(rect3);
1925 tracker.appendChild(rect4);
1926 tracker.appendChild(rectmid12);
1927 tracker.appendChild(rectmid23);
1928 tracker.appendChild(rectmid34);
1929 tracker.appendChild(rectmid41);
1930
1931 /*
1932
1933
1934
1935 */
1936
1937
1938 this.container.appendChild(tracker);
1939
1940
1941
1942 }
1943
1944
1945
1946
1947
1948
1949
1950
1951
1952
1953 VMLRenderer.prototype.getMarkup = function() {
1954
1955 return this.container.innerHTML;
1956 }
1957
1958
1959
1960 /////////////////////////////////
1961
1962
1963
1964 var rotatexxx=0;
1965
1966 var scaleType='';
1967 var xrot=0;
1968 var yrot=0;
1969
1970 var point = {x:0, y:0, width: 0, height:0};
1971
1972 function createPoint (x, y, width, height) {
1973 //var point = {x:34, y:22, width: 22, height:23};
1974 //point.x = x;
1975 //point.y = y;
1976 point = {x:x, y:y, width: width, height:height};
1977 return point;
1978 }
1979
1980
1981 /////////////////////////////////
1982
1983 VMLRenderer.prototype.restruct= function(shape)
1984 {
1985 };
1986
1987
1988
1989 VMLRenderer.prototype.transform = function() {
1990
1991 };
1992
1993 VMLRenderer.prototype.scaleShape = function(shape, previus,toX, toY) {
1994 // document.forms[0].code.value="escala";
1995
1996 //document.forms[0].code.value="escala";
1997 var box = this.bounds(shape);
1998 var prevbox=this.bounds(previus);
1999 var centerx= box.x+(box.width/2);
2000 var centery= box.y+(box.height/2);
2001 var coord=this.editor.inputxy;
2002 toX=parseFloat(coord[0]);
2003 toY=parseFloat(coord[1]);
2004 var d2p_center=dist2p(centerx,centery,toX,toY);
2005
2006 var d2p=dist2p(box.x,box.y,toX,toY);
2007
2008 var shareScale=box.width/d2p;
2009
2010 var trans_ShareScale='';
2011 var tx, ty, tw, yh;
2012
2013 if(scaleType.length==1){
2014 if(scaleType== 'w')
2015 {
2016 trans_ShareScale=shareScale+",1";
2017 tx=toX;
2018 ty=prevbox.y;
2019 var dist=prevbox.x-toX;
2020 var w=dist+prevbox.width;
2021 if(w<1){w=1;}
2022 tw=w;
2023 th=prevbox.height;
2024 //document.forms[0].code.value=box.x+' '+toX+' '+dist+'';
2025 }
2026 if(scaleType== 'e')
2027 {
2028 trans_ShareScale=shareScale+",1";
2029 tx=prevbox.x;
2030 ty=prevbox.y;
2031 var dist=toX-(prevbox.x+prevbox.width); //dist2p(toX,b,c,d);
2032 var w=dist+prevbox.width;
2033 if(w<1){w=1;}
2034 tw=w;
2035 th=prevbox.height;
2036
2037 }
2038 if(scaleType== 'n')
2039 {
2040 trans_ShareScale="1,"+shareScale;
2041
2042 tx=prevbox.x;
2043 ty=toY;
2044 var dist=prevbox.y-toY;
2045 var h=dist+prevbox.height;
2046 if(h<1){h=1;}
2047 tw=prevbox.width;
2048 th=h;
2049
2050 }
2051 if( scaleType== 's')
2052 {
2053 trans_ShareScale="1,"+shareScale;
2054
2055 tx=prevbox.x;
2056 ty=prevbox.y;
2057 var dist=toY-(prevbox.y+prevbox.height); //dist2p(toX,b,c,d);
2058 var h=dist+prevbox.height;
2059 if(h<1){h=1;}
2060 tw=prevbox.width;
2061 th=h;
2062
2063 }
2064 }
2065 if(scaleType.length==2){
2066 if(scaleType== 'nw'){
2067 trans_ShareScale=shareScale+","+shareScale;
2068
2069 //var angle_diagonal=getAngle(prevbox.width,prevbox.height);
2070 var angle_diagonal=ang2v(prevbox.x,prevbox.y,prevbox.x+prevbox.width,prevbox.y+prevbox.height)
2071
2072 var ax= prevbox.x;
2073 var ay= prevbox.y;
2074 var bx= prevbox.x+prevbox.width;
2075 var by= prevbox.y+prevbox.height;
2076
2077 var cx= toX;
2078 var cy= toY;
2079 var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2));
2080 var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2));
2081 var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2082 this.editor.log(angle_diagonal* 180 / Math.PI);
2083
2084 var tx= section_a[1];
2085 var ty= section_a[2];
2086
2087 var ax= section_a[1];
2088 var ay= section_a[2];
2089 var bx= 0;
2090 var by= section_a[2] ;
2091
2092 var cx=prevbox.x+prevbox.width;
2093 var cy= prevbox.y;
2094
2095 var dx= prevbox.x+prevbox.width;
2096 var dy= 0;
2097
2098
2099 var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2100
2101 var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]);
2102
2103 var ax= section_a[1];
2104 var ay= section_a[2];
2105 var bx= section_a[1]
2106 var by= 0;
2107
2108 var cx= prevbox.x;
2109 var cy= prevbox.y+prevbox.height;
2110
2111 var dx= 0;
2112 var dy= prevbox.y+prevbox.height;
2113
2114
2115 var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2116
2117 var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]);
2118
2119
2120
2121
2122
2123 if(distx<1){distx=1;}
2124
2125
2126 if(disty<1){disty=1;}
2127 //document.forms[0].code.value=distx+' '+disty;
2128 tw=distx;
2129 th=disty;
2130
2131
2132 }
2133
2134 //////////////////// SE
2135
2136 if( scaleType== 'se'){
2137 trans_ShareScale=shareScale+","+shareScale;
2138
2139
2140 //var angle_diagonal=getAngle(prevbox.width,prevbox.height);
2141 var angle_diagonal=ang2v(prevbox.x,prevbox.y,prevbox.x+prevbox.width,prevbox.y+prevbox.height)
2142
2143
2144
2145 var ax= prevbox.x;
2146 var ay= prevbox.y;
2147 var bx= prevbox.x+prevbox.width;
2148 var by= prevbox.y+prevbox.height;
2149
2150 var cx= toX;
2151 var cy= toY;
2152 var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2));
2153 var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2));
2154
2155 var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2156
2157
2158
2159 //////////
2160 var tx= prevbox.x;
2161 var ty= prevbox.y;
2162
2163 var ax= section_a[1];
2164 var ay= section_a[2];
2165 var bx= 0;
2166 var by= section_a[2] ;
2167
2168 var cx=prevbox.x;
2169 var cy= prevbox.y;
2170
2171 var dx= prevbox.x;
2172 var dy= 0;
2173
2174
2175 var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2176
2177 /////////////////
2178
2179
2180 var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]);
2181
2182
2183 var ax= section_a[1];
2184 var ay= section_a[2];
2185 var bx= section_a[1]
2186 var by= 0;
2187
2188 var cx= prevbox.x;
2189 var cy= prevbox.y;
2190
2191 var dx=0;
2192 var dy= prevbox.y;
2193
2194
2195 var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2196
2197 ///////////////
2198
2199 var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]);
2200
2201
2202
2203 if(distx<1){distx=1;}
2204
2205
2206 if(disty<1){disty=1;}
2207
2208 tw=distx;
2209 th=disty;
2210
2211
2212 }
2213
2214 if(scaleType== 'ne'){
2215
2216 trans_ShareScale=shareScale+","+shareScale;
2217
2218 var angle_diagonal=ang2v(prevbox.x,prevbox.y+prevbox.height,prevbox.x+prevbox.width,prevbox.y)
2219 //var angle_diagonal=getAngle(prevbox.width,prevbox.height);
2220
2221
2222
2223
2224 var ax= prevbox.x;
2225 var ay= prevbox.y+prevbox.height;
2226 var bx= prevbox.x+prevbox.width;
2227 var by= prevbox.y;
2228
2229 var cx= toX;
2230 var cy= toY;
2231 var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2));
2232 var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2));
2233
2234
2235 this.editor.log(angle_diagonal);
2236
2237
2238 var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2239
2240
2241
2242 //////////
2243 var tx= prevbox.x;
2244 var ty= section_a[2];
2245
2246 var ax= section_a[1];
2247 var ay= section_a[2];
2248 var bx= 0;
2249 var by= section_a[2] ;
2250
2251 var cx=prevbox.x;
2252 var cy= prevbox.y;
2253
2254 var dx= prevbox.x;
2255 var dy= 0;
2256
2257
2258 var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2259
2260 /////////////////
2261
2262
2263 var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]);
2264
2265
2266 var ax= section_a[1];
2267 var ay= section_a[2];
2268 var bx= section_a[1];
2269 var by= 0;
2270
2271 var cx= prevbox.x;
2272 var cy= prevbox.y+prevbox.height;
2273
2274 var dx=0;
2275 var dy= prevbox.y+prevbox.height;
2276
2277
2278 var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2279
2280 ///////////////
2281
2282 var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]);
2283
2284
2285
2286 if(distx<1){distx=1;}
2287
2288
2289 if(disty<1){disty=1;}
2290 //document.forms[0].code.value=distx+' '+disty;
2291 tw=distx;
2292 th=disty;
2293
2294
2295
2296
2297
2298 }
2299 if(scaleType== 'sw'){
2300 trans_ShareScale=shareScale+","+shareScale;
2301
2302
2303
2304
2305 var angle_diagonal=ang2v(prevbox.x,prevbox.y+prevbox.height,prevbox.x+prevbox.width,prevbox.y)
2306 //var angle_diagonal=getAngle(prevbox.width,prevbox.height);
2307
2308
2309
2310
2311 var ax= prevbox.x;
2312 var ay= prevbox.y+prevbox.height;
2313 var bx= prevbox.x+prevbox.width;
2314 var by= prevbox.y;
2315
2316 var cx= toX;
2317 var cy= toY;
2318 var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2));
2319 var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2));
2320
2321
2322 this.editor.log(angle_diagonal);
2323
2324
2325 var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2326
2327
2328 //////////
2329 var tx= section_a[1];
2330 var ty= prevbox.y;
2331
2332 var ax= section_a[1];
2333 var ay= section_a[2];
2334 var bx= 0;
2335 var by= section_a[2] ;
2336
2337 var cx=prevbox.x+prevbox.width;
2338 var cy= prevbox.y+prevbox.height;
2339
2340 var dx= prevbox.x+prevbox.width;
2341 var dy= 0;
2342
2343
2344 var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2345 var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]);
2346
2347 /////////////////
2348 var ax= section_a[1];
2349 var ay= section_a[2];
2350 var bx= section_a[1];
2351 var by= 0;
2352
2353 var cx= prevbox.x;
2354 var cy= prevbox.y;
2355
2356 var dx=0;
2357 var dy= prevbox.y;
2358
2359
2360 var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy);
2361 var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]);
2362 ///////////////
2363
2364
2365
2366 if(distx<1){distx=1;}
2367
2368
2369 if(disty<1){disty=1;}
2370 //document.forms[0].code.value=distx+' '+disty;
2371 tw=distx;
2372 th=disty;
2373
2374 }
2375
2376 }
2377
2378
2379
2380 if(shape.tagName == 'rect')
2381 {
2382 //alert(data[0]);
2383
2384
2385 shape.style.left = tx + 'px';
2386 shape.style.top = ty + 'px';
2387 shape.style.height = th + 'px';
2388 shape.style.width = tw + 'px';
2389
2390 }
2391 else
2392 if(shape.tagName == 'text')
2393 {
2394 /*
2395 shape.setAttribute('x',tx);
2396 shape.setAttribute('y',ty);
2397 shape.setAttribute('width', tw);
2398 shape.setAttribute('height', th);
2399
2400 //previus.setAttribute('transform', "scale("+trans_ShareScale+")");
2401 shape.setAttribute('x', tx + 'px');
2402 shape.setAttribute('y', ty + 'px');
2403
2404 shape.setAttribute('textLength', parseInt(Math.round(tw)));
2405
2406 */
2407 }
2408 else
2409 if(shape.tagName == 'oval')
2410 {
2411 //shape.getAttribute('transform)
2412
2413 shape.style.left = tx + 'px';
2414 shape.style.top = ty + 'px';
2415 shape.style.height = th + 'px';
2416 shape.style.width = tw + 'px';
2417
2418
2419 }
2420 else
2421 if(shape.tagName == 'line')
2422 {
2423 shape.setAttribute('to',tx + 'px,' + ty + 'px');
2424 shape.setAttribute('from', tw + 'px,' + th + 'px');
2425
2426
2427 }
2428 else
2429 if (shape.tagName == 'polyline')
2430 {
2431
2432 }
2433 else
2434 if (shape.tagName == 'image')
2435 {
2436
2437 shape.style.left = tx + 'px';
2438 shape.style.top = ty + 'px';
2439 shape.style.height = th + 'px';
2440 shape.style.width = tw + 'px';
2441
2442 }
2443 else
2444 if (shape.tagName == 'shape')
2445 {
2446
2447 shape.style.left = tx + 'px';
2448 shape.style.top = ty + 'px';
2449 shape.style.height = th + 'px';
2450 shape.style.width = tw + 'px';
2451
2452 //document.forms[0].code.value='';
2453 //shape.setAttribute('transform', "scale("+trans_ShareScale+")");
2454
2455 }
2456
2457
2458
2459
2460
2461 };
2462
2463
2464
2465 VMLRenderer.prototype.rotateShape = function(shape, previus,toX, toY) {
2466
2467
2468
2469 //document.forms[0].code.value=$('xyinput').innerHTML;
2470 //document.getElementById('richdraw').style.cursor='e-resize';
2471 var box = this.bounds(shape);
2472 var prevbox=this.bounds(previus);
2473 var centerx= box.x+(box.width/2);
2474 var centery= box.y+(box.height/2);
2475 var coord=this.editor.inputxy;
2476
2477 var actual_angle=ang2v(centerx,centery,coord[0], coord[1]);
2478
2479 if(xrot<toX) { rotatexxx+=1;}else{rotatexxx-=1;}
2480 xrot=toX;
2481 yrot=toY;
2482
2483 var xtr=0;
2484 var ytr=0;
2485
2486 //var box= shape.getBBox();
2487 var tr1x= box.x;
2488 var tr1y= box.y;
2489
2490
2491
2492 toX+=xtr;
2493 toY+=xtr;
2494
2495 //var trax=parseFloat(toX-box.x); var tray= parseFloat(toY-box.y);
2496 var trax=parseFloat(box.x/2); var tray= parseFloat(box.y/2);
2497 var angler=Math.atan2(toX,toY);
2498 var angle=angler*180/Math.PI;
2499 // var T = shape.getCTM();
2500 //var rotini=T.a*(180 / Math.PI);
2501 //var angle=rotini*180/Math.PI;
2502 //var rot_angle=actual_angle*180/Math.PI;
2503 //document.forms[0].code.value=centerx+' '+centery+' '+coord[0]+' '+coord[1]+'____ '+rot_angle+' '+actual_angle*180/Math.PI;
2504
2505
2506 // matrix( a, b, c, d, e, f )
2507 // a c e
2508 // b d f
2509 // 0 0 1
2510 //a scale factor of 2, a rotation of 30 deg and a translation of (500,50)
2511 //T 1.732 -1 500 1 1.732 50 0 0 1
2512 //T 1 ad-bc d -c -de+cf -b a be-df 0 0 1
2513
2514 //shape.setAttribute('transform', "translate("+(-xshe)+","+(-yshe)+")");
2515
2516 // shape.setAttribute("transform", " matrix( a, b, c, d, e, f )");
2517 // shape.setAttribute('transform', "translate("+(box.x+(box.width/2))+","+(box.y+(box.height/2))+") rotate("+rotatexxx+") ");
2518 //shape.setAttribute('transform', "translate("+(box.x+(box.width/2))+","+(box.y+(box.height/2))+") rotate("+rotatexxx+") translate("+(-box.x-(box.width/2))+","+(-box.y-(box.height/2))+") ");
2519 //shape.setAttribute('transform', "rotate("+rotatexxx+","+(box.x+(box.width/2))+","+(box.y+(box.height/2))+")");
2520 //shape.setAttribute('transform', "rotate("+rotatexxx+","+(prevbox.x+(prevbox.width/2))+","+(prevbox.y+(prevbox.height/2))+")");
2521 //shape.setAttribute('rotation', rot_angle);
2522 shape.setAttribute('rotation', angle);
2523 //(prevbox.x+(prevbox.width/2))+","+(prevbox.y+(prevbox.height/2))+")");
2524
2525
2526
2527 }
2528
2529 //////////////////////////////
2530 /*H = 0;
2531 W = 0;
2532 LX = new Array();
2533 S = new Array();
2534 i = 0;
2535 b = true;
2536
2537 function SVG2VML(i){
2538 l = L[i];
2539 if(l.indexOf(" d=")>0){
2540 p = l.indexOf("fill:")+6;
2541 C = l.substring(p,p+7);
2542 p = l.indexOf(" d=")+4;
2543 q = l.lastIndexOf("z")-1;
2544 l = l.substring(p,q);
2545 l = l.replace(/M/g,"m");
2546 l = l.replace(/c/g,"v");
2547 l = l.replace(/l/g,"r");
2548 S = l.split(" ");
2549 l="";
2550 for(var j in S){
2551 c = S[j];
2552 p = c.substring(0,1);
2553 d = p>"9"?p:"";
2554 n = Math.round(c.substring(d!="") * 100);
2555 l+= (d+n+" ");
2556 }
2557 LX[i] = l;
2558 code = '<v:shape coordsize="'+(W*100)+','+(H*100)+'" class=vml strokeweight="2" strokecolor="'+C+'" filled="false" fillcolor = "'+C+'"/>';
2559 VML.insertAdjacentHTML("beforeEnd",code);
2560 } else {
2561 L[i] = LX[i] = ""
2562 VML.insertAdjacentHTML("beforeEnd","<span></span>");
2563 }
2564 }
2565 */
2566 //http://msdn2.microsoft.com/en-us/library/bb263897(VS.85).aspx
2567 //http://www.w3.org/TR/NOTE-VML
2568 //http://trac.openlayers.org/changeset/5285
2569 //http://vectorconverter.sourceforge.net/index.html
2570 //http://www.dhteumeuleu.com/colorsyntax/viewJS.php?src=svg2vml1.html
2571
2572
2573 VMLRenderer.prototype.getshapes = function(){
2574 return this.container.childNodes;
2575 }
2576
2577
2578 VMLRenderer.prototype.reflect = function(HorV) {
2579 };
2580
2581
2582
2583