rlm@46: /*---------------------------------------------------------------------------- rlm@46: SVGRENDERER 1.0 rlm@46: SVG Renderer For RichDraw rlm@46: ----------------------------------------------------------------------------- rlm@46: Created by Mark Finkle (mark.finkle@gmail.com) rlm@46: Implementation of SVG based renderer. rlm@46: ----------------------------------------------------------------------------- rlm@46: */ rlm@46: function AbstractRenderer() { rlm@46: rlm@46: }; rlm@46: rlm@46: AbstractRenderer.prototype.init = function(elem) {}; rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: function SVGRenderer() { rlm@46: this.base = AbstractRenderer; rlm@46: this.svgRoot = null; rlm@46: } rlm@46: rlm@46: rlm@46: SVGRenderer.prototype = new AbstractRenderer; rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.bounds = function(shape) { rlm@46: rlm@46: var box = shape.getBBox(); rlm@46: rlm@46: return { x:box.x, y:box.y, width:box.width, height: box.height }; rlm@46: rlm@46: }; rlm@46: rlm@46: SVGRenderer.prototype.init = function(elem) { rlm@46: this.container = elem; rlm@46: rlm@46: this.container.style.MozUserSelect = 'none'; rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: rlm@46: this.svgRoot = this.container.ownerDocument.createElementNS(svgNamespace, "svg"); rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', zoominit); rlm@46: this.svgRoot.setAttributeNS(null,'preserveAspectRatio','none'); rlm@46: this.svgRoot.setAttributeNS(null,'space','preserve'); rlm@46: this.container.appendChild(this.svgRoot); rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.view = function(left,top,width,height,viewBox,bgcolor) { rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var tokens = viewBox.split(' '); rlm@46: var margin=100; rlm@46: var wFront=parseInt(document.getElementById('FRONT').style.width) rlm@46: var hFront=parseInt(document.getElementById('FRONT').style.height) rlm@46: var tC=0 + ' ' + 0 + ' ' + wFront + ' ' + hFront; rlm@46: tokensCanvas= tC.split(' '); rlm@46: var w=parseFloat(tokens[2]); rlm@46: var h=parseFloat(tokens[3]); rlm@46: var wImage = w - parseFloat(tokens[0]); rlm@46: var hImage = h - parseFloat(tokens[1]); rlm@46: var wCanvas = wFront; rlm@46: var hCanvas = hFront; rlm@46: proporImage = hImage / wImage; rlm@46: proporCanvas = hCanvas / wCanvas; rlm@46: rlm@46: document.title= initialFile +' '+wImage+' x '+hImage; rlm@46: rlm@46: rlm@46: if(bgcolor != '') rlm@46: { rlm@46: this.container.style.backgroundColor=bgcolor; rlm@46: } else{ rlm@46: this.container.style.backgroundColor="#ffffff"; rlm@46: } rlm@46: if(viewMode=='preview') rlm@46: { rlm@46: if(proporCanvas==proporImage) rlm@46: { rlm@46: this.container.style.width =wFront+'px'; rlm@46: this.container.style.height =hFront+'px'; rlm@46: this.container.style.left =0+'px' rlm@46: this.container.style.top =0+'px' rlm@46: rlm@46: } rlm@46: if(proporCanvasproporImage) rlm@46: { rlm@46: var proportion= hFront/wFront; rlm@46: //var image_proportion= width/height; rlm@46: var image_proportion= h/w; rlm@46: var H=wFront*image_proportion; rlm@46: var leftover=(hFront-H)/2; rlm@46: rlm@46: this.container.style.width =wFront+'px'; rlm@46: this.container.style.height =H+'px'; rlm@46: this.container.style.left =0+'px' rlm@46: this.container.style.top =leftover+'px' rlm@46: } rlm@46: rlm@46: this.svgRoot.setAttributeNS(null,'x', left); rlm@46: this.svgRoot.setAttributeNS(null,'y', top); rlm@46: this.svgRoot.setAttributeNS(null,'width', parseInt(this.container.style.width)); rlm@46: this.svgRoot.setAttributeNS(null,'height', parseInt(this.container.style.height)); rlm@46: rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', viewBox); rlm@46: rlm@46: } rlm@46: if(viewMode=='canvas') rlm@46: { rlm@46: this.container.style.left = 0 + 'px'; rlm@46: this.container.style.top = 0 + 'px'; rlm@46: this.container.style.width = wFront + 'px'; rlm@46: this.container.style.height = hFront + 'px'; rlm@46: rlm@46: // margins 10% rlm@46: var percent=10; rlm@46: var percentX = wImage / percent; rlm@46: var percentY = hImage / percent; rlm@46: var cornerNEx = parseFloat(tokens[0])-percentX; rlm@46: var cornerNEy = parseFloat(tokens[1])-percentY; rlm@46: var percentRectW=wImage + percentX*2; rlm@46: var percentRectH=hImage + percentY*2; rlm@46: rlm@46: document.title= initialFile +' '+wImage+' x '+hImage; rlm@46: // ajust proporImage to proporCanvas rlm@46: if(proporCanvas==proporImage) rlm@46: { rlm@46: cornerNEx = parseFloat(tokens[0])-percentX rlm@46: cornerNEy = parseFloat(tokens[1])-percentY rlm@46: var wi=percentRectW; rlm@46: var he=percentRectH;//hImage+percentY+addHimage; rlm@46: zoominit=viewBox; rlm@46: zoominit1 = cornerNEx+' '+cornerNEy+' '+wi+' '+he; rlm@46: tokensZoom=zoominit1.split(' '); rlm@46: } rlm@46: rlm@46: if(proporCanvasproporImage) rlm@46: { rlm@46: // add to hImage rlm@46: var newHimage = percentRectH * ((hCanvas * percentRectW) / (wCanvas * percentRectH)) ;//newRectH * rlm@46: var diffImages=newHimage-h; rlm@46: cornerNEy = parseFloat(tokens[1]) - (diffImages / 2); rlm@46: var wi=percentRectW; rlm@46: var he=newHimage;//hImage+percentY+addHimage; rlm@46: zoominit=viewBox; rlm@46: zoominit1 = cornerNEx+' '+cornerNEy+' '+wi+' '+he; rlm@46: tokensZoom=zoominit1.split(' '); rlm@46: } rlm@46: /* this.svgRoot.setAttributeNS(null,'x', cornerNEx); rlm@46: this.svgRoot.setAttributeNS(null,'y', cornerNEy); rlm@46: this.svgRoot.setAttributeNS(null,'width', wi); rlm@46: this.svgRoot.setAttributeNS(null,'height',he); rlm@46: */ rlm@46: this.svgRoot.setAttributeNS(null,'x', 0); rlm@46: this.svgRoot.setAttributeNS(null,'y', 0); rlm@46: this.svgRoot.setAttributeNS(null,'width', wFront); rlm@46: this.svgRoot.setAttributeNS(null,'height',hFront); rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', zoominit1); rlm@46: rlm@46: rlm@46: } rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.zoomFrame = function(zoom){ rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', zoom); rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.rectDoc = function(viewBox) { rlm@46: var tokens = viewBox.split(' '); rlm@46: var wFront=parseInt(document.getElementById('FRONT').style.width) rlm@46: var hFront=parseInt(document.getElementById('FRONT').style.height) rlm@46: var tC=0 + ' ' + 0 + ' ' + wFront + ' ' + hFront; rlm@46: tokensCanvas= tC.split(' '); rlm@46: var Ey = parseFloat(tokensCanvas[3]) ; // (end) height canvas. Corner up-right rlm@46: var Hz = parseFloat(tokens[3]) ; // height zoom rlm@46: this.editor.unit = this.editor.initialUnit * (Hz/Ey) ; // 0 to 1 rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: rlm@46: var shape = document.getElementById('rectDoc'); rlm@46: if (shape) { rlm@46: this.remove(shape); rlm@46: } rlm@46: var rect=this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: rect.setAttributeNS(null, 'id', 'rectDoc'); rlm@46: rect.setAttributeNS(null, 'x', tokens[0] + 'px'); rlm@46: rect.setAttributeNS(null, 'y', tokens[1] + 'px'); rlm@46: rect.setAttributeNS(null, 'width', tokens[2]+ 'px'); rlm@46: rect.setAttributeNS(null, 'height', tokens[3] + 'px'); rlm@46: rect.setAttributeNS(null, 'fill', 'none'); rlm@46: rect.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect.setAttributeNS(null, 'stroke-width', this.editor.unit*2+'px'); rlm@46: // this.svgRoot.appendChild(rect) rlm@46: rlm@46: this.svgRoot.insertBefore( rect, this.svgRoot.firstChild ); rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.rectCanvas = function(docx,docy,docw,doch,viewBox) { rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var tokens = zoominit1.split(' '); rlm@46: var shape = document.getElementById('rectCanvas'); rlm@46: if (shape) { rlm@46: this.remove(shape); rlm@46: } rlm@46: var rect=this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: rect.setAttributeNS(null, 'id', 'rectBackground'); rlm@46: rect.setAttributeNS(null, 'x', tokens[0] + 'px'); rlm@46: rect.setAttributeNS(null, 'y', tokens[1] + 'px'); rlm@46: rect.setAttributeNS(null, 'width', tokens[2] + 'px'); rlm@46: rect.setAttributeNS(null, 'height', tokens[3] + 'px'); rlm@46: rect.setAttributeNS(null, 'fill', '#666666'); rlm@46: rect.setAttributeNS(null, 'stroke', 'none'); rlm@46: //this.svgRoot.appendChild(rect) rlm@46: this.svgRoot.insertBefore( rect, this.svgRoot.firstChild ); rlm@46: rlm@46: //this.index('rectBackground',0); rlm@46: rlm@46: /* var shape = document.getElementById('rectOverCanvas'); rlm@46: if (shape) { rlm@46: this.remove(shape); rlm@46: } rlm@46: var rect=this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: rect.setAttributeNS(null, 'id', 'rectOverCanvas'); rlm@46: rect.setAttributeNS(null, 'x', docx + 'px'); rlm@46: rect.setAttributeNS(null, 'y', docy + 'px'); rlm@46: rect.setAttributeNS(null, 'width', docw + 'px'); rlm@46: rect.setAttributeNS(null, 'height', doch + 'px'); rlm@46: rect.setAttributeNS(null, 'fill', 'none'); rlm@46: rect.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect.setAttributeNS(null, 'stroke-width', 1+'px'); rlm@46: // this.svgRoot.appendChild(rect) rlm@46: this.svgRoot.insertBefore( rect, this.svgRoot.lastChild ); rlm@46: */ rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.removeAll = function() rlm@46: { rlm@46: while( this.svgRoot.hasChildNodes () ) rlm@46: { rlm@46: this.svgRoot.removeChild( this.svgRoot.firstChild ); rlm@46: } rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.create = function(shape, fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, points, transform, parent, viewBox) { rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var xlinkNS="http://www.w3.org/1999/xlink"; rlm@46: rlm@46: var svg; rlm@46: rlm@46: if (shape == 'rect') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: svg.setAttributeNS(null, 'x', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y', top + 'px'); rlm@46: svg.setAttributeNS(null, 'width', width + 'px'); rlm@46: svg.setAttributeNS(null, 'height', height + 'px'); rlm@46: svg.setAttributeNS(null, 'rx', 0+'px'); rlm@46: svg.setAttributeNS(null, 'ry', 0+'px'); rlm@46: rlm@46: //svg.setAttributeNS(null,'transform', "translate(0,0)"); rlm@46: //svg.setAttributeNS(null,'transform', "translate('+left+','+top+')"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'ellipse' || shape == 'circle') { rlm@46: rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'ellipse'); rlm@46: svg.setAttributeNS(null, 'cx', (left + width / 2) + 'px'); rlm@46: svg.setAttributeNS(null, 'cy', (top + height / 2) + 'px'); rlm@46: if(shape == 'circle'){ rlm@46: svg.setAttributeNS(null, 'rx', (width / 2) + 'px'); rlm@46: svg.setAttributeNS(null, 'ry', (width / 2) + 'px'); rlm@46: }else{ rlm@46: svg.setAttributeNS(null, 'rx', (width / 2) + 'px'); rlm@46: svg.setAttributeNS(null, 'ry', (height / 2) + 'px'); rlm@46: rlm@46: } rlm@46: //svg.setAttributeNS(null,'transform', "translate('+left+','+top+')"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'roundrect') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: svg.setAttributeNS(null, 'x', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y', top + 'px'); rlm@46: if(textSize!=0 || textSize!=''){ var rounded=textSize; }else{var rounded=18;} rlm@46: svg.setAttributeNS(null, 'rx', rounded+'px'); rlm@46: svg.setAttributeNS(null, 'ry', rounded+'px'); rlm@46: svg.setAttributeNS(null, 'width', width + 'px'); rlm@46: svg.setAttributeNS(null, 'height', height + 'px'); rlm@46: //svg.setAttributeNS(null,'transform', "translate('+left+','+top+')"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'line') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'line'); rlm@46: svg.setAttributeNS(null, 'x1', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y1', top + 'px'); rlm@46: svg.setAttributeNS(null, 'x2', left + width + 'px'); rlm@46: svg.setAttributeNS(null, 'y2', top + height + 'px'); rlm@46: //svg.setAttributeNS(null,'transform', "translate('+left+','+top+')"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'polyline' || shape == 'polygon') { rlm@46: var xcenterpoly=xpArray; rlm@46: var ycenterpoly=ypArray; rlm@46: var thispath=''+xpArray[1]+','+ypArray[1]; rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, shape); rlm@46: svg.setAttributeNS(null, 'points', points); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'path') rlm@46: { rlm@46: var k = (Math.sqrt(2)-1)*4/3; rlm@46: var circle="M 0,1 L 0.552,1 1,0.552 1,0 1,-0.552 0.552,-1 0,-1 -0.552,-1 -1,-0.552 -1,0 -1,0.552 -0.552,1 0,1z" // 4th rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'path'); rlm@46: //svg.setAttributeNS(null, 'd', 'M '+thispath+' C'+thispath); rlm@46: svg.setAttributeNS(null, 'd', points); rlm@46: //svg.setAttributeNS(null,'transform', "translate(-80,-80)"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'controlpath') rlm@46: { rlm@46: var point='M '+left+','+top+' L '+(left+1)+','+(top+1)+'z' // 4th rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'path'); rlm@46: //svg.setAttributeNS(null, 'd', 'M '+thispath+' C'+thispath); rlm@46: svg.setAttributeNS(null, 'd', point); rlm@46: svg.setAttributeNS(null,'transform', "translate(0,0)"); rlm@46: svg.style.position = 'absolute'; rlm@46: } rlm@46: else if (shape == 'text') rlm@46: { rlm@46: var data = this.container.ownerDocument.createTextNode(textMessaje); rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'text'); rlm@46: svg.setAttributeNS(null, 'x', parseFloat(left) + 'px'); rlm@46: svg.setAttributeNS(null, 'y', parseFloat(top) + 'px'); rlm@46: svg.setAttributeNS(null, 'font-family', textFamily ); rlm@46: svg.setAttributeNS(null, 'font-size', parseFloat(textSize)); rlm@46: svg.style.position = 'absolute'; rlm@46: svg.appendChild(data); rlm@46: } rlm@46: else if (shape == 'clipPath') rlm@46: { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'clipPath'); rlm@46: } rlm@46: else if (shape == 'filter') rlm@46: { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'filter'); rlm@46: } rlm@46: else if (shape == 'feGaussianBlur') rlm@46: { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'filter'); rlm@46: svg.setAttributeNS(null, 'in','SourceGraphic'); rlm@46: svg.setAttributeNS(null, 'stdDeviation',parseFloat(left)); rlm@46: } rlm@46: else if (shape == 'linearGradient') rlm@46: { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'linearGradient'); rlm@46: svg.setAttributeNS(null, 'x1', left); rlm@46: svg.setAttributeNS(null, 'y1', top); rlm@46: svg.setAttributeNS(null, 'x2', width); rlm@46: svg.setAttributeNS(null, 'y2', height); rlm@46: svg.setAttributeNS(null, 'gradientUnits',textMessaje);//"userSpaceOnUse" rlm@46: svg.setAttributeNS(xlinkNS,'href', imageHref); rlm@46: rlm@46: } rlm@46: else if (shape == 'radialGradient') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'radialGradient'); rlm@46: svg.setAttributeNS(null, 'gradientUnits',textMessaje);//"userSpaceOnUse" rlm@46: svg.setAttributeNS(null, 'cx', left); rlm@46: svg.setAttributeNS(null, 'cy', top ); rlm@46: svg.setAttributeNS(null, 'fx', width); rlm@46: svg.setAttributeNS(null, 'fy', height); rlm@46: svg.setAttributeNS(null, 'r', lineWidth); rlm@46: svg.setAttributeNS(xlinkNS,'href', imageHref); rlm@46: } rlm@46: else if (shape == 'stop') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'stop'); rlm@46: svg.setAttributeNS(null, 'stop-color', fillColor); rlm@46: svg.setAttributeNS(null, 'stop-opacity', fillOpac); rlm@46: svg.setAttributeNS(null, 'offset', lineOpac); rlm@46: } rlm@46: else if (shape == 'defs') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'defs'); rlm@46: //svg.setAttributeNS(null, 'id', 'defs'); rlm@46: } rlm@46: else if (shape == 'group') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'g'); rlm@46: svg.setAttributeNS(null, 'x', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y', top + 'px'); rlm@46: svg.setAttributeNS(null, 'width', width + 'px'); rlm@46: svg.setAttributeNS(null, 'height', height + 'px'); rlm@46: svg.setAttributeNS(null, 'fill-opacity', parseFloat(fillOpac)); rlm@46: svg.setAttributeNS(null, 'fill', fillColor); rlm@46: //} rlm@46: rlm@46: //else if (shape == 'linearGradient') { rlm@46: //return false rlm@46: } rlm@46: else if (shape == 'pattern') { rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'pattern'); rlm@46: svg.setAttributeNS(null, 'x', left); rlm@46: svg.setAttributeNS(null, 'y', top); rlm@46: svg.setAttributeNS(null, 'width', width ); rlm@46: svg.setAttributeNS(null, 'height', height); rlm@46: svg.setAttributeNS(null, 'viewBox', viewBox); rlm@46: svg.setAttributeNS(null, 'patternUnits', 'userSpaceOnUse'); rlm@46: rlm@46: } rlm@46: else if (shape == 'use') { rlm@46: var svg = this.container.ownerDocument.createElementNS(svgNamespace, 'use'); rlm@46: svg.setAttributeNS(xlinkNS,'xlink:href', imageHref); rlm@46: } rlm@46: else if (shape == 'image') { rlm@46: /* svg = this.container.ownerDocument.createElementNS(svgNamespace, 'g'); rlm@46: svg.setAttributeNS(null, 'x', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y', top + 'px'); rlm@46: svg.setAttributeNS(null, 'width', width + 'px'); rlm@46: svg.setAttributeNS(null, 'height', height + 'px'); rlm@46: */ rlm@46: var svg = this.container.ownerDocument.createElementNS(svgNamespace, 'image'); rlm@46: svg.setAttributeNS(xlinkNS,'href', imageHref); rlm@46: svg.setAttributeNS(null, 'x', left + 'px'); rlm@46: svg.setAttributeNS(null, 'y', top + 'px'); rlm@46: svg.setAttributeNS(null, 'width', width + 'px'); rlm@46: svg.setAttributeNS(null, 'height', height + 'px'); rlm@46: svg.setAttributeNS(null, 'opacity', parseFloat(fillOpac)); rlm@46: svg.setAttributeNS(null, 'preserveAspectRatio','none');//xMinYMin slice rlm@46: //svg.setAttributeNS(null, 'viewbox', left+' '+top+' '+width+' '+height); rlm@46: //Ext.get(this.container).removeAllListeners(isvg) rlm@46: //svg.appendChild(isvg); rlm@46: /* rlm@46: var rsvg = this.container.ownerDocument.createElementNS(svgNamespace, 'rect'); rlm@46: rsvg.setAttributeNS(null, 'x', left + 'px'); rlm@46: rsvg.setAttributeNS(null, 'y', top + 'px'); rlm@46: rsvg.setAttributeNS(null, 'width', width + 'px'); rlm@46: rsvg.setAttributeNS(null, 'height', height + 'px'); rlm@46: rsvg.style.fill = fillColor; rlm@46: rsvg.style.stroke = lineColor; rlm@46: rsvg.style.strokeWidth = lineWidth; rlm@46: rsvg.setAttributeNS(null, 'opacity', '0.1'); rlm@46: rsvg.style.strokOpacity = lineOpac; rlm@46: // Ext.get(this.container).removeAllListeners(rsvg) rlm@46: svg.appendChild(rsvg); rlm@46: rlm@46: */ rlm@46: //svg.setAttributeNS(null, 'color-rendering', fillColor); rlm@46: //svg.setAttributeNS(null, 'display', 'inherit'); rlm@46: rlm@46: //alert(fillOpac+'lkjlkj'); rlm@46: //svg.setAttributeNS(null, 'fill-opacity', parseFloat(fillOpac)); rlm@46: rlm@46: /* if (fillColor.length == 0){fillColor = 'none';} rlm@46: if (lineColor.length == 0){lineColor = 'none';} rlm@46: svg.style.fill = fillColor; rlm@46: svg.style.stroke = lineColor; rlm@46: svg.style.strokeWidth = lineWidth; rlm@46: svg.style.fillOpacity = fillOpac; rlm@46: svg.style.strokOpacity = lineOpac; rlm@46: svg.style.setAttributeNS(null, 'fill', fillColor); rlm@46: svg.style.setAttributeNS(null, 'stroke', lineColor); rlm@46: svg.style.setAttributeNS(null, 'stroke-width', lineWidth); rlm@46: svg.style.setAttributeNS(null, 'fill-opacity', fillOpac); rlm@46: svg.style.setAttributeNS(null, 'stroke-opacity',lineOpac); rlm@46: rlm@46: */ rlm@46: } rlm@46: rlm@46: if(shape == 'zoom') rlm@46: { rlm@46: rlm@46: }else rlm@46: { rlm@46: if(transform!='') rlm@46: { rlm@46: svg.setAttributeNS(null, 'transform', transform); rlm@46: } rlm@46: rlm@46: var render=true; rlm@46: if(shape.indexOf('image')>=0){render=false;} rlm@46: //if(shape.indexOf('group')>=0){render=false;} rlm@46: if(shape.indexOf('linearGradient')>=0){render=false;} rlm@46: if(shape.indexOf('radialGradient')>=0){render=false;} rlm@46: if(shape.indexOf('stop')>=0){render=false;} rlm@46: if(shape.indexOf('def')>=0){render=false;} rlm@46: if(shape.indexOf('filter')>=0){render=false;} rlm@46: if(shape.indexOf('feGaussianBlur')>=0){render=false;} rlm@46: rlm@46: rlm@46: rlm@46: //|| shape != 'group' rlm@46: //if(shape != 'image' || shape != 'stop' || shape != 'def') rlm@46: if(render==true) rlm@46: { rlm@46: rlm@46: //var set = this.container.ownerDocument.createElementNS(svgNamespace, "style"); rlm@46: rlm@46: if (lineColor.length == 0){lineColor = 'none';} rlm@46: if (fillColor.length == 0){fillColor = 'none';} rlm@46: //if (lineWidth == NaN || lineWidth == 0 ){lineColor = '#000000';} rlm@46: rlm@46: rlm@46: // set.setAttributeNS(null, 'stroke', lineColor); rlm@46: //set.setAttributeNS(null, 'stroke-width', lineWidth); rlm@46: //set.setAttributeNS(null, 'fill-opacity', fillOpac); rlm@46: //set.setAttributeNS(null, 'stroke-opacity',lineOpac); rlm@46: //svg.appendChild(set); rlm@46: //svg.setAttributeNS(null, "style","fill:"+ fillColor+";stroke:"+lineColor+";strokeWidth:"+lineWidth+";fill-opacity:"+fillOpac+";stroke-opacity:"+lineOpac); rlm@46: // rlm@46: (fillColor!=''|| fillColor!=null )?svg.setAttributeNS(null, 'fill', fillColor):svg.setAttributeNS(null, 'fill', '#000000'); rlm@46: rlm@46: //svg.setAttributeNS(null, 'filter', filter); rlm@46: svg.setAttributeNS(null, 'stroke', lineColor); rlm@46: svg.setAttributeNS(null, 'stroke-width', parseFloat(lineWidth)); rlm@46: svg.setAttributeNS(null, 'fill-opacity', parseFloat(fillOpac)); rlm@46: svg.setAttributeNS(null, 'stroke-opacity',parseFloat(lineOpac)); rlm@46: svg.setAttributeNS(null, 'stroke-linejoin','round') rlm@46: rlm@46: /* rlm@46: rlm@46: rlm@46: rlm@46: svg.style.stroke = lineColor; rlm@46: svg.style.strokeWidth = lineWidth; rlm@46: svg.style.fillOpacity = fillOpac; rlm@46: svg.style.strokOpacity = lineOpac; rlm@46: if (fillColor.length == 0){fillColor = 'none';} rlm@46: rlm@46: if (lineColor.length == 0){lineColor = 'none';} rlm@46: */ rlm@46: } rlm@46: rlm@46: rlm@46: if(parent==''){ rlm@46: this.svgRoot.appendChild(svg); rlm@46: }else{ rlm@46: if(document.getElementById(parent)){ rlm@46: var parentShape = document.getElementById(parent); rlm@46: parentShape.appendChild(svg); rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: return svg; rlm@46: rlm@46: } rlm@46: rlm@46: }; rlm@46: rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.zoomFrame = function(zoom){ rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', zoom); rlm@46: rlm@46: rlm@46: } rlm@46: SVGRenderer.prototype.zoom = function(clicx,clicy){ rlm@46: /* rlm@46: function(direction, amount) { rlm@46: var viewBox = this.rootNode.getAttribute('viewBox'); rlm@46: var viewVals = viewBox.split(' '); rlm@46: if (amount == null) { rlm@46: amount = SVGElement.panFactor; rlm@46: } rlm@46: switch (direction) { rlm@46: case 'left': rlm@46: amount = 0 - amount; rlm@46: // intentionally fall through rlm@46: case 'right': rlm@46: var currentPosition = parseFloat(viewVals[0]); rlm@46: currentPosition += amount; rlm@46: viewVals[0] = currentPosition; rlm@46: break; rlm@46: case 'up': rlm@46: amount = 0 - amount; rlm@46: // intentionally fall through rlm@46: case 'down': rlm@46: var currentPosition = parseFloat(viewVals[1]); rlm@46: currentPosition += amount; rlm@46: viewVals[1] = currentPosition; rlm@46: break; rlm@46: case 'origin': rlm@46: // reset everything to initial values rlm@46: viewVals[0] = 0; rlm@46: viewVals[1] = 0; rlm@46: this.rootNode.currentScale = 1; rlm@46: this.rootNode.currentTranslate.x = 0; rlm@46: this.rootNode.currentTranslate.y = 0; rlm@46: break; rlm@46: } rlm@46: this.rootNode.setAttribute('viewBox', viewVals.join(' ')); rlm@46: */ rlm@46: rlm@46: rlm@46: rlm@46: //canvasWidth rlm@46: //canvasheight rlm@46: if(zoommode=='frame') rlm@46: { rlm@46: var viewBox = this.svgRoot.getAttributeNS(null,'viewBox'); rlm@46: rlm@46: //alert(viewBox); rlm@46: rlm@46: var viewBox = zoominit; rlm@46: var viewVals = viewBox.split(' '); rlm@46: rlm@46: zoomx = parseFloat(viewVals[0]); rlm@46: zoomy = parseFloat(viewVals[1]); rlm@46: zoomw = parseFloat(viewVals[2]); rlm@46: zoomh = parseFloat(viewVals[3]); rlm@46: proporDiagonal=1; rlm@46: } rlm@46: else rlm@46: { rlm@46: rlm@46: var viewBox = this.svgRoot.getAttributeNS(null,'viewBox'); rlm@46: rlm@46: var viewVals = viewBox.split(' '); rlm@46: var prevX = parseFloat(viewVals[0]); rlm@46: var prevY = parseFloat(viewVals[1]); rlm@46: var prevW = parseFloat(viewVals[2]); rlm@46: var prevH = parseFloat(viewVals[3]); rlm@46: var prevWidth=prevW-prevX; rlm@46: var prevHeight=prevH-prevY; rlm@46: rlm@46: } rlm@46: rlm@46: if(zoommode=='more') rlm@46: { rlm@46: fieldViewx=prevW*0.95; rlm@46: fieldViewy=prevH*0.95; rlm@46: diagonalFrame=dist2p(0,0,fieldViewx,fieldViewy); rlm@46: //diagonalAngle=getAngle(fieldViewx,fieldViewy); rlm@46: zoomx=(diagonalMidx+(diagonalFrame/2)*Math.cos(diagonalAngle+Math.PI));//-(fieldViewx/8);//-(canvasW/2)docx-fieldViewx; rlm@46: zoomy=(diagonalMidy+(diagonalFrame/2)*Math.sin(diagonalAngle+Math.PI));//-(fieldViewy/8);//-(canvasH/2);//docy-fieldViewy; rlm@46: zoomw=prevW*0.95; rlm@46: zoomh=prevH*0.95; rlm@46: rlm@46: rlm@46: proporDiagonal=diagonalFrame/diagonalinit; rlm@46: //alert(proporDiagonal); rlm@46: } rlm@46: if(zoommode=='minus') rlm@46: { rlm@46: fieldViewx=prevW*1.05; rlm@46: fieldViewy=prevH*1.05; rlm@46: diagonalFrame=dist2p(0,0,fieldViewx,fieldViewy); rlm@46: //diagonalAngle=getAngle(fieldViewx,fieldViewy); rlm@46: zoomx=(diagonalMidx+(diagonalFrame/2)*Math.cos(diagonalAngle+Math.PI));//-(fieldViewx/8);//-(canvasW/2)docx-fieldViewx; rlm@46: zoomy=(diagonalMidy+(diagonalFrame/2)*Math.sin(diagonalAngle+Math.PI));//-(fieldViewy/8);//-(canvasH/2);//docy-fieldViewy; rlm@46: zoomw=prevW*1.05; rlm@46: zoomh=prevH*1.05; rlm@46: proporDiagonal=diagonalFrame/diagonalinit; rlm@46: rlm@46: } rlm@46: if(zoommode=='window') rlm@46: { rlm@46: rlm@46: zoomx=c.mouseDownX; rlm@46: zoomy=c.mouseDownY; rlm@46: var dF=dist2p(c.mouseDownX,c.mouseDownY,clicx,clicy); rlm@46: //var mid=pmd2pb(c.clicX,c.clicX,clicx,clicy,0.5) rlm@46: zoomw=dF*proporDoc;//(mid[1]+(dF/2)*Math.cos(diagonalAngle+Math.PI)); rlm@46: zoomh=dF;//(mid[2]+(dF/2)*Math.sin(diagonalAngle+Math.PI)); rlm@46: rlm@46: rlm@46: } rlm@46: var direction=0; rlm@46: if(zoommode=='hand') rlm@46: { rlm@46: direction=ang2v(clicx,clicy,centerZoomx,centerZoomy); rlm@46: var distance=dist2p(clicx,clicy,centerZoomx,centerZoomy); rlm@46: var left = prevX+distance*Math.cos(direction); rlm@46: var top = prevY+distance*Math.sin(direction); rlm@46: makeWorkSite(prevH,left,top); rlm@46: } rlm@46: direction=direction*180/Math.PI; rlm@46: //this.svgRoot.currentScale = zoomscale+0.1; rlm@46: //this.svgRoot.currentTranslate.x = 0; rlm@46: //this.svgRoot.currentTranslate.y = 0; rlm@46: //var resultPosx=clicx-((prevscalex-posx)/2);//-Math.abs(posx+clicx) rlm@46: //var resultPosy=clicy-((prevscalex-posy)/2);//-Math.abs(posy+clicy) rlm@46: //var resultPosx=-Math.abs(posx+clicx); rlm@46: //var resultPosy=-Math.abs(posy+clicy); rlm@46: rlm@46: this.svgRoot.setAttributeNS(null,'viewBox', (zoomx)+' '+(zoomy)+' '+zoomw+' '+zoomh+''); rlm@46: var viewBox = this.svgRoot.getAttributeNS(null,'viewBox'); rlm@46: //$('status').innerHTML=' '+viewBox; rlm@46: //alert(direction+'__'+prevZoomCenterx+' '+prevZoomCentery+' '+centerZoomx+' '+centerZoomy); rlm@46: } rlm@46: rlm@46: //this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,'','' rlm@46: SVGRenderer.prototype.datacreate = function(fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, transform) { rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var svg; rlm@46: svg = this.container.ownerDocument.createElementNS(svgNamespace, 'path'); rlm@46: svg.setAttributeNS(null, 'd', data); rlm@46: svg.setAttributeNS(null,'transform', "translate(0,0)"); rlm@46: svg.style.position = 'absolute'; rlm@46: if (fillColor.length == 0){fillColor = 'none';} rlm@46: svg.setAttributeNS(null, 'fill', fillColor); rlm@46: if (lineColor.length == 0){lineColor = 'none';} rlm@46: svg.setAttributeNS(null, 'stroke', lineColor); rlm@46: svg.setAttributeNS(null, 'stroke-width', lineWidth); rlm@46: this.svgRoot.appendChild(svg); rlm@46: return svg; rlm@46: }; rlm@46: rlm@46: SVGRenderer.prototype.querySelected = function(shape,centerx,centery,width,height) rlm@46: { rlm@46: var result = true; rlm@46: var shapes='names: g, image, rect, path, ellipse, circle, text, line, '; rlm@46: rlm@46: //if(shape.getBBox && shape) rlm@46: if( shapes.indexOf(' '+shape.tagName+',')>0) rlm@46: { rlm@46: rlm@46: var box = shape.getBBox(); rlm@46: }else rlm@46: { rlm@46: return false; rlm@46: } rlm@46: var p1x = box.x; rlm@46: if(Math.abs(p1x-centerx)>width){result = false} rlm@46: rlm@46: var p1y = box.y; rlm@46: if(Math.abs(p1y-centery)>height){result = false} rlm@46: rlm@46: var p2x = box.x+box.width; rlm@46: if(Math.abs(p2x-centerx)>width){result = false} rlm@46: rlm@46: var p2y = box.y; rlm@46: if(Math.abs(p2y-centery)>height){result = false} rlm@46: rlm@46: var p3x = box.x+box.width; rlm@46: if(Math.abs(p3x-centerx)>width){result = false} rlm@46: rlm@46: var p3y = box.y+box.height; rlm@46: if(Math.abs(p3y-centery)>height){result = false} rlm@46: rlm@46: var p4x = box.x; rlm@46: if(Math.abs(p4x-centerx)>width){result = false} rlm@46: rlm@46: var p4y = box.y+box.height; rlm@46: if(Math.abs(p4y-centery)>height){result = false} rlm@46: rlm@46: if(result) rlm@46: { rlm@46: return { 'in':result, 'cornersx': p1x+','+p2x+','+p3x+','+p4x+',' ,'cornersy': p1y+','+p2y+','+p3y+','+p4y+',' }; rlm@46: } rlm@46: else rlm@46: { rlm@46: return { 'in':result } rlm@46: } rlm@46: //center.distanceFrom(point1); rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.searchBoxes = function() rlm@46: { rlm@46: var base = this.svgRoot; rlm@46: rlm@46: var NumNodes = base.childNodes.length; rlm@46: var chain= ''; rlm@46: for(i = 0;i < NumNodes;i++) rlm@46: { rlm@46: if (base.childNodes[i].getBBox) rlm@46: { rlm@46: chain+=base.childNodes[i].id + ';' rlm@46: } rlm@46: } rlm@46: chain+='' rlm@46: return chain; rlm@46: rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.DrawBorder= function(numNode, targetElement ) rlm@46: { rlm@46: var shapes='names: g, image, rect, path, ellipse, circle, text, line, '; rlm@46: rlm@46: //if(shape.getBBox && shape) rlm@46: if( shapes.indexOf(' '+targetElement.tagName+',')>0) rlm@46: { rlm@46: var bbox = targetElement.getBBox(); rlm@46: var svgns = 'http://www.w3.org/2000/svg'; rlm@46: rlm@46: var outline = this.container.ownerDocument.createElementNS(svgns, 'rect'); rlm@46: outline.setAttributeNS( null, 'x', bbox.x - 2 ); rlm@46: outline.setAttributeNS( null, 'y', bbox.y - 2 ); rlm@46: outline.setAttributeNS( null, 'width', bbox.width + 4 ); rlm@46: outline.setAttributeNS( null, 'height', bbox.height + 4 ); rlm@46: outline.setAttributeNS( null, 'stroke', '#ff00ff' ); rlm@46: outline.setAttributeNS( null, 'fill', 'none' ); rlm@46: outline.setAttributeNS( null, 'id', 'shapeBoxed'+numNode ); rlm@46: rlm@46: targetElement.parentNode.insertBefore( outline, targetElement ); rlm@46: return 'shapeBoxed'+numNode; rlm@46: } rlm@46: else rlm@46: { rlm@46: return false rlm@46: } rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.index = function(shape,order) { rlm@46: rlm@46: if(order==-1) rlm@46: { rlm@46: this.svgRoot.appendChild( shape ); rlm@46: } rlm@46: if(order==0){ rlm@46: rlm@46: this.svgRoot.insertBefore( shape, shape.parentNode.firstChild ); rlm@46: } rlm@46: rlm@46: if(order==1 || order==2) rlm@46: { rlm@46: var id=shape.getAttributeNS(null, 'id'); rlm@46: //alert(id); rlm@46: rlm@46: rlm@46: var numNodes=this.svgRoot.childNodes.length; rlm@46: //alert(numNodes); rlm@46: rlm@46: var num=0; rlm@46: for(var i = 1; i < numNodes; i++) rlm@46: { rlm@46: rlm@46: var etiq=this.svgRoot.childNodes[i].getAttributeNS(null, 'id'); rlm@46: if (etiq==id) rlm@46: { rlm@46: num=i; rlm@46: rlm@46: } rlm@46: } rlm@46: //alert(num); rlm@46: if(order==1) rlm@46: { rlm@46: if((num-1)>=-1) rlm@46: { rlm@46: this.svgRoot.insertBefore( shape, this.svgRoot.childNodes[num-1]); rlm@46: } rlm@46: } rlm@46: if(order==2){ rlm@46: if((num+1)2) rlm@46: { rlm@46: if(rot.length>2){ union=',';} rlm@46: cadScale='scale('+scl+')'; rlm@46: if(scl.indexOf('-')!=-1) rlm@46: { rlm@46: var dist= dist2p(left,top,box.x,box.y); rlm@46: rlm@46: left=left; rlm@46: } rlm@46: if(scl.indexOf(',-')!=-1 || scl.indexOf(', -')!=-1 ) rlm@46: { rlm@46: //top=eval('-'+top); rlm@46: var dist= dist2p(left,top,box.x,box.y); rlm@46: top=top; rlm@46: } rlm@46: rlm@46: } rlm@46: //shape.setAttributeNS(null,'transform', 'rotate('+(angle)+', '+centerx+', '+centery+')'); rlm@46: shape.setAttributeNS(null,'transform', cadRot+union+cadScale); rlm@46: rlm@46: //var angleRad=angle*Math.PI/180; rlm@46: rlm@46: rlm@46: rlm@46: //dist=dist2p(x,y,left, top) ; rlm@46: rotated=true; rlm@46: rlm@46: } rlm@46: //left=left-box.x; rlm@46: //top=top-box.y; rlm@46: //left = centerx-left; rlm@46: //top = centery-top; rlm@46: rlm@46: contmove++; rlm@46: rlm@46: if (shape.tagName == 'rect'){ rlm@46: /* var dudy= shape.parentNode; rlm@46: if(dudy.tagName=='g'){ rlm@46: document.forms[0].code.value= 'this g ============ '; rlm@46: shape.setAttributeNS(null, 'x', left); rlm@46: shape.setAttributeNS(null, 'y', top); rlm@46: rlm@46: dudy.setAttributeNS(null, 'x', left); rlm@46: dudy.setAttributeNS(null, 'y', top); rlm@46: dudy.childNodes[0].setAttributeNS(null, 'x', left); rlm@46: dudy.childNodes[0].setAttributeNS(null, 'y', top); rlm@46: rlm@46: }else{ rlm@46: //document.forms[0].code.value= box.x+' '+box.y+' formX Y'+ fromX+'_'+fromY+' left '+left+'_'+top+'=============='; rlm@46: //document.forms[0].code.value+= tran+' rot '+ angle+'_'+x+'_'+y+' dist '+dist; rlm@46: if(rotated){ rlm@46: //shape.setAttributeNS(null, 'x', box.x*Math.cos(angleRad)) ; rlm@46: //shape.setAttributeNS(null, 'y', box.y*Math.sin(angleRad)) ; rlm@46: shape.setAttributeNS(null, 'x', left); rlm@46: shape.setAttributeNS(null, 'y', top); rlm@46: rlm@46: rlm@46: }else{ rlm@46: */ rlm@46: shape.setAttributeNS(null, 'x', left); rlm@46: shape.setAttributeNS(null, 'y', top); rlm@46: //} rlm@46: //$('option_rect_trx').value= left; rlm@46: //$('option_rect_try').value= top; rlm@46: // var h=shape.getAttributeNS(null, 'height'); rlm@46: //var w=shape.getAttributeNS(null, 'width'); rlm@46: //document.forms[0].code.value= h+' '+w; rlm@46: //} rlm@46: } rlm@46: if (shape.tagName == 'g') rlm@46: { rlm@46: //this.editor.log(shape.tagName+' =============='); rlm@46: rlm@46: shape.setAttributeNS(null, 'x', left); rlm@46: shape.setAttributeNS(null, 'y', top); rlm@46: shape.childNodes[0].setAttributeNS(null, 'x', left + 'px'); rlm@46: shape.childNodes[0].setAttributeNS(null, 'y', top + 'px'); rlm@46: shape.childNodes[1].setAttributeNS(null, 'x', left + 'px'); rlm@46: shape.childNodes[1].setAttributeNS(null, 'y', top + 'px'); rlm@46: rlm@46: } rlm@46: if (shape.tagName == 'image'){ rlm@46: shape.setAttributeNS(null, 'x',left + 'px'); rlm@46: shape.setAttributeNS(null, 'y', top + 'px'); rlm@46: //$('option_img_trx').value= left; rlm@46: //$('option_img_try').value= top; rlm@46: var h=shape.getAttributeNS(null, 'height'); rlm@46: var w=shape.getAttributeNS(null, 'width'); rlm@46: // this.editor.log( h+' '+w); rlm@46: } rlm@46: if (shape.tagName == 'text'){ rlm@46: var size=parseFloat(shape.getAttributeNS(null, 'font-size')); rlm@46: //$('code').value=size; rlm@46: shape.setAttributeNS(null, 'x', left + 'px'); rlm@46: shape.setAttributeNS(null, 'y', parseFloat(top+size) + 'px'); rlm@46: //$('option_text_trx').value= left; rlm@46: //$('option_text_try').value= top; rlm@46: rlm@46: } rlm@46: if (shape.tagName == 'line'){ rlm@46: var deltaX = shape.getBBox().width; rlm@46: var deltaY = shape.getBBox().height; rlm@46: shape.setAttributeNS(null, 'x1', left + 'px'); rlm@46: shape.setAttributeNS(null, 'y1', top + 'px'); rlm@46: rlm@46: shape.setAttributeNS(null, 'x2', left + deltaX + 'px'); rlm@46: shape.setAttributeNS(null, 'y2', top + deltaY + 'px'); rlm@46: //$('option_line_trx').value= left; rlm@46: //$('option_line_try').value= top; rlm@46: rlm@46: } rlm@46: if (shape.tagName == 'ellipse'){ rlm@46: var putx=left + (shape.getBBox().width / 2) rlm@46: var puty= top + (shape.getBBox().height / 2) rlm@46: shape.setAttributeNS(null, 'cx', putx + 'px'); rlm@46: shape.setAttributeNS(null, 'cy', puty + 'px'); rlm@46: //$('option_ellipse_trx').value= putx; rlm@46: //$('option_ellipse_try').value= puty; rlm@46: rlm@46: } rlm@46: if (shape.tagName == 'path' || shape.tagName == 'polyline' ) { rlm@46: rlm@46: if(contmove==1){ rlm@46: xshe=left; rlm@46: yshe=top; rlm@46: } rlm@46: var path=shape.getAttributeNS(null, 'd'); rlm@46: path=path.replace(/, /g, ','); rlm@46: path=path.replace(/ ,/g, ','); rlm@46: var ps =path.split(" ") rlm@46: var pcc = ""; rlm@46: var point =ps[0].split(","); rlm@46: rlm@46: rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var num1= parseFloat(point[1]); rlm@46: rlm@46: var ang= ang2v(box.x,box.y,left,top) ; rlm@46: var angle = Math.round((ang/Math.PI* 2)* 360); rlm@46: var angx = Math.cos(ang); rlm@46: var angy = Math.sin(ang); rlm@46: var dist= dist2p(left,top,box.x,box.y); rlm@46: var xinc=dist*angx; rlm@46: var yinc=dist*angy; rlm@46: var re = /^[-]?\d*\.?\d*$/; rlm@46: for(var i = 0; i < ps.length; i++) rlm@46: { rlm@46: if(ps[i].indexOf(',')>0){ rlm@46: rlm@46: var point =ps[i].split(","); rlm@46: var char1=point[0].substring(0,1); rlm@46: if(char1=='A' || char1=='a'){isArc=true; contArc=0;} rlm@46: if(isArc==true){contArc++} rlm@46: if(contArc==4){contArc=0; isArc=false} rlm@46: rlm@46: //if (isNaN(valnum)) rlm@46: if (!char1.match(re)) rlm@46: { rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var text=char1; rlm@46: }else{ rlm@46: if(isArc==true && contArc==2 ) rlm@46: { rlm@46: var num0= point[0]; rlm@46: }else{ rlm@46: var num0= parseFloat(point[0]); rlm@46: } rlm@46: var text=''; rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: if(isArc==true && contArc==2) rlm@46: { rlm@46: point[1]= point[1].toString() ; rlm@46: } rlm@46: else rlm@46: { rlm@46: rlm@46: num0+=xinc; rlm@46: point[1]= parseFloat(point[1]); rlm@46: point[1]+=yinc; rlm@46: rlm@46: } rlm@46: var cx=num0; rlm@46: rlm@46: var cy=point[1]; rlm@46: pcc+=text+cx+','+cy+' '; rlm@46: }else{ rlm@46: pcc+=ps[i]+' '; rlm@46: } rlm@46: } rlm@46: rlm@46: shape.setAttributeNS(null,'d', pcc); rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: //$('status').innerHTML=typeTransform+': '+left+' '+top; rlm@46: //$('option_select_trx').value= left; rlm@46: //$('option_select_try').value= top; rlm@46: rlm@46: rlm@46: rlm@46: }; rlm@46: rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.track = function(shape) { rlm@46: // TODO rlm@46: }; rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.clic = function(shape) { rlm@46: var end=''; rlm@46: if(data_path_close==true){end='z';} rlm@46: var maxcont=setPoints.length; rlm@46: var thispath='M'+setPoints[0]+' '; rlm@46: $('someinfo').value=maxcont; rlm@46: rlm@46: for(var conta=1;conta< maxcont;conta++){ rlm@46: thispath+='L'+setPoints[conta]+' '; rlm@46: } rlm@46: //var pointshape=shape.getAttributeNS(null,"d"); rlm@46: //shape.setAttributeNS(null,'d',thispath+end); rlm@46: var path=thispath+end; rlm@46: rlm@46: shape.setAttributeNS(null,'d',path); rlm@46: $('control_codebase').value=path; rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) { rlm@46: var deltaX = toX - fromX; rlm@46: var deltaY = toY - fromY; rlm@46: rlm@46: /* if (lineColor.length == 0){lineColor = 'none';} rlm@46: if (fillColor.length == 0){fillColor = 'none';} rlm@46: shape.style.fill = fillColor; rlm@46: shape.style.stroke = lineColor; rlm@46: shape.style.strokeWidth = lineWidth; rlm@46: shape.style.fillOpacity = fillOpac; rlm@46: shape.style.strokOpacity = lineOpac; rlm@46: */ rlm@46: if (shape.tagName == 'rect' ) rlm@46: { rlm@46: rlm@46: rlm@46: if (deltaX < 0) { rlm@46: shape.setAttributeNS(null, 'x', toX + 'px'); rlm@46: shape.setAttributeNS(null, 'width', -deltaX + 'px'); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'width', deltaX + 'px'); rlm@46: } rlm@46: rlm@46: if (deltaY < 0) rlm@46: { rlm@46: shape.setAttributeNS(null, 'y', toY + 'px'); rlm@46: shape.setAttributeNS(null, 'height', -deltaY + 'px'); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'height', deltaY + 'px'); rlm@46: } rlm@46: /*shape.style.fill = fillColor; rlm@46: shape.style.stroke = lineColor; rlm@46: shape.style.strokeWidth = lineWidth; rlm@46: shape.style.fillOpacity = fillOpac; rlm@46: shape.style.strokOpacity = lineOpac; rlm@46: */ rlm@46: rlm@46: } rlm@46: rlm@46: /* if ( shape.tagName == 'simage' ) rlm@46: { rlm@46: var img=shape.firstChild;//nodeName;//nodparseFloatue;//nodes.item(0); rlm@46: //alert(img); rlm@46: if (deltaX < 0) { rlm@46: shape.setAttributeNS(null, 'x', parseFloat(toX) + 'px'); rlm@46: shape.setAttributeNS(null, 'width', parseFloat(-deltaX) + 'px'); rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'width', parseFloat(deltaX) + 'px'); rlm@46: } rlm@46: rlm@46: if (deltaY < 0) rlm@46: { rlm@46: shape.setAttributeNS(null, 'y', parseFloat(toY) + 'px'); rlm@46: shape.setAttributeNS(null, 'height', parseFloat(-deltaY) + 'px'); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'height', parseFloat(deltaY) + 'px'); rlm@46: } rlm@46: var h=shape.getAttributeNS(null, 'height'); rlm@46: var w=shape.getAttributeNS(null, 'width'); rlm@46: document.forms[0].code.value= h+' '+w; rlm@46: rlm@46: rlm@46: rlm@46: }*/ rlm@46: if (shape.tagName == 'g' || shape.tagName == 'image') rlm@46: { rlm@46: rlm@46: rlm@46: if (deltaX < 0) rlm@46: { rlm@46: shape.setAttributeNS(null, 'x', parseFloat(toX) + 'px' ); rlm@46: shape.setAttributeNS(null, 'width', parseFloat(-deltaX) + 'px'); rlm@46: rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'width', parseFloat(deltaX) + 'px'); rlm@46: } rlm@46: rlm@46: if (deltaY < 0) rlm@46: { rlm@46: shape.setAttributeNS(null, 'y', parseFloat(toY) + 'px'); rlm@46: shape.setAttributeNS(null, 'height', parseFloat(-deltaY) + 'px' ); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'height', parseFloat(deltaY) + 'px'); rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: if (shape.tagName == 'ellipse') { rlm@46: if (deltaX < 0) { rlm@46: shape.setAttributeNS(null, 'cx', (fromX + deltaX / 2) + 'px'); rlm@46: shape.setAttributeNS(null, 'rx', (-deltaX / 2) + 'px'); rlm@46: } rlm@46: else { rlm@46: shape.setAttributeNS(null, 'cx', (fromX + deltaX / 2) + 'px'); rlm@46: shape.setAttributeNS(null, 'rx', (deltaX / 2) + 'px'); rlm@46: } rlm@46: rlm@46: if (deltaY < 0) { rlm@46: shape.setAttributeNS(null, 'cy', (fromY + deltaY / 2) + 'px'); rlm@46: shape.setAttributeNS(null, 'ry', (-deltaY / 2) + 'px'); rlm@46: } rlm@46: else { rlm@46: shape.setAttributeNS(null, 'cy', (fromY + deltaY / 2) + 'px'); rlm@46: shape.setAttributeNS(null, 'ry', (deltaY / 2) + 'px'); rlm@46: } rlm@46: } rlm@46: if (shape.tagName == 'line') { rlm@46: shape.setAttributeNS(null, 'x2', toX); rlm@46: shape.setAttributeNS(null, 'y2', toY); rlm@46: } rlm@46: if (shape.tagName == 'polyline') { rlm@46: rlm@46: xpArray.push(toX); rlm@46: ypArray.push(toY); rlm@46: var thispath=''+xpArray[1]+','+ypArray[1]; rlm@46: var thispath1=''; rlm@46: var thispath2=''; rlm@46: var maxcont=xpArray.length; rlm@46: rlm@46: for(var conta=2;conta< maxcont;conta++){ rlm@46: thispath1+=' '+xpArray[conta]+' '+ypArray[conta]; rlm@46: thispath2+=' '+xpArray[conta]+', '+ypArray[conta]; rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: shape.setAttributeNS(null,'points',thispath+thispath1); rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: if (shape.tagName == 'path') { rlm@46: rlm@46: if (selectmode == 'controlpath') rlm@46: { rlm@46: var end=''; rlm@46: if(data_path_close==true){end='z';} rlm@46: rlm@46: var thispath='M'+setPoints[0]+' '; rlm@46: var maxcont=setPoints.length; rlm@46: rlm@46: for(var conta=1;conta< maxcont;conta++){ rlm@46: thispath+='L'+setPoints[conta]+' '; rlm@46: rlm@46: rlm@46: } rlm@46: var path=thispath+'L'+toX+','+toY+end; rlm@46: //var pointshape=shape.getAttributeNS(null,"d"); rlm@46: shape.setAttributeNS(null,'d',path); rlm@46: document.forms[0].control_codebase.value=path; rlm@46: } rlm@46: else rlm@46: { rlm@46: rlm@46: xpArray.push(toX); rlm@46: ypArray.push(toY); rlm@46: rlm@46: var thispath=''+xpArray[1]+','+ypArray[1]; rlm@46: var thispath1=''; rlm@46: var thispath2=''; rlm@46: var maxcont=xpArray.length; rlm@46: rlm@46: for(var conta=2;conta< maxcont;conta++){ rlm@46: //thispath1+=' '+xpArray[conta]+' '+ypArray[conta]; rlm@46: thispath2+=' '+xpArray[conta]+','+ypArray[conta]; rlm@46: //if((conta+2)%3==0){thispath2+=' C';} rlm@46: } rlm@46: var end=''; rlm@46: if(data_path_close==true){end='z';} rlm@46: shape.setAttributeNS(null,'d','M '+thispath+ ' L'+thispath2+end); rlm@46: rlm@46: rlm@46: rlm@46: /* rlm@46: rlm@46: var pointshape=shape.getAttributeNS(null,"points"); rlm@46: var thispoint=' '+toX+' '+toY; rlm@46: $('status').innerHTML =pointshape; rlm@46: shape.setAttributeNS(null,'points',pointshape+thispoint) rlm@46: shape.setAttributeNS(null, 'stroke-width', "25"); rlm@46: shape.setAttributeNS(null, 'fill', "#FFFF00"); rlm@46: rlm@46: //shape.points.push(toX); rlm@46: //shape.points.push(toY); rlm@46: //shape.setAttribute("points",pointshape+); rlm@46: // var maxcont=xpArray.length-1; rlm@46: var thispath=''+xpArray[1]+','+ypArray[1]; rlm@46: var maxcont=xpArray.length; rlm@46: //alert(maxcont); rlm@46: for(var conta=2;conta< maxcont;conta++){ rlm@46: thispath+=','+xpArray[conta]+','+ypArray[conta]; rlm@46: } rlm@46: //alert(shape.points[1]); rlm@46: //shape.setAttribute("points",thispath); rlm@46: //points.Value = thispath; rlm@46: var thispath=''+xpArray[1]+','+ypArray[1]; rlm@46: var maxcont=xpArray.length; rlm@46: //alert(maxcont); rlm@46: for(var conta=1;conta< maxcont;conta++){ rlm@46: thispath+=','+xpArray[conta]+','+ypArray[conta]; rlm@46: } rlm@46: rlm@46: shape.points.Value = thispath; rlm@46: */ rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: /* rlm@46: rlm@46: rlm@46: //this.renderer.move(this.selected, this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY); rlm@46: // shape.setAttributeNS(null,'transform', "translate("+(toX)+","+(toy)+")"); rlm@46: rlm@46: rlm@46: rlm@46: var thispath=''+xpArray[0]+','+ypArray[0]; rlm@46: var maxcont=xpArray.length; rlm@46: //shape.setAttributeNS(null,'transform', "translate("+toX+","+toY+")"); rlm@46: for(var conta=1;conta< maxcont;conta++){ rlm@46: thispath+=','+xpArray[conta]+','+ypArray[conta]; rlm@46: } rlm@46: rlm@46: shape.setAttributeNS(null, 'x', toX); rlm@46: shape.setAttributeNS(null, 'y', toY); rlm@46: shape.setAttributeNS(null, 'points', thispath); rlm@46: */ rlm@46: } rlm@46: } rlm@46: if (shape == 'text') {} rlm@46: rlm@46: }; rlm@46: SVGRenderer.prototype.tocurve = function() rlm@46: { rlm@46: var points=$('control_codebase').value.split('L'); rlm@46: var chain=''; rlm@46: chain+=points[0]+'C'; rlm@46: var numpoints=points.length-1; rlm@46: for(var a=1;a=0) rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: if(mystyle!= null){ rlm@46: //var estilo=shape.getAttribute('style'); rlm@46: var data; rlm@46: rlm@46: var estilo=generateJSON(mystyle); rlm@46: eval("data="+estilo); rlm@46: //var data=eval('"'+estilo+'"'); rlm@46: //var data=estilo.evalJSON(); rlm@46: rlm@46: (data["font-size"])?shInfo.textSize=data["font-size"]:shInfo.textSize; rlm@46: (data["font-family"])?shInfo.textFamily=data["font-family"]:shInfo.textFamily; rlm@46: rlm@46: (data.fill)?shInfo.fillColor=data.fill:shInfo.fillColor; rlm@46: (data.stroke)?shInfo.lineColor=data.stroke:shInfo.lineColor; rlm@46: (data.transform)?shInfo.transform=data.transform:shInfo.transform; rlm@46: (data["fill-opacity"])?shInfo.fillOpac=data["fill-opacity"]:shInfo.fillOpac; rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: } rlm@46: shInfo.filter = shape.getAttribute('filter') rlm@46: shInfo.lineColor = shape.getAttribute('stroke') rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('fill-opacity')) rlm@46: shInfo.lineOpac = parseFloat(shape.getAttribute('stroke-opacity')) rlm@46: shInfo.lineWidth = parseFloat(shape.getAttribute('stroke-width')) rlm@46: rlm@46: var mystyle= shape.getAttribute('style'); rlm@46: rlm@46: if(mystyle!= null && mystyle.indexOf('=0) rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: // shInfo.style=shape.getAttribute('style'); rlm@46: rlm@46: if(mystyle!= null){ rlm@46: //var estilo=shape.getAttribute('style'); rlm@46: var data; rlm@46: rlm@46: var estilo=generateJSON(mystyle); rlm@46: eval("data="+estilo); rlm@46: //var data=eval('"'+estilo+'"'); rlm@46: //var data=estilo.evalJSON(); rlm@46: rlm@46: (data["font-size"])?shInfo.textSize=data["font-size"]:shInfo.textSize; rlm@46: (data["font-family"])?shInfo.textFamily=data["font-family"]:shInfo.textFamily; rlm@46: rlm@46: (data.fill)?shInfo.fillColor=data.fill:shInfo.fillColor; rlm@46: (data.stroke)?shInfo.lineColor=data.stroke:shInfo.lineColor; rlm@46: (data.transform)?shInfo.transform=data.transform:shInfo.transform; rlm@46: (data["fill-opacity"])?shInfo.fillOpac=data["fill-opacity"]:shInfo.fillOpac; rlm@46: //(data.color)?shInfo.lineColor=data.color:shInfo.lineColor; rlm@46: rlm@46: //shInfo.fillColor=data.fill; rlm@46: //document.getElementById("someinfo").value +=data.fill+' ';//estilo ;//data['fill']+' ';// rlm@46: } rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: if (shape.tagName == 'rect') rlm@46: { rlm@46: if(shape.getAttribute('rx') || shape.getAttribute('ry')){ rlm@46: shInfo.type = "rect"; rlm@46: shInfo.rx = parseFloat(shape.getAttribute('rx')) rlm@46: shInfo.ry = parseFloat(shape.getAttribute('rx')) rlm@46: } rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: } rlm@46: else if (shape.tagName == 'ellipse' || shape.tagName == 'circle') rlm@46: { rlm@46: if(shape.tagName == 'circle'){ rlm@46: shInfo.width = parseFloat(shape.getAttribute('r'))*2; rlm@46: shInfo.height = parseFloat(shape.getAttribute('r'))*2; rlm@46: }else{ rlm@46: shInfo.width = parseFloat(shape.getAttribute('rx'))*2; rlm@46: shInfo.height = parseFloat(shape.getAttribute('ry'))*2; rlm@46: } rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute('cx')) - (shInfo.width/2); rlm@46: shInfo.top = parseFloat(shape.getAttribute('cy')) - (shInfo.height/2) ; rlm@46: } rlm@46: else if(shape.tagName == 'linearGradient') { rlm@46: shInfo.text =shape.getAttribute('gradientUnits');//"userSpaceOnUse" rlm@46: shInfo.left = shape.getAttribute('x1'); rlm@46: shInfo.top = shape.getAttribute('y1'); rlm@46: shInfo.width = shape.getAttribute('x2'); rlm@46: shInfo.height = shape.getAttribute('y2'); rlm@46: shInfo.href = shape.getAttribute('xlink:href'); rlm@46: } rlm@46: else if(shape.tagName == 'radialGradient') { rlm@46: shInfo.text =shape.getAttribute('gradientUnits');//"userSpaceOnUse" rlm@46: shInfo.left = shape.getAttribute('cx'); rlm@46: shInfo.top = shape.getAttribute('cy'); rlm@46: shInfo.width = shape.getAttribute('fx'); rlm@46: shInfo.height = shape.getAttribute('fy'); rlm@46: shInfo.lineWidth = shape.getAttribute('r'); rlm@46: shInfo.href = shape.getAttribute('xlink:href'); rlm@46: } rlm@46: else if(shape.tagName == 'stop') rlm@46: { rlm@46: shInfo.fillColor = shape.getAttribute('stop-color'); rlm@46: shInfo.fillOpac = shape.getAttribute('stop-opacity'); rlm@46: shInfo.lineOpac = shape.getAttribute('offset'); rlm@46: var mystyle= shape.getAttribute('style'); rlm@46: if(mystyle!= null && mystyle.indexOf('=0) rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: if(mystyle!= null) rlm@46: { rlm@46: var data; rlm@46: var estilo=generateJSON(mystyle); rlm@46: eval("data="+estilo); rlm@46: (data["stop-color"])?shInfo.fillColor=data["stop-color"]:shInfo.fillColor; rlm@46: (data["stop-opacity"])?shInfo.fillOpac=data["stop-opacity"]:shInfo.fillOpac; rlm@46: //document.getElementById("someinfo").value +=data["stop-color"]+' '; rlm@46: } rlm@46: } rlm@46: } rlm@46: else if (shape.tagName == 'line') rlm@46: { rlm@46: shInfo.left = parseFloat(shape.getAttribute('x1')); rlm@46: shInfo.top = parseFloat(shape.getAttribute('y1')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('x2')) -shInfo.left; rlm@46: shInfo.height = parseFloat(shape.getAttribute('y2')) -shInfo.top; rlm@46: } rlm@46: else if (shape.tagName == 'polyline' || shape.tagName == 'polygon') rlm@46: { rlm@46: shInfo.points = shape.getAttribute('points'); rlm@46: } rlm@46: rlm@46: else if (shape.tagName == 'g') rlm@46: { rlm@46: shInfo.type = "group"; rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.fillColor = shape.getAttribute('fill'); rlm@46: if(shape.getAttribute('id')==null || shape.getAttribute('id')=='') rlm@46: { rlm@46: var nid='shape:' + createUUID(); rlm@46: shape.setAttributeNS(null, 'id', nid); rlm@46: shInfo.id=shape.getAttribute('id'); rlm@46: } rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'path') rlm@46: { rlm@46: shInfo.points = shape.getAttribute('d'); rlm@46: //shInfo.transform = shape.getAttribute('transform'); rlm@46: rlm@46: //alert(shInfo.transform); rlm@46: //document.forms[0].codebase.value=shape.getAttribute('d'); rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'pattern') rlm@46: { rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.viewBox = shape.getAttribute('viewBox'); rlm@46: rlm@46: if(shape.getAttribute('id')==null || shape.getAttribute('id')=='') rlm@46: { rlm@46: var nid='shape:' + createUUID(); rlm@46: shape.setAttributeNS(null, 'id', nid); rlm@46: shInfo.id=shape.getAttribute('id'); rlm@46: } rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'image') rlm@46: { rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('opacity')); rlm@46: shInfo.href = shape.getAttribute('href'); rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'use') rlm@46: { rlm@46: rlm@46: shInfo.href = shape.getAttribute('xlink:href'); rlm@46: rlm@46: } rlm@46: if(shape.parentNode.tagName != 'svg'){ rlm@46: //shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: //shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: //shInfo.viewBox = shape.getAttribute('viewBox'); rlm@46: shInfo.parent=shape.parentNode.getAttribute('id'); rlm@46: rlm@46: } rlm@46: rlm@46: return shInfo; rlm@46: }else{ rlm@46: //do nothing if its the tracker rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: }; rlm@46: rlm@46: SVGRenderer.prototype.info01 = function(shape) rlm@46: { rlm@46: var shInfo = {}; rlm@46: if(shape.id != "tracker"){ rlm@46: //shInfo.id = shape.id.substr(6); rlm@46: shInfo.id =shape.getAttribute('id'); rlm@46: shInfo.type = shape.tagName; rlm@46: rlm@46: if(shape.tagName=='svg') rlm@46: { rlm@46: shInfo.type ='doc' rlm@46: shInfo.left = parseFloat(shape.getAttribute('x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute('y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.viewBox = shape.getAttribute('viewBox'); rlm@46: shInfo.bgcolor=this.container.style.backgroundColor; rlm@46: } rlm@46: rlm@46: if (shape.hasAttributeNS(null,'transform')) { rlm@46: shInfo.transform = shape.getAttribute('transform'); rlm@46: }else{ rlm@46: shInfo.transform =''; rlm@46: } rlm@46: rlm@46: if(shape.tagName == "text"){ rlm@46: rlm@46: shInfo.textFamily = shape.getAttribute('font-family') rlm@46: shInfo.textSize = parseInt(shape.getAttribute('font-size')) rlm@46: shInfo.top = parseFloat(shape.getAttribute('y')) rlm@46: shInfo.left = parseFloat(shape.getAttribute('x')) rlm@46: shInfo.text = shape.textContent rlm@46: shInfo.lineWidth = parseFloat(shape.getAttribute('stroke-width')) rlm@46: rlm@46: //shInfo.text = shape.nodparseFloatue; rlm@46: } rlm@46: var styled=true; rlm@46: if(shape.tagName =='image'){styled=false;} rlm@46: if(shape.tagName =='g'){styled=false;} rlm@46: if(shape.tagName =='stop'){styled=false;} rlm@46: if(shape.tagName =='svg'){styled=false;} rlm@46: if(styled) rlm@46: { rlm@46: shInfo.fillColor = shape.getAttribute('fill') rlm@46: shInfo.lineColor = shape.getAttribute('stroke') rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('fill-opacity')) rlm@46: shInfo.lineOpac = parseFloat(shape.getAttribute('stroke-opacity')) rlm@46: shInfo.lineWidth = parseFloat(shape.getAttribute('stroke-width')) rlm@46: rlm@46: var mystyle= shape.getAttribute('style'); rlm@46: rlm@46: if(mystyle!= null && mystyle.indexOf('=0) rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: // shInfo.style=shape.getAttribute('style'); rlm@46: rlm@46: if(mystyle!= null){ rlm@46: //var estilo=shape.getAttribute('style'); rlm@46: var data; rlm@46: rlm@46: var estilo=generateJSON(mystyle); rlm@46: eval("data="+estilo); rlm@46: //var data=eval('"'+estilo+'"'); rlm@46: //var data=estilo.evalJSON(); rlm@46: rlm@46: (data["font-size"])?shInfo.textSize=data["font-size"]:shInfo.textSize; rlm@46: (data["font-family"])?shInfo.textFamily=data["font-family"]:shInfo.textFamily; rlm@46: rlm@46: (data.fill)?shInfo.fillColor=data.fill:shInfo.fillColor; rlm@46: (data.stroke)?shInfo.lineColor=data.stroke:shInfo.lineColor; rlm@46: (data.transform)?shInfo.transform=data.transform:shInfo.transform; rlm@46: (data["fill-opacity"])?shInfo.fillOpac=data["fill-opacity"]:shInfo.fillOpac; rlm@46: //shInfo.fillColor=data.fill; rlm@46: //document.getElementById("someinfo").value +=data.fill+' ';//estilo ;//data['fill']+' ';// rlm@46: } rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: if (shape.tagName == 'rect') rlm@46: { rlm@46: if(shape.getAttribute('rx') || shape.getAttribute('ry')){ rlm@46: shInfo.type = "rect"; rlm@46: shInfo.rx = parseFloat(shape.getAttribute('rx')) rlm@46: shInfo.ry = parseFloat(shape.getAttribute('rx')) rlm@46: } rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: } rlm@46: else if (shape.tagName == 'ellipse' || shape.tagName == 'circle') rlm@46: { rlm@46: if(shape.tagName == 'circle'){ rlm@46: shInfo.width = parseFloat(shape.getAttribute('r'))*2; rlm@46: shInfo.height = parseFloat(shape.getAttribute('r'))*2; rlm@46: }else{ rlm@46: shInfo.width = parseFloat(shape.getAttribute('rx'))*2; rlm@46: shInfo.height = parseFloat(shape.getAttribute('ry'))*2; rlm@46: } rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute('cx')) - (shInfo.width/2); rlm@46: shInfo.top = parseFloat(shape.getAttribute('cy')) - (shInfo.height/2) ; rlm@46: } rlm@46: else if(shape.tagName == 'linearGradient') { rlm@46: shInfo.left = (shape.getAttribute( 'x1')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y1')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('x2')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('y2')); rlm@46: rlm@46: } rlm@46: else if(shape.tagName == 'stop') { rlm@46: shInfo.fillColor = shape.getAttribute('stop-color'); rlm@46: shInfo.fillOpac = shape.getAttribute('stop-opacity'); rlm@46: shInfo.lineOpac = shape.getAttribute('offset'); rlm@46: var mystyle= shape.getAttribute('style'); rlm@46: if(mystyle!= null && mystyle.indexOf('=0) rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: if(mystyle!= null){ rlm@46: var data; rlm@46: var estilo=generateJSON(mystyle); rlm@46: eval("data="+estilo); rlm@46: (data["stop-color"])?shInfo.fillColor=data["stop-color"]:shInfo.fillColor; rlm@46: (data["stop-opacity"])?shInfo.fillOpac=data["stop-opacity"]:shInfo.fillOpac; rlm@46: document.getElementById("someinfo").value +=data["stop-color"]+' '; rlm@46: } rlm@46: rlm@46: } rlm@46: } rlm@46: else if (shape.tagName == 'line') rlm@46: { rlm@46: shInfo.left = parseFloat(shape.getAttribute('x1')); rlm@46: shInfo.top = parseFloat(shape.getAttribute('y1')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('x2')) -shInfo.left; rlm@46: shInfo.height = parseFloat(shape.getAttribute('y2')) -shInfo.top; rlm@46: } rlm@46: else if (shape.tagName == 'polyline') rlm@46: { rlm@46: shInfo.points = shape.getAttribute('points'); rlm@46: } rlm@46: else if (shape.tagName == 'g') rlm@46: { rlm@46: shInfo.type = "group"; rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.fillColor = shape.getAttribute('fill') rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'path') rlm@46: { rlm@46: shInfo.points = shape.getAttribute('d'); rlm@46: //shInfo.transform = shape.getAttribute('transform'); rlm@46: rlm@46: //alert(shInfo.transform); rlm@46: //document.forms[0].codebase.value=shape.getAttribute('d'); rlm@46: rlm@46: } rlm@46: else rlm@46: rlm@46: rlm@46: if (shape.tagName == 'image') rlm@46: { rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('opacity')); rlm@46: shInfo.href = shape.getAttribute('href'); rlm@46: rlm@46: } rlm@46: if(shape.parentNode.tagName != 'svg'){ rlm@46: //shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: //shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: //shInfo.viewBox = parseFloat(shape.getAttribute('viewBox')); rlm@46: shInfo.parent=shape.parentNode.getAttribute('id'); rlm@46: rlm@46: } rlm@46: return shInfo; rlm@46: }else{ rlm@46: //do nothing if its the tracker rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: }; rlm@46: SVGRenderer.prototype.info01 = function(shape) rlm@46: { rlm@46: rlm@46: var shInfo = {}; rlm@46: if(shape.id != "tracker"){ rlm@46: shInfo.id = shape.id.substr(6); rlm@46: shInfo.type = shape.tagName; rlm@46: if (shape.hasAttributeNS(null,'transform')) { rlm@46: shInfo.transform = shape.getAttribute('transform'); rlm@46: }else{ rlm@46: shInfo.transform =''; rlm@46: } rlm@46: rlm@46: rlm@46: //if(shape.tagName !='image') rlm@46: // { rlm@46: shInfo.fillColor = shape.getAttribute('fill') rlm@46: shInfo.lineColor = shape.getAttribute('stroke') rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('fill-opacity')) rlm@46: shInfo.lineOpac = parseFloat(shape.getAttribute('stroke-opacity')) rlm@46: shInfo.lineWidth = parseFloat(shape.getAttribute('stroke-width')) rlm@46: // } rlm@46: rlm@46: rlm@46: if (shape.tagName == 'rect') rlm@46: { rlm@46: if(shape.getAttribute('rx') || shape.getAttribute('ry')){ rlm@46: shInfo.type = "roundrect"; rlm@46: shInfo.rx = parseFloat(shape.getAttribute('rx')) rlm@46: shInfo.ry = parseFloat(shape.getAttribute('rx')) rlm@46: } rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: } rlm@46: else if (shape.tagName == 'ellipse') rlm@46: { rlm@46: shInfo.width = parseFloat(shape.getAttribute('rx'))*2; rlm@46: shInfo.height = parseFloat(shape.getAttribute('ry'))*2; rlm@46: shInfo.left = parseFloat(shape.getAttribute('cx')) - (shInfo.width/2); rlm@46: shInfo.top = parseFloat(shape.getAttribute('cy')) - (shInfo.height/2) ; rlm@46: rlm@46: } rlm@46: else if (shape.tagName == 'line') rlm@46: { rlm@46: shInfo.left = parseFloat(shape.getAttribute('x1')); rlm@46: shInfo.top = parseFloat(shape.getAttribute('y1')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('x2')) -shInfo.left; rlm@46: shInfo.height = parseFloat(shape.getAttribute('y2')) -shInfo.top; rlm@46: } rlm@46: else if (shape.tagName == 'polyline') rlm@46: { rlm@46: shInfo.points = shape.getAttribute('points'); rlm@46: } rlm@46: else rlm@46: rlm@46: if (shape.tagName == 'path') rlm@46: { rlm@46: shInfo.d = shape.getAttribute('d'); rlm@46: //shInfo.transform = shape.getAttribute('transform'); rlm@46: rlm@46: //alert(shInfo.transform); rlm@46: //document.forms[0].codebase.value=shape.getAttribute('d'); rlm@46: rlm@46: } rlm@46: else rlm@46: rlm@46: if(shape.tagName == "text"){ rlm@46: rlm@46: shInfo.textFamily = shape.getAttribute('font-family') rlm@46: shInfo.textSize = parseInt(shape.getAttribute('font-size')) rlm@46: shInfo.top = parseFloat(shape.getAttribute('y')) rlm@46: shInfo.left = parseFloat(shape.getAttribute('x')) rlm@46: shInfo.text = shape.textContent rlm@46: shInfo.lineWidth = parseFloat(shape.getAttribute('stroke-width')) rlm@46: rlm@46: //shInfo.text = shape.nodparseFloatue; rlm@46: } rlm@46: else rlm@46: rlm@46: if (shape.tagName == 'image') rlm@46: { rlm@46: rlm@46: shInfo.left = parseFloat(shape.getAttribute( 'x')); rlm@46: shInfo.top = parseFloat(shape.getAttribute( 'y')); rlm@46: shInfo.width = parseFloat(shape.getAttribute('width')); rlm@46: shInfo.height = parseFloat(shape.getAttribute('height')); rlm@46: shInfo.fillOpac = parseFloat(shape.getAttribute('opacity')); rlm@46: shInfo.href = shape.getAttribute('href'); rlm@46: rlm@46: } rlm@46: rlm@46: return shInfo; rlm@46: }else{ rlm@46: //do nothing if its the tracker rlm@46: } rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.transformShape = function(shape,data,transform) rlm@46: { rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var xlinkNS="http://www.w3.org/1999/xlink"; rlm@46: // rlm@46: rlm@46: if(shape.tagName == 'rect') rlm@46: { rlm@46: var box = shape.getBBox(); rlm@46: var sdata=data.split(';'); rlm@46: rlm@46: //alert(data[0]); rlm@46: shape.setAttributeNS(null,'x',parseFloat(sdata[0])); rlm@46: shape.setAttributeNS(null,'y',parseFloat(sdata[1])); rlm@46: shape.setAttributeNS(null, 'width', parseFloat(sdata[2])); rlm@46: shape.setAttributeNS(null, 'height', parseFloat(sdata[3])); rlm@46: var centerx=parseFloat(sdata[0])+parseFloat(box.width/2); rlm@46: var centery=parseFloat(sdata[1])+parseFloat(box.height/2); rlm@46: shape.setAttributeNS(null, 'transform','rotate('+parseFloat(sdata[4])+','+centerx+','+centery+')'); rlm@46: rlm@46: //shape.nodparseFloatue=data; rlm@46: } rlm@46: else rlm@46: if(shape.tagName == 'text') rlm@46: { rlm@46: if(data.indexOf('<;>',0)==-1 ) rlm@46: { rlm@46: shape.textContent = data; rlm@46: } rlm@46: else rlm@46: { rlm@46: var sdata=data.split('<;>'); //????????? rlm@46: shape.textContent = sdata[0]; rlm@46: shape.setAttributeNS(null,'font-size',parseFloat(sdata[1])); rlm@46: shape.setAttributeNS(null,'font-family',sdata[2]); rlm@46: } rlm@46: //shape.nodparseFloatue=data; rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'polyline') rlm@46: { rlm@46: shape.setAttributeNS(null,'points',data); rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'image') rlm@46: { rlm@46: //alert(data); rlm@46: if(data.indexOf(';',0)==-1 ) rlm@46: { rlm@46: shape.setAttributeNS(xlinkNS,'href',data); rlm@46: } rlm@46: else rlm@46: { rlm@46: var box = shape.getBBox(); rlm@46: var sdata=data.split(';'); rlm@46: shape.setAttributeNS(null,'x',parseFloat(sdata[0])); rlm@46: shape.setAttributeNS(null,'y',parseFloat(sdata[1])); rlm@46: shape.setAttributeNS(null, 'width', parseFloat(sdata[2])); rlm@46: shape.setAttributeNS(null, 'height',parseFloat(sdata[3])); rlm@46: var centerx=parseFloat(sdata[0])+parseFloat(box.width/2); rlm@46: var centery=parseFloat(sdata[1])+parseFloat(box.height/2); rlm@46: shape.setAttributeNS(null, 'transform',' rotate('+parseFloat(sdata[4])+','+centerx+','+centery+')'); rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'path') rlm@46: { rlm@46: if(data.indexOf(';',0)==-1 ) rlm@46: { rlm@46: shape.setAttributeNS(null, 'd', data); rlm@46: shape.setAttributeNS(null, 'transform', transform); rlm@46: } rlm@46: else rlm@46: { rlm@46: var box = shape.getBBox(); rlm@46: var sdata=data.split(';'); rlm@46: var centerx=parseFloat(sdata[0])+parseFloat(box.width/2); rlm@46: var centery=parseFloat(sdata[1])+parseFloat(box.height/2); rlm@46: shape.setAttributeNS(null, 'transform','scale('+parseFloat(sdata[2])+','+parseFloat(sdata[3])+')'+' rotate('+parseFloat(sdata[4])+','+centerx+','+centery+')'+' translate('+parseFloat(sdata[0])+','+parseFloat(sdata[1])+')'); rlm@46: rlm@46: rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: } rlm@46: SVGRenderer.prototype.editShape = function(shape,data) rlm@46: { rlm@46: if(shape.tagName == 'text'){ rlm@46: shape.textContent = data rlm@46: }else rlm@46: if (shape.tagName == 'polyline') rlm@46: { rlm@46: shape.setAttributeNS(null,'points',data); rlm@46: } rlm@46: else rlm@46: rlm@46: if (shape.tagName == 'path') rlm@46: { rlm@46: shape.setAttributeNS(null, 'd', data); rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: SVGRenderer.prototype.editCommand = function(shape, cmd, value) rlm@46: { rlm@46: if (shape != null) { rlm@46: if (cmd == 'fillcolor') { rlm@46: if (value != '') rlm@46: shape.setAttributeNS(null, 'fill', value); rlm@46: else rlm@46: shape.setAttributeNS(null, 'fill', 'none'); rlm@46: } rlm@46: else if (cmd == 'linecolor') { rlm@46: if (value != '') rlm@46: shape.setAttributeNS(null, 'stroke', value); rlm@46: else rlm@46: shape.setAttributeNS(null, 'stroke', 'none'); rlm@46: } rlm@46: else if (cmd == 'linewidth') { rlm@46: shape.setAttributeNS(null, 'stroke-width', parseInt(value) + 'px'); rlm@46: } rlm@46: else if (cmd == 'fillopacity') { rlm@46: if(shape.tagName=='image') rlm@46: { rlm@46: shape.setAttributeNS(null, 'opacity', parseFloat(value)); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'fill-opacity', parseFloat(value)); rlm@46: } rlm@46: rlm@46: } rlm@46: else if (cmd == 'lineopacity') { rlm@46: rlm@46: shape.setAttributeNS(null, 'stroke-opacity', parseFloat(value)); rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.queryCommand = function(shape, cmd) rlm@46: { rlm@46: var result = ''; rlm@46: rlm@46: if (shape != null) { rlm@46: if (cmd == 'fillcolor') { rlm@46: result = shape.getAttributeNS(null, 'fill'); rlm@46: if (result == 'none') rlm@46: result = ''; rlm@46: } rlm@46: else if (cmd == 'linecolor') { rlm@46: result = shape.getAttributeNS(null, 'stroke'); rlm@46: if (result == 'none') rlm@46: result = ''; rlm@46: } rlm@46: else if (cmd == 'linewidth') { rlm@46: result = shape.getAttributeNS(null, 'stroke'); rlm@46: if (result == 'none') rlm@46: result = ''; rlm@46: else rlm@46: result = shape.getAttributeNS(null, 'stroke-width'); rlm@46: } rlm@46: else if (cmd == 'fillopacity') { rlm@46: if(shape.tagName=='image') rlm@46: { rlm@46: shape.setAttributeNS(null, 'opacity', parseFloat(value)); rlm@46: } rlm@46: else rlm@46: { rlm@46: shape.setAttributeNS(null, 'fill-opacity', parseFloat(value)); rlm@46: } rlm@46: rlm@46: } rlm@46: else if (cmd == 'lineopacity') { rlm@46: rlm@46: shape.setAttributeNS(null, 'stroke-opacity', parseFloat(value)); rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: rlm@46: return result; rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.getProperties = function(shape) rlm@46: { rlm@46: var result = ''; rlm@46: rlm@46: if (shape != null) rlm@46: { rlm@46: result = shape.getAttributeNS(null, 'fill'); rlm@46: if (result == 'none') rlm@46: { rlm@46: mefillColor.visible = 'hidden'; rlm@46: mefillColor.hex = '#000000'; rlm@46: filldraw=true; rlm@46: setbe(1,'img_okfill'); rlm@46: } rlm@46: else rlm@46: { rlm@46: //alert(mefillColor.hex+' '+result); rlm@46: mefillColor.visible = 'visible'; rlm@46: mefillColor.hex = result; rlm@46: var rgb=hex2rgb(result) rlm@46: mefillColor.r=rgb[0]; rlm@46: mefillColor.g=rgb[1]; rlm@46: mefillColor.b=rgb[2]; rlm@46: filldraw=false; rlm@46: setbe(1,'img_okfill'); rlm@46: rlm@46: } rlm@46: rlm@46: result = shape.getAttributeNS(null, 'stroke'); rlm@46: if (result == 'none') rlm@46: { rlm@46: mestrokeColor.visible = 'hidden'; rlm@46: mestrokeColor.hex = '#000000'; rlm@46: mestrokeColor.width = 0; rlm@46: strokedraw=true; rlm@46: setbe(2,'img_okstroke'); rlm@46: rlm@46: } rlm@46: else rlm@46: { rlm@46: mestrokeColor.visible = 'visible'; rlm@46: mestrokeColor.hex = result; rlm@46: var rgb=hex2rgb(result) rlm@46: mestrokeColor.r=rgb[0]; rlm@46: mestrokeColor.g=rgb[1]; rlm@46: mestrokeColor.b=rgb[2]; rlm@46: strokedraw=false; rlm@46: setbe(2,'img_okstroke'); rlm@46: rlm@46: } rlm@46: rlm@46: result = shape.getAttributeNS(null, 'stroke-width'); rlm@46: mestrokeColor.width = result; rlm@46: rlm@46: result = shape.getAttributeNS(null, 'fill-opacity'); rlm@46: mefillColor.opacity = result; rlm@46: rlm@46: result = shape.getAttributeNS(null, 'stroke-opacity'); rlm@46: mestrokeColor.opacity = result; rlm@46: rlm@46: setProperties(); rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.showMultiSelect = function(iniX,iniY) { rlm@46: var tracker = document.getElementById('trackerMultiSelect'); rlm@46: if (tracker) { rlm@46: this.remove(tracker); rlm@46: } rlm@46: rlm@46: var coord=this.editor.viewInputxy; rlm@46: toX=parseFloat(coord[0]); rlm@46: toY=parseFloat(coord[1]); rlm@46: rlm@46: tracker = document.createElementNS(svgNamespace, 'rect'); rlm@46: rlm@46: tracker.setAttributeNS(null, 'x', iniX); rlm@46: tracker.setAttributeNS(null, 'y', iniY); rlm@46: tracker.setAttributeNS(null, 'width', toX); rlm@46: tracker.setAttributeNS(null, 'height', toY); rlm@46: tracker.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: tracker.setAttributeNS(null, 'stroke', 'green'); rlm@46: tracker.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: this.svgRoot.appendChild(tracker); rlm@46: } rlm@46: rlm@46: rlm@46: function mouseCoord() rlm@46: { rlm@46: var coord=this.editor.viewInputxy; rlm@46: coord[0]=parseFloat(coord[0]); rlm@46: coord[1]=parseFloat(coord[1]); rlm@46: return coord rlm@46: } rlm@46: /* rlm@46: function nodeHit(node) rlm@46: { rlm@46: node.addEventListener("mousemove", function(event) {nodeMove(node)}, false); rlm@46: rlm@46: } rlm@46: rlm@46: function nodeUp(node) rlm@46: { rlm@46: //node.stopObserving("mousemove"); rlm@46: } rlm@46: rlm@46: function nodeMove(node) rlm@46: { rlm@46: var mypath=$('control_codebase').value; rlm@46: var x= $('option_path_x').value; rlm@46: var y= $('option_path_y').value; rlm@46: var precoord=x+','+y; rlm@46: var coord=mouseCoord(); rlm@46: node.setAttributeNS(null, 'x', coord[0]-2); rlm@46: node.setAttributeNS(null, 'y', coord[1]-2); rlm@46: rlm@46: $('option_path_x').value=parseFloat(node.getAttributeNS(null,'x'))+2; rlm@46: $('option_path_y').value=parseFloat(node.getAttributeNS(null,'y'))+2; rlm@46: rlm@46: var cadx= $('option_path_x').value; rlm@46: var cady= $('option_path_y').value; rlm@46: var coord=cadx+','+cady; rlm@46: var cad1=new RegExp(precoord,"g"); rlm@46: rlm@46: rlm@46: var result=mypath.replace(cad1, coord); rlm@46: rlm@46: rlm@46: $('control_codebase').value=result; rlm@46: rlm@46: $('someinfo').value=precoord; rlm@46: setShape(); rlm@46: rlm@46: rlm@46: rlm@46: } rlm@46: */ rlm@46: rlm@46: var memoNode=null; rlm@46: var memoPrevControl=new Array(); rlm@46: var memoNextControl=new Array(); rlm@46: rlm@46: SVGRenderer.prototype.nodeMove = function(newx,newy) { rlm@46: var mypath=$('control_codebase').value; rlm@46: var x= $('option_path_x').value; rlm@46: var y= $('option_path_y').value; rlm@46: var precoord=x+','+y; rlm@46: rlm@46: $('option_path_x').value=newx; rlm@46: $('option_path_y').value=newy; rlm@46: rlm@46: var cadx= newx; rlm@46: var cady= newy; rlm@46: rlm@46: var coord=cadx+','+cady; rlm@46: var cad1=new RegExp(precoord,"g"); rlm@46: rlm@46: rlm@46: var result=mypath.replace(cad1, coord); rlm@46: rlm@46: rlm@46: $('control_codebase').value=result; rlm@46: rlm@46: $('someinfo').value=precoord; rlm@46: setShape(); rlm@46: rlm@46: } rlm@46: rlm@46: function drawNodeControl(svg,numId){ rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var color1='#0066ff'; rlm@46: // if(parseInt(memoNode.id)==a){ rlm@46: rlm@46: var pointprev=memoPrevControl[numId].split(','); rlm@46: rlm@46: var controlNode1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: controlNode1.setAttributeNS(null, 'x', pointprev[0]-widthLine*2); rlm@46: controlNode1.setAttributeNS(null, 'y', pointprev[1]-widthLine*2); rlm@46: rlm@46: controlNode1.setAttributeNS(null, 'width', widthLine*4); rlm@46: controlNode1.setAttributeNS(null, 'height', widthLine*4); rlm@46: controlNode1.setAttributeNS(null, 'fill', color1); rlm@46: controlNode1.setAttributeNS(null, 'stroke', '#000000'); rlm@46: controlNode1.setAttributeNS(null, 'stroke-width', '0'); rlm@46: controlNode1.setAttributeNS(null, 'id', 'controlNode1'); rlm@46: controlNode1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: svg.appendChild(controlNode1); rlm@46: rlm@46: var pointnext=memoNextControl[numId].split(','); rlm@46: rlm@46: rlm@46: var controlNode2 = document.createElementNS(svgNamespace, 'rect'); rlm@46: controlNode2.setAttributeNS(null, 'x', pointnext[0]-widthLine*2); rlm@46: controlNode2.setAttributeNS(null, 'y', pointnext[1]-widthLine*2); rlm@46: rlm@46: controlNode2.setAttributeNS(null, 'width', widthLine*4); rlm@46: controlNode2.setAttributeNS(null, 'height', widthLine*4); rlm@46: controlNode2.setAttributeNS(null, 'fill', color1); rlm@46: controlNode2.setAttributeNS(null, 'stroke', '#000000'); rlm@46: controlNode2.setAttributeNS(null, 'stroke-width', '0'); rlm@46: controlNode2.setAttributeNS(null, 'id', 'controlNode1'); rlm@46: controlNode2.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: svg.appendChild(controlNode2); rlm@46: rlm@46: //} rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: SVGRenderer.prototype.showNodesCurve = function(path,controlNodeNum){ rlm@46: memoNextControl=new Array(); rlm@46: memoPrevControl=new Array(); rlm@46: var widthLine=this.editor.unit; rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: // tracker = document.createElementNS(svgNamespace, 'g'); rlm@46: var svg = this.container.ownerDocument.createElementNS(svgNamespace, 'g'); rlm@46: svg.setAttributeNS(null, 'id', 'editNodesPath'); rlm@46: rlm@46: /* var group = document.getElementById('editNodesPath'); rlm@46: if (group) rlm@46: { rlm@46: this.remove(group); rlm@46: } rlm@46: */ rlm@46: rlm@46: var points=path.split(' '); rlm@46: var chain=''; rlm@46: var segment=' '; rlm@46: prevControl=' '; rlm@46: nextControl=' '; rlm@46: nodePoint=' '; rlm@46: var init=points[0].split('M'); rlm@46: var allcoords=init[1].split(' '); rlm@46: var point=allcoords[0].split(','); rlm@46: var rect1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect1.setAttributeNS(null, 'x', point[0]-widthLine*2); rlm@46: rect1.setAttributeNS(null, 'y', point[1]-widthLine*2); rlm@46: rlm@46: rect1.setAttributeNS(null, 'width', widthLine*4); rlm@46: rect1.setAttributeNS(null, 'height', widthLine*4); rlm@46: rect1.setAttributeNS(null, 'fill', '#ff7700'); rlm@46: rect1.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect1.setAttributeNS(null, 'stroke-width', '0'); rlm@46: rect1.setAttributeNS(null, 'id', '0'); rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'stroke-width', 1 ); }, false); rlm@46: rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'stroke-width', 0 );}, false); rlm@46: rlm@46: svg.appendChild(rect1); rlm@46: rlm@46: if(controlNodeNum==0){ var color='#ffff00';} rlm@46: if(controlNodeNum==1){var color='#00ffff';} rlm@46: if(controlNodeNum==2){var color='#00cc00';} rlm@46: var color1='#ffff00'; rlm@46: rlm@46: var numpoints=points.length-1; rlm@46: var recalls=''; rlm@46: var re = /^[-]?\d*\.?\d*$/; rlm@46: for(var a=1;a<=numpoints;a++) rlm@46: { rlm@46: rlm@46: var ini=points[a].substring(0,1); rlm@46: if (!ini.match(re)) rlm@46: { rlm@46: var end=points[a].substring(1); rlm@46: color='#0000ff'; rlm@46: if(ini=='L' || ini=='M') rlm@46: { rlm@46: color='#ffff00'; rlm@46: } rlm@46: rlm@46: if(ini=='C') rlm@46: { rlm@46: recall=a+2; rlm@46: //color='#ffff00'; rlm@46: } rlm@46: rlm@46: }else rlm@46: { rlm@46: var end=points[a]; rlm@46: var ini=''; rlm@46: color='#ff00ff'; rlm@46: if(a==recall) rlm@46: { rlm@46: color='#ffff00'; rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: //segment=points[a].split(','); rlm@46: prevControl=segment[0]+' '; rlm@46: nextControl=segment[1]+' '; rlm@46: nodePoint=segment[2]+' '; rlm@46: memoPrevControl[a]=prevControl; rlm@46: memoNextControl[a]=nextControl; rlm@46: if(controlNodeNum==0){chain+=prevControl; var point=prevControl.split(',');} rlm@46: if(controlNodeNum==1){chain+=nextControl; var point=nextControl.split(',');} rlm@46: if(controlNodeNum==2){chain+=nodePoint; var point=nodePoint.split(',');} rlm@46: if(controlNodeNum==3){chain+=nodePoint; var point=nodePoint.split(',');} rlm@46: rlm@46: rlm@46: //if (isNaN(valnum)) rlm@46: rlm@46: //if(ini=='C'){color='#ff00ff';} rlm@46: rlm@46: var point=end.split(','); rlm@46: if(memoNode!=null){ rlm@46: } rlm@46: var rect1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect1.setAttributeNS(null, 'x', point[0]-widthLine*2); rlm@46: rect1.setAttributeNS(null, 'y', point[1]-widthLine*2); rlm@46: rlm@46: rect1.setAttributeNS(null, 'width', widthLine*4); rlm@46: rect1.setAttributeNS(null, 'height', widthLine*4); rlm@46: rect1.setAttributeNS(null, 'fill', color); rlm@46: rect1.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect1.setAttributeNS(null, 'stroke-width', '0'); rlm@46: rect1.setAttributeNS(null, 'id', ''+a); rlm@46: rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );}drawNodeControl(svg,this.getAttributeNS(null,'id')); memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: // rect1.addEventListener("mousedown", function(event) {nodeHit(this);if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; document.forms[0].option_path_x.focus(); }, false); rlm@46: //rect1.addEventListener("mousedown", function(event) { if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} nodeHit(this); memoNode=this;this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: //rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} addControlPoints(segment[0],segment[1],svg); memoNode=this; this.setAttributeNS(null, 'fillColor', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: //rect1.addEventListener("mouseup", function(event) {nodeUp(this); }, false); rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'fillColor', '#ffcc00' ); }, false); rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'fillColor', '#00cc00' ); }, false); rlm@46: rlm@46: rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'stroke-width', 0 ); }, false); rlm@46: rlm@46: svg.appendChild(rect1); rlm@46: rlm@46: } rlm@46: var info=''; rlm@46: rlm@46: if(controlNodeNum==0){info='prev Control'} rlm@46: if(controlNodeNum==1){info='next Control'} rlm@46: if(controlNodeNum==2){info='points node'} rlm@46: // $('someinfo').value=numpoints+ ' '+info+':'+ chain; rlm@46: $('someinfo').value='Crtl+Arrow to move'; rlm@46: //return chain; rlm@46: rlm@46: rlm@46: //this.svgRoot.appendChild(svg); rlm@46: rlm@46: return svg; rlm@46: rlm@46: }; rlm@46: rlm@46: SVGRenderer.prototype.showNodesCurve1 = function(path,controlNodeNum){ rlm@46: memoNextControl=new Array(); rlm@46: memoPrevControl=new Array(); rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: // tracker = document.createElementNS(svgNamespace, 'g'); rlm@46: var svg = this.container.ownerDocument.createElementNS(svgNamespace, 'g'); rlm@46: svg.setAttributeNS(null, 'id', 'editNodesPath'); rlm@46: rlm@46: /* var group = document.getElementById('editNodesPath'); rlm@46: if (group) rlm@46: { rlm@46: this.remove(group); rlm@46: } rlm@46: */ rlm@46: rlm@46: var points=path.split('C'); rlm@46: var chain=''; rlm@46: var segment=' '; rlm@46: prevControl=' '; rlm@46: nextControl=' '; rlm@46: nodePoint=' '; rlm@46: var init=points[0].split('M'); rlm@46: var allcoords=init[1].split(' '); rlm@46: var point=allcoords[0].split(','); rlm@46: var rect1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect1.setAttributeNS(null, 'x', point[0]-2); rlm@46: rect1.setAttributeNS(null, 'y', point[1]-2); rlm@46: rlm@46: rect1.setAttributeNS(null, 'width', 4); rlm@46: rect1.setAttributeNS(null, 'height', 4); rlm@46: rect1.setAttributeNS(null, 'fill', '#ff7700'); rlm@46: rect1.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect1.setAttributeNS(null, 'stroke-width', '0'); rlm@46: rect1.setAttributeNS(null, 'id', '0'); rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'stroke-width', 1 ); }, false); rlm@46: rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'stroke-width', 0 );}, false); rlm@46: rlm@46: svg.appendChild(rect1); rlm@46: rlm@46: if(controlNodeNum==0){ var color='#ffff00';} rlm@46: if(controlNodeNum==1){var color='#00ffff';} rlm@46: if(controlNodeNum==2){var color='#00cc00';} rlm@46: var color1='#ffff00'; rlm@46: rlm@46: var numpoints=points.length-1; rlm@46: for(var a=1;a<=numpoints;a++) rlm@46: { rlm@46: rlm@46: rlm@46: rlm@46: segment=points[a].split(' '); rlm@46: prevControl=segment[0]+' '; rlm@46: nextControl=segment[1]+' '; rlm@46: nodePoint=segment[2]+' '; rlm@46: memoPrevControl[a]=prevControl; rlm@46: memoNextControl[a]=nextControl; rlm@46: if(controlNodeNum==0){chain+=prevControl; var point=prevControl.split(',');} rlm@46: if(controlNodeNum==1){chain+=nextControl; var point=nextControl.split(',');} rlm@46: if(controlNodeNum==2){chain+=nodePoint; var point=nodePoint.split(',');} rlm@46: if(controlNodeNum==3){chain+=nodePoint; var point=nodePoint.split(',');} rlm@46: rlm@46: if(memoNode!=null){ rlm@46: } rlm@46: var rect1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect1.setAttributeNS(null, 'x', point[0]-2); rlm@46: rect1.setAttributeNS(null, 'y', point[1]-2); rlm@46: rlm@46: rect1.setAttributeNS(null, 'width', 4); rlm@46: rect1.setAttributeNS(null, 'height', 4); rlm@46: rect1.setAttributeNS(null, 'fill', color); rlm@46: rect1.setAttributeNS(null, 'stroke', '#000000'); rlm@46: rect1.setAttributeNS(null, 'stroke-width', '0'); rlm@46: rect1.setAttributeNS(null, 'id', ''+a); rlm@46: rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );}drawNodeControl(svg,this.getAttributeNS(null,'id')); memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: // rect1.addEventListener("mousedown", function(event) {nodeHit(this);if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} memoNode=this; this.setAttributeNS(null, 'fill-color', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; document.forms[0].option_path_x.focus(); }, false); rlm@46: //rect1.addEventListener("mousedown", function(event) { if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} nodeHit(this); memoNode=this;this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: //rect1.addEventListener("mousedown", function(event) {if(memoNode != null){memoNode.setAttributeNS(null, 'stroke-width', 0 );} addControlPoints(segment[0],segment[1],svg); memoNode=this; this.setAttributeNS(null, 'fillColor', '#ffff00' );this.setAttributeNS(null, 'stroke-width', 1 );$('option_path_num').value=this.getAttributeNS(null,'id'); $('option_path_x').value=parseFloat(this.getAttributeNS(null,'x'))+2; $('option_path_y').value=parseFloat(this.getAttributeNS(null,'y'))+2; }, false); rlm@46: //rect1.addEventListener("mouseup", function(event) {nodeUp(this); }, false); rlm@46: //rect1.addEventListener("mouseover", function(event) {this.setAttributeNS(null, 'fillColor', '#ffcc00' ); }, false); rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'fillColor', '#00cc00' ); }, false); rlm@46: rlm@46: rlm@46: //rect1.addEventListener("mouseout", function(event) {this.setAttributeNS(null, 'stroke-width', 0 ); }, false); rlm@46: rlm@46: svg.appendChild(rect1); rlm@46: rlm@46: } rlm@46: var info=''; rlm@46: rlm@46: if(controlNodeNum==0){info='prev Control'} rlm@46: if(controlNodeNum==1){info='next Control'} rlm@46: if(controlNodeNum==2){info='points node'} rlm@46: // $('someinfo').value=numpoints+ ' '+info+':'+ chain; rlm@46: $('someinfo').value='Crtl+Arrow to move'; rlm@46: //return chain; rlm@46: rlm@46: rlm@46: //this.svgRoot.appendChild(svg); rlm@46: rlm@46: return svg; rlm@46: rlm@46: }; rlm@46: SVGRenderer.prototype.showTracker = function(shape,pathsEdit) { rlm@46: rlm@46: var box = shape.getBBox(); rlm@46: var matrix = shape.getScreenCTM(); rlm@46: var trshape= shape.getAttributeNS(null, 'transform'); rlm@46: var shap=1; rlm@46: var T = shape.getCTM(); rlm@46: //a,b,c,d,e,f rlm@46: rlm@46: var widthLine=this.editor.unit; rlm@46: rlm@46: rlm@46: rlm@46: //var thisTransform = { sx: s[0], r: shape.vRotate, t: shape.vTranslate }; rlm@46: //if (currentTransform != null) alert(currentTransform.t); rlm@46: rlm@46: if (shape.tagName == 'rect') { rlm@46: rlm@46: $('option_rect_rot').value= T.b* (Math.PI * 2 / 360); rlm@46: $('option_rect_trx').value= box.x; rlm@46: $('option_rect_try').value= box.y; rlm@46: $('option_rect_sclx').value= box.width; rlm@46: $('option_rect_scly').value= box.height; rlm@46: rlm@46: } rlm@46: rlm@46: if (shape.tagName == 'image'){ rlm@46: $('option_img_trx').value= box.x; rlm@46: $('option_img_try').value= box.y; rlm@46: $('option_img_sclx').value= box.width; rlm@46: $('option_img_scly').value= box.height; rlm@46: $('option_img_rot').value= T.b* (Math.PI * 2 / 360); rlm@46: } rlm@46: if (shape.tagName == 'text'){ rlm@46: //$('option_text_trx').value= box.x; rlm@46: //$('option_text_try').value= box.y; rlm@46: $('option_text_size').value= box.height; rlm@46: /*$('option_text_sclx').value= box.width; rlm@46: $('option_text_scly').value= box.height; rlm@46: $('option_text_rot').value= T.b* (Math.PI * 2 / 360); rlm@46: */ rlm@46: } rlm@46: if (shape.tagName == 'line'){ rlm@46: /* rlm@46: $('option_line_trx').value= box.x; rlm@46: $('option_line_try').value= box.y; rlm@46: */ rlm@46: } rlm@46: if (shape.tagName == 'ellipse'){ rlm@46: /*$('option_ellipse_trx').value= putx; rlm@46: $('option_ellipse_try').value= puty; rlm@46: $('option_ellipse_sclx').value= box.width; rlm@46: $('option_ellipse_scly').value= box.height; rlm@46: $('option_ellipse_rot').value= T.b* (Math.PI * 2 / 360); rlm@46: */ rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: /* if (shape.getAttributeNS(null, 'transform') ) { rlm@46: rlm@46: rlm@46: shap=2; }else{ rlm@46: }*/ rlm@46: var tracker = document.getElementById('tracker'); rlm@46: if (tracker) { rlm@46: this.remove(tracker); rlm@46: } rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: rlm@46: tracker = document.createElementNS(svgNamespace, 'g'); rlm@46: tracker.setAttributeNS(null, 'id', 'tracker'); rlm@46: rlm@46: var controlPoints=null; rlm@46: if (shape.tagName == 'path') { shap=2; rlm@46: rlm@46: /* $('option_path_trx').value= box.x; rlm@46: $('option_path_try').value= box.y; rlm@46: $('option_path_sclx').value= T.a; rlm@46: $('option_path_scly').value= T.d; rlm@46: $('option_path_rot').value= T.b* (Math.PI * 2 / 360); rlm@46: */ rlm@46: var path=shape.getAttributeNS(null, 'd'); rlm@46: $('control_codebase').value=path; rlm@46: rlm@46: //controlPoints=this.showNodesCurve(path,0); rlm@46: //controlPoints=this.showNodesCurve(path,1); rlm@46: controlPoints=this.showNodesCurve(path,2); rlm@46: rlm@46: rlm@46: /* controlPoints=this.showNodesCurve(path,1); rlm@46: rlm@46: tracker.appendChild(controlPoints); rlm@46: rlm@46: controlPoints=this.showNodesCurve(path,0); rlm@46: rlm@46: tracker.appendChild(controlPoints); rlm@46: */ rlm@46: } rlm@46: rlm@46: var svg = this.container.ownerDocument.createElementNS(svgNamespace, 'g'); rlm@46: svg.setAttributeNS(null, 'id', 'transformSquares'); rlm@46: rlm@46: rlm@46: //var rect = document.createElementNS(svgNamespace, 'rect'); rlm@46: var border = document.createElementNS(svgNamespace, 'path'); rlm@46: rlm@46: var trshape='translate (0,0) rotate(0) translate(0,0) '; rlm@46: var trshape_split=trshape.split(') '); rlm@46: rlm@46: // get_between (trshape, s1, s2) ; rlm@46: if(shape.getAttributeNS(null, 'transform')){ rlm@46: var trshape=shape.getAttributeNS(null, 'transform') ; rlm@46: //var spl=trshape.replace(', ',' '); rlm@46: //var spl1=spl.replace(')',' '); rlm@46: var trshape_split=trshape.split(') '); rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: var corners = []; rlm@46: var point = createPoint(box.x, box.y, box.width, box.height); rlm@46: //point = {x:box.x, y:box.y, width: box.width, height:box.height}; rlm@46: //point = createPoint(box.x, box.y, box.width, box.height); rlm@46: //1 rlm@46: corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) ); rlm@46: point.x = box.x + box.width; rlm@46: point.y = box.y; rlm@46: //2 rlm@46: corners.push( createPoint(box.x + box.width, box.y + box.height, box.width, box.height) ); rlm@46: point.x = box.x + box.width; rlm@46: point.y = box.y + box.height; rlm@46: //3 rlm@46: //corners.push( point.matrixTransform(matrix) ); rlm@46: corners.push( createPoint(box.x , box.y + box.height, box.width, box.height) ); rlm@46: point.x = box.x; rlm@46: point.y = box.y + box.height; rlm@46: //4 rlm@46: corners.push( createPoint(box.x + box.width, box.y, box.width, box.height) ); rlm@46: rlm@46: var max = createPoint(corners[0].x, corners[0].y); rlm@46: var min = createPoint(corners[0].x, corners[0].y); rlm@46: rlm@46: // identify the new corner coordinates of the rlm@46: // fully transformed bounding box rlm@46: for (var i = 1; i < corners.length; i++) { rlm@46: var x = corners[i].x; rlm@46: var y = corners[i].y; rlm@46: if (x < min.x) { rlm@46: min.x = x; rlm@46: } rlm@46: else if (x > max.x) { rlm@46: max.x = x; rlm@46: } rlm@46: if (y < min.y) { rlm@46: min.y = y; rlm@46: } rlm@46: else if (y > max.y) { rlm@46: max.y = y; rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: border.setAttributeNS(null, 'd', "M"+(min.x-(widthLine*10))+","+ (min.y-(widthLine*10))+' h'+(box.width+(widthLine*20))+','+(0)+' v'+(0)+','+(box.height+(widthLine*20))+' h'+(-box.width-(widthLine*20))+','+(0)+' z M'+(box.x+box.width+(widthLine*10))+","+ (box.y+(box.height/2)+' h'+(widthLine*25)+',0 ')); rlm@46: rlm@46: rlm@46: border.setAttributeNS(null, 'fill', 'none'); rlm@46: border.setAttributeNS(null, 'stroke', '#cccccc'); rlm@46: border.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: // createRect(min.x, min.y, max.x - min.x, max.y - min.y); rlm@46: rlm@46: var circle1 = document.createElementNS(svgNamespace, 'ellipse'); rlm@46: circle1.setAttributeNS(null, 'cx', (box.x + box.width+(widthLine*40)) + 'px'); rlm@46: circle1.setAttributeNS(null, 'cy', (box.y + box.height / 2) + 'px'); rlm@46: circle1.setAttributeNS(null, 'rx', (widthLine*5) + 'px'); rlm@46: circle1.setAttributeNS(null, 'ry', (widthLine*5) + 'px'); rlm@46: circle1.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: circle1.setAttributeNS(null, 'stroke', 'green'); rlm@46: circle1.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var circleCenter = document.createElementNS(svgNamespace, 'ellipse'); rlm@46: circleCenter.setAttributeNS(null, 'cx', (box.x + (box.width/2)) + 'px'); rlm@46: circleCenter.setAttributeNS(null, 'cy', (box.y + (box.height /2)) + 'px'); rlm@46: circleCenter.setAttributeNS(null, 'rx', (widthLine*10) + 'px'); rlm@46: circleCenter.setAttributeNS(null, 'ry', (widthLine*10) + 'px'); rlm@46: circleCenter.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: circleCenter.setAttributeNS(null, 'stroke', 'green'); rlm@46: circleCenter.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rect1 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect1.setAttributeNS(null, 'width', widthLine*10); rlm@46: rect1.setAttributeNS(null, 'height', widthLine*10); rlm@46: rect1.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rect1.setAttributeNS(null, 'stroke', 'green'); rlm@46: rect1.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rect2 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect2.setAttributeNS(null, 'width', widthLine*10); rlm@46: rect2.setAttributeNS(null, 'height', widthLine*10); rlm@46: rect2.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rect2.setAttributeNS(null, 'stroke', 'green'); rlm@46: rect2.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rect3 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect3.setAttributeNS(null, 'width', widthLine*10); rlm@46: rect3.setAttributeNS(null, 'height', widthLine*10); rlm@46: rect3.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rect3.setAttributeNS(null, 'stroke', 'green'); rlm@46: rect3.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rect4 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rect4.setAttributeNS(null, 'width', widthLine*10); rlm@46: rect4.setAttributeNS(null, 'height', widthLine*10); rlm@46: rect4.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rect4.setAttributeNS(null, 'stroke', 'green'); rlm@46: rect4.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rectmid12 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rectmid12.setAttributeNS(null, 'width', widthLine*10); rlm@46: rectmid12.setAttributeNS(null, 'height', widthLine*10); rlm@46: rectmid12.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rectmid12.setAttributeNS(null, 'stroke', 'green'); rlm@46: rectmid12.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rectmid23 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rectmid23.setAttributeNS(null, 'width', widthLine*10); rlm@46: rectmid23.setAttributeNS(null, 'height', widthLine*10); rlm@46: rectmid23.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rectmid23.setAttributeNS(null, 'stroke', 'green'); rlm@46: rectmid23.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rectmid34 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rectmid34.setAttributeNS(null, 'width', widthLine*10); rlm@46: rectmid34.setAttributeNS(null, 'height', widthLine*10); rlm@46: rectmid34.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rectmid34.setAttributeNS(null, 'stroke', 'green'); rlm@46: rectmid34.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: rlm@46: var rectmid41 = document.createElementNS(svgNamespace, 'rect'); rlm@46: rectmid41.setAttributeNS(null, 'width', widthLine*10); rlm@46: rectmid41.setAttributeNS(null, 'height', widthLine*10); rlm@46: rectmid41.setAttributeNS(null, 'fill', '#ffffff'); rlm@46: rectmid41.setAttributeNS(null, 'stroke', 'green'); rlm@46: rectmid41.setAttributeNS(null, 'stroke-width', widthLine); rlm@46: // rect.setAttributeNS(null, 'x', box.x - widthLine*10); rlm@46: // rect.setAttributeNS(null, 'y', box.y - widthLine*10); rlm@46: rlm@46: rect1.setAttributeNS(null, 'x', box.x - widthLine*15); rlm@46: rect1.setAttributeNS(null, 'y', box.y - widthLine*15); rlm@46: rlm@46: rlm@46: rect2.setAttributeNS(null, 'x', box.x + box.width +widthLine*5 ); rlm@46: rect2.setAttributeNS(null, 'y', box.y - widthLine*15); rlm@46: rlm@46: rect3.setAttributeNS(null, 'x', box.x + box.width + widthLine*5 ); rlm@46: rect3.setAttributeNS(null, 'y', box.y + box.height + widthLine*5); rlm@46: rlm@46: rect4.setAttributeNS(null, 'x', box.x - widthLine*15 ); rlm@46: rect4.setAttributeNS(null, 'y', box.y + box.height + widthLine*5); rlm@46: rlm@46: rlm@46: rlm@46: rectmid12.setAttributeNS(null, 'x', box.x + (box.width/2) - widthLine*5); rlm@46: rectmid12.setAttributeNS(null, 'y', box.y - widthLine*15); rlm@46: rlm@46: rectmid23.setAttributeNS(null, 'x', box.x + box.width + widthLine*5 ); rlm@46: rectmid23.setAttributeNS(null, 'y', box.y + (box.height/2) - widthLine*5); rlm@46: rlm@46: rectmid34.setAttributeNS(null, 'x', box.x + (box.width/2) - widthLine*5 ); rlm@46: rectmid34.setAttributeNS(null, 'y', box.y + box.height + widthLine*5); rlm@46: rlm@46: rectmid41.setAttributeNS(null, 'x', box.x - widthLine*15 ); rlm@46: rectmid41.setAttributeNS(null, 'y', box.y + (box.height/2) - widthLine*5); rlm@46: rlm@46: svg.appendChild(border); rlm@46: var colorin="#ff0000"; rlm@46: var colorout="#ffffff" rlm@46: rlm@46: circle1.addEventListener("mouseover", function(event) {circle1.setAttributeNS(null, 'cursor', 's-resize'); circle1.setAttributeNS(null, 'fill', colorin ); typeTransform='Rotate'; scaleType='nw'; }, false); rlm@46: circle1.addEventListener("mouseout", function(event) {circle1.setAttributeNS(null, 'cursor', 'default'); circle1.setAttributeNS(null, 'fill', colorout ); typeTransform='Rotate'; }, false); //typeTransform='rotate' rlm@46: circleCenter.addEventListener("mouseover", function(event) {circleCenter.setAttributeNS(null, 'cursor', 'move'); circleCenter.setAttributeNS(null, 'fill', colorin ); typeTransform='spěnCenter'; scaleType='nw'; }, false); rlm@46: circleCenter.addEventListener("mouseout", function(event) {circleCenter.setAttributeNS(null, 'cursor', 'default'); circleCenter.setAttributeNS(null, 'fill', colorout ); typeTransform=''; }, false); //typeTransform='rotate' rlm@46: rlm@46: rlm@46: rect1.addEventListener("mouseover", function(event) {rect1.setAttributeNS(null, 'cursor', 'nw-resize'); rect1.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='nw';}, false); rlm@46: rect1.addEventListener("mouseout", function(event) {rect1.setAttributeNS(null, 'cursor', 'default'); rect1.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); //typeTransform='rotate' rlm@46: rlm@46: rect2.addEventListener("mouseover", function(event) {rect2.setAttributeNS(null, 'cursor', 'ne-resize'); rect2.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='ne';}, false); rlm@46: rect2.addEventListener("mouseout", function(event) {rect2.setAttributeNS(null, 'cursor', 'default'); rect2.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rect3.addEventListener("mouseover", function(event) {rect3.setAttributeNS(null, 'cursor', 'se-resize'); rect3.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='se';}, false); rlm@46: rect3.addEventListener("mouseout", function(event) {rect3.setAttributeNS(null, 'cursor', 'default'); rect3.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rect4.addEventListener("mouseover", function(event) {rect4.setAttributeNS(null, 'cursor', 'sw-resize'); rect4.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='sw';}, false); rlm@46: rect4.addEventListener("mouseout", function(event) {rect4.setAttributeNS(null, 'cursor', 'default'); rect4.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rectmid12.addEventListener("mouseover", function(event) {rectmid12.setAttributeNS(null, 'cursor', 'n-resize'); rectmid12.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='n';}, false); rlm@46: rectmid12.addEventListener("mouseout", function(event) {rectmid12.setAttributeNS(null, 'cursor', 'default'); rectmid12.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rectmid23.addEventListener("mouseover", function(event) {rectmid23.setAttributeNS(null, 'cursor', 'e-resize'); rectmid23.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='e';}, false); rlm@46: rectmid23.addEventListener("mouseout", function(event) {rectmid23.setAttributeNS(null, 'cursor', 'default'); rectmid23.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rectmid34.addEventListener("mouseover", function(event) {rectmid34.setAttributeNS(null, 'cursor', 's-resize'); rectmid34.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='s';}, false); rlm@46: rectmid34.addEventListener("mouseout", function(event) {rectmid34.setAttributeNS(null, 'cursor', 'default'); rectmid34.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: rectmid41.addEventListener("mouseover", function(event) {rectmid41.setAttributeNS(null, 'cursor', 'w-resize'); rectmid41.setAttributeNS(null, 'fill', colorin ); typeTransform='Scale'; scaleType='w'; }, false); rlm@46: rectmid41.addEventListener("mouseout", function(event) {rectmid41.setAttributeNS(null, 'cursor', 'default'); rectmid41.setAttributeNS(null, 'fill', colorout ); typeTransform='Scale'; }, false); rlm@46: rlm@46: ////////// rlm@46: svg.setAttributeNS(null, 'transform',trshape); rlm@46: rlm@46: svg.appendChild(circle1); rlm@46: //tracker.appendChild(circleCenter); rlm@46: if (shape.tagName == 'text'){ rlm@46: svg.appendChild(rect1); rlm@46: svg.appendChild(rect2); rlm@46: svg.appendChild(rect3); rlm@46: svg.appendChild(rect4); rlm@46: }else{ rlm@46: svg.appendChild(rect1); rlm@46: svg.appendChild(rect2); rlm@46: svg.appendChild(rect3); rlm@46: svg.appendChild(rect4); rlm@46: svg.appendChild(rectmid12); rlm@46: svg.appendChild(rectmid23); rlm@46: svg.appendChild(rectmid34); rlm@46: svg.appendChild(rectmid41); rlm@46: rlm@46: } rlm@46: if(pathsEdit) rlm@46: { rlm@46: controlPoints.setAttributeNS(null, 'transform',trshape); rlm@46: tracker.appendChild(controlPoints); rlm@46: }else{ rlm@46: tracker.appendChild(svg); rlm@46: } rlm@46: this.svgRoot.appendChild(tracker); rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.getMarkup = function() { rlm@46: rlm@46: return this.container.innerHTML; rlm@46: } rlm@46: rlm@46: rlm@46: ///////////////////////////////// rlm@46: var rotatexxx=0; rlm@46: rlm@46: var scaleType=''; rlm@46: var xrot=0; rlm@46: var yrot=0; rlm@46: rlm@46: var point = {x:0, y:0, width: 0, height:0}; rlm@46: rlm@46: function createPoint (x, y, width, height) { rlm@46: //var point = {x:34, y:22, width: 22, height:23}; rlm@46: //point.x = x; rlm@46: //point.y = y; rlm@46: point = {x:x, y:y, width: width, height:height}; rlm@46: return point; rlm@46: } rlm@46: rlm@46: /////////////////////////////// rlm@46: rlm@46: SVGRenderer.prototype.restruct= function(shape) rlm@46: { rlm@46: //alert('end'); rlm@46: //forceRedraw(); rlm@46: //clearWorkspace(); rlm@46: //document.getElementById('richdraw').style.cursor='default'; rlm@46: }; rlm@46: rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.transform = function() { rlm@46: //document.forms[0].code.value='Im tranforming'; rlm@46: }; rlm@46: rlm@46: SVGRenderer.prototype.scaleShape = function(shape,previus, toX, toY) { rlm@46: rlm@46: var box = shape.getBBox(); rlm@46: var prevbox=previus.getBBox(); rlm@46: var centerx= box.x+(box.width/2); rlm@46: var centery= box.y+(box.height/2); rlm@46: var coord=this.editor.viewInputxy; rlm@46: toX=parseFloat(coord[0]); rlm@46: toY=parseFloat(coord[1]); rlm@46: var d2p_center=dist2p(centerx,centery,toX,toY); rlm@46: rlm@46: var d2p=dist2p(box.x,box.y,toX,toY); rlm@46: rlm@46: var shareScale=box.width/d2p; rlm@46: rlm@46: var trans_ShareScale=''; rlm@46: var tx, ty, tw, yh; rlm@46: rlm@46: if(scaleType.length==1){ rlm@46: if(scaleType== 'w') rlm@46: { rlm@46: trans_ShareScale=shareScale+",1"; rlm@46: tx=toX; rlm@46: ty=prevbox.y; rlm@46: var dist=prevbox.x-toX; rlm@46: var w=dist+prevbox.width; rlm@46: if(w<1){w=1;} rlm@46: tw=w; rlm@46: th=prevbox.height; rlm@46: //document.forms[0].code.value=box.x+' '+toX+' '+dist+''; rlm@46: } rlm@46: if(scaleType== 'e') rlm@46: { rlm@46: trans_ShareScale=shareScale+",1"; rlm@46: tx=prevbox.x; rlm@46: ty=prevbox.y; rlm@46: var dist=toX-(prevbox.x+prevbox.width); //dist2p(toX,b,c,d); rlm@46: var w=dist+prevbox.width; rlm@46: if(w<1){w=1;} rlm@46: tw=w; rlm@46: th=prevbox.height; rlm@46: rlm@46: } rlm@46: if(scaleType== 'n') rlm@46: { rlm@46: trans_ShareScale="1,"+shareScale; rlm@46: rlm@46: tx=prevbox.x; rlm@46: ty=toY; rlm@46: var dist=prevbox.y-toY; rlm@46: var h=dist+prevbox.height; rlm@46: if(h<1){h=1;} rlm@46: tw=prevbox.width; rlm@46: th=h; rlm@46: rlm@46: } rlm@46: if( scaleType== 's') rlm@46: { rlm@46: trans_ShareScale="1,"+shareScale; rlm@46: rlm@46: tx=prevbox.x; rlm@46: ty=prevbox.y; rlm@46: var dist=toY-(prevbox.y+prevbox.height); //dist2p(toX,b,c,d); rlm@46: var h=dist+prevbox.height; rlm@46: if(h<1){h=1;} rlm@46: tw=prevbox.width; rlm@46: th=h; rlm@46: rlm@46: } rlm@46: } rlm@46: if(scaleType.length==2){ rlm@46: if(scaleType== 'nw'){ rlm@46: trans_ShareScale=shareScale+","+shareScale; rlm@46: rlm@46: //var angle_diagonal=getAngle(prevbox.width,prevbox.height); rlm@46: var angle_diagonal=ang2v(prevbox.x,prevbox.y,prevbox.x+prevbox.width,prevbox.y+prevbox.height) rlm@46: rlm@46: var ax= prevbox.x; rlm@46: var ay= prevbox.y; rlm@46: var bx= prevbox.x+prevbox.width; rlm@46: var by= prevbox.y+prevbox.height; rlm@46: rlm@46: var cx= toX; rlm@46: var cy= toY; rlm@46: var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2)); rlm@46: var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2)); rlm@46: rlm@46: var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: this.editor.log(angle_diagonal* 180 / Math.PI); rlm@46: rlm@46: var tx= section_a[1]; rlm@46: var ty= section_a[2]; rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= 0; rlm@46: var by= section_a[2] ; rlm@46: rlm@46: var cx=prevbox.x+prevbox.width; rlm@46: var cy= prevbox.y; rlm@46: rlm@46: var dx= prevbox.x+prevbox.width; rlm@46: var dy= 0; rlm@46: rlm@46: rlm@46: var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]); rlm@46: rlm@46: rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= section_a[1] rlm@46: var by= 0; rlm@46: rlm@46: var cx= prevbox.x; rlm@46: var cy= prevbox.y+prevbox.height; rlm@46: rlm@46: var dx= 0; rlm@46: var dy= prevbox.y+prevbox.height; rlm@46: rlm@46: rlm@46: var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]); rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: if(distx<1){distx=1;} rlm@46: rlm@46: rlm@46: if(disty<1){disty=1;} rlm@46: //document.forms[0].code.value=distx+' '+disty; rlm@46: tw=distx; rlm@46: th=disty; rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: //////////////////// SE rlm@46: rlm@46: if( scaleType== 'se'){ rlm@46: trans_ShareScale=shareScale+","+shareScale; rlm@46: rlm@46: rlm@46: //var angle_diagonal=getAngle(prevbox.width,prevbox.height); rlm@46: var angle_diagonal=ang2v(prevbox.x,prevbox.y,prevbox.x+prevbox.width,prevbox.y+prevbox.height) rlm@46: rlm@46: rlm@46: rlm@46: var ax= prevbox.x; rlm@46: var ay= prevbox.y; rlm@46: var bx= prevbox.x+prevbox.width; rlm@46: var by= prevbox.y+prevbox.height; rlm@46: rlm@46: var cx= toX; rlm@46: var cy= toY; rlm@46: var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2)); rlm@46: var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2)); rlm@46: rlm@46: var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var tracker = document.getElementById('tracker'); rlm@46: rlm@46: ////////// rlm@46: var tx= prevbox.x; rlm@46: var ty= prevbox.y; rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= 0; rlm@46: var by= section_a[2] ; rlm@46: rlm@46: var cx=prevbox.x; rlm@46: var cy= prevbox.y; rlm@46: rlm@46: var dx= prevbox.x; rlm@46: var dy= 0; rlm@46: rlm@46: rlm@46: var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: ///////////////// rlm@46: rlm@46: rlm@46: var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]); rlm@46: rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= section_a[1] rlm@46: var by= 0; rlm@46: rlm@46: var cx= prevbox.x; rlm@46: var cy= prevbox.y; rlm@46: rlm@46: var dx=0; rlm@46: var dy= prevbox.y; rlm@46: rlm@46: rlm@46: var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: /////////////// rlm@46: rlm@46: var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]); rlm@46: rlm@46: rlm@46: rlm@46: if(distx<1){distx=1;} rlm@46: rlm@46: rlm@46: if(disty<1){disty=1;} rlm@46: rlm@46: tw=distx; rlm@46: th=disty; rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: if(scaleType== 'ne'){ rlm@46: rlm@46: trans_ShareScale=shareScale+","+shareScale; rlm@46: rlm@46: var angle_diagonal=ang2v(prevbox.x,prevbox.y+prevbox.height,prevbox.x+prevbox.width,prevbox.y) rlm@46: //var angle_diagonal=getAngle(prevbox.width,prevbox.height); rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: var ax= prevbox.x; rlm@46: var ay= prevbox.y+prevbox.height; rlm@46: var bx= prevbox.x+prevbox.width; rlm@46: var by= prevbox.y; rlm@46: rlm@46: var cx= toX; rlm@46: var cy= toY; rlm@46: var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2)); rlm@46: var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2)); rlm@46: rlm@46: rlm@46: this.editor.log(angle_diagonal); rlm@46: rlm@46: rlm@46: var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var tracker = document.getElementById('tracker'); rlm@46: rlm@46: ////////// rlm@46: var tx= prevbox.x; rlm@46: var ty= section_a[2]; rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= 0; rlm@46: var by= section_a[2] ; rlm@46: rlm@46: var cx=prevbox.x; rlm@46: var cy= prevbox.y; rlm@46: rlm@46: var dx= prevbox.x; rlm@46: var dy= 0; rlm@46: rlm@46: rlm@46: var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: ///////////////// rlm@46: rlm@46: rlm@46: var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]); rlm@46: rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= section_a[1]; rlm@46: var by= 0; rlm@46: rlm@46: var cx= prevbox.x; rlm@46: var cy= prevbox.y+prevbox.height; rlm@46: rlm@46: var dx=0; rlm@46: var dy= prevbox.y+prevbox.height; rlm@46: rlm@46: rlm@46: var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: /////////////// rlm@46: rlm@46: var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]); rlm@46: rlm@46: rlm@46: rlm@46: if(distx<1){distx=1;} rlm@46: rlm@46: rlm@46: if(disty<1){disty=1;} rlm@46: //document.forms[0].code.value=distx+' '+disty; rlm@46: tw=distx; rlm@46: th=disty; rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: } rlm@46: if(scaleType== 'sw'){ rlm@46: trans_ShareScale=shareScale+","+shareScale; rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: var angle_diagonal=ang2v(prevbox.x,prevbox.y+prevbox.height,prevbox.x+prevbox.width,prevbox.y) rlm@46: //var angle_diagonal=getAngle(prevbox.width,prevbox.height); rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: var ax= prevbox.x; rlm@46: var ay= prevbox.y+prevbox.height; rlm@46: var bx= prevbox.x+prevbox.width; rlm@46: var by= prevbox.y; rlm@46: rlm@46: var cx= toX; rlm@46: var cy= toY; rlm@46: var dx= toX+10*Math.cos(angle_diagonal+(Math.PI/2)); rlm@46: var dy= toY+10*Math.sin(angle_diagonal+(Math.PI/2)); rlm@46: rlm@46: rlm@46: this.editor.log(angle_diagonal); rlm@46: rlm@46: rlm@46: var section_a=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: rlm@46: rlm@46: var svgNamespace = 'http://www.w3.org/2000/svg'; rlm@46: var tracker = document.getElementById('tracker'); rlm@46: rlm@46: ////////// rlm@46: var tx= section_a[1]; rlm@46: var ty= prevbox.y; rlm@46: rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= 0; rlm@46: var by= section_a[2] ; rlm@46: rlm@46: var cx=prevbox.x+prevbox.width; rlm@46: var cy= prevbox.y+prevbox.height; rlm@46: rlm@46: var dx= prevbox.x+prevbox.width; rlm@46: var dy= 0; rlm@46: rlm@46: rlm@46: var section_b=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: var distx=dist2p(section_a[1],section_a[2],section_b[1],section_b[2]); rlm@46: rlm@46: ///////////////// rlm@46: var ax= section_a[1]; rlm@46: var ay= section_a[2]; rlm@46: var bx= section_a[1]; rlm@46: var by= 0; rlm@46: rlm@46: var cx= prevbox.x; rlm@46: var cy= prevbox.y; rlm@46: rlm@46: var dx=0; rlm@46: var dy= prevbox.y; rlm@46: rlm@46: rlm@46: var section_c=ntrsccn2rb(ax,ay,bx,by,cx,cy,dx,dy); rlm@46: var disty=dist2p(section_a[1],section_a[2],section_c[1],section_c[2]); rlm@46: /////////////// rlm@46: rlm@46: rlm@46: rlm@46: if(distx<1){distx=1;} rlm@46: rlm@46: rlm@46: if(disty<1){disty=1;} rlm@46: //document.forms[0].code.value=distx+' '+disty; rlm@46: tw=distx; rlm@46: th=disty; rlm@46: rlm@46: } rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: if(shape.tagName == 'rect') rlm@46: { rlm@46: //alert(data[0]); rlm@46: shape.setAttributeNS(null,'x',tx); rlm@46: shape.setAttributeNS(null,'y',ty); rlm@46: shape.setAttributeNS(null, 'width', tw); rlm@46: shape.setAttributeNS(null, 'height', th); rlm@46: rlm@46: //shape.nodparseFloatue=data; rlm@46: } rlm@46: else rlm@46: if(shape.tagName == 'text') rlm@46: { rlm@46: rlm@46: var tsize=shape.getAttributeNS(null, 'font-size') ; rlm@46: // var d2p_center=dist2p(centerx,centery,toX,toY); rlm@46: rlm@46: var d2p=dist2p(0,box.y,0,toY); rlm@46: //shape.setAttributeNS(null, 'x', tx + 'px'); rlm@46: //shape.setAttributeNS(null, 'y', ty + 'px'); rlm@46: //var mysize=box.height+1 ; rlm@46: //if((toX - centerx)<0){tsize++}else{tsize--} rlm@46: tsize=d2p; rlm@46: //var mysize=parseInt(Math.round(th)); rlm@46: rlm@46: if(scaleType== 'ne'){ shape.setAttributeNS(null, 'font-size',tsize);} rlm@46: if(scaleType== 'se'){ shape.setAttributeNS(null, 'font-size',tsize);} rlm@46: if(scaleType== 'nw'){ shape.setAttributeNS(null, 'font-size',tsize);} rlm@46: if(scaleType== 'sw'){ shape.setAttributeNS(null, 'font-size',tsize);} rlm@46: rlm@46: //shape.setAttributeNS(null, 'font-size', mysize); rlm@46: rlm@46: rlm@46: /* rlm@46: shape.setAttributeNS(null,'x',tx); rlm@46: shape.setAttributeNS(null,'y',ty); rlm@46: shape.setAttributeNS(null, 'width', tw); rlm@46: shape.setAttributeNS(null, 'height', th); rlm@46: rlm@46: //previus.setAttributeNS(null,'transform', "scale("+trans_ShareScale+")"); rlm@46: shape.setAttributeNS(null, 'x', tx + 'px'); rlm@46: shape.setAttributeNS(null, 'y', ty + 'px'); rlm@46: rlm@46: shape.setAttributeNS(null, 'textLength', parseInt(Math.round(tw))); rlm@46: rlm@46: */ rlm@46: } rlm@46: else rlm@46: if(shape.tagName == 'ellipse') rlm@46: { rlm@46: //shape.getAttributeNS(null, 'transform) rlm@46: shape.setAttributeNS(null, 'cx', (tx + (box.width / 2)) + 'px'); rlm@46: shape.setAttributeNS(null, 'cy', (ty + (box.height / 2)) + 'px'); rlm@46: shape.setAttributeNS(null, 'rx', (tw / 2) + 'px'); rlm@46: shape.setAttributeNS(null, 'ry', (th / 2) + 'px'); rlm@46: rlm@46: rlm@46: } rlm@46: else rlm@46: if(shape.tagName == 'line') rlm@46: { rlm@46: shape.setAttributeNS(null, 'x1', tx + 'px'); rlm@46: shape.setAttributeNS(null, 'y1', ty + 'px'); rlm@46: shape.setAttributeNS(null, 'x2', tx + tw + 'px'); rlm@46: shape.setAttributeNS(null, 'y2', ty + th + 'px'); rlm@46: rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'polyline') rlm@46: { rlm@46: rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'image') rlm@46: { rlm@46: shape.setAttributeNS(null,'x',tx); rlm@46: shape.setAttributeNS(null,'y',ty); rlm@46: shape.setAttributeNS(null, 'width', tw); rlm@46: shape.setAttributeNS(null, 'height', th); rlm@46: rlm@46: } rlm@46: else rlm@46: if (shape.tagName == 'path') rlm@46: { rlm@46: // var xscale= box.width/tw; rlm@46: // var yscale= box.height/th; rlm@46: var xscale= tw/box.width; rlm@46: var yscale= th/box.height; rlm@46: var xinc=xscale;//dist*angx; rlm@46: var yinc=yscale/ty;//dist*angy; rlm@46: rlm@46: if(scaleType== 'n') rlm@46: { rlm@46: tx=box.x+(box.width/2); rlm@46: ty=box.y+box.height; rlm@46: var xinc=1; rlm@46: var yinc=box.y/toY;//dist*angy; rlm@46: rlm@46: } rlm@46: if(scaleType== 's') rlm@46: { rlm@46: tx=box.x+(box.width/2); rlm@46: ty=box.y; rlm@46: var xinc=1; rlm@46: var yinc=toY/(box.y+box.height);//dist*angy; rlm@46: } rlm@46: if(scaleType== 'e') rlm@46: { rlm@46: tx=box.x; rlm@46: ty=box.y+(box.height/2); rlm@46: var xinc=toX/(box.x+box.width); rlm@46: var yinc=1; rlm@46: rlm@46: } rlm@46: if(scaleType== 'w') rlm@46: { rlm@46: tx=box.x+box.width; rlm@46: ty=box.y+(box.height/2); rlm@46: var xinc=box.x/toX; rlm@46: var yinc=1; rlm@46: rlm@46: } rlm@46: if(scaleType== 'ne') rlm@46: { rlm@46: tx=box.x; rlm@46: ty=box.y+box.height; rlm@46: var xinc=toX/(box.x+box.width); rlm@46: var yinc=xinc; rlm@46: } rlm@46: if(scaleType== 'nw') rlm@46: { rlm@46: tx=box.x+box.width; rlm@46: ty=box.y+box.height; rlm@46: var xinc=box.x/toX; rlm@46: var yinc=xinc; rlm@46: } rlm@46: if(scaleType== 'se') rlm@46: { rlm@46: tx=box.x; rlm@46: ty=box.y; rlm@46: var xinc=toX/(box.x+box.width); rlm@46: var yinc=xinc; rlm@46: } rlm@46: if(scaleType== 'sw') rlm@46: { rlm@46: tx=(box.x+box.width); rlm@46: ty=box.y; rlm@46: var xinc=box.x/toX; rlm@46: var yinc=xinc; rlm@46: } rlm@46: if(xinc==0){ xinc= 0.0000001;} rlm@46: if(yinc==0){ yinc= 0.0000001; } rlm@46: var prevpath=previus.getAttributeNS(null, 'd'); rlm@46: var path=shape.getAttributeNS(null, 'd'); rlm@46: //////////// rlm@46: rlm@46: rlm@46: //xshe=left; rlm@46: //yshe=top; rlm@46: rlm@46: path=path.replace(/, /g, ','); rlm@46: path=path.replace(/ ,/g, ','); rlm@46: var ps =path.split(" ") rlm@46: var pcc = ""; rlm@46: var point =ps[0].split(","); rlm@46: rlm@46: rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var num1= parseFloat(point[1]); rlm@46: rlm@46: rlm@46: var ang= ang2v(box.x,box.y,tx,ty) ; rlm@46: var angle = Math.round((ang/Math.PI* 2)* 360); rlm@46: var angx = Math.cos(ang); rlm@46: var angy = Math.sin(ang); rlm@46: var dist= dist2p(tx,ty,box.x,box.y); rlm@46: //var xinc=xscale;//dist*angx; rlm@46: //var yinc=yscale;//dist*angy; rlm@46: var re = /^[-]?\d*\.?\d*$/; rlm@46: var axis = $V([tx,ty]); rlm@46: for(var i = 0; i < ps.length; i++) rlm@46: { rlm@46: if(ps[i].indexOf(',')>0){ rlm@46: rlm@46: var point =ps[i].split(","); rlm@46: var char1=point[0].substring(0,1); rlm@46: if(char1=='A' || char1=='a'){isArc=true; contArc=0;} rlm@46: if(isArc==true){contArc++} rlm@46: if(contArc==4){contArc=0; isArc=false} rlm@46: rlm@46: //if (isNaN(valnum)) rlm@46: if (!char1.match(re)) rlm@46: { rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var text=char1; rlm@46: }else{ rlm@46: if(isArc==true && contArc==2 ) rlm@46: { rlm@46: var num0= point[0]; rlm@46: }else{ rlm@46: var num0= parseFloat(point[0]); rlm@46: } rlm@46: var text=''; rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: if(isArc==true && contArc==2) rlm@46: { rlm@46: point[1]= point[1].toString() ; rlm@46: } rlm@46: else rlm@46: { rlm@46: rlm@46: //num0*=xinc; rlm@46: point[1]= parseFloat(point[1]); rlm@46: //point[1]*=yinc; rlm@46: var pointIni=$V([num0,point[1],1]); rlm@46: var matrT = $M([[1,0,-tx],[0,1,-ty],[0,0,1]]); rlm@46: var matrS = $M([[xinc,0,0],[0,yinc,0],[0,0,1]]); rlm@46: var matrR = $M([[1,0,tx],[0,1,ty],[0,0,1]]); rlm@46: var matr1= matrT.x(pointIni); rlm@46: var matr2= matrS.x(matr1); rlm@46: //var pointR=pointIni.Random(1) rlm@46: //var pointR=pointIni.rotate(Math.PI/180,axis); rlm@46: //var pointRc=pointIni.cross(axis); rlm@46: //var pointR=matr2; rlm@46: var pointR=matrR.x(matr2); rlm@46: num0=pointR.elements[0]; rlm@46: point[1]=pointR.elements[1]; rlm@46: $('code').value=pointIni.elements[0]+','+pointR.elements[1]+' '; rlm@46: } rlm@46: var cx=num0; rlm@46: var cy=point[1]; rlm@46: pcc+=text+cx+','+cy+' '; rlm@46: //pcc+=text+cx+','+cy+' '; rlm@46: rlm@46: }else{ rlm@46: pcc+=ps[i]+' '; rlm@46: } rlm@46: } rlm@46: rlm@46: shape.setAttributeNS(null,'d', pcc); rlm@46: rlm@46: rlm@46: rlm@46: ////////////// rlm@46: /* rlm@46: path=path.replace(/, /g, ','); rlm@46: path=path.replace(/ ,/g, ','); rlm@46: var ps =path.split(" ") rlm@46: var pcc = ""; rlm@46: rlm@46: var xinc=tx-prevbox.x; rlm@46: var yinc=ty-prevbox.y; rlm@46: rlm@46: var re = /^[-]?\d*\.?\d*$/; rlm@46: for(var i = 0; i < ps.length; i++) rlm@46: { rlm@46: if(ps[i].indexOf(',')>0){ rlm@46: rlm@46: var point =ps[i].split(","); rlm@46: var char1=point[0].substring(0,1); rlm@46: point[1]= parseFloat(point[1]); rlm@46: rlm@46: // var valnum =char1.charAt(0); rlm@46: //if (isNaN(valnum)) rlm@46: if (!char1.match(re)) rlm@46: rlm@46: { rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var text=char1; rlm@46: }else{ rlm@46: var num0= parseFloat(point[0]); rlm@46: var text=''; rlm@46: rlm@46: } rlm@46: //num0+=dist*angx; rlm@46: //point[1]+=dist*angy; rlm@46: num0*=xscale; rlm@46: point[1]*=yscale; rlm@46: rlm@46: // num0+=xinc; rlm@46: // point[1]+=yinc; rlm@46: rlm@46: rlm@46: rlm@46: var cx=num0; rlm@46: var cy=point[1]; rlm@46: pcc+=text+cx+','+cy+' '; rlm@46: }else{ rlm@46: pcc+=ps[i]+' '; rlm@46: } rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: // $('code').value=dist+' '+ ang+' '+'__'+x+'= '+left+'/ '+y+'= ' +top+''; rlm@46: rlm@46: //shape.setAttributeNS(null,'transform', "rotate("+left+")"); rlm@46: rlm@46: // shape.setAttributeNS(null,'transform', "translate("+trax+","+tray+") rotate("+0+") scale(1,1)"); rlm@46: shape.setAttributeNS(null,'d', pcc); rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: //document.forms[0].code.value=''; rlm@46: //shape.setAttributeNS(null,'transform', "scale("+trans_ShareScale+")"); rlm@46: */ rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: //$('status').innerHTML=typeTransform+': '+shareScale; rlm@46: rlm@46: rlm@46: }; rlm@46: rlm@46: rlm@46: SVGRenderer.prototype.rotateShape = function(shape, previus, toX, toY) { rlm@46: rlm@46: //document.getElementById('richdraw').style.cursor='e-resize'; rlm@46: var box = shape.getBBox(); rlm@46: var prevbox=previus.getBBox(); rlm@46: var centerx= box.x+(box.width/2); rlm@46: var centery= box.y+(box.height/2); rlm@46: var coord=this.editor.viewInputxy; rlm@46: rlm@46: var actual_angle=ang2v(centerx,centery,coord[0], coord[1]); rlm@46: rlm@46: if(xrot0){ rlm@46: rlm@46: var point =ps[i].split(","); rlm@46: var char1=point[0].substring(0,1); rlm@46: if(char1=='A' || char1=='a'){isArc=true; contArc=0;} rlm@46: if(isArc==true){contArc++} rlm@46: if(contArc==4){contArc=0; isArc=false} rlm@46: rlm@46: //if (isNaN(valnum)) rlm@46: if (!char1.match(re)) rlm@46: { rlm@46: var num0= parseFloat(point[0].substring(1)); rlm@46: var text=char1; rlm@46: }else{ rlm@46: if(isArc==true && contArc==2 ) rlm@46: { rlm@46: var num0= point[0]; rlm@46: }else{ rlm@46: var num0= parseFloat(point[0]); rlm@46: } rlm@46: var text=''; rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: if(isArc==true && contArc==2) rlm@46: { rlm@46: point[1]= point[1].toString() ; rlm@46: } rlm@46: else rlm@46: { rlm@46: rlm@46: //num0*=xinc; rlm@46: point[1]= parseFloat(point[1]); rlm@46: //point[1]*=yinc; rlm@46: var pointIni=$V([num0,point[1],1]); rlm@46: var matrT = $M([[1,0,-tx],[0,1,-ty],[0,0,1]]); rlm@46: var matrS = $M([[xinc,0,0],[0,yinc,0],[0,0,1]]); rlm@46: var matrR = $M([[1,0,tx],[0,1,ty],[0,0,1]]); rlm@46: var matr1= matrT.x(pointIni); rlm@46: var matr2= matrS.x(matr1); rlm@46: //var pointR=pointIni.Random(1) rlm@46: //var pointR=pointIni.rotate(Math.PI/180,axis); rlm@46: //var pointRc=pointIni.cross(axis); rlm@46: //var pointR=matr2; rlm@46: var pointR=matrR.x(matr2); rlm@46: num0=pointR.elements[0]; rlm@46: point[1]=pointR.elements[1]; rlm@46: $('code').value=pointIni.elements[0]+','+pointR.elements[1]+' '; rlm@46: } rlm@46: var cx=num0; rlm@46: var cy=point[1]; rlm@46: pcc+=text+cx+','+cy+' '; rlm@46: //pcc+=text+cx+','+cy+' '; rlm@46: rlm@46: }else{ rlm@46: pcc+=ps[i]+' '; rlm@46: } rlm@46: } rlm@46: var svg =shape.cloneNode(false); rlm@46: svg.setAttributeNS(null,'d', pcc); rlm@46: this.svgRoot.appendChild(svg); rlm@46: return svg; rlm@46: } rlm@46: else rlm@46: { rlm@46: if(shape.tagName=="text" || shape.tagName=="image" ) rlm@46: { rlm@46: rlm@46: rlm@46: var tr=''; rlm@46: var turn0=''; rlm@46: var svg =shape.cloneNode(false); rlm@46: var x= shape.getAttributeNS(null, 'x'); rlm@46: var y= shape.getAttributeNS(null, 'y'); rlm@46: x+=box.width/2; rlm@46: y+=box.height/2; rlm@46: if(HorV=='V') rlm@46: { rlm@46: svg.setAttributeNS(null,'x',-parseFloat(x)); rlm@46: var scaleSim='-1, 1'; rlm@46: svg.setAttributeNS(null,'transform','scale('+scaleSim+')'); rlm@46: //svg.setAttributeNS(null,'y',parseFloat(x)); rlm@46: svg.setAttributeNS(null,'x',-parseFloat(x)); rlm@46: rlm@46: rlm@46: } rlm@46: if(HorV=='H') rlm@46: { rlm@46: var scaleSim='1, -1'; rlm@46: svg.setAttributeNS(null,'y',-parseFloat(y)); rlm@46: svg.setAttributeNS(null,'transform','scale('+scaleSim+')'); rlm@46: //svg.setAttributeNS(null,'x',parseFloat(x)); rlm@46: svg.setAttributeNS(null,'y',-parseFloat(y)); rlm@46: rlm@46: rlm@46: } rlm@46: rlm@46: if(shape.hasAttributeNS(null, 'transform')) rlm@46: { rlm@46: tr=shape.getAttributeNS(null, 'transform'); rlm@46: turn0=GetString(tr,'rotate(',')'); rlm@46: rlm@46: svg.setAttributeNS(null,'transform','rotate('+turn+'),scale('+scaleSim+')'); rlm@46: svg.setAttributeNS(null,'x',parseFloat(x)); rlm@46: svg.setAttributeNS(null,'y',parseFloat(y)); rlm@46: rlm@46: //svg.setAttributeNS(null,'transform','rotate('+turn+'),scale('+''); rlm@46: }else{ rlm@46: rlm@46: } rlm@46: rlm@46: rlm@46: rlm@46: if(shape.tagName=="text"){ rlm@46: var text=shape.textContent ; rlm@46: svg.textContent=text; rlm@46: } rlm@46: //svg.setAttributeNS(null,'writing-mode',mode); rlm@46: //svg.setAttributeNS(null,'glyph-orientation-horizontal','0deg'); rlm@46: // rlm@46: //svg.appendChild(text); rlm@46: rlm@46: this.svgRoot.appendChild(svg); rlm@46: return svg; rlm@46: } rlm@46: else rlm@46: { rlm@46: if(shape.hasAttributeNS(null, 'transform')) rlm@46: { rlm@46: rlm@46: rlm@46: var tr=shape.getAttributeNS(null, 'transform'); rlm@46: var turn0=GetString(tr, 'rotate(',','); rlm@46: turn0=parseFloat(turn0); rlm@46: //alert(turn0); rlm@46: rlm@46: if(HorV=='V'){ rlm@46: var angle=180; rlm@46: //var turn=(turn0+angle)-(turn0-90); rlm@46: var turn=turn0+((angle-turn0)*2); rlm@46: } rlm@46: if(HorV=='H'){ rlm@46: var angle=90; rlm@46: var turn=turn0+((angle-turn0)*2); rlm@46: } rlm@46: var centerx= box.x+(box.width/2); rlm@46: var centery= box.y+(box.height/2); rlm@46: //this.editor.log(centerx+' '+centery+' '+coord[0]+' '+coord[1]+'____ '+rot_angle+' '+actual_angle*180/Math.PI); rlm@46: var svg =shape.cloneNode(false); rlm@46: svg.setAttributeNS(null,'transform', "rotate("+turn+","+centerx+","+centery+")"); rlm@46: this.svgRoot.appendChild(svg); rlm@46: return svg; rlm@46: } rlm@46: else rlm@46: { rlm@46: var centerx= box.x+(box.width/2); rlm@46: var centery= box.y+(box.height/2); rlm@46: shape.setAttributeNS(null,'transform', "rotate("+180+","+centerx+","+centery+")"); rlm@46: rlm@46: } rlm@46: } rlm@46: } rlm@46: }; rlm@46: //http://dev.opera.com/articles/view/svg-evolution-2-our-first-steps-into-sv/?page=3 rlm@46: //http://www.w3.org/TR/2000/03/WD-SVG-20000303/exchange.html#StylingAttributes rlm@46: //http://www.xml.com/lpt/a/1390 rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: rlm@46: //http://xml-utils.com/conferencia-svg.html#d0e527 rlm@46: //http://www.xml.com/lpt/a/1321 rlm@46: //http://phrogz.net/objjob/object.asp?id=101 rlm@46: //http://admisource.gouv.fr/plugins/scmcvs/cvsweb.php/Cassini-ihm/js-yosemite/mapApp.js?rev=1.1;cvsroot=cassini rlm@46: //http://groups.google.com/group/prototype-graphic/msg/0547c0caea8869c6 rlm@46: //http://sylvester.jcoglan.com/