trc-client-core/src/product/ProductTrainers.jsx

The core of the TRC Client

import React from 'react';
import classnames from 'classnames';
import Page from 'trc-client-core/src/components/Page';
import UserStore from 'trc-client-core/src/user/UserStore';
import TrainersCollection from 'trc-client-core/src/copy/product/product-trainers.yml'
import {staticUrl} from 'trc-client-core/src/constants/url';
var ProductTrainers = React.createClass({
    displayName: 'ProductTrainers',
    render() {
        return <Page title="Product Trainers">
            <div>
                <h1>Our Team</h1>
                <ul className="ListDivided">
                    {TrainersCollection.map(this.renderTrainer)}
                </ul>
            </div>
        </Page>
    },
    renderTrainer(person, key) {
        if(UserStore.get('site') === person.brand || person.brand === 'all') {
            return <li className="padding-left">
                <div className="Media">
                    <img className="Media_image Avatar" src={staticUrl(`img/product/avatar/${person.avatar}`)} height="150" width="150"/>
                    <div className="Media_body padding-left">
                        <h3 className="hug margin-bottom05">{person.name}</h3>
                        <p>{person.title}<br/><em>{person.company}</em></p>
                        <ul>
                            {this.renderItem(person,'phone')}
                            {this.renderItem(person,'mobile')}
                            {this.renderItem(person, `email_${UserStore.get('site')}`)}
                        </ul>
                    </div>
                </div>
            </li>            
        }
    },
    renderItem(person, key) {
        var prefix;
        var icon;
        switch(key) {
            case 'phone':
               icon = '\uE183';
               prefix = 'tel';
               break;
            case 'mobile':
               icon =  '\uE145';
               prefix = 'tel';
               break;
            default:
               icon = '\uE028';
               prefix = 'mailto';
               break;
        }

        var className = classnames({
            "link": key === `email_${UserStore.get('site')}`
        });

        if(person[key]) {
            return <li className="Icon Icon-small Icon-inline" data-icon={icon}>
                <a className={className} href={`${prefix}:${person[key]}`}>{person[key]}</a>
            </li>
        }
    }

});



module.exports = ProductTrainers;