Site Notice
hello, world
Difference between revisions of "MediaWiki:Gadget-Highlight.js"
From Project-EPB Commons
([InPageEdit] 没有编辑摘要) |
([InPageEdit] 没有编辑摘要) |
||
| Line 1: | Line 1: | ||
| − | /** highlight.js **/ | + | /** |
| + | * @name highlight.js | ||
| + | * @description 为页面内的代码块提供语法高亮 | ||
| + | */ | ||
!(function () { | !(function () { | ||
| + | |||
| + | // 为代码页面添加class | ||
var pageName = mw.config.get('wgPageName') | var pageName = mw.config.get('wgPageName') | ||
if (pageName.substr(pageName.length - 3, 3) === '.js') { | if (pageName.substr(pageName.length - 3, 3) === '.js') { | ||
| Line 9: | Line 14: | ||
$('#mw-content-text pre').addClass('lang-lua hightlight linenums') | $('#mw-content-text pre').addClass('lang-lua hightlight linenums') | ||
} | } | ||
| + | |||
| + | // 加载主题 | ||
| + | mw.loader.load('https://cdn.jsdelivr.net/npm/[email protected]/styles/solarized-light.css', 'text/css') | ||
| + | |||
| + | // 加载脚本 | ||
$.ajax({ | $.ajax({ | ||
url: 'https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/highlight.min.js', | url: 'https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/highlight.min.js', | ||
| Line 14: | Line 24: | ||
cache: true | cache: true | ||
}).then(function () { | }).then(function () { | ||
| − | $('#mw-content-text .hightlight').each(function (_, | + | |
| − | hljs.highlightBlock( | + | // 初始化高亮 |
| − | if ($ | + | $('#mw-content-text pre.hightlight, #mw-content-text pre.hljs').each(function (_, block) { |
| − | $ | + | hljs.highlightBlock(block) |
| − | var | + | |
| − | + | // 添加行号 | |
| − | var $ | + | var $block = $(block) |
| − | + | if ($block.hasClass('linenums')) { | |
| − | + | $block.html(function () { | |
| − | + | var splitHtml = $(this).html().split('\n') | |
| − | + | var $html = $('<div>', { class: 'line-container' }).append( | |
| − | + | $('<div>', { class: 'line-content' }), | |
| − | + | $('<div>', { class: 'line-numbers' }) | |
| + | ) | ||
| + | $.each(splitHtml, function (lineNum, lineContent) { | ||
| + | lineNum = lineNum + 1 | ||
| + | $html.find('.line-content').append( | ||
| + | $('<div>', { class: 'line-row', html: lineContent }) | ||
| + | ) | ||
| + | $html.find('.line-numbers').append( | ||
| + | $('<div>', { class: 'line-number-block', text: lineNum }) | ||
) | ) | ||
}) | }) | ||
| − | return $ | + | return $html |
}) | }) | ||
} | } | ||
| + | |||
}) | }) | ||
}) | }) | ||
| − | |||
})() | })() | ||
Revision as of 20:18, 29 October 2020
/**
* @name highlight.js
* @description 为页面内的代码块提供语法高亮
*/
!(function () {
// 为代码页面添加class
var pageName = mw.config.get('wgPageName')
if (pageName.substr(pageName.length - 3, 3) === '.js') {
$('#mw-content-text pre').addClass('lang-js hightlight linenums')
} else if (pageName.substr(pageName.length - 4, 4) === '.css') {
$('#mw-content-text pre').addClass('lang-css hightlight linenums')
} else if (mw.config.get('wgNamespaceNumber') === 828) {
$('#mw-content-text pre').addClass('lang-lua hightlight linenums')
}
// 加载主题
mw.loader.load('https://cdn.jsdelivr.net/npm/[email protected]/styles/solarized-light.css', 'text/css')
// 加载脚本
$.ajax({
url: 'https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/highlight.min.js',
dataType: 'script',
cache: true
}).then(function () {
// 初始化高亮
$('#mw-content-text pre.hightlight, #mw-content-text pre.hljs').each(function (_, block) {
hljs.highlightBlock(block)
// 添加行号
var $block = $(block)
if ($block.hasClass('linenums')) {
$block.html(function () {
var splitHtml = $(this).html().split('\n')
var $html = $('<div>', { class: 'line-container' }).append(
$('<div>', { class: 'line-content' }),
$('<div>', { class: 'line-numbers' })
)
$.each(splitHtml, function (lineNum, lineContent) {
lineNum = lineNum + 1
$html.find('.line-content').append(
$('<div>', { class: 'line-row', html: lineContent })
)
$html.find('.line-numbers').append(
$('<div>', { class: 'line-number-block', text: lineNum })
)
})
return $html
})
}
})
})
})()
