JSDoc: Source: runner/text_span.js

], function(DisplayObject, color, gradient, tools) {
  'use strict';
  var accessor = tools.descriptorAccessor,
      data = tools.descriptorData,
      getter = tools.getter,
      parseColor = color.parse;
  // Getters and setters stolen from shape.js
  function getTextFillColor() {
    return this._textFillColor; // return color instance
  function setTextFillColor(fill) {
    this._textFillColor = parseColor(fill, this._textFillColor);
  function getTextFillGradient() {
    return this._textFillGradient;
  function setTextFillGradient(grad) {
    if (grad) {
      this._textFillGradient = gradient(grad);
  function getFontFamily() {
    return this._fontFamily;
  function setFontFamily(fontFamily) {
    this._fontFamily = fontFamily ? fontFamily.fontId || fontFamily : null;
  function getGlyphx() {
    return this._glyphx;
  function setGlyphx(glyphx) {
    if (tools.isArray(glyphx)) {
      this._glyphx = glyphx;
    if (!glyphx) {
      this._glyphx = null;
  function getGlyphy() {
    return this._glyphy;
  function setGlyphy(glyphy) {
    if (tools.isArray(glyphy)) {
      this._glyphy = glyphy;
    if (!glyphy) {
      this._glyphy = null;
  var getTextStrokeColor = getter('_textStrokeColor');
  function setTextStrokeColor(color) {
    this._textStrokeColor = parseColor(color, this._textStrokeColor);
   * The TextSpan constructor
   * @constructor
   * @name TextSpan
   * @extends DisplayObject
   * @param {String} text The text content
   * @property {__list__} __supportedAttributes__ List of supported attribute names.
   *    In addition to the property names listed for DisplayObject,
   *    these are the attribute names you can pass to the attr() method. Note
   *    that this property is not available in your code, it's just here for
   *    documentation purposes.
   * @property {string} __supportedAttributes__.text The text content.
   * @property {number} __supportedAttributes__.fontSize The font size. Default: 16
   * @property {string} __supportedAttributes__.fontFamily The font family Default: 'monospace'
   * @property {string} __supportedAttributes__.fontStyle The font style. Can be one of 'normal' or 'italic'. Default: 'normal'
   * @property {string} __supportedAttributes__.fontWeight The font weight. Can be one of 'normal' or 'bold'. Default: 'normal'
   * @property {string} __supportedAttributes__.glyphx An array of x offsets mapped to each individual glyph position
   * @property {string} __supportedAttributes__.glyphy An array of y offsets mapped to each individual glyph position
   * @property {string} __supportedAttributes__.cap The shape to be used at the end of open Path items, when they have a stroke. Can be one of 'round', 'square', 'butt'. Default: 'butt'
   * @property {string} __supportedAttributes__.textFillColor The fill color. Default: black.
   * @property {string} __supportedAttributes__.join The shape to be used at the corners of paths. Can be one of 'miter', 'round', 'bevel'. Default: 'miter'
   * @property {string} __supportedAttributes__.textStrokeColor The line color. Default: transparent
   * @property {number} __supportedAttributes__.textStrokeWidth The line width. Default: 0
   * @property {number} __supportedAttributes__.miterLimit The miter limit of the stroke. Default: 4
   * @property {number} __supportedAttributes__.selectable Boolean indicates whether the text is selectable or not
  function TextSpan(text) {
    text = String(text);
    Object.defineProperties(this._attributes, {
      // many are null: default to null to inherit from Text parent
      text: data('', true, true),
      fontSize: data(null, true, true),
      fontFamily: accessor(getFontFamily, setFontFamily, true),
      _fontFamily: data(null, true),
      fontStyle: data(null, true, true),
      fontWeight: data(null, true, true),
      _textFillColor: data(null, true),
      textFillColor: accessor(getTextFillColor, setTextFillColor, true),
      _textFillGradient: data(null, true),
      textFillGradient: accessor(getTextFillGradient, setTextFillGradient, true),
      textFillOpacity: data(1, true, true),
      _glyphx: data(null, true),
      _glyphy: data(null, true),
      glyphx: accessor(getGlyphx, setGlyphx, true),
      glyphy: accessor(getGlyphy, setGlyphy, true),
      textLineOpacity: data(1, true, true),
      _textStrokeColor: data(null, true), // black by default
      textStrokeColor: accessor(getTextStrokeColor, setTextStrokeColor, true),
      textStrokeWidth: data(null, true, true),
      selectable: data(true, true, true)
    this._renderAttributes = {
      // Set new render-attributes
      // Only font-related/presentational
      fontSize: 'fontSize',
      fontFamily: '_fontFamily',
      fontStyle: 'fontStyle',
      fontWeight: 'fontWeight',
      fillColor: '_textFillColor',
      fillGradient: '_textFillGradient',
      fillOpacity: 'textFillOpacity',
      filters: '_filters',
      glyphx: '_glyphx',
      glyphy: '_glyphy',
      strokeOpacity: 'textLineOpacity',
      strokeColor: '_textStrokeColor',
      strokeWidth: 'textStrokeWidth',
      opacity: '_opacity',
      text: 'text',
      selectable: 'selectable'
    if (text != null) {
      this.attr('text', text);
  var proto = TextSpan.prototype = Object.create(DisplayObject.prototype);
  proto.type = 'TextSpan';
  proto.setText = function(text) {
    return this.attr('text', text);
  proto.getText = function(text) {
    return this.attr('text');
  return TextSpan;