all files / src/datums/ link.cjsx

0% Statements 0/19
0% Branches 0/6
0% Functions 0/5
0% Lines 0/15
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68                                                                                                                                       
 
React = require('react')
_ = require('underscore')
 
Datum = require('./datum')
 
 
###
  see ./link.md
###
module.exports = class Link extends Datum
  @displayName: "react-datum.Link"
 
 
  @propTypes: _.extend {}, Datum.propTypes,
    # attribute on model to display as the <a> content. if null ReactDatum.Link will 
    # render the children enclosed in an <a></a>
    nameAttr: React.PropTypes.string
    # passed to <a> as the target
    target: React.PropTypes.string
    
    # The link's content between the A tags can be ellisized.  Set ellipsizeAt to false 
    # to display whole value. Only effects 'readonly' display, values displayed 
    # in 'edit' mode are never truncated.
    ellipsizeAt: React.PropTypes.oneOfType([
      React.PropTypes.number
      React.PropTypes.bool
    ])
 
    # If we want the ellipsis to be like ...Long Name we need to make this true
    reverseEllipsis: React.PropTypes.bool
    
    
    
  @defaultProps: _.extend {}, Datum.defaultProps,
    # ellipsizeAt is defaulted to prevent really long strings from breaking layouts
    ellipsizeAt: 35
    target: '_blank'
    
 
  subClassName: 'link'
 
  # TODO add validations.
 
  # override
  renderValueForDisplay: () ->
    <a href={@_getHref()} target={@props.target}>
      {@_getTagContent()}
    </a>
 
 
  # Datum default renderForInput should should work
 
  _getHref: ->
    @getModelValue()
    
 
  _getTagContent: ->
    if @props.nameAttr?
      contentValue = @getModel().get(@props.nameAttr)
      if _.isArray(contentValue)
        contentValue = contentValue.map((v) -> v.toString()).join(', ')
      return @renderEllipsizedValue(contentValue)
    else if @props.children?
      return <span>{@props.children}</span>
    else
      return @renderEllipsizedValue(@getModelValue())