0a5f6a8047
- Go backend (server/)
- Frontend (web/, server/static/)
- Database and deployment files
- Scripts and docs
Co-Authored-By: 狸花猫/Claude-Qwen3.6-Plus 🐾
283 lines
10 KiB
JavaScript
283 lines
10 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.WebGLEngine = void 0;
|
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
var _gWebgpuCore = require("@antv/g-webgpu-core");
|
|
var _regl = _interopRequireDefault(require("regl"));
|
|
var _ReglAttribute = _interopRequireDefault(require("./ReglAttribute"));
|
|
var _ReglBuffer = _interopRequireDefault(require("./ReglBuffer"));
|
|
var _ReglComputeModel = _interopRequireDefault(require("./ReglComputeModel"));
|
|
var _ReglElements = _interopRequireDefault(require("./ReglElements"));
|
|
var _ReglFramebuffer = _interopRequireDefault(require("./ReglFramebuffer"));
|
|
var _ReglModel = _interopRequireDefault(require("./ReglModel"));
|
|
var _ReglTexture2D = _interopRequireDefault(require("./ReglTexture2D"));
|
|
/**
|
|
* render w/ regl
|
|
* @see https://github.com/regl-project/regl/blob/gh-pages/API.md
|
|
*/
|
|
/**
|
|
* regl renderer
|
|
*/
|
|
var WebGLEngine = /*#__PURE__*/function () {
|
|
function WebGLEngine() {
|
|
var _this = this;
|
|
(0, _classCallCheck2.default)(this, WebGLEngine);
|
|
this.supportWebGPU = false;
|
|
this.useWGSL = false;
|
|
this.$canvas = void 0;
|
|
this.gl = void 0;
|
|
this.inited = void 0;
|
|
this.createModel = /*#__PURE__*/function () {
|
|
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(options) {
|
|
return _regenerator.default.wrap(function _callee2$(_context2) {
|
|
while (1) {
|
|
switch (_context2.prev = _context2.next) {
|
|
case 0:
|
|
if (!options.uniforms) {
|
|
_context2.next = 3;
|
|
break;
|
|
}
|
|
_context2.next = 3;
|
|
return Promise.all(Object.keys(options.uniforms).map( /*#__PURE__*/function () {
|
|
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(name) {
|
|
var texture;
|
|
return _regenerator.default.wrap(function _callee$(_context) {
|
|
while (1) {
|
|
switch (_context.prev = _context.next) {
|
|
case 0:
|
|
if (!(options.uniforms[name] &&
|
|
// @ts-ignore
|
|
options.uniforms[name].load !== undefined)) {
|
|
_context.next = 5;
|
|
break;
|
|
}
|
|
_context.next = 3;
|
|
return options.uniforms[name].load();
|
|
case 3:
|
|
texture = _context.sent;
|
|
// @ts-ignore
|
|
options.uniforms[name] = texture;
|
|
case 5:
|
|
case "end":
|
|
return _context.stop();
|
|
}
|
|
}
|
|
}, _callee);
|
|
}));
|
|
return function (_x2) {
|
|
return _ref2.apply(this, arguments);
|
|
};
|
|
}()));
|
|
case 3:
|
|
return _context2.abrupt("return", new _ReglModel.default(_this.gl, options));
|
|
case 4:
|
|
case "end":
|
|
return _context2.stop();
|
|
}
|
|
}
|
|
}, _callee2);
|
|
}));
|
|
return function (_x) {
|
|
return _ref.apply(this, arguments);
|
|
};
|
|
}();
|
|
this.createAttribute = function (options) {
|
|
return new _ReglAttribute.default(_this.gl, options);
|
|
};
|
|
this.createBuffer = function (options) {
|
|
return new _ReglBuffer.default(_this.gl, options);
|
|
};
|
|
this.createElements = function (options) {
|
|
return new _ReglElements.default(_this.gl, options);
|
|
};
|
|
this.createTexture2D = function (options) {
|
|
return new _ReglTexture2D.default(_this.gl, options);
|
|
};
|
|
this.createFramebuffer = function (options) {
|
|
return new _ReglFramebuffer.default(_this.gl, options);
|
|
};
|
|
this.useFramebuffer = function (framebuffer, drawCommands) {
|
|
_this.gl({
|
|
framebuffer: framebuffer ? framebuffer.get() : null
|
|
})(drawCommands);
|
|
};
|
|
this.createComputeModel = /*#__PURE__*/function () {
|
|
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(context) {
|
|
return _regenerator.default.wrap(function _callee3$(_context3) {
|
|
while (1) {
|
|
switch (_context3.prev = _context3.next) {
|
|
case 0:
|
|
return _context3.abrupt("return", new _ReglComputeModel.default(_this.gl, context));
|
|
case 1:
|
|
case "end":
|
|
return _context3.stop();
|
|
}
|
|
}
|
|
}, _callee3);
|
|
}));
|
|
return function (_x3) {
|
|
return _ref3.apply(this, arguments);
|
|
};
|
|
}();
|
|
this.clear = function (options) {
|
|
// @see https://github.com/regl-project/regl/blob/gh-pages/API.md#clear-the-draw-buffer
|
|
var color = options.color,
|
|
depth = options.depth,
|
|
stencil = options.stencil,
|
|
_options$framebuffer = options.framebuffer,
|
|
framebuffer = _options$framebuffer === void 0 ? null : _options$framebuffer;
|
|
var reglClearOptions = {
|
|
color: color,
|
|
depth: depth,
|
|
stencil: stencil
|
|
};
|
|
reglClearOptions.framebuffer = framebuffer === null ? framebuffer : framebuffer.get();
|
|
_this.gl.clear(reglClearOptions);
|
|
};
|
|
this.setScissor = function (scissor) {
|
|
if (_this.gl && _this.gl._gl) {
|
|
// https://developer.mozilla.org/zh-CN/docs/Web/API/WebGLRenderingContext/scissor
|
|
if (scissor.enable && scissor.box) {
|
|
// console.log(scissor.box);
|
|
_this.gl._gl.enable(_gWebgpuCore.gl.SCISSOR_TEST);
|
|
_this.gl._gl.scissor(scissor.box.x, scissor.box.y, scissor.box.width, scissor.box.height);
|
|
} else {
|
|
_this.gl._gl.disable(_gWebgpuCore.gl.SCISSOR_TEST);
|
|
}
|
|
_this.gl._refresh();
|
|
}
|
|
};
|
|
this.viewport = function (_ref4) {
|
|
var x = _ref4.x,
|
|
y = _ref4.y,
|
|
width = _ref4.width,
|
|
height = _ref4.height;
|
|
if (_this.gl && _this.gl._gl) {
|
|
// use WebGL context directly
|
|
// @see https://github.com/regl-project/regl/blob/gh-pages/API.md#unsafe-escape-hatch
|
|
_this.gl._gl.viewport(x, y, width, height);
|
|
_this.gl._refresh();
|
|
}
|
|
};
|
|
this.readPixels = function (options) {
|
|
var framebuffer = options.framebuffer,
|
|
x = options.x,
|
|
y = options.y,
|
|
width = options.width,
|
|
height = options.height;
|
|
var readPixelsOptions = {
|
|
x: x,
|
|
y: y,
|
|
width: width,
|
|
height: height
|
|
};
|
|
if (framebuffer) {
|
|
readPixelsOptions.framebuffer = framebuffer.get();
|
|
}
|
|
return _this.gl.read(readPixelsOptions);
|
|
};
|
|
this.getCanvas = function () {
|
|
return _this.$canvas;
|
|
};
|
|
this.getGLContext = function () {
|
|
return _this.gl._gl;
|
|
};
|
|
this.destroy = function () {
|
|
if (_this.gl) {
|
|
// @see https://github.com/regl-project/regl/blob/gh-pages/API.md#clean-up
|
|
_this.gl.destroy();
|
|
_this.inited = false;
|
|
}
|
|
};
|
|
}
|
|
(0, _createClass2.default)(WebGLEngine, [{
|
|
key: "init",
|
|
value: function () {
|
|
var _init = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(cfg) {
|
|
return _regenerator.default.wrap(function _callee4$(_context4) {
|
|
while (1) {
|
|
switch (_context4.prev = _context4.next) {
|
|
case 0:
|
|
if (!this.inited) {
|
|
_context4.next = 2;
|
|
break;
|
|
}
|
|
return _context4.abrupt("return");
|
|
case 2:
|
|
this.$canvas = cfg.canvas;
|
|
// tslint:disable-next-line:typedef
|
|
_context4.next = 5;
|
|
return new Promise(function (resolve, reject) {
|
|
(0, _regl.default)({
|
|
canvas: cfg.canvas,
|
|
attributes: {
|
|
alpha: true,
|
|
// use TAA instead of MSAA
|
|
// @see https://www.khronos.org/registry/webgl/specs/1.0/#5.2.1
|
|
antialias: cfg.antialias,
|
|
premultipliedAlpha: true
|
|
// preserveDrawingBuffer: false,
|
|
},
|
|
|
|
pixelRatio: 1,
|
|
// TODO: use extensions
|
|
extensions: ['OES_element_index_uint', 'OES_texture_float', 'OES_standard_derivatives',
|
|
// wireframe
|
|
'angle_instanced_arrays' // VSM shadow map
|
|
],
|
|
|
|
optionalExtensions: ['EXT_texture_filter_anisotropic', 'EXT_blend_minmax', 'WEBGL_depth_texture'],
|
|
profile: true,
|
|
onDone: function onDone(err, r) {
|
|
if (err || !r) {
|
|
reject(err);
|
|
}
|
|
// @ts-ignore
|
|
resolve(r);
|
|
}
|
|
});
|
|
});
|
|
case 5:
|
|
this.gl = _context4.sent;
|
|
this.inited = true;
|
|
case 7:
|
|
case "end":
|
|
return _context4.stop();
|
|
}
|
|
}
|
|
}, _callee4, this);
|
|
}));
|
|
function init(_x4) {
|
|
return _init.apply(this, arguments);
|
|
}
|
|
return init;
|
|
}()
|
|
}, {
|
|
key: "isFloatSupported",
|
|
value: function isFloatSupported() {
|
|
// @see https://github.com/antvis/GWebGPUEngine/issues/26
|
|
// @ts-ignore
|
|
return this.gl.limits.readFloat;
|
|
}
|
|
}, {
|
|
key: "beginFrame",
|
|
value: function beginFrame() {
|
|
//
|
|
}
|
|
}, {
|
|
key: "endFrame",
|
|
value: function endFrame() {
|
|
//
|
|
}
|
|
}]);
|
|
return WebGLEngine;
|
|
}();
|
|
exports.WebGLEngine = WebGLEngine;
|
|
//# sourceMappingURL=index.js.map
|