evilchili/vtt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rename js obj to froghat, add widget plugin

Browse Source
This commit is contained in:
evilchili 2025-12-25 10:42:59 -08:00
parent f21bdbdb0c
commit 27cf36c390
5 changed files with 82 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/ttfrog/themes/default/page.html
View File

@ -4,7 +4,7 @@
{% endblock %}
{% block content %}
<div id='content'>{{ page.body }}</div>
<div id='froghat'>{{ page.body }}</div>
{% endblock %}
@ -13,14 +13,14 @@
<!-- for converting markdown to html -->
<script src="{{ url_for('static', filename='editor/purify.min.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/marked.umd.min.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/grung.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/froghat.js' ) }}"></script>
{% if user.can_write(page) %}
<script src="{{ url_for('static', filename='editor/turndown.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/joplin-turndown-plugin-gfm.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/grung-editor.js' ) }}"></script>
<script src="{{ url_for('static', filename='editor/froghat-editor.js' ) }}"></script>
{% endif %}
<script>
const wiki = new Grung{% if user.can_write(page) %}Editor{% endif %}({plugins: [MacroPlugin]});
const wiki = new Froghat{% if user.can_write(page) %}Editor{% endif %}({plugins: [MacroPlugin, WidgetPlugin]});
wiki.view();
</script>
{% endblock %}

2
src/ttfrog/themes/default/static/editor/grung-editor.js → src/ttfrog/themes/default/static/editor/froghat-editor.js
View File

@ -1,4 +1,4 @@
class GrungEditor extends Grung {
class FroghatEditor extends Froghat {
constructor(settings) {
/*

74
src/ttfrog/themes/default/static/editor/grung.js → src/ttfrog/themes/default/static/editor/froghat.js
View File

@ -1,9 +1,9 @@
class Grung {
class Froghat {
constructor(settings) {
/*
* Create a new Editor instance.
*/
this.element = document.getElementById(settings.editorId || 'content');
this.element = document.getElementById(settings.editorId || 'froghat');
this.source = this.element.textContent;
this.marked = marked;
@ -91,7 +91,7 @@ class Grung {
}
class GrungPlugin {
class FroghatPlugin {
constructor(settings) {
this.name = settings.name;
@ -112,7 +112,73 @@ class GrungPlugin {
};
class MacroPlugin extends GrungPlugin {
class WidgetPlugin extends FroghatPlugin {
setEditable() {
};
toMarkdown(html) {
return html;
};
toHTML(md) {
return md;
};
parseWidgetSource(html) {
function block(prefix) {
return RegExp('##\\s*' + prefix + '.*?```\\w*(.+?)```', 'gims');
};
const template = block("Template").exec(html)[1];
const css = block("CSS").exec(html)[1];
const processor = block("Processor").exec(html)[1];
var func;
eval("func = " + processor);
return {
template: template,
css: css,
processor: func
};
}
async processWidgets(html, callback) {
var widgetPattern = /({{(.+)}})/gm;
if (!html.match(widgetPattern)) {
callback();
return;
}
html.matchAll(widgetPattern).forEach(match => {
var widgetTag = match[1];
var widgetName = match[2];
if (Object.values(WIDGETS).indexOf(widgetName) == -1) {
APIv1.search("Widget", widgetName, (res) => {
if (res.code == 200) {
var parts = parseWidgetSource(res.response[0].body);
WIDGETS[widgetName] = parts.processor;
contents = WIDGETS[widgetName](widgetTag, parts.template, parts.css);
} else {
contents = `Invalid widget: ${widgetName}`;
}
var rep = `<span class="widget-${widgetName}" data-source="${widgetTag}">${contents}</span>`;
html = html.replaceAll(widgetTag, rep);
if (parts) {
html = `<style type='text/css'>${parts.css}</style>${html}`;
}
callback(html);
});
}
});
};
}
class MacroPlugin extends FroghatPlugin {
macros = {
// image: {}

14
src/ttfrog/themes/default/static/site.css
View File

@ -328,27 +328,27 @@ div[data-macro-name="toc"] a:hover {
}
#content {
#froghat {
display: none;
}
#content.loaded {
#froghat.loaded {
display: block;
}
#content.wysiwyg {
#froghat.wysiwyg {
display: none,
}
#content.view {
#froghat.view {
}
#content.edit {
#froghat.edit {
font-family: monospace;
white-space: pre;
}
#content.wysiwyg {
#froghat.wysiwyg {
}
#content.wysiwyg .md {
#froghat.wysiwyg .md {
opacity: 0.5;
}

54
src/ttfrog/themes/default/static/site.js
View File

@ -56,57 +56,3 @@ APIv1 = {
})();
},
};
const WIDGETS = {};
function parseWidgetSource(html) {
function block(prefix) {
return RegExp('##\\s*' + prefix + '.*?```\\w*(.+?)```', 'gims');
};
const template = block("Template").exec(html)[1];
const css = block("CSS").exec(html)[1];
const processor = block("Processor").exec(html)[1];
var func;
eval("func = " + processor);
return {
template: template,
css: css,
processor: func
};
}
async function processWidgets(html, callback) {
var widgetPattern = /({{(.+)}})/gm;
if (!html.match(widgetPattern)) {
callback();
return;
}
html.matchAll(widgetPattern).forEach(match => {
var widgetTag = match[1];
var widgetName = match[2];
if (Object.values(WIDGETS).indexOf(widgetName) == -1) {
APIv1.search("Widget", widgetName, (res) => {
if (res.code == 200) {
var parts = parseWidgetSource(res.response[0].body);
WIDGETS[widgetName] = parts.processor;
contents = WIDGETS[widgetName](widgetTag, parts.template, parts.css);
} else {
contents = `Invalid widget: ${widgetName}`;
}
var rep = `<span class="widget-${widgetName}" data-source="${widgetTag}">${contents}</span>`;
html = html.replaceAll(widgetTag, rep);
if (parts) {
html = `<style type='text/css'>${parts.css}</style>${html}`;
}
callback(html);
});
}
});
};