Как «потребовать» мой код WebGL, который разбит на три файла в один файл начальной загрузки? - PullRequest
Новая
       11

Как «потребовать» мой код WebGL, который разбит на три файла в один файл начальной загрузки?

2 голосов
/ 17 марта 2012

Я написал некоторый код WebGL, на самом деле я играю с примерами, которые можно найти здесь . В любом случае я решил написать три отдельных псевдокласса, я покажу здесь только один из них, чтобы сэкономить место, и потому что я не думаю, что другие имеют отношение к вопросу. 

var Buffer = (function() {

/* PRIVATE MEMBERS */
var currentBuffer;
var itemSize = 3;
var numberItems;
var localWebGLContext;

/* CONSTRUCTOR */
var BufferConstructor = function(webGLWorker, vertices) {
    localWebGLContext = webGLWorker.getWebGLContext();
    currentBuffer = localWebGLContext.createBuffer();
    localWebGLContext.bindBuffer(localWebGLContext.ARRAY_BUFFER, currentBuffer);
    localWebGLContext.bufferData(localWebGLContext.ARRAY_BUFFER, new Float32Array(vertices), localWebGLContext.STATIC_DRAW);
    numberItems = vertices.length / itemSize;
};

return BufferConstructor;
})();

Итак, я хотел бы знать, как лучше всего включить (потребовать) их в отдельный файл, который будет загружать все. Я читал о CommonJS, но это на стороне сервера, и здесь мы говорим на стороне клиента. Я действительно не хочу хранить все в одном файле, потому что то, что я пытаюсь сделать, в конечном итоге будет довольно большим как приложение, и я действительно не хочу все это в одном месте. Заранее спасибо!

1 Ответ

1 голос
/ 18 марта 2012

Для своих проектов WebGL я использую Require.js . Синтаксис не так хорош, как реализация CommonJS в Node, но он хорошо работает с асинхронной природой на стороне клиента. Быстрый пример: 

require([
    "renderer",
    "util"
], function(Renderer, Util) {
    // Use the code from your required files in here!
});

И определить модуль для него так же просто: 

define([
    "matrix" // Dependencies for this module
], function(Matrix) {
    return {
        DrawSuff: function() { /*...*/ }
    }
});

Вы можете увидеть простой пример этого в действии с проектом WebGL здесь .

...