forked from snxraven/LinkUp-P2P-Chat
Adding syntax highlights
This commit is contained in:
parent
4fbbc73527
commit
3a0af4ace2
17
app.js
17
app.js
@ -162,6 +162,11 @@ async function initialize() {
|
|||||||
swarm.on('close', () => {
|
swarm.on('close', () => {
|
||||||
console.log('Swarm closed');
|
console.log('Swarm closed');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Initialize highlight.js once the DOM is fully loaded
|
||||||
|
document.addEventListener("DOMContentLoaded", (event) => {
|
||||||
|
hljs.highlightAll();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function registerUser(e) {
|
function registerUser(e) {
|
||||||
@ -408,7 +413,17 @@ function onMessageAdded(from, message, avatar) {
|
|||||||
const $text = document.createElement('div');
|
const $text = document.createElement('div');
|
||||||
$text.classList.add('message-text');
|
$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);
|
const markdownContent = md.render(message);
|
||||||
$text.innerHTML = markdownContent;
|
$text.innerHTML = markdownContent;
|
||||||
|
|
||||||
|
@ -7,6 +7,8 @@
|
|||||||
<link rel="stylesheet" type="text/css" href="style.css">
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
<script type="module" src="./app.js"></script>
|
<script type="module" src="./app.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.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>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
|
Loading…
Reference in New Issue
Block a user