ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2025-02-20 01:06:14 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed syntax coloring

Browse Source
This commit is contained in:
saloui 2023-06-30 15:23:49 +02:00
parent 8046c45284
commit c861702225
5 changed files with 199 additions and 154 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
c_webui.sh
View File

@ -98,6 +98,8 @@ if ping -q -c 1 google.com >/dev/null 2>&1; then
# Install the required packages
echo "Installing requirements..."
conda install -c gcc
conda install -c conda-forge cudatoolkit-dev
pip install --upgrade pip setuptools wheel
pip install -r requirements.txt

140
web/dist/assets/index-2d3d79cc.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

145
web/dist/assets/index-580d32c6.js vendored
View File

File diff suppressed because one or more lines are too long

2
web/dist/index.html vendored
View File

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LoLLMS WebUI - Welcome</title>
<script type="module" crossorigin src="/assets/index-580d32c6.js"></script>
<script type="module" crossorigin src="/assets/index-2d3d79cc.js"></script>
<link rel="stylesheet" href="/assets/index-c49276e4.css">
</head>
<body>

64
web/src/components/MarkdownRenderer.vue
View File

@ -10,6 +10,32 @@ import feather from 'feather-icons';
import MarkdownIt from 'markdown-it';
import emoji from 'markdown-it-emoji';
import hljs from 'highlight.js/lib/core';
import 'highlight.js/styles/tomorrow-night-blue.css';
import 'highlight.js/styles/tokyo-night-dark.css';
// Import individual language modules
import javascript from 'highlight.js/lib/languages/javascript';
import xml from 'highlight.js/lib/languages/xml';
import css from 'highlight.js/lib/languages/css';
import python from 'highlight.js/lib/languages/python';
import java from 'highlight.js/lib/languages/java';
import csharp from 'highlight.js/lib/languages/csharp';
import cpp from 'highlight.js/lib/languages/cpp';
import ruby from 'highlight.js/lib/languages/ruby';
import php from 'highlight.js/lib/languages/php';
import swift from 'highlight.js/lib/languages/swift';
import go from 'highlight.js/lib/languages/go';
import rust from 'highlight.js/lib/languages/rust';
import typescript from 'highlight.js/lib/languages/typescript';
import shell from 'highlight.js/lib/languages/shell';
import markdown from 'highlight.js/lib/languages/markdown';
import json from 'highlight.js/lib/languages/json';
import yaml from 'highlight.js/lib/languages/yaml';
import sql from 'highlight.js/lib/languages/sql';
// ... import other language modules
import 'highlight.js/styles/tomorrow-night-blue.css';
import 'highlight.js/styles/tokyo-night-dark.css';
import attrs from 'markdown-it-attrs';
@ -27,6 +53,7 @@ const markdownIt = new MarkdownIt('commonmark', {
linkify: true,
typographer: true,
highlight: (str, lang) => {
let id = generateUniqueId();
if (lang && hljs.getLanguage(lang)) {
try {
const highlightedCode = hljs.highlight(lang, str).value;
@ -34,7 +61,9 @@ const markdownIt = new MarkdownIt('commonmark', {
'<div class="bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel p-2 rounded-lg shadow-sm">' +
lang +
'<button class="px-2 py-1 ml-10 mb-2 text-left p-2 text-sm font-medium bg-bg-dark-tone-panel dark:bg-bg-dark-tone rounded-lg hover:bg-primary dark:hover:bg-primary text-white text-xs transition-colors duration-200">' +
'<span class="mr-1" id="copy-btn" onclick="copyContentToClipboard(' +
'<span class="mr-1" id="copy-btn_' +
id +
'" onclick="copyContentToClipboard(' +
id +
')">Copy</span>' +
'<span class="hidden text-xs text-green-500" id="copyed-btn_' +
@ -56,7 +85,6 @@ const markdownIt = new MarkdownIt('commonmark', {
console.error(`Syntax highlighting failed for language '${lang}':`, error);
}
}
let id = generateUniqueId();
let codeString =
'<div class="bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel p-2 rounded-lg shadow-sm">' +
lang +
@ -85,6 +113,31 @@ const markdownIt = new MarkdownIt('commonmark', {
bulletListMarker: '•',
}).use(emoji).use(attrs); // Add attrs plugin for adding attributes to elements
// Register all language modules
hljs.registerLanguage('javascript', javascript);
hljs.registerLanguage('xml', xml);
hljs.registerLanguage('css', css);
hljs.registerLanguage('python', python);
hljs.registerLanguage('java', java);
hljs.registerLanguage('csharp', csharp);
hljs.registerLanguage('cpp', cpp);
hljs.registerLanguage('ruby', ruby);
hljs.registerLanguage('php', php);
hljs.registerLanguage('swift', swift);
hljs.registerLanguage('go', go);
hljs.registerLanguage('rust', rust);
hljs.registerLanguage('typescript', typescript);
hljs.registerLanguage('shell', shell);
hljs.registerLanguage('markdown', markdown);
hljs.registerLanguage('json', json);
hljs.registerLanguage('yaml', yaml);
hljs.registerLanguage('sql', sql);
// ... register other languages
hljs.configure({ languages: [] }); // Reset languages
hljs.configure({ languages: ['javascript'] }); // Set JavaScript as the default language
markdownIt.renderer.rules.link_open = (tokens, idx, options, env, self) => {
const token = tokens[idx];
const hrefIndex = token.attrIndex('href');
@ -96,6 +149,7 @@ markdownIt.renderer.rules.link_open = (tokens, idx, options, env, self) => {
return self.renderToken(tokens, idx, options);
};
// Define a custom rendering function for lists
const renderList = (tokens, idx, options, env, self) => {
const token = tokens[idx];
@ -157,12 +211,6 @@ export default {
window.getSelection().addRange(range);
document.execCommand('copy');
window.getSelection().removeAllRanges();
this.isCopied = true;
setTimeout(() => {
this.isCopied = false;
}, 1500);
}
`;
script.async = true; // Set to true if the script should be loaded asynchronously