Skip to content

Commit 002d22f

Browse files
pepc84pepc84
committed
add cppmode syntax highlighting to examples pages
1 parent d4b8eeb commit 002d22f

162 files changed

Lines changed: 1295 additions & 1128 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎examples/acceleration-with-vectors.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -119,7 +116,7 @@ <h1>Acceleration With Vectors</h1>
119116
120117
mover.update();
121118
mover.display();
122-
</body></html>`);doc.close();})();</script>
119+
}<\/script></body></html>`);doc.close();})();</script>
123120
<div class="code-block">
124121
<div class="code-header">
125122
<span>acceleration-with-vectors.pde</span>
@@ -176,6 +173,10 @@ <h1>Acceleration With Vectors</h1>
176173
sec.style.display = open ? 'none' : 'block';
177174
arrow.textContent = open ? '▸' : '▾';
178175
}</script>
176+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
177+
<script src="../assets/cppmode-keywords.js"></script>
178+
<script src="../assets/cm-cppmode.js"></script>
179+
<script src="../assets/code-highlight.js"></script>
179180
<script src="../assets/nav.js"></script>
180181
</body>
181182
</html>

‎examples/additive-wave.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -147,7 +144,7 @@ <h1>Additive Wave</h1>
147144
148145
calcWave();
149146
renderWave();
150-
</body></html>`);doc.close();})();</script>
147+
}<\/script></body></html>`);doc.close();})();</script>
151148
<div class="code-block">
152149
<div class="code-header">
153150
<span>additive-wave.pde</span>
@@ -237,6 +234,10 @@ <h1>Additive Wave</h1>
237234
sec.style.display = open ? 'none' : 'block';
238235
arrow.textContent = open ? '▸' : '▾';
239236
}</script>
237+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
238+
<script src="../assets/cppmode-keywords.js"></script>
239+
<script src="../assets/cm-cppmode.js"></script>
240+
<script src="../assets/code-highlight.js"></script>
240241
<script src="../assets/nav.js"></script>
241242
</body>
242243
</html>

‎examples/alpha-mask.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -94,7 +91,7 @@ <h1>Alpha Mask</h1>
9491
image(img, width / 2, height / 2);
9592
image(img, mouseX, mouseY);
9693
}
97-
</body></html>`);doc.close();})();</script>
94+
}<\/script></body></html>`);doc.close();})();</script>
9895
<div class="code-block">
9996
<div class="code-header">
10097
<span>alpha-mask.pde</span>
@@ -154,6 +151,10 @@ <h1>Alpha Mask</h1>
154151
sec.style.display = open ? 'none' : 'block';
155152
arrow.textContent = open ? '▸' : '▾';
156153
}</script>
154+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
155+
<script src="../assets/cppmode-keywords.js"></script>
156+
<script src="../assets/cm-cppmode.js"></script>
157+
<script src="../assets/code-highlight.js"></script>
157158
<script src="../assets/nav.js"></script>
158159
</body>
159160
</html>

‎examples/animated-sprite.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -122,7 +119,7 @@ <h1>Animated Sprite</h1>
122119
if (img) return img.width;
123120
return 0;
124121
}
125-
</body></html>`);doc.close();})();</script>
122+
}<\/script></body></html>`);doc.close();})();</script>
126123
<div class="code-block">
127124
<div class="code-header">
128125
<span>animated-sprite.pde</span>
@@ -208,6 +205,10 @@ <h1>Animated Sprite</h1>
208205
sec.style.display = open ? 'none' : 'block';
209206
arrow.textContent = open ? '▸' : '▾';
210207
}</script>
208+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
209+
<script src="../assets/cppmode-keywords.js"></script>
210+
<script src="../assets/cm-cppmode.js"></script>
211+
<script src="../assets/code-highlight.js"></script>
211212
<script src="../assets/nav.js"></script>
212213
</body>
213214
</html>

‎examples/arctangent.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -127,7 +124,7 @@ <h1>Arctangent</h1>
127124
128125
e3.update(mouseX, mouseY);
129126
e3.display();
130-
</body></html>`);doc.close();})();</script>
127+
}<\/script></body></html>`);doc.close();})();</script>
131128
<div class="code-block">
132129
<div class="code-header">
133130
<span>arctangent.pde</span>
@@ -203,6 +200,10 @@ <h1>Arctangent</h1>
203200
sec.style.display = open ? 'none' : 'block';
204201
arrow.textContent = open ? '▸' : '▾';
205202
}</script>
203+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
204+
<script src="../assets/cppmode-keywords.js"></script>
205+
<script src="../assets/cm-cppmode.js"></script>
206+
<script src="../assets/code-highlight.js"></script>
206207
<script src="../assets/nav.js"></script>
207208
</body>
208209
</html>

