Skip to content

Commit fc383a1

Browse files
austinvhuangaustinvhuang
committed
update fasthtml version, wip gpu puzzles site
1 parent 47542f8 commit fc383a1

File tree

6 files changed

+284
-168
lines changed

6 files changed

+284
-168
lines changed

‎experimental/fasthtml/gpu_puzzles/client.js‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -91,13 +91,3 @@ function customPrint(text) {
9191
console.warn("Terminal not initialized");
9292
}
9393
}
94-
95-
function updateEditor(delta) {
96-
if (delta.action === 'insert' && (delta.lines[0] === '.' || delta.lines[0] === ' ')) {
97-
showCompletionSuggestion();
98-
}
99-
100-
if (!AppState.isModuleReady) {
101-
console.log("Module not ready, waiting...");
102-
return;
103-
}

‎experimental/fasthtml/gpu_puzzles/code_editor.js‎

Lines changed: 107 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -1,126 +1,128 @@
1-
21
let editor;
32
let completionTippy;
4-
let currentCompletion = '';
3+
let currentCompletion = "";
54

65
function updateEditor(delta) {
7-
if (delta.action === 'insert' && (delta.lines[0] === '.' || delta.lines[0] === ' ')) {
8-
showCompletionSuggestion();
9-
}
6+
if (
7+
delta.action === "insert" &&
8+
(delta.lines[0] === "." || delta.lines[0] === " ")
9+
) {
10+
showCompletionSuggestion();
11+
}
1012

11-
// Recover from errors TODO(avh): only do this if there's an error
12-
createModule().then((Module) => {
13-
// Keep your existing Module setup
14-
Module.print = window.customPrint;
15-
Module.printErr = window.customPrint;
16-
window.Module = Module;
17-
console.log("updateEditor() - Module ready");
18-
});
13+
// Recover from errors TODO(avh): only do this if there's an error
14+
createModule().then((Module) => {
15+
// Keep your existing Module setup
16+
Module.print = window.customPrint;
17+
Module.printErr = window.customPrint;
18+
window.Module = Module;
19+
console.log("updateEditor() - Module ready");
20+
});
1921

20-
if (window.Module && window.Module.executeKernel) {
21-
console.log("Executing kernel");
22-
window.terminal.clear();
23-
window.Module.executeKernel(editor.getValue());
24-
} else {
25-
console.log("updateEditor() - Module not ready");
26-
}
22+
if (window.Module && window.Module.executeKernel) {
23+
console.log("Executing kernel");
24+
window.terminal.clear();
25+
const wgSize = [256, 1, 1];
26+
const gridSize = [256, 1, 1];
27+
window.Module.executeKernel(editor.getValue(), wgSize, gridSize);
28+
} else {
29+
console.log("updateEditor() - Module not ready");
30+
}
2731
}
2832

2933
function initEditor(initial_content) {
30-
editor = ace.edit("editor");
31-
editor.setTheme("ace/theme/monokai");
32-
editor.session.setMode("ace/mode/javascript");
33-
editor.setOptions({
34-
fontSize: "14px",
35-
showPrintMargin: false,
36-
// disable showing errors in gutter, Ace's WGSL parser is out of date
37-
showGutter: false,
38-
highlightActiveLine: true,
39-
wrap: true,
40-
});
41-
editor.setKeyboardHandler("ace/keyboard/vim");
42-
editor.setValue(initial_content);
43-
window.addEventListener('resize', function() {
44-
editor.resize();
45-
});
46-
// document.getElementById('language').addEventListener('change', function(e) {
47-
// let mode = "ace/mode/" + e.target.value;
48-
// editor.session.setMode(mode);
49-
// });
34+
editor = ace.edit("editor");
35+
editor.setTheme("ace/theme/monokai");
36+
editor.session.setMode("ace/mode/javascript");
37+
editor.setOptions({
38+
fontSize: "16px",
39+
showPrintMargin: false, // disable showing errors in gutter, Ace's WGSL parser is out of date
40+
showGutter: false,
41+
highlightActiveLine: true,
42+
wrap: true,
43+
});
44+
editor.setKeyboardHandler("ace/keyboard/vim");
45+
editor.setValue(initial_content);
46+
window.addEventListener("resize", function () {
47+
editor.resize();
48+
});
5049

51-
editor.session.on('change', updateEditor);
50+
editor.session.on("change", updateEditor);
5251

53-
completionTippy = tippy(document.getElementById('editor'), {
54-
content: 'Loading...',
55-
trigger: 'manual',
56-
placement: 'top-start',
57-
arrow: true,
58-
interactive: true
59-
});
52+
completionTippy = tippy(document.getElementById("editor"), {
53+
content: "Loading...",
54+
trigger: "manual",
55+
placement: "top-start",
56+
arrow: true,
57+
interactive: true,
58+
});
6059

61-
// Override the default tab behavior
62-
editor.commands.addCommand({
63-
name: 'insertCompletion',
64-
bindKey: {win: 'Tab', mac: 'Tab'},
65-
exec: function(editor) {
66-
if (currentCompletion) {
67-
editor.insert(currentCompletion);
68-
currentCompletion = '';
69-
completionTippy.hide();
70-
} else {
71-
editor.indent();
72-
}
73-
}
74-
});
60+
// Override the default tab behavior
61+
editor.commands.addCommand({
62+
name: "insertCompletion",
63+
bindKey: { win: "Tab", mac: "Tab" },
64+
exec: function (editor) {
65+
if (currentCompletion) {
66+
editor.insert(currentCompletion);
67+
currentCompletion = "";
68+
completionTippy.hide();
69+
} else {
70+
editor.indent();
71+
}
72+
},
73+
});
7574
}
7675

7776
async function showCompletionSuggestion() {
78-
const cursorPosition = editor.getCursorPosition();
79-
const screenPosition = editor.renderer.textToScreenCoordinates(cursorPosition.row, cursorPosition.column);
77+
const cursorPosition = editor.getCursorPosition();
78+
const screenPosition = editor.renderer.textToScreenCoordinates(
79+
cursorPosition.row,
80+
cursorPosition.column,
81+
);
82+
83+
completionTippy.setContent("Loading...");
84+
completionTippy.setProps({
85+
getReferenceClientRect: () => ({
86+
width: 0,
87+
height: 0,
88+
top: screenPosition.pageY,
89+
bottom: screenPosition.pageY,
90+
left: screenPosition.pageX,
91+
right: screenPosition.pageX,
92+
}),
93+
});
94+
completionTippy.show();
8095

81-
completionTippy.setContent('Loading...');
82-
completionTippy.setProps({
83-
getReferenceClientRect: () => ({
84-
width: 0,
85-
height: 0,
86-
top: screenPosition.pageY,
87-
bottom: screenPosition.pageY,
88-
left: screenPosition.pageX,
89-
right: screenPosition.pageX,
90-
})
96+
try {
97+
const response = await fetch("/complete", {
98+
method: "POST",
99+
headers: {
100+
"Content-Type": "application/json",
101+
},
102+
body: JSON.stringify({
103+
code: editor.getValue(),
104+
row: cursorPosition.row,
105+
column: cursorPosition.column,
106+
}),
91107
});
92-
completionTippy.show();
93108

94-
try {
95-
const response = await fetch('/complete', {
96-
method: 'POST',
97-
headers: {
98-
'Content-Type': 'application/json',
99-
},
100-
body: JSON.stringify({
101-
code: editor.getValue(),
102-
row: cursorPosition.row,
103-
column: cursorPosition.column
104-
}),
105-
});
106-
107-
if (!response.ok) {
108-
throw new Error(`HTTP error! status: ${response.status}`);
109-
}
110-
111-
const data = await response.json();
112-
currentCompletion = data.completion;
113-
completionTippy.setContent(`${currentCompletion} (Press Tab to insert)`);
114-
} catch (error) {
115-
console.error('Error:', error);
116-
completionTippy.setContent('Error fetching completion');
117-
currentCompletion = '';
109+
if (!response.ok) {
110+
throw new Error(`HTTP error! status: ${response.status}`);
118111
}
119112

120-
setTimeout(() => {
121-
if (currentCompletion) {
122-
completionTippy.hide();
123-
currentCompletion = '';
124-
}
125-
}, 5000);
113+
const data = await response.json();
114+
currentCompletion = data.completion;
115+
completionTippy.setContent(`${currentCompletion} (Press Tab to insert)`);
116+
} catch (error) {
117+
console.error("Error:", error);
118+
completionTippy.setContent("Error fetching completion");
119+
currentCompletion = "";
120+
}
121+
122+
setTimeout(() => {
123+
if (currentCompletion) {
124+
completionTippy.hide();
125+
currentCompletion = "";
126+
}
127+
}, 5000);
126128
}

‎experimental/fasthtml/gpu_puzzles/run.cpp‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
#include <future>
66
#include <memory>
77
#include <string>
8+
#include <vector>
89

910
using namespace gpu;
1011

@@ -75,14 +76,26 @@ bool runCheck(const char *kernelCode, const Shape &wgSize,
7576
#ifndef STANDALONE_WASM
7677
#include "emscripten/bind.h"
7778
EMSCRIPTEN_BINDINGS(module) {
79+
80+
emscripten::value_array<std::array<size_t, 3>>("ArrayST")
81+
.element(emscripten::index<0>())
82+
.element(emscripten::index<1>())
83+
.element(emscripten::index<2>());
84+
emscripten::register_vector<std::vector<float>>("VectorFloat");
85+
emscripten::register_vector<std::vector<int>>("VectorInt");
86+
7887
emscripten::function(
7988
"executeKernel",
8089
emscripten::optional_override([](const std::string &kernelCode,
8190
const std::array<size_t, 3>& wgSize,
8291
const std::array<size_t, 3>& nWorkgroups) {
8392
runCheck(kernelCode.c_str(),
84-
Shape{wgSize[0], wgSize[1], wgSize[2]},
85-
Shape{nWorkgroups[0], nWorkgroups[1], nWorkgroups[2]});
93+
Shape{static_cast<size_t>(wgSize[0]),
94+
static_cast<size_t>(wgSize[1]),
95+
static_cast<size_t>(wgSize[2])},
96+
Shape{static_cast<size_t>(nWorkgroups[0]),
97+
static_cast<size_t>(nWorkgroups[1]),
98+
static_cast<size_t>(nWorkgroups[2])});
8699
}));
87100
emscripten::function("checkAnswer", &checkAnswer);
88101
}

0 commit comments

Comments
 (0)