Adding syntax highlights
This commit is contained in:
parent
4fbbc73527
commit
3a0af4ace2
19
app.js
19
app.js
@ -162,6 +162,11 @@ async function initialize() {
|
||||
swarm.on('close', () => {
|
||||
console.log('Swarm closed');
|
||||
});
|
||||
|
||||
// Initialize highlight.js once the DOM is fully loaded
|
||||
document.addEventListener("DOMContentLoaded", (event) => {
|
||||
hljs.highlightAll();
|
||||
});
|
||||
}
|
||||
|
||||
function registerUser(e) {
|
||||
@ -408,7 +413,17 @@ function onMessageAdded(from, message, avatar) {
|
||||
const $text = document.createElement('div');
|
||||
$text.classList.add('message-text');
|
||||
|
||||
const md = window.markdownit();
|
||||
const md = window.markdownit({
|
||||
highlight: function (str, lang) {
|
||||
if (lang && hljs.getLanguage(lang)) {
|
||||
try {
|
||||
return hljs.highlight(str, { language: lang }).value;
|
||||
} catch (__) {}
|
||||
}
|
||||
return ''; // use external default escaping
|
||||
}
|
||||
});
|
||||
|
||||
const markdownContent = md.render(message);
|
||||
$text.innerHTML = markdownContent;
|
||||
|
||||
@ -462,4 +477,4 @@ function updatePortInUrl(url) {
|
||||
return urlObject.toString();
|
||||
}
|
||||
|
||||
initialize();
|
||||
initialize();
|
||||
|
@ -7,6 +7,8 @@
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<script type="module" src="./app.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/atom-one-dark.min.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
|
Loading…
Reference in New Issue
Block a user