feat: 添加 Ace 编辑器支持并优化样式

This commit is contained in:
2026-04-11 20:42:59 +08:00
parent 31c676fc3a
commit 917ea78c66
2 changed files with 110 additions and 13 deletions

View 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 &lt;bits/stdc++.h&gt;
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>

View File

@@ -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;