Swapped editor to Ace

This commit is contained in:
emizzle 2018-08-06 15:51:22 +10:00 committed by Pascal Precht
parent 518111132b
commit 12faeb7866
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
5 changed files with 55 additions and 42 deletions

View File

@ -18,6 +18,11 @@
"negotiator": "0.6.1" "negotiator": "0.6.1"
} }
}, },
"ace-mode-solidity": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/ace-mode-solidity/-/ace-mode-solidity-0.1.0.tgz",
"integrity": "sha512-vLhygG5B0ImeDd/+L3vAB3aD3wQ5OE/+AYUD6dyOmvBc2G40K5mO/Lp7li+d04xpzO1LP82bQKN1N/I35K/wgg=="
},
"acorn": { "acorn": {
"version": "5.7.1", "version": "5.7.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.1.tgz", "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.1.tgz",
@ -1440,6 +1445,11 @@
} }
} }
}, },
"brace": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/brace/-/brace-0.11.1.tgz",
"integrity": "sha1-SJb8ydVE7vRfS7dmDbMg07N5/lg="
},
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@ -2686,6 +2696,11 @@
"resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz", "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
"integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA==" "integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA=="
}, },
"diff-match-patch": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/diff-match-patch/-/diff-match-patch-1.0.1.tgz",
"integrity": "sha512-A0QEhr4PxGUMEtKxd6X+JLnOTFd3BfIPSDpsc4dMvj+CbSaErDwTpoTo/nFJDMSrjxLW4BiNq+FbNisAAHhWeQ=="
},
"diffie-hellman": { "diffie-hellman": {
"version": "5.0.3", "version": "5.0.3",
"resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz", "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
@ -6501,6 +6516,16 @@
"resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz", "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
"integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw=" "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
}, },
"lodash.get": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
"integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
},
"lodash.isequal": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
"integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
},
"lodash.memoize": { "lodash.memoize": {
"version": "4.1.2", "version": "4.1.2",
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz", "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@ -8831,6 +8856,18 @@
"prop-types": "^15.6.0" "prop-types": "^15.6.0"
} }
}, },
"react-ace": {
"version": "6.1.4",
"resolved": "https://registry.npmjs.org/react-ace/-/react-ace-6.1.4.tgz",
"integrity": "sha512-a8/lAsy2bfi7Ho+3Kaj8hBPR+PEiCTG9xFG9LIjCJrv5WQFYFpeFTiPWA96M3t+LgIDFFltwfVTwD2pmdAVOxQ==",
"requires": {
"brace": "^0.11.0",
"diff-match-patch": "^1.0.0",
"lodash.get": "^4.4.2",
"lodash.isequal": "^4.1.1",
"prop-types": "^15.5.8"
}
},
"react-dev-utils": { "react-dev-utils": {
"version": "5.0.1", "version": "5.0.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-5.0.1.tgz", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-5.0.1.tgz",

View File

@ -3,12 +3,14 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"ace-mode-solidity": "^0.1.0",
"axios": "^0.18.0", "axios": "^0.18.0",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"connected-react-router": "^4.3.0", "connected-react-router": "^4.3.0",
"history": "^4.7.2", "history": "^4.7.2",
"prop-types": "^15.6.2", "prop-types": "^15.6.2",
"react": "^16.4.1", "react": "^16.4.1",
"react-ace": "^6.1.4",
"react-dom": "^16.4.1", "react-dom": "^16.4.1",
"react-redux": "^5.0.7", "react-redux": "^5.0.7",
"react-router-dom": "^4.3.1", "react-router-dom": "^4.3.1",

View File

@ -1,9 +1,9 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<meta name="theme-color" content="#000000"> <meta name="theme-color" content="#000000"/>
<!-- <!--
manifest.json provides metadata used when your web app is added to the manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/ homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
@ -37,20 +37,6 @@
To begin the development, run `npm start` or `yarn start`. To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`. To create a production bundle, use `npm run build` or `yarn build`.
--> -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.13.1/min/vs/loader.js"></script>
<script>
require.config({
paths: {
'vs': 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.13.1/min/vs'
}
});
window.MonacoEnvironment = {
getWorkerUrl: function (workerId, label) {
return '/monaco-editor-worker-loader-proxy.js';
}
};
require(["vs/editor/editor.main"], function () { })
</script>
</body> </body>
</html> </html>

View File

@ -1,5 +1,10 @@
import React from 'react'; import React from 'react';
import MonacoEditor from 'react-monaco-editor'; import AceEditor from 'react-ace';
import 'brace/mode/javascript';
import 'brace/theme/tomorrow_night_blue';
import 'ace-mode-solidity/build/remix-ide/mode-solidity';
const Fiddle = ({code, options, editorDidMount, onChange}) => { const Fiddle = ({code, options, editorDidMount, onChange}) => {
options = options || { options = options || {
@ -9,15 +14,13 @@ const Fiddle = ({code, options, editorDidMount, onChange}) => {
<React.Fragment> <React.Fragment>
<h1>Fiddle</h1> <h1>Fiddle</h1>
<p>Play around with contract code and deploy against your running node.</p> <p>Play around with contract code and deploy against your running node.</p>
<MonacoEditor <AceEditor
height="1200" mode="solidity"
language="sol" theme="tomorrow_night_blue"
theme="vs-dark" name="blah1"
value={code} height="60em"
options={options} width="100%"
onChange={onChange} />
editorDidMount={editorDidMount}
/>
</React.Fragment> </React.Fragment>
); );
}; };

15
package-lock.json generated
View File

@ -756,15 +756,6 @@
"@types/node": "*" "@types/node": "*"
} }
}, },
"@types/react": {
"version": "16.4.7",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.4.7.tgz",
"integrity": "sha512-tHpSs7HMyjnpyfzka1G0pYh7rBNdpwGgcIDT4vfV6jUaR69yOHo/vNH2H+d9iYHo9xnX4qDe7UalPe9HiGRkLw==",
"dev": true,
"requires": {
"csstype": "^2.2.0"
}
},
"@types/semver": { "@types/semver": {
"version": "5.5.0", "version": "5.5.0",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.5.0.tgz", "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.5.0.tgz",
@ -6744,12 +6735,6 @@
"resolved": "https://registry.npmjs.org/mock-fs/-/mock-fs-4.7.0.tgz", "resolved": "https://registry.npmjs.org/mock-fs/-/mock-fs-4.7.0.tgz",
"integrity": "sha512-WlQNtUlzMRpvLHf8dqeUmNqfdPjGY29KrJF50Ldb4AcL+vQeR8QH3wQcFMgrhTwb1gHjZn9xggho+84tBskLgA==" "integrity": "sha512-WlQNtUlzMRpvLHf8dqeUmNqfdPjGY29KrJF50Ldb4AcL+vQeR8QH3wQcFMgrhTwb1gHjZn9xggho+84tBskLgA=="
}, },
"monaco-editor": {
"version": "0.13.1",
"resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.13.1.tgz",
"integrity": "sha512-0Kssg/O3cl1tXP0qAIxhrtMbRnzusFUEvFyt5/fpUbmuVeY3z+TnUx13+3kW16pgacFPXGUTEO/hOPlDeFU/dw==",
"dev": true
},
"mout": { "mout": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/mout/-/mout-1.1.0.tgz", "resolved": "https://registry.npmjs.org/mout/-/mout-1.1.0.tgz",