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 113 114 115 116 117 118 119 120 121 122 | 4x 4x 4x 7x 90x 90x 18x 18x 18x 90x 90x 36x 36x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 4x | var React = require('react'); var ReactDOM = require('react-dom'); var ButtonManagerMixin = { iconsProviderName: null, setIconsProvider: function(name) { this.iconsProviderName = name; }, isFontAwesome: function() { return this.iconsProviderName === 'font-awesome'; }, getStyleMarkdownBtn: function() { return { 'flex': '1', 'maxWidth': '50px', 'border': '1px solid #ddd', 'backgroundColor': 'white', 'borderRadius': '4px', 'margin': '0 2px', 'padding': '2px 3px', 'cursor': 'pointer', 'display': 'flex', 'justifyContent': 'center', 'alignItems': 'center' }; }, getBoldButton: function(isDisabled, onClickHandler) { var _style = this.getStyleMarkdownBtn(); Eif (this.isFontAwesome()) { return this.getButtonFontAwesomeIcon(isDisabled, onClickHandler, _style, 'fa-bold', 'bold-btn'); } else { return this.getButtonMaterializeIcon(isDisabled, onClickHandler, _style, 'format_bold', 'bold-btn'); } }, getButtonMaterializeIcon: function(isDisabled, onClickHandler, styleBtn, iconName, containerClassName) { return ( <div role='button' className={containerClassName} style={styleBtn} disabled={isDisabled} onClick={onClickHandler}> <i className='material-icons'>{iconName}</i> </div> ); }, getButtonFontAwesomeIcon: function(isDisabled, onClickHandler, styleBtn, iconName, containerClassName) { var _className = 'fa ' + iconName; return ( <div role='button' className={containerClassName} style={styleBtn} disabled={isDisabled} onClick={onClickHandler}> <i className={_className}></i> </div> ); }, getButtonWithoutIcon: function(isDisabled, onClickHandler, additionalClassName, textBtn) { var styleBtn = { 'display': 'flex', 'minWidth': '50px', 'border': '1px solid #ddd', 'color': 'black', 'backgroundColor': 'white', 'borderRadius': '4px', 'margin': '0 2px', 'padding': '2px 3px', 'cursor': 'pointer', 'textAlign': 'center', 'justifyContent': 'flex-end', 'alignItems': 'center' }; return ( <div role='button' style={styleBtn} className={additionalClassName} disabled={isDisabled} onClick={onClickHandler}> <span>{textBtn}</span> </div> ); }, getItalicButton: function(isDisabled, onClickHandler) { Eif (this.isFontAwesome()) { var _style = this.getStyleMarkdownBtn(); return this.getButtonFontAwesomeIcon(isDisabled, onClickHandler, _style, 'fa-italic', 'italic-btn'); } else { var _style = this.getStyleMarkdownBtn(); return this.getButtonMaterializeIcon(isDisabled, onClickHandler, _style, 'format_italic', 'italic-btn'); } }, getMakeListButton: function(isDisabled, onClickHandler) { Eif (this.isFontAwesome()) { var _style = this.getStyleMarkdownBtn(); return this.getButtonFontAwesomeIcon(isDisabled, onClickHandler, _style, 'fa-list-ul', 'list-btn'); } else { var _style = this.getStyleMarkdownBtn(); return this.getButtonMaterializeIcon(isDisabled, onClickHandler, _style, 'format_list_bulleted', 'list-btn'); } }, getImageButton: function(isDisabled, onClickHandler) { Eif (this.isFontAwesome()) { var _style = this.getStyleMarkdownBtn(); return this.getButtonFontAwesomeIcon(isDisabled, onClickHandler, _style, 'fa-file-image-o', 'insert-img-btn'); } else { var _style = this.getStyleMarkdownBtn(); return this.getButtonMaterializeIcon(isDisabled, onClickHandler, _style, 'insert_photo', 'insert-img-btn'); } }, getLinkButton: function(isDisabled, onClickHandler) { Eif (this.isFontAwesome()) { var _style = this.getStyleMarkdownBtn(); return this.getButtonFontAwesomeIcon(isDisabled, onClickHandler, _style, 'fa-link', 'insert-link-btn'); } else { var _style = this.getStyleMarkdownBtn(); return this.getButtonMaterializeIcon(isDisabled, onClickHandler, _style, 'insert_link', 'insert-link-btn'); } } }; module.exports = ButtonManagerMixin; |