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 112 | 4x 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; |