Spaces:
Sleeping
Sleeping
File size: 2,861 Bytes
503af9c f069a43 503af9c b4e8587 503af9c b4e8587 503af9c b4e8587 503af9c b4e8587 503af9c b4e8587 503af9c |
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 |
import CodeMirror from 'codemirror'
import 'codemirror/mode/javascript/javascript'
import nextTick from 'licia/nextTick'
import copy from 'licia/copy'
import beautify from 'js-beautify'
import stripIndent from 'licia/stripIndent'
export default function (eruda) {
let { evalCss } = eruda.util
class Code extends eruda.Tool {
constructor() {
super()
this.name = 'code'
this.displayName = 'コード'
this._style = evalCss(require('./style.scss'))
this._CodeMirrorStyle = evalCss(
require('codemirror/lib/codemirror.css') +
require('codemirror/theme/material-darker.css')
)
this._CodeMirrorCustomStyle = evalCss(require('./CodeMirror.css'))
this._editor = null
}
init($el, container) {
super.init($el, container)
$el.html(stripIndent`<textarea class="eruda-editor">function fib(num) {
if (num <= 2) return 1;
return fib(num - 1) + fib(num - 2);
}
console.log(fib(5));</textarea>
<div class="eruda-bottom-bar">
<div class="eruda-btn eruda-beautify">
整形
</div>
<div class="eruda-btn eruda-copy">
コピー
</div>
<div class="eruda-btn eruda-clear">
クリア
</div>
<div class="eruda-btn eruda-run">
実行
</div>
</div>`)
this._bindEvent()
}
show() {
super.show()
if (!this._editor) {
let container = this._$el.find('.eruda-editor').get(0)
this._editor = CodeMirror.fromTextArea(container, {
lineNumbers: 'true',
mode: 'javascript',
})
nextTick(() => this._editor.refresh())
}
}
hide() {
super.hide()
}
run() {
try {
evalJs(this._editor.getValue())
} catch (e) {
/* eslint-disable no-console */
console.error(e)
}
}
beautify() {
let editor = this._editor
let value = editor.getValue()
editor.setValue(beautify(value))
}
copy() {
copy(this._editor.getValue())
eruda.get().notify('コピーしました', { icon: 'success' })
}
clear() {
this._editor.setValue('')
}
destroy() {
super.destroy()
evalCss.remove(this._style)
evalCss.remove(this._CodeMirrorStyle)
evalCss.remove(this._CodeMirrorCustomStyle)
}
_bindEvent() {
this._$el
.on('click', '.eruda-run', () => this.run())
.on('click', '.eruda-beautify', () => this.beautify())
.on('click', '.eruda-clear', () => this.clear())
.on('click', '.eruda-copy', () => this.copy())
}
}
let evalJs = (code) => {
let ret
try {
ret = eval.call(window, `(${code})`)
} catch (e) {
ret = eval.call(window, code)
}
return ret
}
return new Code()
}
|