apeman-react-toast/lib/ap_toast_group.jsx

/**
 * Toast group.
 * @class ApToastGroup
 */

'use strict'

import React, {PropTypes as types} from 'react'
import ApToast from './ap_toast'
import {ApPureMixin} from 'apeman-react-mixin-pure'
import ApInfoToast from './ap_info_toast'
import ApWarnToast from './ap_warn_toast'
import ApErrorToast from './ap_error_toast'
import Toaster from './toasting/toaster'
import classnames from 'classnames'

/** @lends ApToastGroup */
const ApToastGroup = React.createClass({

  // --------------------
  // Specs
  // --------------------

  propTypes: {
    duration: types.number,
    toaster: types.instanceOf(Toaster)
  },

  mixins: [
    ApPureMixin
  ],

  statics: {
    Toaster: Toaster
  },

  getInitialState () {
    let state = { _date: null }
    Toaster.levels.forEach(level => {
      state[ level ] = null;
    })
    return state;
  },

  getDefaultProps () {
    return {
      toaster: null
    }
  },

  render () {
    const s = this
    let { state, props } = s
    let { duration } = props

    return (
      <div className={ classnames('ap-toast-group', {
            }, props.className) }>
        <ApToast message={ state.default } duration={ duration } name="default" onDismiss={ s.handleDismiss }/>
        <ApInfoToast message={ state.info } duration={ duration } name="info" onDismiss={ s.handleDismiss }/>
        <ApWarnToast message={ state.warn } duration={ duration } name="warn" onDismiss={ s.handleDismiss }/>
        <ApErrorToast message={ state.error } duration={ duration } name="error" onDismiss={ s.handleDismiss }/>
        { props.children }
      </div>
    )
  },

  // --------------------
  // Lifecycle
  // --------------------

  componentDidMount () {
    const s = this
    let { props } = s
    if (props.toaster) {
      s.bindToaster(props.toaster)
    }
  },

  componentWillReceiveProps (nextProps) {
    const s = this
    let { props } = s
    if (nextProps.toaster) {
      s.unbindToaster(props.toaster)
      s.bindToaster(nextProps.toaster)
    }
  },

  componentWillUnmount () {
    const s = this
    let { props } = s
    if (props.toaster) {
      s.unbindToaster(props.toaster)
    }
  },

  // --------------------
  // Custom
  // --------------------

  handleDismiss(e) {
    const s = this
    let { state } = s
    let { name, dismissed } = e
    if (state[ name ] === dismissed) {
      s.setState({ name: null })
    }
  },

  /**
   * Bind toaster events.
   * @param toaster
   */
  bindToaster(toaster){
    const s = this
    toaster.addListener('toast', s.handleToast)
  },

  /**
   * Unbind toaster events.
   * @param toaster
   */
  unbindToaster(toaster){
    const s = this
    toaster.removeListener('toast', s.handleToast)
  },

  /**
   * Handle toaster events.
   * @param data
   */
  handleToast(data){
    const s = this
    let state = { _date: new Date() }
    Toaster.levels.forEach((level) => {
      state[ level ] = data.level === level ? data.message : null;
    })
    s.setState(state)
  }
})

export default ApToastGroup;