Angle.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. /*
  2. Copyright (c) 2004-2012, 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. if(!dojo._hasResource["dojox.drawing.annotations.Angle"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
  7. dojo._hasResource["dojox.drawing.annotations.Angle"] = true;
  8. dojo.provide("dojox.drawing.annotations.Angle");
  9. dojox.drawing.annotations.Angle = dojox.drawing.util.oo.declare(
  10. // summary:
  11. // When initiated, an HTML box will hover near the Stencil,
  12. // displaying it's angle while drawn or modified. Currently
  13. // only works with Vector, Line, Arrow, and Axes.
  14. // description:
  15. // Annotation is positioned with dojox.drawing.util.positioning.angle
  16. // That method should be overwritten for custom placement.
  17. // Called internally. To initiaize:
  18. // TODO: currently always on
  19. //
  20. function(/*Object*/options){
  21. // arguments:
  22. // options: Object
  23. // One key value: the stencil that called this.
  24. //
  25. this.stencil = options.stencil;
  26. this.util = options.stencil.util;
  27. this.mouse = options.stencil.mouse;
  28. this.stencil.connectMult([
  29. ["onDrag", this, "showAngle"],
  30. ["onUp", this, "hideAngle"],
  31. ["onTransformBegin", this, "showAngle"],
  32. ["onTransform", this, "showAngle"],
  33. ["onTransformEnd", this, "hideAngle"]
  34. ]);
  35. },
  36. {
  37. type:"dojox.drawing.tools.custom",
  38. angle:0,
  39. showAngle: function(){
  40. // summary:
  41. // Called to display angle
  42. //
  43. if(!this.stencil.selected && this.stencil.created){ return; }
  44. if(this.stencil.getRadius() < this.stencil.minimumSize){
  45. this.hideAngle();
  46. return;
  47. }
  48. var node = this.getAngleNode();
  49. var d = this.stencil.pointsToData();
  50. var pt = dojox.drawing.util.positioning.angle({x:d.x1,y:d.y1},{x:d.x2,y:d.y2});
  51. var sc = this.mouse.scrollOffset();
  52. var mx = this.stencil.getTransform();
  53. var dx = mx.dx / this.mouse.zoom;
  54. var dy = mx.dy / this.mouse.zoom;
  55. pt.x /= this.mouse.zoom;
  56. pt.y /= this.mouse.zoom;
  57. // adding _offX & _offY since this is HTML
  58. // and we are from the page corner, not
  59. // the canvas corner
  60. var x = this.stencil._offX + pt.x - sc.left + dx;
  61. var y = this.stencil._offY + pt.y - sc.top + dy;
  62. dojo.style(node, {
  63. left: x + "px",
  64. top: y + "px",
  65. align:pt.align
  66. });
  67. var angle=this.stencil.getAngle();
  68. if(this.stencil.style.zAxis && this.stencil.shortType=="vector"){
  69. node.innerHTML = this.stencil.data.cosphi > 0 ? "out of" : "into";
  70. }else if(this.stencil.shortType=="line"){
  71. node.innerHTML = this.stencil.style.zAxis?"out of":Math.ceil(angle%180);
  72. }else{
  73. node.innerHTML = Math.ceil(angle);
  74. }
  75. },
  76. getAngleNode: function(){
  77. // summary:
  78. // Gets or creates HTMLNode used for display
  79. if(!this._angleNode){
  80. this._angleNode = dojo.create("span", null, dojo.body());
  81. dojo.addClass(this._angleNode, "textAnnotation");
  82. dojo.style(this._angleNode, "opacity", 1);
  83. }
  84. return this._angleNode; //HTMLNode
  85. },
  86. hideAngle: function(){
  87. // summary:
  88. // Turns display off.
  89. //
  90. if(this._angleNode && dojo.style(this._angleNode, "opacity")>0.9){
  91. dojo.fadeOut({node:this._angleNode,
  92. duration:500,
  93. onEnd: function(node){
  94. dojo.destroy(node);
  95. }
  96. }).play();
  97. this._angleNode = null;
  98. }
  99. }
  100. }
  101. )
  102. }