Sha256: 7ffb5968e8a42b0c1b1a1f9bbc05f63973a6b64c523a0b2b6facfde9a7c83624

Contents?: true

Size: 1.95 KB

Versions: 2

Compression:

Stored size: 1.95 KB

Contents

# @cjsx React.DOM 
React = require('react')
Edit = require('./edit')
ModalTrigger = require('react-bootstrap/lib/ModalTrigger')

module.exports = React.createClass
  displayName: 'Card'

  componentDidMount: ->
    @props.card.on 'change', @forceUpdate.bind(@, null)
    @props.card.on 'change', (model)->
      console.log 'change', model

  getInitialState: ()->
    showTools: false
    editing: false
    updating: false
    title: @props.card.get('title')
    content: @props.card.get('content')

  onMouseOver: ()->
    @setState showTools: true

  onMouseLeave: ()->
    @setState showTools: false

  render: ->
    console.log 'Card: render'
    style = {height:'220px'}
    if @props.card.get('focused')
      #style.color = 'red'
      style.borderColor = '#ccc'
    <div className='col-sm-4' style={padding:'5px'} onMouseOver={@onMouseOver} onMouseLeave={@onMouseLeave}>
      <div className='list-group' style={margin:'0px',padding:'0px'}>
        <div className='list-group-item' style={style}>
          <p>
            {
              if @props.card.get('focused')
                <i className='glyphicon glyphicon-star' style={marginRight:'5px'} />
            }
            <strong>
              {@props.card.get('title')}
            </strong>
            <span className='pull-right' style={{visibility: if @state.showTools then 'visible' else 'hidden'}}>
              <ModalTrigger modal={<Edit card={@props.card} />}>
                <a href="javascript:void(0)">
                  <i className='glyphicon glyphicon-edit' />
                </a>
              </ModalTrigger>
              &nbsp;
              &nbsp;
              <a href={'#/' + @props.card.get('title')}>
                <i className='glyphicon glyphicon-link' />
              </a>
            </span>
          </p>
          <p style={overflow:'scroll',width:'100%',height:'80%',wordWrap:'break-word'}>
            {@props.card.get('content')}
          </p>
        </div>
      </div>
    </div>

Version data entries

2 entries across 2 versions & 1 rubygems

Version Path
carte-server-0.0.3 lib/carte/client/views/card.cjsx
carte-server-0.0.1 lib/carte/client/views/card.cjsx