annotate onlypaths/js/onlypaths_mini.js @ 74:24d5d4221b42 laserkard

session with nick, updated the about page
author r@rlm
date Fri, 25 Jun 2010 19:59:31 -0400
parents 26c2b3ad21c7
children
rev   line source
rlm@46 1 /*----------------------------------------------------------------------------
rlm@46 2 ONLYPATHS 0.1
rlm@46 3 from
rlm@46 4 RICHDRAW 1.0
rlm@46 5 Vector Graphics Drawing Script
rlm@46 6 -----------------------------------------------------------------------------
rlm@46 7 Created by Mark Finkle (mark.finkle@gmail.com)
rlm@46 8 Implementation of simple vector graphic drawing control using SVG or VML.
rlm@46 9 -----------------------------------------------------------------------------
rlm@46 10 Copyright (c) 2006 Mark Finkle
rlm@46 11 2008 Antimatter15
rlm@46 12 2008 Josep_ssv
rlm@46 13
rlm@46 14 This program is free software; you can redistribute it and/or modify it
rlm@46 15 under the terms of the MIT License.
rlm@46 16
rlm@46 17 Permission is hereby granted, free of charge, to any person obtaining a
rlm@46 18 copy of this software and associated documentation files (the "Software"),
rlm@46 19 to deal in the Software without restriction, including without limitation
rlm@46 20 the rights to use, copy, modify, merge, publish, distribute, sublicense,
rlm@46 21 and/or sell copies of the Software, and to permit persons to whom the
rlm@46 22 Software is furnished to do so, subject to the following conditions:
rlm@46 23 The above copyright notice and this permission notice shall be included in
rlm@46 24 all copies or substantial portions of the Software.
rlm@46 25
rlm@46 26 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
rlm@46 27 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
rlm@46 28 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
rlm@46 29 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
rlm@46 30 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
rlm@46 31 FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
rlm@46 32 DEALINGS IN THE SOFTWARE.
rlm@46 33 -----------------------------------------------------------------------------
rlm@46 34 Dependencies: (SVG or VML rendering implementations)
rlm@46 35 History:
rlm@46 36 2006-04-05 | Created richdraw.js
rlm@46 37 2008 | Update content and added framework ExtJS
rlm@46 38 2008-06-08 | Rename onlypaths.js
rlm@46 39 --------------------------------------------------------------------------*/
rlm@46 40
rlm@46 41 var xpArray=new Array();
rlm@46 42 var ypArray=new Array();
rlm@46 43 var setPoints=new Array();
rlm@46 44
rlm@46 45 var inout='';//true;
rlm@46 46 var typeTransform='';
rlm@46 47
rlm@46 48 var contmove=0;
rlm@46 49 var zoomx=0;
rlm@46 50 var zoomy=0;
rlm@46 51 var zoomscale=1;
rlm@46 52 var zoommode='frame'; //more minus frame
rlm@46 53
rlm@46 54 //
rlm@46 55
rlm@46 56 var data_path_close=true;
rlm@46 57 var data_text_family='';
rlm@46 58 var data_text_size=19
rlm@46 59 var data_text_messaje='';
rlm@46 60 var data_image_href='';
rlm@46 61
rlm@46 62 var numClics=0;
rlm@46 63
rlm@46 64 ////////////
rlm@46 65
rlm@46 66 function RichDrawEditor(elem, renderer) {
rlm@46 67 this.container = elem;
rlm@46 68 this.gridX = 10;
rlm@46 69 this.gridY = 10;
rlm@46 70 this.mouseDownX = 0;
rlm@46 71 this.mouseDownY = 0;
rlm@46 72 this.clicX = 0;
rlm@46 73 this.clicY = 0;
rlm@46 74 this.nowDraw=false;
rlm@46 75 this.mode = '';
rlm@46 76 this.fillColor = '';
rlm@46 77 this.lineColor = '';
rlm@46 78 this.lineWidth = '';
rlm@46 79 this.selected = null;
rlm@46 80 this.squareSelect = null;
rlm@46 81 this.focusin = null;
rlm@46 82 this.lineOpac = 1;
rlm@46 83 this.fillOpac = 1;
rlm@46 84 this.gridWidth = 1;
rlm@46 85 this.opac = 1;
rlm@46 86 //++ ;
rlm@46 87 this.text_messaje="";
rlm@46 88 this.text_size=19;
rlm@46 89 this.text_family="Arial";
rlm@46 90
rlm@46 91 this.pathsEdit = false;
rlm@46 92 this.previusBox=null;
rlm@46 93 this.initialPath='';
rlm@46 94 this.clipboard=null;
rlm@46 95 this.moveNow=true;
rlm@46 96
rlm@46 97 this.selectedBounds = { x:0, y:0, width:0, height: 0 };
rlm@46 98 this.onselect = function() {}
rlm@46 99 this.onunselect = function() {}
rlm@46 100
rlm@46 101 this.logtext = "";
rlm@46 102
rlm@46 103 this.renderer = renderer;
rlm@46 104 this.renderer.init(this.container);
rlm@46 105 this.renderer.editor = this;
rlm@46 106 this.inputxy = [];
rlm@46 107 this.onInputXY = function(){};
rlm@46 108 Ext.get(this.container).on('keypress', function(e){alert(e.keyCode);});
rlm@46 109
rlm@46 110 Ext.get(this.container).on( "mousedown", this.onMouseDown,this);
rlm@46 111 Ext.get(this.container).on( "mouseup", this.onMouseUp,this);
rlm@46 112 //Ext.get(this.container).on( "mouseout", this.outShape,this);
rlm@46 113 //Ext.get(this.container).on( "mouseover", this.overShape,this);
rlm@46 114 Ext.get(this.container).on( "mousemove", this.onTranslate,this);
rlm@46 115 Ext.get(this.container).on( "dblclick", this.onEndLine,this);
rlm@46 116 Ext.get(this.container).on( "selectstart", this.onSelectStart,this);
rlm@46 117
rlm@46 118
rlm@46 119 //Ext.get(this.container).on("keydown", keypresshandler, this);
rlm@46 120 //Event.observe(this.container).on( "keydown", keypresshandler,this);
rlm@46 121 //Ext.get(this.container).on( "keypress", this.onKeyPress,this);
rlm@46 122 //Ext.get(this.container).on('keydown',this.onKeyPress,this);
rlm@46 123
rlm@46 124 }
rlm@46 125
rlm@46 126 RichDrawEditor.prototype.log = function(logtext){
rlm@46 127 //this.logtext = logtext
rlm@46 128 if(document.forms[0].code){
rlm@46 129 document.forms[0].code.value = logtext
rlm@46 130 }
rlm@46 131 }
rlm@46 132
rlm@46 133
rlm@46 134 RichDrawEditor.prototype.getshapes = function(){
rlm@46 135 return this.renderer.getshapes();
rlm@46 136 }
rlm@46 137
rlm@46 138 RichDrawEditor.prototype.info = function(shape){
rlm@46 139 return this.renderer.info(shape)
rlm@46 140 }
rlm@46 141
rlm@46 142
rlm@46 143 RichDrawEditor.prototype.clearWorkspace = function() {
rlm@46 144 this.container.innerHTML = '';
rlm@46 145 };
rlm@46 146
rlm@46 147 RichDrawEditor.prototype.deleteSelection = function() {
rlm@46 148 if (this.selected) {
rlm@46 149 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 150 this.renderer.remove(this.selected);
rlm@46 151 this.selected = null;
rlm@46 152 }
rlm@46 153 };
rlm@46 154
rlm@46 155 RichDrawEditor.prototype.toFront = function(order) {
rlm@46 156 if (this.selected) {
rlm@46 157 this.renderer.index(this.selected, order);
rlm@46 158 }
rlm@46 159 };
rlm@46 160
rlm@46 161 RichDrawEditor.prototype.deleteAll = function() {
rlm@46 162 this.renderer.removeAll();
rlm@46 163 };
rlm@46 164
rlm@46 165
rlm@46 166 RichDrawEditor.prototype.select = function(elem) {
rlm@46 167 if (elem == this.selected){ return; }
rlm@46 168 this.selected = elem;
rlm@46 169 this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 170 this.onselect(this);
rlm@46 171 };
rlm@46 172
rlm@46 173
rlm@46 174 RichDrawEditor.prototype.unselect = function() {
rlm@46 175 if (this.selected) {
rlm@46 176 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 177 this.selected = null;
rlm@46 178 this.onunselect(this);
rlm@46 179 }
rlm@46 180 };
rlm@46 181
rlm@46 182 RichDrawEditor.prototype.getSelectedElement = function() {
rlm@46 183 return this.selected;
rlm@46 184 };
rlm@46 185
rlm@46 186 RichDrawEditor.prototype.toCurve = function() {
rlm@46 187 this.renderer.tocurve();
rlm@46 188 }
rlm@46 189
rlm@46 190 RichDrawEditor.prototype.submitShape = function(data) {
rlm@46 191 if (this.mode != 'select') {
rlm@46 192 setMode('path', 'Path');
rlm@46 193 this.actualStyle();
rlm@46 194 onColorChange();
rlm@46 195 //shape, fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, points, transform, parent
rlm@46 196 //this.selected = this.renderer.datacreate(this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,data);
rlm@46 197 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref, data, '', '');
rlm@46 198
rlm@46 199 this.selected.id = 'shape:' + createUUID();
rlm@46 200 Ext.get(this.selected).on("mousedown", this.onHit,this);
rlm@46 201 setMode('select', 'Select');
rlm@46 202 } else {
rlm@46 203 this.renderer.transformShape(this.selected,data,null);
rlm@46 204 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 205 this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 206 }
rlm@46 207 };
rlm@46 208
rlm@46 209 RichDrawEditor.prototype.setGrid = function(horizontal, vertical) {
rlm@46 210 this.gridX = horizontal;
rlm@46 211 this.gridY = vertical;
rlm@46 212 this.gridWidth = (vertical+horizontal)/2; //average. ideally, it should be the same
rlm@46 213 };
rlm@46 214
rlm@46 215
rlm@46 216 // ++
rlm@46 217 RichDrawEditor.prototype.actualStyle = function()
rlm@46 218 {
rlm@46 219 this.textMessaje=$('option_text_message').value;
rlm@46 220 this.textSize=parseFloat($('option_text_size').value);
rlm@46 221 this.textFamily=$('option_text_family').value;
rlm@46 222 this.pathClose = $('option_path_close').checked;
rlm@46 223 this.imageHref = $('option_image_href').value;
rlm@46 224
rlm@46 225 return;
rlm@46 226 };
rlm@46 227
rlm@46 228
rlm@46 229 RichDrawEditor.prototype.editCommand = function(cmd, value)
rlm@46 230 {
rlm@46 231 if (cmd == 'mode')
rlm@46 232 {
rlm@46 233 this.mode = value;
rlm@46 234 }
rlm@46 235 else if (this.selected == null)
rlm@46 236 {
rlm@46 237 if (cmd == 'fillcolor')
rlm@46 238 {
rlm@46 239 this.fillColor = value;
rlm@46 240 }
rlm@46 241 else if (cmd == 'linecolor')
rlm@46 242 {
rlm@46 243 this.lineColor = value;
rlm@46 244 }
rlm@46 245 else if (cmd == 'linewidth')
rlm@46 246 {
rlm@46 247 this.lineWidth = parseInt(value) + 'px';
rlm@46 248 }
rlm@46 249 else if (cmd == 'fillopacity') {
rlm@46 250 this.fillOpac = parseInt(value);
rlm@46 251 }
rlm@46 252 else if (cmd == 'lineopacity') {
rlm@46 253 this.lineOpac = parseInt(value);
rlm@46 254 }
rlm@46 255 }
rlm@46 256 else
rlm@46 257 {
rlm@46 258 this.renderer.editCommand(this.selected, cmd, value);
rlm@46 259 }
rlm@46 260 }
rlm@46 261
rlm@46 262
rlm@46 263 RichDrawEditor.prototype.queryCommand = function(cmd)
rlm@46 264 {
rlm@46 265 if (cmd == 'mode')
rlm@46 266 {
rlm@46 267 return this.mode;
rlm@46 268 }
rlm@46 269 else if (this.selected == null)
rlm@46 270 {
rlm@46 271 if (cmd == 'fillcolor')
rlm@46 272 {
rlm@46 273 return this.fillColor;
rlm@46 274 }
rlm@46 275 else if (cmd == 'linecolor')
rlm@46 276 {
rlm@46 277 return this.lineColor;
rlm@46 278 }
rlm@46 279 else if (cmd == 'linewidth')
rlm@46 280 {
rlm@46 281 return this.lineWidth;
rlm@46 282 }
rlm@46 283 else if (cmd == 'fillopacity')
rlm@46 284 {
rlm@46 285 return this.fillOpac;
rlm@46 286 }
rlm@46 287 else if (cmd == 'lineopacity')
rlm@46 288 {
rlm@46 289 return this.fillOpac;
rlm@46 290 }
rlm@46 291 }
rlm@46 292 else
rlm@46 293 {
rlm@46 294 return this.renderer.queryCommand(this.selected, cmd);
rlm@46 295 }
rlm@46 296 }
rlm@46 297
rlm@46 298
rlm@46 299
rlm@46 300
rlm@46 301 RichDrawEditor.prototype.onSelectStart = function(event) {
rlm@46 302 return false
rlm@46 303 }
rlm@46 304
rlm@46 305
rlm@46 306 /////////////////////////////
rlm@46 307
rlm@46 308
rlm@46 309 /*
rlm@46 310
rlm@46 311 Event.observe(window, 'load', function() {
rlm@46 312 Event.observe(document, 'keypress', function(e){
rlm@46 313 var code;
rlm@46 314 if (!e) var e = window.event;
rlm@46 315 if (e.keyCode) code = e.keyCode;
rlm@46 316 else if (e.which) code = e.which;
rlm@46 317 var character = String.fromCharCode(code);
rlm@46 318 alert('Character was ' + character);
rlm@46 319 });
rlm@46 320 });
rlm@46 321 */
rlm@46 322
rlm@46 323 ////////////////////////
rlm@46 324 /*RichDrawEditor.prototype.outShape = function(event) {
rlm@46 325 if(typeTransform=='Translate')
rlm@46 326 {
rlm@46 327 typeTransform='';
rlm@46 328 }
rlm@46 329 }
rlm@46 330 RichDrawEditor.prototype.overShape = function(event) {
rlm@46 331 typeTransform='Translate';
rlm@46 332
rlm@46 333 }
rlm@46 334 */
rlm@46 335 RichDrawEditor.prototype.onMouseDown = function(event) {
rlm@46 336
rlm@46 337 clockdata();
rlm@46 338
rlm@46 339 //MODE NO SELECT
rlm@46 340 if (this.mode != 'select')
rlm@46 341 {
rlm@46 342 var modeUsed=0;
rlm@46 343 if (this.mode == 'zoom')
rlm@46 344 {
rlm@46 345 var offset = Ext.get(this.container).getXY();
rlm@46 346 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 347 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 348 //snappedX*=proporDiagonal;
rlm@46 349 //snappedY*=proporDiagonal;
rlm@46 350
rlm@46 351 //snappedX+=marginx;
rlm@46 352 //snappedY+=marginy;
rlm@46 353 var width=this.gridWidth;
rlm@46 354 contmove=0;
rlm@46 355 this.setGrid(width, width);
rlm@46 356 this.unselect();
rlm@46 357 xpArray=new Array();
rlm@46 358 ypArray=new Array();
rlm@46 359 this.mouseDownX = zoomx+snappedX;
rlm@46 360 this.mouseDownY = zoomy+snappedY;
rlm@46 361 xpArray.push(this.mouseDownX);
rlm@46 362 ypArray.push(this.mouseDownY);
rlm@46 363 if(zoommode=='window'){
rlm@46 364 this.squareSelect= this.renderer.create('rect', 'none', "#000000", 1, 1, 1, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref,'M0,0 1,1', '', '');
rlm@46 365 this.squareSelect.id = 'squareSelectID';
rlm@46 366 Ext.get(this.squareSelect).on( "mousedown", this.onHit,this);
rlm@46 367 Ext.get(this.squareSelect).on( "mousemove", this.onDraw,this);
rlm@46 368
rlm@46 369 }else{
rlm@46 370 this.renderer.zoom(this.mouseDownX, this.mouseDownY);
rlm@46 371 }
rlm@46 372 modeUsed=1;
rlm@46 373 } //end zoom
rlm@46 374 if (this.mode == 'controlpath')
rlm@46 375 {
rlm@46 376 this.actualStyle();
rlm@46 377 onColorChange();
rlm@46 378 if(numClics<=0)
rlm@46 379 {
rlm@46 380 this.nowDraw=true;
rlm@46 381 setPoints=new Array();
rlm@46 382 var offset = Ext.get(this.container).getXY();
rlm@46 383 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 384 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 385 //snappedX*=proporDiagonal;
rlm@46 386 //snappedY*=proporDiagonal;
rlm@46 387 //snappedX+=marginx;
rlm@46 388 //snappedY+=marginy;
rlm@46 389 var width=this.gridWidth;
rlm@46 390 contmove=0;
rlm@46 391 this.setGrid(width, width);
rlm@46 392 this.unselect();
rlm@46 393 xpArray=new Array();
rlm@46 394 ypArray=new Array();
rlm@46 395 this.mouseDownX = zoomx+snappedX;
rlm@46 396 this.mouseDownY = zoomy+snappedY;
rlm@46 397 xpArray.push(this.mouseDownX);
rlm@46 398 ypArray.push(this.mouseDownY);
rlm@46 399 setPoints.push(this.mouseDownX+','+this.mouseDownY);
rlm@46 400 // ++ ;
rlm@46 401 onColorChange();
rlm@46 402 this.actualStyle();
rlm@46 403 // ++ ;
rlm@46 404 //shape, fillColor, lineColor, fillOpac, lineOpac, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, points, transform, parent
rlm@46 405 //this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref, '');
rlm@46 406
rlm@46 407 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref, 'M0,0 1,1', '', '');
rlm@46 408
rlm@46 409 this.selected.id = 'shape:' + createUUID();
rlm@46 410 Ext.get(this.selected).on( "mousedown", this.onHit,this);
rlm@46 411 this.log(this.selected.id);
rlm@46 412
rlm@46 413 Ext.get(this.selected).on( "dblclick", this.onEndLine,this);
rlm@46 414 Ext.get(this.container).on( "mousemove", this.onDraw,this);
rlm@46 415 numClics++;
rlm@46 416 }
rlm@46 417 else
rlm@46 418 {
rlm@46 419 var coord=this.inputxy;
rlm@46 420 var X=parseFloat(coord[0]);
rlm@46 421 var Y=parseFloat(coord[1]);
rlm@46 422 setPoints.push(X+','+Y);
rlm@46 423 this.renderer.clic(this.selected);
rlm@46 424 numClics++;
rlm@46 425 }
rlm@46 426 modeUsed=1;
rlm@46 427 } //end mode controlpath
rlm@46 428 if (modeUsed == 0)
rlm@46 429 {
rlm@46 430 var offset = Ext.get(this.container).getXY();
rlm@46 431 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 432 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 433 //snappedX*=proporDiagonal;
rlm@46 434 //snappedY*=proporDiagonal;
rlm@46 435 //snappedX+=marginx;
rlm@46 436 //snappedY+=marginy;
rlm@46 437
rlm@46 438 var width=this.gridWidth;
rlm@46 439 contmove=0;
rlm@46 440 this.setGrid(width, width);
rlm@46 441 this.unselect();
rlm@46 442 xpArray=new Array();
rlm@46 443 ypArray=new Array();
rlm@46 444 this.mouseDownX = zoomx+snappedX;
rlm@46 445 this.mouseDownY = zoomy+snappedY;
rlm@46 446 xpArray.push(this.mouseDownX);
rlm@46 447 ypArray.push(this.mouseDownY);
rlm@46 448 this.unselect();
rlm@46 449 onColorChange();
rlm@46 450 this.actualStyle();
rlm@46 451 //this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref,'');
rlm@46 452
rlm@46 453 this.selected = this.renderer.create(this.mode, this.fillColor, this.lineColor, this.fillOpac, this.lineOpac, this.lineWidth, this.mouseDownX, this.mouseDownY, 1, 1,this.textMessaje,this.textSize,this.textFamily,this.imageHref,'M0,0 1,1', '', '');
rlm@46 454
rlm@46 455 this.selected.id = 'shape:' + createUUID();
rlm@46 456 //-- this.selected.id = this.mode+':' + createUUID();
rlm@46 457 Ext.get(this.selected).on( "mousedown", this.onHit,this);
rlm@46 458 Ext.get(this.container).on( "mousemove", this.onDraw,this);
rlm@46 459 //Ext.get(this.container).on( "mouseover", this.overShape,this);
rlm@46 460 //Ext.get(this.container).on( "mouseout", this.outShape,this);
rlm@46 461 }
rlm@46 462 }
rlm@46 463 else //----- MODE SELECT
rlm@46 464 {
rlm@46 465
rlm@46 466 var offset = Ext.get(this.container).getXY();
rlm@46 467 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 468 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 469
rlm@46 470 //snappedX*=proporDiagonal;
rlm@46 471 //snappedY*=proporDiagonal;
rlm@46 472 //snappedX+=marginx;
rlm@46 473 //snappedY+=marginy;
rlm@46 474
rlm@46 475 // if ((this.mouseDownX != snappedX && this.mouseDownY != snappedY) || typeTransform=='')
rlm@46 476 if (this.mouseDownX != snappedX || this.mouseDownY != snappedY)
rlm@46 477 {
rlm@46 478 if(this.selected!=null && typeTransform=='Translate' )
rlm@46 479 {
rlm@46 480
rlm@46 481 Ext.get(this.container).un("mousemove", this.onDrag);
rlm@46 482 this.unselect();
rlm@46 483 }
rlm@46 484 //typeTransform='';
rlm@46 485 }
rlm@46 486
rlm@46 487 // if (typeTransform=='' && (this.mouseDownX != snappedX || this.mouseDownY != snappedY) )
rlm@46 488 // {
rlm@46 489 //if(typeTransform=='Rotate' || typeTransform=='Translate'){ }else{
rlm@46 490
rlm@46 491 //this.unselect();
rlm@46 492 // }
rlm@46 493 // }
rlm@46 494 //else
rlm@46 495 //{
rlm@46 496 // if(this.nowDraw==true){ alert('Double click, please'); this.onEndLineListener(event); return true;}
rlm@46 497 //Ext.get(this.container).on( "mouseout", this.onRotate,this);
rlm@46 498
rlm@46 499
rlm@46 500 // if (this.mouseDownX != snappedX || this.mouseDownY != snappedY)
rlm@46 501 //{
rlm@46 502 if(typeTransform=='Translate')
rlm@46 503 {
rlm@46 504 inout='move';//true;
rlm@46 505 //Event.observe(this.selected, "mousedown", this.onHit,this);
rlm@46 506 //Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 507 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 508
rlm@46 509 }
rlm@46 510 if(typeTransform=='Scale' || typeTransform=='Rotate')
rlm@46 511 {
rlm@46 512 inout='rotate_escale';//false
rlm@46 513 Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 514 Ext.get(this.selected).on( "mousedown", this.onHit,this);
rlm@46 515 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 516
rlm@46 517 //Ext.get(this.container).on( "mouseover", this.onTranslate,this);
rlm@46 518 //Ext.get(this.container).on( "mouseout", this.onRotate,this);
rlm@46 519 //this.unselect();
rlm@46 520 }
rlm@46 521 //} //end typeTransform==''
rlm@46 522 } //end mode select
rlm@46 523 return false;
rlm@46 524 };
rlm@46 525
rlm@46 526
rlm@46 527 RichDrawEditor.prototype.onMouseUp = function(event)
rlm@46 528 {
rlm@46 529 //Ext.get(this.selected).un("mousemove",this.onDrag)
rlm@46 530
rlm@46 531 //MODE NO SELECT
rlm@46 532 if (this.mode != 'select')
rlm@46 533 {
rlm@46 534 //this.renderer.restruct(this.selected);
rlm@46 535 if(this.mode == 'controlpath')
rlm@46 536 {
rlm@46 537 //Event.observe(this.selected, "mousemove", this.onClic,this);
rlm@46 538 //this.renderer.info(this.selected);
rlm@46 539 }
rlm@46 540 else
rlm@46 541 {
rlm@46 542 //ZOOM
rlm@46 543 if (this.mode == 'zoom')
rlm@46 544 {
rlm@46 545 var offset = Ext.get(this.container).getXY()
rlm@46 546 var snappedX = Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
rlm@46 547 var snappedY = Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
rlm@46 548
rlm@46 549 //snappedX*=proporDiagonal;
rlm@46 550 //snappedY*=proporDiagonal;
rlm@46 551 //snappedX+=marginx;
rlm@46 552 //snappedY+=marginy;
rlm@46 553 this.renderer.zoom(snappedX, snappedY);
rlm@46 554 this.renderer.remove(this.container.ownerDocument.getElementById('squareSelectID'));
rlm@46 555 Ext.get(this.container).un("mousemove", this.onDraw);
rlm@46 556 this.squareSelect = null;
rlm@46 557 this.selected = null;
rlm@46 558 }else{
rlm@46 559 Ext.get(this.container).un("mousemove", this.onDraw);
rlm@46 560 this.selected = null;
rlm@46 561 }
rlm@46 562 }
rlm@46 563 }
rlm@46 564 else //MODE SELECT
rlm@46 565 {
rlm@46 566 Ext.get(this.container).un("mousemove", this.onDraw); //or drag
rlm@46 567 //Ext.get(this.container).un("mousemove", this.onDrag);
rlm@46 568 Ext.get(this.container).un("mousemove", this.onDrag);
rlm@46 569
rlm@46 570 moveNow=false;
rlm@46 571 contmove=0;
rlm@46 572 // if(inout=='move' || inout=='rotate_scale' ){
rlm@46 573 if(typeTransform=="Rotate" || typeTransform=="Scale" )
rlm@46 574 {
rlm@46 575 //this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 576 this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 577
rlm@46 578 //inout='move';//true;
rlm@46 579 //this.renderer.restruct(this.selected);
rlm@46 580 typeTransform=='';
rlm@46 581 }
rlm@46 582 if(typeTransform=="Translate" )
rlm@46 583 {
rlm@46 584
rlm@46 585 this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 586 //Ext.get(this.container).un("mousemove", this.renderer.move);
rlm@46 587 //Ext.get(this.container).un("mousemove", this.onDrag);
rlm@46 588 typeTransform=='';
rlm@46 589 //this.renderer.restruct(this.selected);
rlm@46 590 //this.unselect();
rlm@46 591 contmove=0;
rlm@46 592
rlm@46 593 }
rlm@46 594 if(inout=='multiSelect')
rlm@46 595 {
rlm@46 596
rlm@46 597 //inout='move';//true;
rlm@46 598 }
rlm@46 599
rlm@46 600 typeTransform=='';
rlm@46 601 }
rlm@46 602 //Event.stopObserving(this.container, "mousemove", this.onDraw,this);
rlm@46 603 };
rlm@46 604
rlm@46 605
rlm@46 606 RichDrawEditor.prototype.onDrag = function(event) {
rlm@46 607
rlm@46 608 moveNow=true;
rlm@46 609 var offset = Ext.get(this.container).getXY();
rlm@46 610 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 611 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 612 //snappedX*=proporDiagonal;
rlm@46 613 //snappedY*=proporDiagonal;
rlm@46 614 //snappedX+=marginx;
rlm@46 615 //snappedY+=marginy;
rlm@46 616
rlm@46 617 var deltaX = snappedX - this.mouseDownX;
rlm@46 618 var deltaY = snappedY - this.mouseDownY;
rlm@46 619
rlm@46 620 var modeUsed=0;
rlm@46 621 if(this.mode == 'zoom')
rlm@46 622 {
rlm@46 623 Ext.get(this.container).getXY();
rlm@46 624 this.renderer.resize(this.squareSelect, this.clicX,this.clicY, zoomx+(this.selectedBounds.x + deltaX), zoomy+(this.selectedBounds.y +deltaY));
rlm@46 625 //this.renderer.zoom(this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY);
rlm@46 626 //this.renderer.zoom(this.mouseDownX, this.mouseDownY);
rlm@46 627
rlm@46 628 modeUsed=1;
rlm@46 629 }
rlm@46 630 if(this.mode == 'controlpath')
rlm@46 631 {
rlm@46 632 modeUsed=1;
rlm@46 633 }
rlm@46 634 if(modeUsed==0)
rlm@46 635 {
rlm@46 636 if(inout=='multiSelect'){
rlm@46 637 this.renderer.showMultiSelect(this.mouseDownX, this.mouseDownY);
rlm@46 638 }
rlm@46 639
rlm@46 640
rlm@46 641 if(typeTransform=="Translate")
rlm@46 642 {
rlm@46 643 Ext.get(this.container).getXY();
rlm@46 644
rlm@46 645
rlm@46 646 //var coord=this.inputxy;
rlm@46 647 //var moveX=parseFloat(coord[0]);
rlm@46 648 //var moveY=parseFloat(coord[1]);
rlm@46 649 this.log(this.mouseDownX+' '+event.getXY()[0]+' '+ this.selectedBounds.x +'contmove'+contmove);
rlm@46 650 this.renderer.move(this.selected, zoomx+(this.selectedBounds.x + deltaX), zoomy+(this.selectedBounds.y +deltaY),this.clicX,this.clicY);
rlm@46 651 //this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 652
rlm@46 653 }
rlm@46 654
rlm@46 655
rlm@46 656 if(typeTransform=="Rotate")
rlm@46 657 {
rlm@46 658 this.renderer.rotateShape(this.selected, this.previusBox,deltaX, deltaY);
rlm@46 659 //this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 660 }
rlm@46 661
rlm@46 662 //if(typeTransform=="Scale") {this.renderer.scale(this.selected, this.previusBox, deltaX, deltaY); }
rlm@46 663 if(typeTransform=="Scale")
rlm@46 664 {
rlm@46 665 this.renderer.scaleShape(this.selected, this.previusBox, this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY);
rlm@46 666 //this.renderer.showTracker(this.selected,this.pathsEdit);
rlm@46 667 }
rlm@46 668 //if(typeTransform=="Scale") {this.renderer.scale(this.selected, this.previusBox, this.selectedBounds.width + deltaX, this.selectedBounds.height + deltaY); }
rlm@46 669
rlm@46 670 //RichDrawEditor.prototype.onTransform(event);
rlm@46 671
rlm@46 672
rlm@46 673 //}
rlm@46 674
rlm@46 675 }
rlm@46 676 // Update selection tracker
rlm@46 677 //this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 678
rlm@46 679 //this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 680
rlm@46 681 // hide_tracker();
rlm@46 682 };
rlm@46 683
rlm@46 684
rlm@46 685 RichDrawEditor.prototype.onResize = function(event) {
rlm@46 686 var offset = Ext.get(this.container).getXY();
rlm@46 687 var snappedX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 688 var snappedY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 689 //snappedX*=proporDiagonal;
rlm@46 690 //snappedY*=proporDiagonal;
rlm@46 691 //snappedX+=marginx;
rlm@46 692 //snappedY+=marginy;
rlm@46 693 var deltaX = snappedX - this.mouseDownX;
rlm@46 694 var deltaY = snappedY - this.mouseDownY;
rlm@46 695
rlm@46 696 this.renderer.track(handle, deltaX, deltaY);
rlm@46 697
rlm@46 698 // Update selection tracker
rlm@46 699 show_tracker();
rlm@46 700 // hide_tracker();
rlm@46 701 };
rlm@46 702
rlm@46 703
rlm@46 704 RichDrawEditor.prototype.onDraw = function(event) {
rlm@46 705 if (this.selected == null)
rlm@46 706 {
rlm@46 707 if(this.squareSelect != null)
rlm@46 708 {
rlm@46 709 var offset = Ext.get(this.container).getXY()
rlm@46 710 var snappedX = Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
rlm@46 711 var snappedY = Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
rlm@46 712
rlm@46 713 //snappedX*=proporDiagonal;
rlm@46 714 //snappedY*=proporDiagonal;
rlm@46 715 //snappedX+=marginx;
rlm@46 716 //snappedY+=marginy;
rlm@46 717
rlm@46 718 this.renderer.resize(this.squareSelect, this.mouseDownX, this.mouseDownY, snappedX, snappedY);
rlm@46 719
rlm@46 720 }else{
rlm@46 721 return;
rlm@46 722 }
rlm@46 723 }else{
rlm@46 724 var offset = Ext.get(this.container).getXY()
rlm@46 725 var snappedX = Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
rlm@46 726 var snappedY = Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
rlm@46 727
rlm@46 728 //snappedX*=proporDiagonal;
rlm@46 729 //snappedY*=proporDiagonal;
rlm@46 730 //snappedX+=marginx;
rlm@46 731 //snappedY+=marginy;
rlm@46 732
rlm@46 733 this.renderer.resize(this.selected, this.mouseDownX, this.mouseDownY, snappedX, snappedY);
rlm@46 734 }
rlm@46 735 };
rlm@46 736
rlm@46 737 RichDrawEditor.prototype.onRotate = function(event) {
rlm@46 738 if (this.selected == null)
rlm@46 739 {
rlm@46 740
rlm@46 741 }else{
rlm@46 742 // this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 743 //document.getElementById('richdraw').style.cursor='e-resize';
rlm@46 744
rlm@46 745 //alert('chao');
rlm@46 746 //inout=false;
rlm@46 747
rlm@46 748 //return;
rlm@46 749 }
rlm@46 750 };
rlm@46 751
rlm@46 752 RichDrawEditor.prototype.onScale = function(event) {
rlm@46 753 if (this.selected == null)
rlm@46 754 {
rlm@46 755
rlm@46 756 }else{
rlm@46 757 //document.getElementById('richdraw').style.cursor='e-resize';
rlm@46 758 //alert('chao');
rlm@46 759 //inout=false;
rlm@46 760
rlm@46 761 //return;
rlm@46 762 }
rlm@46 763 };
rlm@46 764
rlm@46 765 RichDrawEditor.prototype.onTransform = function(event) {
rlm@46 766 if (this.selected == null)
rlm@46 767 {
rlm@46 768
rlm@46 769 }else{
rlm@46 770 //if(typeTransform=="rotate") {this.renderer.rotate(this.selected, this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY);}
rlm@46 771 //if(typeTransform=="scale") {this.renderer.scale(this.selected, this.selectedBounds.x + deltaX, this.selectedBounds.y + deltaY); }
rlm@46 772
rlm@46 773 }
rlm@46 774 };
rlm@46 775
rlm@46 776 RichDrawEditor.prototype.onTranslate = function(event) {
rlm@46 777 if (this.selected == null)
rlm@46 778 {
rlm@46 779
rlm@46 780 }else{
rlm@46 781 // document.getElementById('richdraw').style.cursor='move';
rlm@46 782 //alert('hello');
rlm@46 783 //inout=true;
rlm@46 784
rlm@46 785 //return;
rlm@46 786 }
rlm@46 787 var offset = Ext.get(this.container).getXY()
rlm@46 788 // var offset = Ext.get(this.container).getXY();
rlm@46 789 var x = zoomx+Math.round(event.getXY()[0] - offset[0]);
rlm@46 790 var y = zoomy+Math.round(event.getXY()[1] - offset[1]);
rlm@46 791
rlm@46 792 //var x= parseFloat(event.getXY()[0]);
rlm@46 793 //var y= parseFloat(event.getXY()[1]);
rlm@46 794
rlm@46 795
rlm@46 796 this.inputxy = [x,y]
rlm@46 797 this.onInputXY(x,y);
rlm@46 798
rlm@46 799 //Ext.get(this.container).getXY(); ;//
rlm@46 800 };
rlm@46 801
rlm@46 802
rlm@46 803 RichDrawEditor.prototype.onHit = function(event) {
rlm@46 804 //console.log("AAH HIT!!!!")
rlm@46 805 if(this.mode == 'select')
rlm@46 806 {
rlm@46 807
rlm@46 808 //event.cancelBubble =false;
rlm@46 809 // We've handled this event. Don't let anybody else see it.
rlm@46 810 if (event.stopPropagation) event.stopPropagation(); // DOM Level 2
rlm@46 811 else event.cancelBubble = true; // IE
rlm@46 812 // Now prevent any default action.
rlm@46 813 if (event.preventDefault) event.preventDefault(); // DOM Level 2
rlm@46 814 else event.returnValue = false; // IE
rlm@46 815
rlm@46 816 if(inout=='multiSelect')
rlm@46 817 {
rlm@46 818 //Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 819 //Ext.get(this.container).on( "mouseup", this.onMouseUp,this);
rlm@46 820
rlm@46 821 }
rlm@46 822 else
rlm@46 823 {
rlm@46 824
rlm@46 825 Ext.get(this.container).un("mousemove", this.onDrag);
rlm@46 826 //this.unselect();
rlm@46 827 typeTransform="Translate";
rlm@46 828
rlm@46 829 /* //this.previusBox=this.selected;
rlm@46 830 this.select(Event.element(event));
rlm@46 831 this.selectedBounds = this.renderer.bounds(this.selected);
rlm@46 832 //document.forms[0].code.value=shape(c,this.selected);
rlm@46 833 var offset = Ext.get(this.container).getXY();
rlm@46 834 this.mouseDownX = Math.round((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX;
rlm@46 835 this.mouseDownY = Math.round((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY;
rlm@46 836 this.renderer.info(this.selected);
rlm@46 837 Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 838 //Ext.get(this.container).on( "mouseover", noselect);
rlm@46 839 Ext.get(this.container).on( "mouseout", this.onMouseUp,this);
rlm@46 840 //Ext.get(this.container).on( "mouseup", this.onMouseUp,this);
rlm@46 841 //typeTransform=="Translate";
rlm@46 842 //if(typeTransform=="Rotate") {this.renderer.rotate(this.selected, this.previusBox,2, 2);}
rlm@46 843 */
rlm@46 844 //var width = parseFloat(widths.options[widths.selectedIndex].value);
rlm@46 845
rlm@46 846 contmove=0;
rlm@46 847 //this.setGrid(this.lineWidth, width);
rlm@46 848 var width=this.gridWidth;
rlm@46 849
rlm@46 850 this.setGrid(width, width);
rlm@46 851
rlm@46 852 this.select(event.getTarget());
rlm@46 853 this.previusBox=this.selected;
rlm@46 854
rlm@46 855 //++
rlm@46 856 this.renderer.getProperties(this.selected);
rlm@46 857 var offset = Ext.get(this.container).getXY();
rlm@46 858
rlm@46 859 this.selectedBounds = this.renderer.bounds(this.selected);
rlm@46 860 //document.forms[0].code.value=shape(c,this.selected);
rlm@46 861 //var snappedX = Math.round((event.getXY()[0] - offset[0]));
rlm@46 862 //var snappedY = Math.round((event.getXY()[1] - offset[1]));
rlm@46 863
rlm@46 864 //offset[0]-=marginx;
rlm@46 865 //offset[1]-=marginy;
rlm@46 866 var x =offset[0];//parseInt(this.selected.offsetLeft);//this.selectedBounds.x-event.getXY()[0];//this.inputxy[0]+ offset[0];//Math.round(event.getXY()[0] - offset[0]);
rlm@46 867 var y =offset[1];//$(this.selected.id).offsetTop;;//parseInt(this.selected.offsetTop);//this.selectedBounds.y-event.getXY()[1];//this.inputxy[1]+ offset[1];//+Math.round(event.getXY()[1] - offset[1]);
rlm@46 868 //alert(x+' '+y)
rlm@46 869 this.mouseDownX =x;// offset[0];//zoomx+snappedX;
rlm@46 870 this.mouseDownY =y;// offset[1];//zoomy+snappedY;
rlm@46 871 //objectOffset(this.selected)
rlm@46 872 // this.mouseDownX = Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
rlm@46 873 //this.mouseDownY = Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
rlm@46 874 this.log(this.gridX);
rlm@46 875 this.renderer.info(this.selected);
rlm@46 876 if(this.container.ownerDocument.getElementById('tracker'))
rlm@46 877 {
rlm@46 878 this.renderer.remove(this.container.ownerDocument.getElementById('tracker'));
rlm@46 879 }
rlm@46 880 Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 881
rlm@46 882
rlm@46 883 }
rlm@46 884 }
rlm@46 885 else
rlm@46 886 {
rlm@46 887 //this.selectedBounds = this.renderer.bounds(this.selected);
rlm@46 888 var offset = Ext.get(this.container).getXY();
rlm@46 889
rlm@46 890 this.mouseDownX = Math.round(zoomx+((event.getXY()[0] - offset[0]) / this.gridX) * this.gridX);
rlm@46 891 this.mouseDownY = Math.round(zoomy+((event.getXY()[1] - offset[1]) / this.gridY) * this.gridY);
rlm@46 892 Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 893
rlm@46 894 }
rlm@46 895 };
rlm@46 896
rlm@46 897
rlm@46 898 RichDrawEditor.prototype.onClic = function(event) {
rlm@46 899 if(this.mode == 'controlpath')
rlm@46 900 {
rlm@46 901
rlm@46 902 //Ext.get(this.container).on( "mouseout", this.onMouseUp,this);
rlm@46 903
rlm@46 904 //Ext.get(this.container).on( "mousemove", this.onDrag,this);
rlm@46 905
rlm@46 906 //Ext.get(this.container).on( "mouseout", this.onDrag,this);
rlm@46 907 }
rlm@46 908 else
rlm@46 909 {
rlm@46 910
rlm@46 911 }
rlm@46 912 };
rlm@46 913
rlm@46 914 RichDrawEditor.prototype.reflect = function(HorV) {
rlm@46 915 this.selected=this.renderer.reflect(HorV);
rlm@46 916 this.selected.id = 'shape:' + createUUID();
rlm@46 917 Ext.get(this.selected).on( "mousedown", this.onHit,this);
rlm@46 918 }
rlm@46 919
rlm@46 920 RichDrawEditor.prototype.onEndLine = function(event) {
rlm@46 921
rlm@46 922 if(this.mode == 'controlpath')
rlm@46 923 { // alert('hello');
rlm@46 924 numClics=0;
rlm@46 925 //this.selected = null;
rlm@46 926
rlm@46 927 //Event.stopObserving(this.container, "mousemove", this.onDraw,this);
rlm@46 928
rlm@46 929
rlm@46 930
rlm@46 931 //Event.observe(this.selected, "mousedown", this.onHit,this);
rlm@46 932 //Ext.get(this.container).on( "mousemove", this.onDraw,this);
rlm@46 933
rlm@46 934 //Event.stopObserving(this.selected, "dblclick", this.onEndLine,this);
rlm@46 935 //Event.stopObserving(this.container, "mousemove", this.onDraw,this);
rlm@46 936
rlm@46 937 this.selected = null;
rlm@46 938
rlm@46 939
rlm@46 940 //this.unselect();
rlm@46 941
rlm@46 942 }
rlm@46 943 else
rlm@46 944 {
rlm@46 945 this.nowDraw=false;
rlm@46 946 }
rlm@46 947 };
rlm@46 948 function noselect(){
rlm@46 949 //typeTransform="";
rlm@46 950 }
rlm@46 951
rlm@46 952 function createUUID()
rlm@46 953 {
rlm@46 954 return [4, 2, 2, 2, 6].map(function(length) {
rlm@46 955 var uuidpart = "";
rlm@46 956 for (var i=0; i<length; i++) {
rlm@46 957 var uuidchar = parseInt((Math.random() * 256)).toString(16);
rlm@46 958 if (uuidchar.length == 1)
rlm@46 959 uuidchar = "0" + uuidchar;
rlm@46 960 uuidpart += uuidchar;
rlm@46 961 }
rlm@46 962 return uuidpart;
rlm@46 963 }).join('-');
rlm@46 964 }
rlm@46 965
rlm@46 966
rlm@46 967 //----------------------------------------------------------------------------
rlm@46 968 // AbstractRenderer
rlm@46 969 //
rlm@46 970 // Abstract base class defining the drawing API. Can not be used directly.
rlm@46 971 //----------------------------------------------------------------------------
rlm@46 972
rlm@46 973 function AbstractRenderer() {
rlm@46 974
rlm@46 975 };
rlm@46 976
rlm@46 977 AbstractRenderer.prototype.init = function(elem) {};
rlm@46 978 AbstractRenderer.prototype.bounds = function(shape) { return { x:0, y:0, width:0, height: 0 }; };
rlm@46 979 AbstractRenderer.prototype.create = function(shape, fillColor, lineColor, lineWidth, left, top, width, height, textMessaje, textSize, textFamily, imageHref, transform) {};
rlm@46 980 AbstractRenderer.prototype.datacreate = function(fillColor, lineColor, lineWidth, fillOpac, strokeOpac, left, top, width, height,data) {};
rlm@46 981 AbstractRenderer.prototype.index = function(shape, order) {};
rlm@46 982 AbstractRenderer.prototype.remove = function(shape) {};
rlm@46 983 AbstractRenderer.prototype.copy = function(shape) {};
rlm@46 984 AbstractRenderer.prototype.paste = function(left,top) {};
rlm@46 985 AbstractRenderer.prototype.duplicate = function(shape) {};
rlm@46 986 AbstractRenderer.prototype.move = function(shape, left, top) {};
rlm@46 987 AbstractRenderer.prototype.endmove = function(shape) {};
rlm@46 988 AbstractRenderer.prototype.transform= function(shape, left, top) {};
rlm@46 989 AbstractRenderer.prototype.scale = function(shape, left, top) {};
rlm@46 990 AbstractRenderer.prototype.rotate = function(shape, left, top) {};
rlm@46 991 AbstractRenderer.prototype.track = function(shape) {};
rlm@46 992 AbstractRenderer.prototype.restruct = function(shape) {};
rlm@46 993 AbstractRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) {};
rlm@46 994 AbstractRenderer.prototype.editCommand = function(shape, cmd, value) {};
rlm@46 995 AbstractRenderer.prototype.queryCommand = function(shape, cmd) {};
rlm@46 996 AbstractRenderer.prototype.showTracker = function(shape,value) {};
rlm@46 997 AbstractRenderer.prototype.getMarkup = function() { return null; };
rlm@46 998 AbstractRenderer.prototype.info = function(shape){};
rlm@46 999 AbstractRenderer.prototype.editShape = function(shape,data){};
rlm@46 1000 AbstractRenderer.prototype.onKeyPress = function(){};
rlm@46 1001
rlm@46 1002 AbstractRenderer.prototype.getshapes = function(){};
rlm@46 1003
rlm@46 1004
rlm@46 1005 //-----------------------------
rlm@46 1006 // Geometry - string functions
rlm@46 1007 //-----------------------------
rlm@46 1008
rlm@46 1009 //two point angle deg
rlm@46 1010 function ang2v(x1,y1,x2,y2)
rlm@46 1011 {
rlm@46 1012 /*
rlm@46 1013 var k=0;
rlm@46 1014
rlm@46 1015 var sum1=u1+v1;
rlm@46 1016 var sum2=u2+v2;
rlm@46 1017
rlm@46 1018 var res1=u1-v1;
rlm@46 1019 var res2=u2-v2;
rlm@46 1020
rlm@46 1021 var ku1=k*u1;
rlm@46 1022 var ku2=k*u2;
rlm@46 1023
rlm@46 1024 var mu= Math.sqrt(u1*u1+u2*u2);
rlm@46 1025 var mv= Math.sqrt(v1*v1+v2*v2);
rlm@46 1026
rlm@46 1027 var pesc= u1*v1+u2*v2;
rlm@46 1028 //var ang=Math.acos(pesc/(mu*mv))*180/Math.PI;
rlm@46 1029 var ang=Math.acos(pesc/(mu*mv));
rlm@46 1030 */
rlm@46 1031 var resx=x2-x1;
rlm@46 1032 var resy=y2-y1;
rlm@46 1033 var ang=Math.atan2(resy,resx);
rlm@46 1034 //alert(ang);
rlm@46 1035 return ang;
rlm@46 1036 }
rlm@46 1037
rlm@46 1038 function dist2p(a,b,c,d)
rlm@46 1039 {
rlm@46 1040 with (Math)
rlm@46 1041 {
rlm@46 1042 //var d2p=sqrt(abs(((d-b)*(d-b) )+((c-a)*(c-a)))); //decimas(d2p,3); return d2p;
rlm@46 1043 return sqrt(abs((d-b)*(d-b)+ (c-a)*(c-a)));
rlm@46 1044
rlm@46 1045 }
rlm@46 1046 }
rlm@46 1047 function pmd2pb(a,b,c,d,q) {
rlm@46 1048 pmdx= (1-q)*a+c*q;
rlm@46 1049 pmdy= (1-q)*b+d*q;
rlm@46 1050 //pmdx=decimas(pmdx,3);
rlm@46 1051 //pmdy=decimas(pmdy,3);
rlm@46 1052 var cad=pmdx+','+pmdy;
rlm@46 1053 var sol= new Array();
rlm@46 1054 sol= [cad,pmdx,pmdy];
rlm@46 1055 return sol
rlm@46 1056
rlm@46 1057 }
rlm@46 1058
rlm@46 1059 function getAngle(dx,dy) {
rlm@46 1060 var angle = Math.atan2(dy, dx);
rlm@46 1061 //angle *= 180 / Math.PI;
rlm@46 1062 return angle;
rlm@46 1063
rlm@46 1064 }
rlm@46 1065
rlm@46 1066 /*
rlm@46 1067
rlm@46 1068 A = y2-y1
rlm@46 1069 B = x1-x2
rlm@46 1070 C = A*x1+B*y1
rlm@46 1071 Regardless of how the lines are specified, you should be able to generate two different points along the line, and then generate A, B and C. Now, lets say that you have lines, given by the equations:
rlm@46 1072 A1x + B1y = C1
rlm@46 1073 A2x + B2y = C2
rlm@46 1074 To find the point at which the two lines intersect, we simply need to solve the two equations for the two unknowns, x and y.
rlm@46 1075
rlm@46 1076 double det = A1*B2 - A2*B1
rlm@46 1077 if(det == 0){
rlm@46 1078 //Lines are parallel
rlm@46 1079 }else{
rlm@46 1080 double x = (B2*C1 - B1*C2)/det
rlm@46 1081 double y = (A1*C2 - A2*C1)/det
rlm@46 1082 }
rlm@46 1083
rlm@46 1084
rlm@46 1085
rlm@46 1086
rlm@46 1087 */
rlm@46 1088 // interseccion 2 rectas
rlm@46 1089 function ntrsccn2rb(a,b,c,d,e,f,g,h){
rlm@46 1090 var solution= new Array();
rlm@46 1091 var i2rx=0;var i2ry=0;
rlm@46 1092 var w= (c-a)*(f-h)-(e-g)*(d-b);
rlm@46 1093 if(w==0){
rlm@46 1094 n=1;
rlm@46 1095 i2rx= (1-n)*a+n*c;
rlm@46 1096 i2ry= (1-n)*b+n*d;
rlm@46 1097 solution= ['',i2rx,i2ry];
rlm@46 1098 //Lines are parallel
rlm@46 1099 return solution
rlm@46 1100 //return (i2rx+' '+i2ry);
rlm@46 1101 }
rlm@46 1102 var n = (((e-a)*(f-h))-((e-g)*(f-b)))/w;
rlm@46 1103 i2rx=(1-n)*a+n*c;
rlm@46 1104 i2ry=(1-n)*b+n*d;
rlm@46 1105 //return (i2rx+' '+i2ry);
rlm@46 1106 solution= ['',i2rx,i2ry];
rlm@46 1107 return solution
rlm@46 1108
rlm@46 1109 }
rlm@46 1110
rlm@46 1111 //ecuacion implicita de la recta
rlm@46 1112 function ccnmplct(a,b,c,d) {
rlm@46 1113 var solution= new Array();
rlm@46 1114 //a1 a2, b1 b2 vector direccion b1-a1 , b2-a2
rlm@46 1115 var v1m=c-a;
rlm@46 1116 var v1n=d-b;
rlm@46 1117 var c1x= v1m;
rlm@46 1118 var c1y= v1n;
rlm@46 1119 // ecuacion continua (x - a) /c -a = (y - b)/d - b
rlm@46 1120 //(x - a) * v1n = (y - b) * v1m
rlm@46 1121 //x * v1n - v1n*a = y * v1m - b* v1m
rlm@46 1122 eia= v1n ;
rlm@46 1123 eib= - v1m;
rlm@46 1124 eic= (b* v1m) - ( v1n*a)
rlm@46 1125 solution= [eia,eib,eic];
rlm@46 1126 return solution
rlm@46 1127 }
rlm@46 1128 function GetString(source, start, end){
rlm@46 1129 var st = source.indexOf(start) + start.length;
rlm@46 1130 var en = source.indexOf(end, start);
rlm@46 1131 return source.substring(st, en);//trimAll(source.substring(st, en));
rlm@46 1132 }
rlm@46 1133
rlm@46 1134 function deg2rad(angle){
rlm@46 1135 return (angle/180) * Math.PI;
rlm@46 1136 }
rlm@46 1137
rlm@46 1138 String.prototype.trim = function(){ return this.replace(/^\s+|\s+$/g,'') }
rlm@46 1139
rlm@46 1140 function objectOffset(obj)
rlm@46 1141 {
rlm@46 1142 var posX=0;
rlm@46 1143 var posY=0;
rlm@46 1144 if(typeof(obj.offsetParent) != "undefined")
rlm@46 1145 {
rlm@46 1146 for(var x=0, y=0;obj; obj=obj.offsetParent)
rlm@46 1147 {
rlm@46 1148 x += obj.offsetLeft;
rlm@46 1149 y += obj.offsetTop;
rlm@46 1150 }
rlm@46 1151 posX=x;
rlm@46 1152 posY=y;
rlm@46 1153 }
rlm@46 1154 else
rlm@46 1155 {
rlm@46 1156 posX=obj.offsetLeft;
rlm@46 1157 posY=obj.offsetTop;
rlm@46 1158 }
rlm@46 1159 alert(obj.id+" "+"X: "+posX+" Y: "+posY);
rlm@46 1160 }
rlm@46 1161
rlm@46 1162 function generateJSON(cssEnv)
rlm@46 1163 {
rlm@46 1164 //string=string.replace(/;/g,'",') ;
rlm@46 1165 //string=string.replace(/:/g,':"') ;
rlm@46 1166 //style="fill:#7e0000;fill-opacity:1"
rlm@46 1167
rlm@46 1168 var css=cssEnv.split(';')
rlm@46 1169
rlm@46 1170 var strJSON = '{';
rlm@46 1171 ch = ',';
rlm@46 1172 for (i = 0 ; i < css.length; i++)
rlm@46 1173 {
rlm@46 1174 var data=css[i].split(':');
rlm@46 1175 if(data[0]!=''){
rlm@46 1176 //if(i == (css.length-2)){ ch = ''; }
rlm@46 1177 strJSON += "'"+data[0].trim()+"':'"+data[1].trim()+"'"+",";
rlm@46 1178 }
rlm@46 1179
rlm@46 1180
rlm@46 1181 }
rlm@46 1182 var num= strJSON.length;
rlm@46 1183 strJSON=strJSON.substr(0, num-1);
rlm@46 1184
rlm@46 1185 strJSON += '}';
rlm@46 1186
rlm@46 1187 return strJSON;
rlm@46 1188 }