✨ feat: 更新问题页面和提交页面,集成Vditor适配器,优化Markdown渲染
This commit is contained in:
@@ -33,8 +33,7 @@ div[class*=ace_br] {
|
||||
}
|
||||
</style>
|
||||
<script src="<?php echo $OJ_CDN_URL.$path_fix."template/$OJ_TEMPLATE/"?>clipboard.min.js"></script>
|
||||
<script src="<?php echo $OJ_CDN_URL.$path_fix."template/bs3/"?>marked.min.js"></script>
|
||||
<script src="<?php echo $OJ_CDN_URL.$path_fix."template/syzoj/js/"?>markdown-it.min.js"></script>
|
||||
<script src="include/vditor-adapter.js"></script>
|
||||
|
||||
<div class="padding ">
|
||||
<div class="ui center aligned grid">
|
||||
@@ -399,154 +398,172 @@ function phpfm(pid){
|
||||
}
|
||||
});
|
||||
}
|
||||
function getFrameSourceValue(frameWindow){
|
||||
if(frameWindow.editor && typeof frameWindow.editor.getValue === "function"){
|
||||
return frameWindow.editor.getValue();
|
||||
}
|
||||
return frameWindow.$("#source").text();
|
||||
}
|
||||
function setFrameSourceValue(frameWindow, value){
|
||||
if(frameWindow.editor && typeof frameWindow.editor.setValue === "function"){
|
||||
frameWindow.editor.setValue(value);
|
||||
return;
|
||||
}
|
||||
frameWindow.$("#source").text(value);
|
||||
}
|
||||
function selectOne( num, answer){
|
||||
let editor = $("iframe")[0].contentWindow.$("#source");
|
||||
let old=editor.text();
|
||||
let frameWindow = $("iframe")[0].contentWindow;
|
||||
let old=getFrameSourceValue(frameWindow);
|
||||
let key= num+".*";
|
||||
console.log(key);
|
||||
let rep=old.replace(new RegExp(key),num+" "+answer);
|
||||
editor.text(rep);
|
||||
setFrameSourceValue(frameWindow, rep);
|
||||
}
|
||||
function selectMulti( num, answer){
|
||||
let editor = $("iframe")[0].contentWindow.$("#source");
|
||||
let old=editor.text();
|
||||
let frameWindow = $("iframe")[0].contentWindow;
|
||||
let old=getFrameSourceValue(frameWindow);
|
||||
let key= num+".*";
|
||||
console.log(key);
|
||||
let rep=old.replace(new RegExp(key),num+" "+answer);
|
||||
editor.text(rep);
|
||||
setFrameSourceValue(frameWindow, rep);
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
$("#creator").load("problem-ajax.php?pid=<?php echo $id?>");
|
||||
<?php if(isset($OJ_MARKDOWN)&&$OJ_MARKDOWN){ ?>
|
||||
marked.use({
|
||||
// 开启异步渲染
|
||||
async: true,
|
||||
pedantic: false,
|
||||
gfm: true,
|
||||
mangle: false,
|
||||
headerIds: false
|
||||
});
|
||||
|
||||
$(".md").each(function(){
|
||||
<?php if ($OJ_MARKDOWN && $OJ_MARKDOWN=="marked.js") {?>
|
||||
$(this).html(marked.parse($(this).html()));
|
||||
<?php }else if ($OJ_MARKDOWN && $OJ_MARKDOWN=="markdown-it") {?>
|
||||
const md = window.markdownit();
|
||||
$(this).html(md.render($(this).text()));
|
||||
<?php } ?>
|
||||
});
|
||||
// adding note for ```input1 ```output1 in description
|
||||
for(let i=1;i<10;i++){
|
||||
$(".language-input"+i).parent().before("<div><?php echo $MSG_Input?>"+i+":</div>");
|
||||
$(".language-output"+i).parent().before("<div><?php echo $MSG_Output?>"+i+":</div>");
|
||||
}
|
||||
|
||||
|
||||
$(".md table tr td").css({
|
||||
"border": "1px solid grey",
|
||||
"text-align": "center",
|
||||
"width": "200px",
|
||||
"height": "30px"
|
||||
function addMarkdownInputOutputLabels() {
|
||||
for (let i = 1; i < 10; i++) {
|
||||
$(".language-input" + i).parent().each(function(){
|
||||
if ($(this).prev('.hustoj-md-io-label').length === 0) {
|
||||
$(this).before("<div class='hustoj-md-io-label'><?php echo $MSG_Input?>" + i + ":</div>");
|
||||
}
|
||||
});
|
||||
|
||||
$(".md table th").css({
|
||||
"border": "1px solid grey",
|
||||
"width": "200px",
|
||||
"height": "30px",
|
||||
"background-color": "#9e9e9ea1",
|
||||
"text-align": "center"
|
||||
$(".language-output" + i).parent().each(function(){
|
||||
if ($(this).prev('.hustoj-md-io-label').length === 0) {
|
||||
$(this).before("<div class='hustoj-md-io-label'><?php echo $MSG_Output?>" + i + ":</div>");
|
||||
}
|
||||
});
|
||||
|
||||
<?php } ?>
|
||||
//单纯文本1. A. B. C. D. 自动变控件
|
||||
$('span[class=auto_select]').each(function(){
|
||||
let i=1;
|
||||
let start=0;
|
||||
let next=0;
|
||||
let raw=$(this).html();
|
||||
let options=['A','B','C','D'];
|
||||
console.log("scanning...");
|
||||
while(start>=0){
|
||||
start=raw.indexOf("\n"+i+".",start);
|
||||
if(start<0) break;
|
||||
let end=start;
|
||||
let type="radio"
|
||||
for(let j=0;j<4;j++){
|
||||
let option=options[j];
|
||||
end=raw.indexOf(option+".",start);
|
||||
next=raw.indexOf("\n"+(i+1)+".",start);
|
||||
console.log("["+raw.substring(start,end)+"]");
|
||||
if ( end<0 || ( end > next && next > 0 )) {
|
||||
console.log("i:"+i+" j:"+option+" end:"+end+" next:"+next);
|
||||
end=start;
|
||||
break;
|
||||
}
|
||||
if(j==0&&raw.substring(start,end).indexOf("多选")>0) type="checkbox";
|
||||
let disp="<input type=\""+type+"\" name=\""+i+"\" value=\""+option+"\" />"+option+".";
|
||||
//console.log(disp);
|
||||
raw= raw.substring(0,end-1)+disp+raw.substring(end+2);
|
||||
start+=disp.length;
|
||||
}
|
||||
start=end+1;
|
||||
i++;
|
||||
}
|
||||
//console.log(raw);
|
||||
$(this).html(raw);
|
||||
}
|
||||
}
|
||||
|
||||
function styleMarkdownTables() {
|
||||
$(".md table tr td").css({
|
||||
"border": "1px solid grey",
|
||||
"text-align": "center",
|
||||
"width": "200px",
|
||||
"height": "30px"
|
||||
});
|
||||
|
||||
$(".md table th").css({
|
||||
"border": "1px solid grey",
|
||||
"width": "200px",
|
||||
"height": "30px",
|
||||
"background-color": "#9e9e9ea1",
|
||||
"text-align": "center"
|
||||
});
|
||||
}
|
||||
|
||||
function renderProblemMarkdown() {
|
||||
<?php if(isset($OJ_MARKDOWN)&&$OJ_MARKDOWN){ ?>
|
||||
return HustOJVditor.renderMarkdownBlocks('.md').then(function () {
|
||||
addMarkdownInputOutputLabels();
|
||||
styleMarkdownTables();
|
||||
});
|
||||
<?php } ?>
|
||||
return Promise.resolve([]);
|
||||
}
|
||||
|
||||
function initializeProblemChoices() {
|
||||
$('span[class=auto_select]').each(function(){
|
||||
let i=1;
|
||||
let start=0;
|
||||
let next=0;
|
||||
let raw=$(this).html();
|
||||
let options=['A','B','C','D'];
|
||||
console.log("scanning...");
|
||||
while(start>=0){
|
||||
start=raw.indexOf("\n"+i+".",start);
|
||||
if(start<0) break;
|
||||
let end=start;
|
||||
let type="radio"
|
||||
for(let j=0;j<4;j++){
|
||||
let option=options[j];
|
||||
end=raw.indexOf(option+".",start);
|
||||
next=raw.indexOf("\n"+(i+1)+".",start);
|
||||
console.log("["+raw.substring(start,end)+"]");
|
||||
if ( end<0 || ( end > next && next > 0 )) {
|
||||
console.log("i:"+i+" j:"+option+" end:"+end+" next:"+next);
|
||||
end=start;
|
||||
break;
|
||||
}
|
||||
if(j==0&&raw.substring(start,end).indexOf("多选")>0) type="checkbox";
|
||||
let disp="<input type=\""+type+"\" name=\""+i+"\" value=\""+option+"\" />"+option+".";
|
||||
raw= raw.substring(0,end-1)+disp+raw.substring(end+2);
|
||||
start+=disp.length;
|
||||
}
|
||||
start=end+1;
|
||||
i++;
|
||||
}
|
||||
$(this).html(raw);
|
||||
});
|
||||
|
||||
$('span[class="md auto_select"]').each(function(){
|
||||
let i=1;
|
||||
let options=['A','B','C','D','E','F','G'];
|
||||
$(this).find("ul").each(function(){
|
||||
let type="radio";
|
||||
let ol=$(this).prev("ol");
|
||||
if(ol!=undefined && ol.attr("start")!=undefined) i=ol.attr("start");
|
||||
console.log("id["+i+"]");
|
||||
if($(this).html().indexOf("多选")>0|| (ol!=undefined && ol.html()!=undefined && ol.html().indexOf("multiselect")>0)) type="checkbox";
|
||||
let j=0;
|
||||
$(this).find("li").each(function(){
|
||||
let option=options[j];
|
||||
let disp="<input type=\""+type+"\" name=\""+i+"\" value=\""+option+"\" />"+option+".";
|
||||
$(this).prepend(disp);
|
||||
j++;
|
||||
});
|
||||
i++;
|
||||
});
|
||||
let html=$(this).html();
|
||||
for(;i>0;i--){
|
||||
console.log("searching..."+i);
|
||||
html=html.replace("{{ input("+i+") }}","<input type='text' size=5 name='"+i+"' placeholder='第"+i+"题' ><br>");
|
||||
}
|
||||
html=html.replaceAll("<","<");
|
||||
html=html.replaceAll(">",">");
|
||||
$(this).html(html);
|
||||
});
|
||||
|
||||
// subjective problems from hydroOJ markdown and embeded marks
|
||||
$('span[class="md auto_select"]').each(function(){
|
||||
let i=1;
|
||||
let options=['A','B','C','D','E','F','G'];
|
||||
$(this).find("ul").each(function(){
|
||||
let type="radio";
|
||||
let ol=$(this).prev("ol");
|
||||
if(ol!=undefined && ol.attr("start")!=undefined) i=ol.attr("start");
|
||||
console.log("id["+i+"]");
|
||||
if($(this).html().indexOf("多选")>0|| (ol!=undefined && ol.html()!=undefined && ol.html().indexOf("multiselect")>0)) type="checkbox";
|
||||
let j=0;
|
||||
$(this).find("li").each(function(){
|
||||
let option=options[j];
|
||||
let disp="<input type=\""+type+"\" name=\""+i+"\" value=\""+option+"\" />"+option+".";
|
||||
$(this).prepend(disp);
|
||||
//console.log(options[j]);
|
||||
j++;
|
||||
});
|
||||
i++;
|
||||
});
|
||||
let html=$(this).html();
|
||||
for(;i>0;i--){
|
||||
console.log("searching..."+i);
|
||||
html=html.replace("{{ input("+i+") }}","<input type='text' size=5 name='"+i+"' placeholder='第"+i+"题' ><br>");
|
||||
}
|
||||
html=html.replaceAll("<","<");
|
||||
html=html.replaceAll(">",">");
|
||||
$(this).html(html);
|
||||
$(".auto_select").find('input[type="text"]').change(function(){
|
||||
selectOne($(this).attr("name"),$(this).val());
|
||||
});
|
||||
|
||||
$('input[type="radio"]').click(function(){
|
||||
if ($(this).is(':checked'))
|
||||
selectOne($(this).attr("name"),$(this).val());
|
||||
}).css("width","24px").css("height","21px");
|
||||
$('input[type="checkbox"]').click(function(){
|
||||
let num=$(this).attr("name");
|
||||
let answer="";
|
||||
$("input[type=checkbox][name="+num+"]").each(function(){
|
||||
if ($(this).is(':checked'))
|
||||
answer+=$(this).val();
|
||||
});
|
||||
selectMulti(num,answer);
|
||||
}).css("width","24px").css("height","21px");
|
||||
<?php if ($row['spj']>1 || isset($_GET['sid']) || (isset($OJ_AUTO_SHOW_OFF)&&$OJ_AUTO_SHOW_OFF)){?>
|
||||
transform();
|
||||
<?php }?>
|
||||
}
|
||||
|
||||
window.renderProblemMarkdown = renderProblemMarkdown;
|
||||
|
||||
$(".auto_select").find('input[type="text"]').change(function(){
|
||||
selectOne($(this).attr("name"),$(this).val());
|
||||
});
|
||||
|
||||
|
||||
$('input[type="radio"]').click(function(){
|
||||
if ($(this).is(':checked'))
|
||||
selectOne($(this).attr("name"),$(this).val());
|
||||
}).css("width","24px").css("height","21px");
|
||||
$('input[type="checkbox"]').click(function(){
|
||||
let num=$(this).attr("name");
|
||||
let answer="";
|
||||
$("input[type=checkbox][name="+num+"]").each(function(){
|
||||
if ($(this).is(':checked'))
|
||||
answer+=$(this).val();
|
||||
});
|
||||
selectMulti(num,answer);
|
||||
}).css("width","24px").css("height","21px");
|
||||
<?php if ($row['spj']>1 || isset($_GET['sid']) || (isset($OJ_AUTO_SHOW_OFF)&&$OJ_AUTO_SHOW_OFF)){?>
|
||||
transform();
|
||||
<?php }?>
|
||||
renderProblemMarkdown().catch(function (error) {
|
||||
console.error('Failed to render problem markdown.', error);
|
||||
}).then(function () {
|
||||
initializeProblemChoices();
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user