Pārlūkot izejas kodu

add a simple editor

Lucas Stadler 10 gadi atpakaļ
vecāks
revīzija
6430454e66
1 mainītis faili ar 42 papildinājumiem un 0 dzēšanām
  1. 42 0
      glsl/raymarching.js

+ 42 - 0
glsl/raymarching.js

@ -25,6 +25,10 @@ try {
25 25
    console.error(e);
26 26
  }
27 27
  
28
  function clearError() {
29
    errorEl.textContent = "";
30
  }
31
  
28 32
  function compileShader(gl, type, shaderSrc) {
29 33
    var shader = gl.createShader(type);
30 34
    gl.shaderSource(shader, shaderSrc);
@ -217,6 +221,18 @@ void main() {
217 221
  transition: right 0.1s;
218 222
  right: 0;
219 223
}
224
225
#editor {
226
  position: absolute;
227
  top: 0;
228
  left: 0;
229
230
  border: none;
231
  background-color: rgba(255, 255, 255, 0.5);
232
233
  min-width: 72ex;
234
  height: 100vh;
235
}
220 236
  `
221 237
  document.head.appendChild(styleEl);
222 238
  
@ -305,6 +321,32 @@ void main() {
305 321
  addSliders(sidebarEl, sliders);
306 322
  
307 323
  tt.render();
324
  
325
  var editor = {};
326
  editor.el = document.createElement("textarea");
327
  editor.el.id = "editor";
328
  editor.el.value = fragmentShaderSrc;
329
  document.body.appendChild(editor.el);
330
  
331
  editor.el.onkeydown = function(ev) {
332
    try {
333
      if (ev.ctrlKey && ev.keyCode == 13) {
334
        tt = TwoTriangles(canvas, editor.el.value);
335
336
        sidebarEl.innerHTML = "";
337
        sliders = findSliders(fragmentShaderSrc);
338
        initSliders(tt.gl, tt.program, sliders, function(ev) {
339
          requestAnimationFrame(tt.render);
340
        });
341
        addSliders(sidebarEl, sliders);
342
343
        tt.render();
344
        clearError();
345
      }
346
    } catch (e) {
347
      displayError(e);
348
    }
349
  }
308 350
} catch (e) {
309 351
  displayError(e);
310 352
}