1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 09:46:22 +00:00

clipboard button is added

This commit is contained in:
Kevin Nadro
2017-05-28 17:31:23 -05:00
parent 67d8b02c49
commit f3612774ba
2 changed files with 27 additions and 1 deletions

View File

@@ -9,6 +9,7 @@ import SequenceDiagram from 'js-sequence-diagrams'
import eventEmitter from 'browser/main/lib/eventEmitter' import eventEmitter from 'browser/main/lib/eventEmitter'
import fs from 'fs' import fs from 'fs'
import htmlTextHelper from 'browser/lib/htmlTextHelper' import htmlTextHelper from 'browser/lib/htmlTextHelper'
import copy from 'copy-to-clipboard'
const { remote } = require('electron') const { remote } = require('electron')
const { app } = remote const { app } = remote
@@ -46,6 +47,24 @@ code {
font-family: ${codeBlockFontFamily.join(', ')}; font-family: ${codeBlockFontFamily.join(', ')};
} }
.clipboardButton {
color: #939395;
fill: #939395;
border-radius: 17px;
font-size: 14px;
margin: 13px 7px;
padding-top: 5px;
border: none;
background-color: transparent;
outline: none;
height: 34px;
width: 34px;
}
.clipboardButton:hover {
background-color: #D9D9D9;
}
h1, h2 { h1, h2 {
border: none; border: none;
} }
@@ -261,6 +280,12 @@ export default class MarkdownPreview extends React.Component {
if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text') if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text')
CodeMirror.requireMode(syntax.mode, () => { CodeMirror.requireMode(syntax.mode, () => {
let content = htmlTextHelper.decodeEntities(el.innerHTML) let content = htmlTextHelper.decodeEntities(el.innerHTML)
const copyIcon = document.createElement('i')
copyIcon.innerHTML = '<button class="clipboardButton"><svg width="14" height="14" viewBox="0 0 1792 1792" ><path d="M768 1664h896v-640h-416q-40 0-68-28t-28-68v-416h-384v1152zm256-1440v-64q0-13-9.5-22.5t-22.5-9.5h-704q-13 0-22.5 9.5t-9.5 22.5v64q0 13 9.5 22.5t22.5 9.5h704q13 0 22.5-9.5t9.5-22.5zm256 672h299l-299-299v299zm512 128v672q0 40-28 68t-68 28h-960q-40 0-68-28t-28-68v-160h-544q-40 0-68-28t-28-68v-1344q0-40 28-68t68-28h1088q40 0 68 28t28 68v328q21 13 36 28l408 408q28 28 48 76t20 88z"/></svg></button>'
copyIcon.onclick = (e) => {
copy(content)
}
el.parentNode.appendChild(copyIcon)
el.innerHTML = '' el.innerHTML = ''
el.parentNode.className += ` cm-s-${codeBlockTheme} CodeMirror` el.parentNode.className += ` cm-s-${codeBlockTheme} CodeMirror`
CodeMirror.runMode(content, syntax.mime, el, { CodeMirror.runMode(content, syntax.mime, el, {
@@ -357,4 +382,4 @@ MarkdownPreview.propTypes = {
onMouseDown: PropTypes.func, onMouseDown: PropTypes.func,
className: PropTypes.string, className: PropTypes.string,
value: PropTypes.string value: PropTypes.string
} }

View File

@@ -89,6 +89,7 @@
"babel-preset-react-hmre": "^1.0.1", "babel-preset-react-hmre": "^1.0.1",
"babel-register": "^6.11.6", "babel-register": "^6.11.6",
"concurrently": "^3.4.0", "concurrently": "^3.4.0",
"copy-to-clipboard": "^3.0.6",
"css-loader": "^0.19.0", "css-loader": "^0.19.0",
"devtron": "^1.1.0", "devtron": "^1.1.0",
"dom-storage": "^2.0.2", "dom-storage": "^2.0.2",