‎examples/arm.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -104,7 +101,7 @@ <h1>Arm</h1>
104101
translate(x, y);
105102
rotate(a);
106103
line(0, 0, segLength, 0);
107-
</body></html>`);doc.close();})();</script>
104+
}<\/script></body></html>`);doc.close();})();</script>
108105
<div class="code-block">
109106
<div class="code-header">
110107
<span>arm.pde</span>
@@ -177,6 +174,10 @@ <h1>Arm</h1>
177174
sec.style.display = open ? 'none' : 'block';
178175
arrow.textContent = open ? '▸' : '▾';
179176
}</script>
177+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
178+
<script src="../assets/cppmode-keywords.js"></script>
179+
<script src="../assets/cm-cppmode.js"></script>
180+
<script src="../assets/code-highlight.js"></script>
180181
<script src="../assets/nav.js"></script>
181182
</body>
182183
</html>

‎examples/array-2d.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -103,7 +100,7 @@ <h1>Array 2D</h1>
103100
point(x + spacer / 2, y + spacer / 2);
104101
}
105102
}
106-
</body></html>`);doc.close();})();</script>
103+
}<\/script></body></html>`);doc.close();})();</script>
107104
<div class="code-block">
108105
<div class="code-header">
109106
<span>array-2d.pde</span>
@@ -172,6 +169,10 @@ <h1>Array 2D</h1>
172169
sec.style.display = open ? 'none' : 'block';
173170
arrow.textContent = open ? '▸' : '▾';
174171
}</script>
172+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
173+
<script src="../assets/cppmode-keywords.js"></script>
174+
<script src="../assets/cm-cppmode.js"></script>
175+
<script src="../assets/code-highlight.js"></script>
175176
<script src="../assets/nav.js"></script>
176177
</body>
177178
</html>

‎examples/array-objects.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -143,7 +140,7 @@ <h1>Array Objects</h1>
143140
mods[i].update();
144141
mods[i].display();
145142
}
146-
</body></html>`);doc.close();})();</script>
143+
}<\/script></body></html>`);doc.close();})();</script>
147144
<div class="code-block">
148145
<div class="code-header">
149146
<span>array-objects.pde</span>
@@ -239,6 +236,10 @@ <h1>Array Objects</h1>
239236
sec.style.display = open ? 'none' : 'block';
240237
arrow.textContent = open ? '▸' : '▾';
241238
}</script>
239+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
240+
<script src="../assets/cppmode-keywords.js"></script>
241+
<script src="../assets/cm-cppmode.js"></script>
242+
<script src="../assets/code-highlight.js"></script>
242243
<script src="../assets/nav.js"></script>
243244
</body>
244245
</html>

‎examples/array.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
pre { padding: 1.5rem; font-family: "SF Mono","Fira Code",monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
3737
.welcome h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
3838
.welcome p { color: #555; line-height: 1.8; max-width: 500px; }
39+
.cm-static-wrap .CodeMirror { height: auto; border-radius: 8px; font-size: 13px; line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem; font-family: "SF Mono","Fira Code",monospace; }
40+
.cm-static-wrap .CodeMirror-scroll { overflow: hidden !important; max-height: none; }
3941
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
4042
.footer-contact { margin-top: 0.4rem; font-size: 12px; }
4143
.footer-contact a { color: #aaa; border-bottom: 1px solid transparent; }
@@ -48,12 +50,7 @@
4850
.content { padding: 2rem 1.25rem; }
4951
.preview-wrap { max-width: 100%; }
5052
pre { font-size: 12px; }
51-
}
52-
height: auto; border-radius: 8px; font-size: 13px;
53-
line-height: 1.6; padding: 0.25rem 0; margin-bottom: 1.25rem;
54-
font-family: "SF Mono","Fira Code",monospace;
55-
}
56-
</style>
53+
}</style>
5754
</head>
5855
<body>
5956
<nav id="site-nav">
@@ -111,7 +108,7 @@ <h1>Array</h1>
111108
stroke(255 - coswave[i] * 255);
112109
line(i, y1, i, y2);
113110
}
114-
</body></html>`);doc.close();})();</script>
111+
}<\/script></body></html>`);doc.close();})();</script>
115112
<div class="code-block">
116113
<div class="code-header">
117114
<span>array.pde</span>
@@ -188,6 +185,10 @@ <h1>Array</h1>
188185
sec.style.display = open ? 'none' : 'block';
189186
arrow.textContent = open ? '▸' : '▾';
190187
}</script>
188+
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.16/codemirror.min.js"></script>
189+
<script src="../assets/cppmode-keywords.js"></script>
190+
<script src="../assets/cm-cppmode.js"></script>
191+
<script src="../assets/code-highlight.js"></script>
191192
<script src="../assets/nav.js"></script>
192193
</body>
193194
</html>

0 commit comments

Comments
 (0)