tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

use monaco editor

Browse Source
This commit is contained in:
pengfei.zhou 2019-08-14 20:07:36 +08:00
parent 8c2c55e7b8
commit d9eb9489b8
6 changed files with 70 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
Android/doric/src/main/java/com/github/penfeizhou/doric/dev/LocalServer.java
View File

@ -12,6 +12,7 @@ import com.github.penfeizhou.doric.DoricDriver;
import com.github.pengfeizhou.jscore.JSONBuilder; import com.github.pengfeizhou.jscore.JSONBuilder;
import org.json.JSONArray; import org.json.JSONArray;
import org.json.JSONObject;
import java.io.IOException; import java.io.IOException;
import java.io.InputStream; import java.io.InputStream;
@ -78,6 +79,34 @@ public class LocalServer extends NanoHTTPD {
return "{}"; return "{}";
} }
}); });
commandMap.put("reload", new APICommand() {
@Override
public String name() {
return "reload";
}
@Override
public Object exec(IHTTPSession session) {
Map<String, String> files = new HashMap<>();
try {
session.parseBody(files);
} catch (Exception e) {
e.printStackTrace();
}
String id = session.getParms().get("id");
DoricContext doricContext = DoricContextManager.getContext(id);
if (doricContext != null) {
try {
JSONObject jsonObject = new JSONObject(files.get("postData"));
doricContext.reload(jsonObject.optString("script"));
} catch (Exception e) {
e.printStackTrace();
}
return "success";
}
return "fail";
}
});
} }

5
debugger/package-lock.json generated
View File

@ -7453,6 +7453,11 @@
} }
} }
}, },
"monaco-editor": {
"version": "0.17.1",
"resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.17.1.tgz",
"integrity": "sha512-JAc0mtW7NeO+0SwPRcdkfDbWLgkqL9WfP1NbpP9wNASsW6oWqgZqNIWt4teymGjZIXTElx3dnQmUYHmVrJ7HxA=="
},
"move-concurrently": { "move-concurrently": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npm.taobao.org/move-concurrently/download/move-concurrently-1.0.1.tgz", "resolved": "https://registry.npm.taobao.org/move-concurrently/download/move-concurrently-1.0.1.tgz",

1
debugger/package.json
View File

@ -12,6 +12,7 @@
"babel-plugin-prismjs": "^1.1.1", "babel-plugin-prismjs": "^1.1.1",
"core-js": "^2.6.5", "core-js": "^2.6.5",
"element-ui": "^2.11.1", "element-ui": "^2.11.1",
"monaco-editor": "^0.17.1",
"prismjs": "^1.17.1", "prismjs": "^1.17.1",
"vue": "^2.6.10", "vue": "^2.6.10",
"vue-prism": "^1.0.5", "vue-prism": "^1.0.5",

4
debugger/public/index.html
View File

@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>Doric Dev Pannel</title> <title>Doric Dev Pannel</title>
<link href="prism.css" rel="stylesheet" /> <!-- <link href="prism.css" rel="stylesheet" /> -->
</head> </head>
<body> <body>
@ -17,7 +17,7 @@
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
<script src="prism.js"></script> <!-- <script src="prism.js"></script> -->
</body> </body>
</html> </html>

8
debugger/src/App.vue
View File

@ -11,11 +11,19 @@ export default {
</script> </script>
<style> <style>
html {
height: 100%;
}
body {
height: 100%;
}
#app { #app {
font-family: "Avenir", Helvetica, Arial, sans-serif; font-family: "Avenir", Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-align: center; text-align: center;
color: #2c3e50; color: #2c3e50;
height: 100%;
} }
</style> </style>

37
debugger/src/components/Context.vue
View File

@ -2,7 +2,7 @@
<div class="context"> <div class="context">
<el-page-header @back="goBack"></el-page-header> <el-page-header @back="goBack"></el-page-header>
<el-container class="container"> <el-container class="container">
<el-aside class="aside"> <el-aside>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>Context info</span> <span>Context info</span>
@ -20,12 +20,7 @@
</el-aside> </el-aside>
<el-main> <el-main>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div class="script" ref="editor"></div>
<span>Running</span>
</div>
<div class="script">
<pre class="language-js"> <code v-html="script"></code></pre>
</div>
</el-card> </el-card>
</el-main> </el-main>
</el-container> </el-container>
@ -34,13 +29,19 @@
<script> <script>
import axios from "axios"; import axios from "axios";
import * as monaco from "monaco-editor/esm/vs/editor/editor.main.js";
import "monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution";
import { StandaloneCodeEditorServiceImpl } from "monaco-editor/esm/vs/editor/standalone/browser/standaloneCodeServiceImpl.js";
export default { export default {
name: "Context", name: "Context",
data: function() { data: function() {
return { return {
id: this.$route.params.id, id: this.$route.params.id,
source: this.$route.params.id, source: this.$route.params.id,
script: "" script: "",
editor: null,
curTheme: "vs"
}; };
}, },
methods: { methods: {
@ -49,6 +50,14 @@ export default {
}, },
debug() { debug() {
console.log("debug"); console.log("debug");
axios
.post(`/api/reload?id=${this.$route.params.id}`, {
contextId: this.$route.params.id,
script: this.editor.getValue()
})
.then(function(response) {
console.log("post result:", response);
});
} }
}, },
mounted: function() { mounted: function() {
@ -56,10 +65,13 @@ export default {
axios.get(`/api/context?id=${this.$route.params.id}`).then(res => { axios.get(`/api/context?id=${this.$route.params.id}`).then(res => {
this.source = res.data.source; this.source = res.data.source;
this.script = res.data.script; this.script = res.data.script;
this.editor.setValue(this.script);
});
this.editor = monaco.editor.create(this.$refs.editor, {
theme: this.curTheme,
automaticLayout: true,
language: "javascript"
}); });
},
updated: function() {
Prism.highlightAll();
} }
}; };
</script> </script>
@ -91,6 +103,7 @@ p span {
.script { .script {
text-align: left; text-align: left;
font-size: 50%; font-size: 100%;
height: fill-available;
} }
</style> </style>