All files / src/components MarkdownEditorMenu.js

81.58% Statements 31/38
83.33% Branches 5/6
41.67% Functions 5/12
81.58% Lines 31/38

Press n or j to go to the next uncovered block, b, p or k for the previous block.

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 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 1124x 4x 4x 4x 4x 4x 4x 4x 4x   4x               7x           7x 7x         18x 18x 18x 18x 18x 18x 18x 18x   18x   18x                           10x 3x 7x 7x         1x                                                               4x                         4x   4x  
var React = require('react');
var ReactDOM = require('react-dom');
var Reflux = require('reflux');
var createClass = require('create-react-class');
var ButtonManagerMixin = require('../mixins/ButtonManagerMixin');
var MarkdownSelectionStore = require('../stores/MarkdownSelectionStore');
var MarkdownEditorActions = require('../actions/MarkdownEditorActions');
var PropTypes = require('prop-types');
var objectAssign = require('object-assign');
 
var MarkdownEditorMenu = createClass({
  mixins: [Reflux.ListenerMixin, ButtonManagerMixin],
 
  propTypes: {
    iconsSet: PropTypes.string.isRequired
  },
 
  getInitialState: function() {
    return {
      enabled: false
    };
  },
 
  componentWillMount: function() {
    this.listenTo(MarkdownSelectionStore, this.handleMarkdownSelectionStore);
    this.setIconsProvider(this.props.iconsSet);
  },
 
  render: function() {
 
    var _disabled = (!this.state.enabled) ? 'disabled' : '';
    var boldButton = this.getBoldButton(_disabled, this.handleBoldButtonClick);
    var italicButton = this.getItalicButton(_disabled, this.handleItalicButtonClick);
    var makeListButton = this.getMakeListButton(_disabled, this.handleListButtonClick);
    var imageButton = this.getImageButton(_disabled, this.handleImageButtonClick);
    var linkButton = this.getLinkButton(_disabled, this.handleLinkButtonClick);
    var headerButton = this.getButtonWithoutIcon(_disabled, this.handleHeaderButtonClick, 'md-editor-menu-header', 'Header');
    var subHeaderButton = this.getButtonWithoutIcon(_disabled, this.handleSubHeaderButtonClick, 'md-editor-menu-subheader', 'Subheader');
 
    var styleMarkdownMenu = objectAssign({}, MarkdownEditorMenu.defaultProps.styles.styleMarkdownMenu, this.props.styles.styleMarkdownMenu);
 
    return (
      <div style={styleMarkdownMenu} className='md-editor-menu'>
        {boldButton}
        {italicButton}
        {headerButton}
        {subHeaderButton}
        {makeListButton}
        {imageButton}
        {linkButton}
      </div>
    );
  },
 
  handleMarkdownSelectionStore: function(data) {
    if (data.type === 'clear') {
      this.setState({enabled: false});
    } else Eif (data.type === 'set') {
      this.setState({enabled: true});
    }
  },
 
  handleBoldButtonClick: function() {   
    MarkdownEditorActions.makeBold(this.props.instanceRef);
  },
 
  handleImageButtonClick: function() {
    MarkdownEditorActions.makeImage(this.props.instanceRef);
  },
 
  handleItalicButtonClick: function() {
    MarkdownEditorActions.makeItalic(this.props.instanceRef);
  },
 
  handleUnderlineButtonClick: function() {
    MarkdownEditorActions.makeUnderline(this.props.instanceRef);
  },
 
  handleHeaderButtonClick: function() {
    MarkdownEditorActions.makeHeader(this.props.instanceRef);
  },
 
  handleSubHeaderButtonClick: function() {
    MarkdownEditorActions.makeSubHeader(this.props.instanceRef);
  },
 
  handleLinkButtonClick: function() {
    MarkdownEditorActions.makeLink(this.props.instanceRef);
  },
 
  handleListButtonClick: function() {
    MarkdownEditorActions.makeList(this.props.instanceRef);
  }
});
 
MarkdownEditorMenu.defaultProps = {
    styles: { 
        styleMarkdownMenu : {
            'margin': '5px 0',
            'flex': '1',
            'display': 'flex',
            'position': 'absolute',
            'right': '20px',
            'top': '10px'
        }
    }
}
 
MarkdownEditorMenu.displayName = 'MarkdownEditorMenu';
 
module.exports = MarkdownEditorMenu;