不再使用markdown编译html,而是直接markdown源文件,前端进行渲染
This commit is contained in:
1
Html/apps/static/cdnback/js/tex-mml-chtml.js
Normal file
1
Html/apps/static/cdnback/js/tex-mml-chtml.js
Normal file
File diff suppressed because one or more lines are too long
@@ -424,14 +424,12 @@ window.addEventListener('beforeunload', () => {
|
||||
|
||||
let currentChapterIndex = -1;
|
||||
function next_chapter(data) {
|
||||
// 获取所有的 h3 元素
|
||||
var iframe = document.getElementById('markdown-content-iframe');
|
||||
// 直接获取页面中的 h3 元素(不再使用 iframe)
|
||||
var container = document.getElementById('markdown-content-container');
|
||||
var titles = [];
|
||||
var h3Elements = container.querySelectorAll('h3');
|
||||
console.log("h3Elements next");
|
||||
|
||||
// 访问 iframe 的文档对象
|
||||
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
|
||||
var titles = []
|
||||
var h3Elements = iframeDocument.querySelectorAll('h3');
|
||||
console.log("h3Elements next")
|
||||
if (currentChapterIndex >= h3Elements.length) {
|
||||
return; // 如果已经到了最后一个章节,则不进行任何操作
|
||||
}
|
||||
@@ -439,7 +437,7 @@ function next_chapter(data) {
|
||||
// 隐藏当前章节及其后的内容
|
||||
for (let i = 0; i < h3Elements.length; i++) {
|
||||
h3Elements[i].style.display = 'none';
|
||||
titles.push(h3Elements[i].innerText)
|
||||
titles.push(h3Elements[i].innerText);
|
||||
let nextSibling = h3Elements[i].nextElementSibling;
|
||||
while (nextSibling && nextSibling.tagName !== 'H3') {
|
||||
nextSibling.style.display = 'none';
|
||||
|
||||
@@ -235,13 +235,46 @@
|
||||
fetch(`/${course_id}-${chapter_name}-${lesson_name}-markdown`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.html_url) {
|
||||
document.getElementById('markdown-content').innerHTML = `<iframe id="markdown-content-iframe" src="${data.html_url}"style="width: 100%;height: 100%;"></iframe>`;
|
||||
document.getElementById('markdown-content-iframe').addEventListener('load', function() {
|
||||
// 在这里执行你想要的操作
|
||||
console.log('Iframe has finished loading');
|
||||
if (data.markdown_content) {
|
||||
// 使用 marked 解析 Markdown 内容
|
||||
const html = marked.parse(data.markdown_content);
|
||||
|
||||
// 创建包含 MathJax 支持的 HTML 结构
|
||||
const markdownContainer = document.createElement('div');
|
||||
markdownContainer.id = 'markdown-content-container';
|
||||
markdownContainer.innerHTML = html;
|
||||
|
||||
// 清空内容容器并添加渲染后的内容
|
||||
const contentElement = document.getElementById('markdown-content');
|
||||
contentElement.innerHTML = '';
|
||||
contentElement.appendChild(markdownContainer);
|
||||
|
||||
// 配置并加载 MathJax
|
||||
if (typeof MathJax === 'undefined') {
|
||||
// 动态加载 MathJax
|
||||
const script = document.createElement('script');
|
||||
script.src = '/static/cdnback/js/tex-mml-chtml.js';
|
||||
script.async = true;
|
||||
script.onload = function() {
|
||||
MathJax.config = {
|
||||
tex: {
|
||||
inlineMath: [['$', '$'], ['\\(', '\\)']]
|
||||
},
|
||||
svg: {
|
||||
fontCache: 'global'
|
||||
}
|
||||
};
|
||||
MathJax.typesetPromise([markdownContainer]);
|
||||
// 初始化课程进度
|
||||
next_chapter();
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} else {
|
||||
// MathJax 已加载,直接排版
|
||||
MathJax.typesetPromise([markdownContainer]);
|
||||
// 初始化课程进度
|
||||
next_chapter();
|
||||
});
|
||||
}
|
||||
} else {
|
||||
console.error('Markdown file not found');
|
||||
}
|
||||
|
||||
@@ -14,17 +14,8 @@ bp = Blueprint("markdown", __name__)
|
||||
def convert_md(course_id, chapter_name, lesson_name):
|
||||
print(f"convert_md: {course_id}, {chapter_name}, {lesson_name}")
|
||||
md_file = load_markdown_file(course_id, chapter_name, lesson_name)
|
||||
# 配置Markdown解析器,启用数学公式支持
|
||||
md = MarkdownIt()
|
||||
md.use(texmath.texmath_plugin) # 添加数学公式插件
|
||||
# 转换markdown为html(包含公式标记)
|
||||
html = md.render(md_file)
|
||||
# 包装样式时添加MathJax支持,用于在浏览器中渲染公式
|
||||
html_with_styles = wrap_with_styles(html)
|
||||
# 保存HTML文件到static
|
||||
html_output_path = os.path.join(current_app.config["STATIC_DIR"], f"{course_id}-{chapter_name}-{lesson_name}.html")
|
||||
save_html(html_with_styles, html_output_path)
|
||||
return jsonify({"html_url": f"/static/{course_id}-{chapter_name}-{lesson_name}.html"})
|
||||
# 直接返回Markdown源文件内容,不进行服务器端渲染
|
||||
return jsonify({"markdown_content": md_file})
|
||||
|
||||
# 提供静态文件访问
|
||||
@bp.route("/static/<path:filename>")
|
||||
|
||||
Reference in New Issue
Block a user