root / trunk / web / dojo / dojox / sketch / Figure.js
History | View | Annotate | Download (10 KB)
1 |
/*
|
---|---|
2 |
Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved.
|
3 |
Available via Academic Free License >= 2.1 OR the modified BSD license.
|
4 |
see: http://dojotoolkit.org/license for details
|
5 |
*/
|
6 |
|
7 |
|
8 |
if(!dojo._hasResource["dojox.sketch.Figure"]){ |
9 |
dojo._hasResource["dojox.sketch.Figure"]=true; |
10 |
dojo.provide("dojox.sketch.Figure");
|
11 |
dojo.experimental("dojox.sketch");
|
12 |
dojo.require("dojox.gfx");
|
13 |
dojo.require("dojox.sketch.UndoStack");
|
14 |
(function(){
|
15 |
var ta=dojox.sketch;
|
16 |
ta.tools={}; |
17 |
ta.registerTool=function(_1,fn){ |
18 |
ta.tools[_1]=fn; |
19 |
}; |
20 |
ta.Figure=function(_2){ |
21 |
var _3=this; |
22 |
this.annCounter=1; |
23 |
this.shapes=[];
|
24 |
this.image=null; |
25 |
this.imageSrc=null; |
26 |
this.size={w:0,h:0}; |
27 |
this.surface=null; |
28 |
this.group=null; |
29 |
this.node=null; |
30 |
this.zoomFactor=1; |
31 |
this.tools=null; |
32 |
this.obj={};
|
33 |
dojo.mixin(this,_2);
|
34 |
this.selected=[];
|
35 |
this.hasSelections=function(){ |
36 |
return this.selected.length>0; |
37 |
}; |
38 |
this.isSelected=function(_4){ |
39 |
for(var i=0;i<_3.selected.length;i++){ |
40 |
if(_3.selected[i]==_4){
|
41 |
return true; |
42 |
} |
43 |
} |
44 |
return false; |
45 |
}; |
46 |
this.select=function(_5){ |
47 |
if(!_3.isSelected(_5)){
|
48 |
_3.clearSelections(); |
49 |
_3.selected=[_5]; |
50 |
} |
51 |
_5.setMode(ta.Annotation.Modes.View); |
52 |
_5.setMode(ta.Annotation.Modes.Edit); |
53 |
}; |
54 |
this.deselect=function(_6){ |
55 |
var _7=-1; |
56 |
for(var i=0;i<_3.selected.length;i++){ |
57 |
if(_3.selected[i]==_6){
|
58 |
_7=i; |
59 |
break;
|
60 |
} |
61 |
} |
62 |
if(_7>-1){ |
63 |
_6.setMode(ta.Annotation.Modes.View); |
64 |
_3.selected.splice(_7,1);
|
65 |
} |
66 |
return _6;
|
67 |
}; |
68 |
this.clearSelections=function(){ |
69 |
for(var i=0;i<_3.selected.length;i++){ |
70 |
_3.selected[i].setMode(ta.Annotation.Modes.View); |
71 |
} |
72 |
_3.selected=[]; |
73 |
}; |
74 |
this.replaceSelection=function(n,o){ |
75 |
if(!_3.isSelected(o)){
|
76 |
_3.select(n); |
77 |
return;
|
78 |
} |
79 |
var _8=-1; |
80 |
for(var i=0;i<_3.selected.length;i++){ |
81 |
if(_3.selected[i]==o){
|
82 |
_8=i; |
83 |
break;
|
84 |
} |
85 |
} |
86 |
if(_8>-1){ |
87 |
_3.selected.splice(_8,1,n);
|
88 |
} |
89 |
}; |
90 |
this._c=null; |
91 |
this._ctr=null; |
92 |
this._lp=null; |
93 |
this._action=null; |
94 |
this._prevState=null; |
95 |
this._startPoint=null; |
96 |
this._ctool=null; |
97 |
this._start=null; |
98 |
this._end=null; |
99 |
this._absEnd=null; |
100 |
this._cshape=null; |
101 |
this._dblclick=function(e){ |
102 |
var o=_3._fromEvt(e);
|
103 |
if(o){
|
104 |
_3.onDblClickShape(o,e); |
105 |
} |
106 |
}; |
107 |
this._keydown=function(e){ |
108 |
var _9=false; |
109 |
if(e.ctrlKey){
|
110 |
if(e.keyCode===90||e.keyCode===122){ |
111 |
_3.undo(); |
112 |
_9=true;
|
113 |
}else{
|
114 |
if(e.keyCode===89||e.keyCode===121){ |
115 |
_3.redo(); |
116 |
_9=true;
|
117 |
} |
118 |
} |
119 |
} |
120 |
if(e.keyCode===46||e.keyCode===8){ |
121 |
_3._delete(_3.selected); |
122 |
_9=true;
|
123 |
} |
124 |
if(_9){
|
125 |
dojo.stopEvent(e); |
126 |
} |
127 |
}; |
128 |
this._md=function(e){ |
129 |
if(dojox.gfx.renderer=="vml"){ |
130 |
_3.node.focus(); |
131 |
} |
132 |
var o=_3._fromEvt(e);
|
133 |
_3._startPoint={x:e.pageX,y:e.pageY}; |
134 |
_3._ctr=dojo.position(_3.node); |
135 |
var _a={x:_3.node.scrollLeft,y:_3.node.scrollTop}; |
136 |
_3._ctr={x:_3._ctr.x-_a.x,y:_3._ctr.y-_a.y}; |
137 |
var X=e.clientX-_3._ctr.x,Y=e.clientY-_3._ctr.y;
|
138 |
_3._lp={x:X,y:Y}; |
139 |
_3._start={x:X,y:Y}; |
140 |
_3._end={x:X,y:Y}; |
141 |
_3._absEnd={x:X,y:Y}; |
142 |
if(!o){
|
143 |
_3.clearSelections(); |
144 |
_3._ctool.onMouseDown(e); |
145 |
}else{
|
146 |
if(o.type&&o.type()!="Anchor"){ |
147 |
if(!_3.isSelected(o)){
|
148 |
_3.select(o); |
149 |
_3._sameShapeSelected=false;
|
150 |
}else{
|
151 |
_3._sameShapeSelected=true;
|
152 |
} |
153 |
} |
154 |
o.beginEdit(); |
155 |
_3._c=o; |
156 |
} |
157 |
}; |
158 |
this._mm=function(e){ |
159 |
if(!_3._ctr){
|
160 |
return;
|
161 |
} |
162 |
var x=e.clientX-_3._ctr.x;
|
163 |
var y=e.clientY-_3._ctr.y;
|
164 |
var dx=x-_3._lp.x;
|
165 |
var dy=y-_3._lp.y;
|
166 |
_3._absEnd={x:x,y:y}; |
167 |
if(_3._c){
|
168 |
_3._c.setBinding({dx:dx/_3.zoomFactor,dy:dy/_3.zoomFactor}); |
169 |
_3._lp={x:x,y:y}; |
170 |
}else{
|
171 |
_3._end={x:dx,y:dy}; |
172 |
var _b={x:Math.min(_3._start.x,_3._absEnd.x),y:Math.min(_3._start.y,_3._absEnd.y),width:Math.abs(_3._start.x-_3._absEnd.x),height:Math.abs(_3._start.y-_3._absEnd.y)}; |
173 |
if(_b.width&&_b.height){
|
174 |
_3._ctool.onMouseMove(e,_b); |
175 |
} |
176 |
} |
177 |
}; |
178 |
this._mu=function(e){ |
179 |
if(_3._c){
|
180 |
_3._c.endEdit(); |
181 |
}else{
|
182 |
_3._ctool.onMouseUp(e); |
183 |
} |
184 |
_3._c=_3._ctr=_3._lp=_3._action=_3._prevState=_3._startPoint=null;
|
185 |
_3._cshape=_3._start=_3._end=_3._absEnd=null;
|
186 |
}; |
187 |
this.initUndoStack();
|
188 |
}; |
189 |
var p=ta.Figure.prototype;
|
190 |
p.initUndoStack=function(){ |
191 |
this.history=new ta.UndoStack(this); |
192 |
}; |
193 |
p.setTool=function(t){ |
194 |
this._ctool=t;
|
195 |
}; |
196 |
p.gridSize=0;
|
197 |
p._calCol=function(v){ |
198 |
return this.gridSize?(Math.round(v/this.gridSize)*this.gridSize):v; |
199 |
}; |
200 |
p._delete=function(_c,_d){ |
201 |
for(var i=0;i<_c.length;i++){ |
202 |
_c[i].setMode(ta.Annotation.Modes.View); |
203 |
_c[i].destroy(_d); |
204 |
this.remove(_c[i]);
|
205 |
this._remove(_c[i]);
|
206 |
if(!_d){
|
207 |
_c[i].onRemove(); |
208 |
} |
209 |
} |
210 |
_c.splice(0,_c.length);
|
211 |
}; |
212 |
p.onDblClickShape=function(_e,e){ |
213 |
if(_e["onDblClick"]){ |
214 |
_e.onDblClick(e); |
215 |
} |
216 |
}; |
217 |
p.onCreateShape=function(_f){ |
218 |
}; |
219 |
p.onBeforeCreateShape=function(_10){ |
220 |
}; |
221 |
p.initialize=function(_11){ |
222 |
this.node=_11;
|
223 |
this.surface=dojox.gfx.createSurface(_11,this.size.w,this.size.h); |
224 |
this.group=this.surface.createGroup(); |
225 |
this._cons=[];
|
226 |
var es=this.surface.getEventSource(); |
227 |
this._cons.push(dojo.connect(es,"ondraggesture",dojo.stopEvent),dojo.connect(es,"ondragenter",dojo.stopEvent),dojo.connect(es,"ondragover",dojo.stopEvent),dojo.connect(es,"ondragexit",dojo.stopEvent),dojo.connect(es,"ondragstart",dojo.stopEvent),dojo.connect(es,"onselectstart",dojo.stopEvent),dojo.connect(es,"onmousedown",this._md),dojo.connect(es,"onmousemove",this._mm),dojo.connect(es,"onmouseup",this._mu),dojo.connect(es,"onclick",this,"onClick"),dojo.connect(es,"ondblclick",this._dblclick),dojo.connect(_11,"onkeydown",this._keydown)); |
228 |
this.image=this.group.createImage({width:this.imageSize.w,height:this.imageSize.h,src:this.imageSrc}); |
229 |
}; |
230 |
p.destroy=function(_12){ |
231 |
if(!this.node){ |
232 |
return;
|
233 |
} |
234 |
if(!_12){
|
235 |
if(this.history){ |
236 |
this.history.destroy();
|
237 |
} |
238 |
if(this._subscribed){ |
239 |
dojo.unsubscribe(this._subscribed);
|
240 |
delete this._subscribed; |
241 |
} |
242 |
} |
243 |
dojo.forEach(this._cons,dojo.disconnect);
|
244 |
this._cons=[];
|
245 |
dojo.empty(this.node);
|
246 |
this.group=this.surface=null; |
247 |
this.obj={};
|
248 |
this.shapes=[];
|
249 |
}; |
250 |
p.nextKey=function(){ |
251 |
return "annotation-"+this.annCounter++; |
252 |
}; |
253 |
p.draw=function(){ |
254 |
}; |
255 |
p.zoom=function(pct){ |
256 |
this.zoomFactor=pct/100; |
257 |
var w=this.size.w*this.zoomFactor; |
258 |
var h=this.size.h*this.zoomFactor; |
259 |
this.surface.setDimensions(w,h);
|
260 |
this.group.setTransform(dojox.gfx.matrix.scale(this.zoomFactor,this.zoomFactor)); |
261 |
for(var i=0;i<this.shapes.length;i++){ |
262 |
this.shapes[i].zoom(this.zoomFactor); |
263 |
} |
264 |
}; |
265 |
p.getFit=function(){ |
266 |
var wF=(this.node.parentNode.offsetWidth-5)/this.size.w; |
267 |
var hF=(this.node.parentNode.offsetHeight-5)/this.size.h; |
268 |
return Math.min(wF,hF)*100; |
269 |
}; |
270 |
p.unzoom=function(){ |
271 |
this.zoomFactor=1; |
272 |
this.surface.setDimensions(this.size.w,this.size.h); |
273 |
this.group.setTransform();
|
274 |
}; |
275 |
p._add=function(obj){ |
276 |
this.obj[obj._key]=obj;
|
277 |
}; |
278 |
p._remove=function(obj){ |
279 |
if(this.obj[obj._key]){ |
280 |
delete this.obj[obj._key]; |
281 |
} |
282 |
}; |
283 |
p._get=function(key){ |
284 |
if(key&&key.indexOf("bounding")>-1){ |
285 |
key=key.replace("-boundingBox",""); |
286 |
}else{
|
287 |
if(key&&key.indexOf("-labelShape")>-1){ |
288 |
key=key.replace("-labelShape",""); |
289 |
} |
290 |
} |
291 |
return this.obj[key]; |
292 |
}; |
293 |
p._keyFromEvt=function(e){ |
294 |
var key=e.target.id+""; |
295 |
if(key.length==0){ |
296 |
var p=e.target.parentNode;
|
297 |
var _13=this.surface.getEventSource(); |
298 |
while(p&&p.id.length==0&&p!=_13){ |
299 |
p=p.parentNode; |
300 |
} |
301 |
key=p.id; |
302 |
} |
303 |
return key;
|
304 |
}; |
305 |
p._fromEvt=function(e){ |
306 |
return this._get(this._keyFromEvt(e)); |
307 |
}; |
308 |
p.add=function(_14){ |
309 |
for(var i=0;i<this.shapes.length;i++){ |
310 |
if(this.shapes[i]==_14){ |
311 |
return true; |
312 |
} |
313 |
} |
314 |
this.shapes.push(_14);
|
315 |
return true; |
316 |
}; |
317 |
p.remove=function(_15){ |
318 |
var idx=-1; |
319 |
for(var i=0;i<this.shapes.length;i++){ |
320 |
if(this.shapes[i]==_15){ |
321 |
idx=i; |
322 |
break;
|
323 |
} |
324 |
} |
325 |
if(idx>-1){ |
326 |
this.shapes.splice(idx,1); |
327 |
} |
328 |
return _15;
|
329 |
}; |
330 |
p.getAnnotator=function(id){ |
331 |
for(var i=0;i<this.shapes.length;i++){ |
332 |
if(this.shapes[i].id==id){ |
333 |
return this.shapes[i]; |
334 |
} |
335 |
} |
336 |
return null; |
337 |
}; |
338 |
p.convert=function(ann,t){ |
339 |
var _16=t+"Annotation"; |
340 |
if(!ta[_16]){
|
341 |
return;
|
342 |
} |
343 |
var _17=ann.type(),id=ann.id,_18=ann.label,_19=ann.mode,_1a=ann.tokenId;
|
344 |
var _1b,end,_1c,_1d;
|
345 |
switch(_17){
|
346 |
case "Preexisting": |
347 |
case "Lead": |
348 |
_1d={dx:ann.transform.dx,dy:ann.transform.dy}; |
349 |
_1b={x:ann.start.x,y:ann.start.y}; |
350 |
end={x:ann.end.x,y:ann.end.y}; |
351 |
var cx=end.x-((end.x-_1b.x)/2); |
352 |
var cy=end.y-((end.y-_1b.y)/2); |
353 |
_1c={x:cx,y:cy}; |
354 |
break;
|
355 |
case "SingleArrow": |
356 |
case "DoubleArrow": |
357 |
_1d={dx:ann.transform.dx,dy:ann.transform.dy}; |
358 |
_1b={x:ann.start.x,y:ann.start.y}; |
359 |
end={x:ann.end.x,y:ann.end.y}; |
360 |
_1c={x:ann.control.x,y:ann.control.y}; |
361 |
break;
|
362 |
case "Underline": |
363 |
_1d={dx:ann.transform.dx,dy:ann.transform.dy}; |
364 |
_1b={x:ann.start.x,y:ann.start.y}; |
365 |
_1c={x:_1b.x+50,y:_1b.y+50}; |
366 |
end={x:_1b.x+100,y:_1b.y+100}; |
367 |
break;
|
368 |
case "Brace": |
369 |
} |
370 |
var n=new ta[_16](this,id); |
371 |
if(n.type()=="Underline"){ |
372 |
n.transform={dx:_1d.dx+_1b.x,dy:_1d.dy+_1b.y}; |
373 |
}else{
|
374 |
if(n.transform){
|
375 |
n.transform=_1d; |
376 |
} |
377 |
if(n.start){
|
378 |
n.start=_1b; |
379 |
} |
380 |
} |
381 |
if(n.end){
|
382 |
n.end=end; |
383 |
} |
384 |
if(n.control){
|
385 |
n.control=_1c; |
386 |
} |
387 |
n.label=_18; |
388 |
n.token=dojo.lang.shallowCopy(ann.token); |
389 |
n.initialize(); |
390 |
this.replaceSelection(n,ann);
|
391 |
this._remove(ann);
|
392 |
this.remove(ann);
|
393 |
ann.destroy(); |
394 |
n.setMode(_19); |
395 |
}; |
396 |
p.setValue=function(_1e){ |
397 |
var obj=dojox.xml.DomParser.parse(_1e);
|
398 |
var _1f=this.node; |
399 |
this.load(obj,_1f);
|
400 |
}; |
401 |
p.load=function(obj,n){ |
402 |
if(this.surface){ |
403 |
this.destroy(true); |
404 |
} |
405 |
var _20=obj.documentElement;
|
406 |
this.size={w:parseFloat(_20.getAttribute("width"),10),h:parseFloat(_20.getAttribute("height"),10)}; |
407 |
var g=_20.childrenByName("g")[0]; |
408 |
var img=g.childrenByName("image")[0]; |
409 |
this.imageSize={w:parseFloat(img.getAttribute("width"),10),h:parseFloat(img.getAttribute("height"),10)}; |
410 |
this.imageSrc=img.getAttribute("xlink:href"); |
411 |
this.initialize(n);
|
412 |
var ann=g.childrenByName("g"); |
413 |
for(var i=0;i<ann.length;i++){ |
414 |
this._loadAnnotation(ann[i]);
|
415 |
} |
416 |
if(this._loadDeferred){ |
417 |
this._loadDeferred.callback(this); |
418 |
this._loadDeferred=null; |
419 |
} |
420 |
this.onLoad();
|
421 |
}; |
422 |
p.onLoad=function(){ |
423 |
}; |
424 |
p.onClick=function(){ |
425 |
}; |
426 |
p._loadAnnotation=function(obj){ |
427 |
var _21=obj.getAttribute("dojoxsketch:type")+"Annotation"; |
428 |
if(ta[_21]){
|
429 |
var a=new ta[_21](this,obj.id); |
430 |
a.initialize(obj); |
431 |
this.nextKey();
|
432 |
a.setMode(ta.Annotation.Modes.View); |
433 |
this._add(a);
|
434 |
return a;
|
435 |
} |
436 |
return null; |
437 |
}; |
438 |
p.onUndo=function(){ |
439 |
}; |
440 |
p.onBeforeUndo=function(){ |
441 |
}; |
442 |
p.onRedo=function(){ |
443 |
}; |
444 |
p.onBeforeRedo=function(){ |
445 |
}; |
446 |
p.undo=function(){ |
447 |
if(this.history){ |
448 |
this.onBeforeUndo();
|
449 |
this.history.undo();
|
450 |
this.onUndo();
|
451 |
} |
452 |
}; |
453 |
p.redo=function(){ |
454 |
if(this.history){ |
455 |
this.onBeforeRedo();
|
456 |
this.history.redo();
|
457 |
this.onRedo();
|
458 |
} |
459 |
}; |
460 |
p.serialize=function(){ |
461 |
var s="<svg xmlns=\"http://www.w3.org/2000/svg\" "+"xmlns:xlink=\"http://www.w3.org/1999/xlink\" "+"xmlns:dojoxsketch=\"http://dojotoolkit.org/dojox/sketch\" "+"width=\""+this.size.w+"\" height=\""+this.size.h+"\">"+"<g>"+"<image xlink:href=\""+this.imageSrc+"\" x=\"0\" y=\"0\" width=\""+this.size.w+"\" height=\""+this.size.h+"\" />"; |
462 |
for(var i=0;i<this.shapes.length;i++){ |
463 |
s+=this.shapes[i].serialize();
|
464 |
} |
465 |
s+="</g></svg>";
|
466 |
return s;
|
467 |
}; |
468 |
p.getValue=p.serialize; |
469 |
})(); |
470 |
} |