Skip to content

Commit 26f9ee2

Browse files
phtournierphtournier
committed
can now search and view markdown examples
1 parent 74139bc commit 26f9ee2

File tree

10 files changed

+9631
-14878
lines changed

10 files changed

+9631
-14878
lines changed

‎source/_static/css/examples.css

+77
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,70 @@
1111
background-color: yellow;
1212
}
1313

14+
#ExampleLinkToGitHub {
15+
display: inline-block;
16+
width:100%;
17+
}
18+
19+
#checkbox-markdown-toggle {
20+
margin-right: 2em;
21+
}
22+
23+
#checkbox-markdown-toggle i {
24+
color: rgba(0.75, 0.75, 0.75, 0.1);
25+
transition: color .25s, opacity .25s;
26+
}
27+
28+
#checkbox-markdown-toggle:hover i {
29+
color: rgba(0,0,0,.54);
30+
}
31+
32+
.button-strip {
33+
margin-right: 2em;
34+
width: 100px;
35+
height: 20px;
36+
border: 2px solid #3f51b5;
37+
border-radius: 3px;
38+
display: flex;
39+
}
40+
41+
.button-strip-disabled {
42+
border: 2px solid #9c9c9c;
43+
}
44+
45+
.strip-button {
46+
background-color: white;
47+
color: #3f51b5;
48+
width: 50%;
49+
height: 100%;
50+
text-align: center;
51+
vertical-align: middle;
52+
line-height: 20px;
53+
transition: background-color .4s linear, color .2s linear;
54+
cursor: pointer;
55+
}
56+
.strip-button span {
57+
color: inherit;
58+
}
59+
.strip-button-text {
60+
vertical-align: middle;
61+
font-family: 'Khula', sans-serif;
62+
font-weight: 400;
63+
font-size: 15px;
64+
color: #3f51b5;
65+
margin: 0px;
66+
padding: 0px;
67+
}
68+
.active-strip-button {
69+
background-color: #3f51b5;
70+
color: white;
71+
}
72+
.disabled-strip-button {
73+
background-color: rgb(207, 207, 207);
74+
color: #898989;
75+
pointer-events: none;
76+
}
77+
1478
#exampleCode {
1579
background-color: #efefef;
1680
/* height: 31.25rem; */
@@ -23,6 +87,19 @@
2387

2488
#exampleCode h2 {
2589
margin-left: 1rem;
90+
display: flex;
91+
}
92+
93+
#mdout {
94+
background-color: #ffffff;
95+
/* height: 31.25rem; */
96+
overflow-y: auto;
97+
min-width: 350px;
98+
font-size: 1rem;
99+
}
100+
101+
#mdout img {
102+
width: 100%;
26103
}
27104

28105
#code {

‎source/_static/js/buttonstrip.min.js

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎source/_static/js/examples.js

+86-11
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,10 @@ const searchToggle = document.getElementById('checkbox-search-toggle')
99

1010
let searchExamples = false
1111

