✨ feat: 添加 Ace 编辑器支持并优化样式
This commit is contained in:
71
.copilot-temp/submit-ace-smoke.html
Normal file
71
.copilot-temp/submit-ace-smoke.html
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Submit Ace Smoke</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 24px;
|
||||||
|
background: #f4f7fb;
|
||||||
|
font-family: "Segoe UI", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#source {
|
||||||
|
width: 100%;
|
||||||
|
height: 320px;
|
||||||
|
border: 1px solid #d4d4d5;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#hide_source {
|
||||||
|
width: 100%;
|
||||||
|
height: 140px;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<pre id="source">#include <bits/stdc++.h>
|
||||||
|
|
||||||
|
int main() {
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
</pre>
|
||||||
|
<textarea id="hide_source"></textarea>
|
||||||
|
<script src="../web/ace/ace.js"></script>
|
||||||
|
<script src="../web/ace/ext-language_tools.js"></script>
|
||||||
|
<script>
|
||||||
|
ace.config.set('basePath', '../web/ace');
|
||||||
|
var sourceElement = document.getElementById('source');
|
||||||
|
var hiddenSourceElement = document.getElementById('hide_source');
|
||||||
|
var initialSourceCode = sourceElement ? (sourceElement.textContent || sourceElement.innerText || '') : '';
|
||||||
|
var editor = ace.edit('source');
|
||||||
|
|
||||||
|
editor.setTheme('ace/theme/xcode');
|
||||||
|
editor.setShowPrintMargin(false);
|
||||||
|
editor.setBehavioursEnabled(true);
|
||||||
|
editor.session.setUseWrapMode(true);
|
||||||
|
editor.session.setTabSize(4);
|
||||||
|
editor.session.setUseSoftTabs(true);
|
||||||
|
editor.setOptions({
|
||||||
|
enableBasicAutocompletion: true,
|
||||||
|
enableSnippets: true,
|
||||||
|
enableLiveAutocompletion: true,
|
||||||
|
fontSize: '18px'
|
||||||
|
});
|
||||||
|
editor.setValue(initialSourceCode, -1);
|
||||||
|
|
||||||
|
function syncEditorSource() {
|
||||||
|
if (hiddenSourceElement) {
|
||||||
|
hiddenSourceElement.value = editor.getValue();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
editor.getSession().on('change', syncEditorSource);
|
||||||
|
syncEditorSource();
|
||||||
|
editor.getSession().setMode('ace/mode/c_cpp');
|
||||||
|
window.smokeEditor = editor;
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -15,15 +15,23 @@
|
|||||||
text-align: left !important;
|
text-align: left !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hustoj-vditor-code,
|
#source.ace_editor {
|
||||||
.hustoj-vditor-code .vditor,
|
|
||||||
.hustoj-vditor-code .vditor-content,
|
|
||||||
.hustoj-vditor-code .vditor-reset,
|
|
||||||
.hustoj-vditor-code textarea {
|
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
|
border: 1px solid #d4d4d5;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#source.ace_editor,
|
||||||
|
#source.ace_editor .ace_scroller,
|
||||||
|
#source.ace_editor .ace_content,
|
||||||
|
#source.ace_editor .ace_text-layer {
|
||||||
text-align: left !important;
|
text-align: left !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#source.ace_editor .ace_gutter {
|
||||||
|
border-radius: 6px 0 0 6px;
|
||||||
|
}
|
||||||
|
|
||||||
.ace-chrome .ace_marker-layer .ace_active-line{ /*当前行*/
|
.ace-chrome .ace_marker-layer .ace_active-line{ /*当前行*/
|
||||||
background-color: rgba(0,0,199,0.3);
|
background-color: rgba(0,0,199,0.3);
|
||||||
}
|
}
|
||||||
@@ -474,21 +482,39 @@ function loadFromBlockly(){
|
|||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
<?php if($OJ_ACE_EDITOR){ ?>
|
<?php if($OJ_ACE_EDITOR){ ?>
|
||||||
<script src="include/vditor-adapter.js"></script>
|
<script src="ace/ace.js"></script>
|
||||||
|
<script src="ace/ext-language_tools.js"></script>
|
||||||
<script>
|
<script>
|
||||||
var editor = HustOJVditor.createDeferredCodeEditor({
|
ace.config.set("basePath", "ace");
|
||||||
container: "source",
|
|
||||||
hiddenField: "hide_source",
|
var sourceElement = document.getElementById("source");
|
||||||
theme: "ace/theme/xcode",
|
var hiddenSourceElement = document.getElementById("hide_source");
|
||||||
fontSize: 18
|
var initialSourceCode = sourceElement ? (sourceElement.textContent || sourceElement.innerText || "") : "";
|
||||||
});
|
var editor = ace.edit("source");
|
||||||
switchLang(<?php echo $lastlang ?>);
|
|
||||||
|
editor.setTheme("ace/theme/xcode");
|
||||||
|
editor.setShowPrintMargin(false);
|
||||||
|
editor.setBehavioursEnabled(true);
|
||||||
|
editor.session.setUseWrapMode(true);
|
||||||
|
editor.session.setTabSize(4);
|
||||||
|
editor.session.setUseSoftTabs(true);
|
||||||
editor.setOptions({
|
editor.setOptions({
|
||||||
enableBasicAutocompletion: true,
|
enableBasicAutocompletion: true,
|
||||||
enableSnippets: true,
|
enableSnippets: true,
|
||||||
enableLiveAutocompletion: true,
|
enableLiveAutocompletion: true,
|
||||||
fontSize: "18px"
|
fontSize: "18px"
|
||||||
});
|
});
|
||||||
|
editor.setValue(initialSourceCode, -1);
|
||||||
|
|
||||||
|
function syncEditorSource(){
|
||||||
|
if(hiddenSourceElement){
|
||||||
|
hiddenSourceElement.value = editor.getValue();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
editor.getSession().on("change", syncEditorSource);
|
||||||
|
switchLang(<?php echo $lastlang ?>);
|
||||||
|
syncEditorSource();
|
||||||
reloadtemplate($("#language").val());
|
reloadtemplate($("#language").val());
|
||||||
function getSourceDraftKey(languageOverride){
|
function getSourceDraftKey(languageOverride){
|
||||||
let language=languageOverride;
|
let language=languageOverride;
|
||||||
|
|||||||
Reference in New Issue
Block a user