Text.js 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231
  1. // wrapped by build app
  2. define("dojox/drawing/stencil/Text", ["dijit","dojo","dojox"], function(dijit,dojo,dojox){
  3. dojo.provide("dojox.drawing.stencil.Text");
  4. dojox.drawing.stencil.Text = dojox.drawing.util.oo.declare(
  5. // summary:
  6. // Creates a dojox.gfx Text (SVG or VML) based on data provided.
  7. // description:
  8. // There are two text classes. TextBlock extends this one and
  9. // adds editable functionality, discovers text width etc.
  10. // This class displays text only. There is no line wrapping.
  11. // Multiple lines can be acheived by inserting \n linebreaks
  12. // in the text.
  13. //
  14. dojox.drawing.stencil._Base,
  15. function(options){
  16. // summary:
  17. // constructor.
  18. },
  19. {
  20. type:"dojox.drawing.stencil.Text",
  21. anchorType:"none",
  22. baseRender:true,
  23. // align: String
  24. // Text horizontal alignment.
  25. // Options: start, middle, end
  26. align:"start",
  27. //
  28. // valign:String
  29. // Text vertical alignment
  30. // Options: top, middle, bottom (FIXME: bottom not supported)
  31. valign:"top",
  32. //
  33. // _lineHeight: [readonly] Number
  34. // The height of each line of text. Based on style information
  35. // and font size.
  36. _lineHeight:1,
  37. /*=====
  38. StencilData: {
  39. // summary:
  40. // The data used to create the dojox.gfx Text
  41. // x: Number
  42. // Left point x
  43. // y: Number
  44. // Top point y
  45. // width: ? Number
  46. // Optional width of Text. Not required but reccommended.
  47. // for auto-sizing, use TextBlock
  48. // height: ? Number
  49. // Optional height of Text. If not provided, _lineHeight is used.
  50. // text: String
  51. // The string content. If not provided, may auto-delete depending on defaults.
  52. },
  53. StencilPoints: [
  54. // summary:
  55. // An Array of dojox.__StencilPoint objects that describe the Stencil
  56. // 0: Object
  57. // Top left point
  58. // 1: Object
  59. // Top right point
  60. // 2: Object
  61. // Bottom right point
  62. // 3: Object
  63. // Bottom left point
  64. ],
  65. =====*/
  66. typesetter: function(text){
  67. // summary:
  68. // Register raw text, returning typeset form.
  69. // Uses function dojox.drawing.stencil.Text.typeset
  70. // for typesetting, if it exists.
  71. //
  72. if(dojox.drawing.util.typeset){
  73. this._rawText = text;
  74. return dojox.drawing.util.typeset.convertLaTeX(text);
  75. }
  76. return text;
  77. },
  78. setText: function(text){
  79. // summary:
  80. // Setter for text.
  81. //
  82. // Only apply typesetting to objects that the user can modify.
  83. // Else, it is assumed that typesetting is done elsewhere.
  84. if(this.enabled){
  85. text = this.typesetter(text);
  86. }
  87. // This only has an effect if text is null or this.created is false.
  88. this._text = text;
  89. this._textArray = [];
  90. this.created && this.render(text);
  91. },
  92. getText: function(){
  93. // summary:
  94. // Getter for text.
  95. //
  96. return this._rawText || this._text;
  97. },
  98. dataToPoints: function(/*Object*/o){
  99. //summary:
  100. // Converts data to points.
  101. o = o || this.data;
  102. var w = o.width =="auto" ? 1 : o.width;
  103. var h = o.height || this._lineHeight;
  104. this.points = [
  105. {x:o.x, y:o.y}, // TL
  106. {x:o.x + w, y:o.y}, // TR
  107. {x:o.x + w, y:o.y + h}, // BR
  108. {x:o.x, y:o.y + h} // BL
  109. ];
  110. return this.points;
  111. },
  112. pointsToData: function(/*Array*/p){
  113. // summary:
  114. // Converts points to data
  115. p = p || this.points;
  116. var s = p[0];
  117. var e = p[2];
  118. this.data = {
  119. x: s.x,
  120. y: s.y,
  121. width: e.x-s.x,
  122. height: e.y-s.y
  123. };
  124. return this.data;
  125. },
  126. render: function(/* String*/text){
  127. // summary:
  128. // Renders the 'hit' object (the shape used for an expanded
  129. // hit area and for highlighting) and the'shape' (the actual
  130. // display object). Text is slightly different than other
  131. // implementations. Instead of calling render twice, it calls
  132. // _createHilite for the 'hit'
  133. // arguments:
  134. // text String
  135. // Changes text if sent. Be sure to use the setText and
  136. // not to call this directly.
  137. //
  138. this.remove(this.shape, this.hit);
  139. //console.log("text render, outline:", !this.annotation, this.renderHit, (!this.annotation && this.renderHit))
  140. !this.annotation && this.renderHit && this._renderOutline();
  141. if(text!=undefined){
  142. this._text = text;
  143. this._textArray = this._text.split("\n");
  144. }
  145. var d = this.pointsToData();
  146. var h = this._lineHeight;
  147. var x = d.x + this.style.text.pad*2;
  148. var y = d.y + this._lineHeight - (this.textSize*.4);
  149. if(this.valign=="middle"){
  150. y -= h/2;
  151. }
  152. this.shape = this.container.createGroup();
  153. /*console.log(" render ", this.type, this.id)
  154. console.log(" render Y:", d.y, "textSize:", this.textSize, "LH:", this._lineHeight)
  155. console.log(" render text:", y, " ... ", this._text, "enabled:", this.enabled);
  156. console.log(" render text:", this.style.currentText);
  157. */
  158. dojo.forEach(this._textArray, function(txt, i){
  159. var tb = this.shape.createText({x: x, y: y+(h*i), text: unescape(txt), align: this.align})
  160. .setFont(this.style.currentText)
  161. .setFill(this.style.currentText.color);
  162. this._setNodeAtts(tb);
  163. }, this);
  164. this._setNodeAtts(this.shape);
  165. },
  166. _renderOutline: function(){
  167. // summary:
  168. // Create the hit and highlight area
  169. // for the Text.
  170. //
  171. if(this.annotation){ return; }
  172. var d = this.pointsToData();
  173. if(this.align=="middle"){
  174. d.x -= d.width/2 - this.style.text.pad * 2;
  175. }else if(this.align=="start"){
  176. d.x += this.style.text.pad;
  177. }else if(this.align=="end"){
  178. d.x -= d.width - this.style.text.pad * 3;
  179. }
  180. if(this.valign=="middle"){
  181. d.y -= (this._lineHeight )/2 - this.style.text.pad;
  182. }
  183. this.hit = this.container.createRect(d)
  184. .setStroke(this.style.currentHit)
  185. .setFill(this.style.currentHit.fill);
  186. //.setFill("#ffff00");
  187. this._setNodeAtts(this.hit);
  188. this.hit.moveToBack();
  189. },
  190. makeFit: function(text, w){
  191. var span = dojo.create('span', {innerHTML:text, id:"foo"}, document.body);
  192. var sz = 1;
  193. dojo.style(span, "fontSize", sz+"px");
  194. var cnt = 30;
  195. while(dojo.marginBox(span).w<w){
  196. sz++;
  197. dojo.style(span, "fontSize", sz+"px");
  198. if(cnt--<=0) break;
  199. }
  200. sz--;
  201. var box = dojo.marginBox(span);
  202. dojo.destroy(span);
  203. return {size:sz, box:box};
  204. }
  205. }
  206. );
  207. dojox.drawing.register({
  208. name:"dojox.drawing.stencil.Text"
  209. }, "stencil");
  210. });