12+
let viewMarkdown = true
13+
14+
let iscurrentfilemd = false
15+
1216
toggleExamples = (mode) => {
1317
if (mode) {
1418
subnav.children[1].style.display = 'block'
@@ -42,26 +46,87 @@ toggleExamples = (mode) => {
4246
}
4347

4448
loadExamplefromGitHub = (name, dir, editor) => {
45-
function load(data) {
49+
function loadedp(data) {
50+
iscurrentfilemd = false;
51+
var byClass = document.getElementsByClassName("strip-button");
52+
for (var i = 0; i < byClass.length; i++) {
53+
byClass[i].classList.add("disabled-strip-button");
54+
}
55+
var byClass = document.getElementsByClassName("button-strip");
56+
for (var i = 0; i < byClass.length; i++) {
57+
byClass[i].classList.add("button-strip-disabled");
58+
}
4659
examplecode.style.display = 'flex'
4760
examplewelcome.style.display = 'none'
4861
editor.setValue(data)
4962
highlightKeyword(editor)
63+
showExample(viewMarkdown)
64+
}
65+
66+
function loadmd(data) {
67+
iscurrentfilemd = true;
68+
var byClass = document.getElementsByClassName("strip-button");
69+
for (var i = 0; i < byClass.length; i++) {
70+
byClass[i].classList.remove("disabled-strip-button");
71+
}
72+
var byClass = document.getElementsByClassName("button-strip");
73+
for (var i = 0; i < byClass.length; i++) {
74+
byClass[i].classList.remove("button-strip-disabled");
75+
}
76+
//markdowntoggle.style.display = 'flex'
77+
examplecode.style.display = 'flex'
78+
examplewelcome.style.display = 'none'
79+
var edpcode = ""
80+
data.replace(/(```|~~~)freefem([\s\S]*?)\1/g, (match, p1,p2) => {
81+
edpcode += p2;
82+
return p2;
83+
});
84+
edpcode = edpcode.replace(/^\s/, '')
85+
editor.getWrapperElement().style.display = 'block'
86+
editor.getWrapperElement().style.visibility = 'hidden'
87+
editor.setValue(edpcode)
88+
highlightKeyword(editor)
89+
90+
editor.getWrapperElement().style.display = 'none'
91+
editor.getWrapperElement().style.visibility = 'hidden'
92+
document.getElementById('mdout').innerHTML = md.render(data);
93+
94+
MathJax.Hub.Queue(["Typeset", MathJax.Hub, document.getElementById('mdout')]);
95+
MathJax.Hub.Configured();
96+
showExample(viewMarkdown);
5097
}
5198

52-
const fpath = (dir == 'idp' ? '' : 'examples/') + dir + '/' + name
53-
const url =
54-
'https://raw.githubusercontent.com/FreeFem/FreeFem-sources/master/' + fpath
55-
console.log('load ' + dir + '/' + name + 'from GitHub')
99+
const fpath = (dir == 'idp' ? 'examples/' : 'examples/') + dir + '/' + name
100+
const url = "https://raw.githubusercontent.com/FreeFem/FreeFem-sources/develop/" + fpath
101+
console.log('load ' + dir + '/' + name + ' from GitHub')
56102
document.getElementById('ExampleLinkToGitHub').innerHTML =
57-
"<a href='https://github.com/FreeFem/FreeFem-sources/blob/master/" +
103+
"<a href='https://github.com/FreeFem/FreeFem-sources/blob/develop/" +
58104
fpath +
59105
"' target='_blank'>" +
60106
dir +
61107
'/' +
62108
name +
63109
'</a>'
64-
HTTPGet(url, load)
110+
111+
if (name.endsWith('.edp'))
112+
HTTPGet(url, loadedp)
113+
else
114+
HTTPGet(url, loadmd)
115+
}
116+
117+
showExample = (viewMarkdown) => {
118+
if (viewMarkdown && iscurrentfilemd) {
119+
editor.getWrapperElement().style.display = 'none'
120+
editor.getWrapperElement().style.visibility = 'hidden'
121+
document.getElementById('mdout').style.display = 'block'
122+
document.getElementById('mdout').style.visibility = 'visible'
123+
}
124+
else {
125+
document.getElementById('mdout').style.display = 'none'
126+
document.getElementById('mdout').style.visibility = 'hidden'
127+
editor.getWrapperElement().style.display = 'block'
128+
editor.getWrapperElement().style.visibility = 'visible'
129+
}
65130
}
66131

67132
FilterbyTag = (focus) => {
@@ -203,10 +268,7 @@ let treedata = [
203268
document.addEventListener(
204269
'keydown',
205270
(event) => {
206-
if (event.altKey) {
207-
var name = event.key
208-
var code = event.code
209-
271+
if (event.altKey && event.code == "AltRight") {
210272
searchExamples = !searchExamples
211273
toggleExamples(searchExamples)
212274
if (document.getElementById('search-overlay').style.display != 'none')
@@ -268,3 +330,16 @@ fetch('/_static/json/all_examples.json')
268330
}
269331
})
270332
})
333+
334+
var bs1 = new ButtonStrip({
335+
id: 'buttonStrip1'
336+
});
337+
bs1.addButton('.md', true, 'click', function(){
338+
viewMarkdown = true
339+
showExample(viewMarkdown)
340+
});
341+
bs1.addButton('.edp', false, 'click', function(){
342+
viewMarkdown = false
343+
showExample(viewMarkdown)
344+
});
345+
bs1.append('#markdowntoggle');

‎source/_static/js/markdownit.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
var defaults = {
2+
html: false, // Enable HTML tags in source
3+
xhtmlOut: false, // Use '/' to close single tags (<br />)
4+
breaks: false, // Convert '\n' in paragraphs into <br>
5+
langPrefix: 'language-', // CSS language prefix for fenced blocks
6+
linkify: true, // autoconvert URL-like texts to links
7+
typographer: true, // Enable smartypants and other sweet transforms
8+
_highlight: true,
9+
_strict: false,
10+
_view: 'html' // html / src / debug
11+
};
12+
13+
defaults.highlight = function (str, lang) {
14+
var esc = md.utils.escapeHtml;
15+
try {
16+
var html = "<div class = \"highlight\"><pre class=\"cm-s-default\">";
17+
const outf = function(token, tokenClass) {
18+
html = html + "<span class=\"cm-" + tokenClass + "\">" + token + "</span>"
19+
}
20+
CodeMirror.runMode(str, 'text/x-ff++src',outf);
21+
html = html + "</pre></div>";
22+
return html;
23+
} catch (__) {}
24+
};
25+
26+
var md = window.markdownit(defaults);
27+
md.use(window.markdownitMathjax(), {options :{
28+
beforeMath: '\n',
29+
afterMath: '\n',
30+
beforeInlineMath: '$',
31+
afterInlineMath: '$',
32+
beforeDisplayMath: '$$',
33+
afterDisplayMath: '$$'}
34+
});

‎source/_static/js/mathjax-config.js

+10-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
MathJax.Hub.Config({
2-
jax: ['input/TeX', 'output/CommonHTML'],
2+
extensions: ["tex2jax.js"],
3+
jax: ["input/TeX", "output/HTML-CSS"],
4+
tex2jax: {
5+
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
6+
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
7+
processEscapes: true,
8+
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre']
9+
},
10+
"HTML-CSS": { fonts: ["TeX"] },
11+
312
TeX: {
413
TagSide: 'right',
514
TagIndent: '.8em',

‎source/_static/js/mode/freefem/freefem.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ CodeMirror.defineMode("freefem", function(config, parserConfig) {
7878
var result = hooks[ch](stream, state);
7979
if (result !== false) return result;
8080
}
81-
if (ch == '"' || ch == "'") {
81+
if (ch == '"') {
8282
state.tokenize = tokenString(ch);
8383
return state.tokenize(stream, state);
8484
}

0 commit comments

Comments
 (0)