利用构建模板替换掉game.js 文件,再给一个首屏图片即可。
game.js源码如下:
require('./libs/wrapper/builtin/index');
window.DOMParser = require('./libs/common/xmldom/dom-parser').DOMParser;
require('./libs/common/engine/globalAdapter/index');
require('./libs/wrapper/unify');
require('./libs/wrapper/systemInfo');
// Ensure getting the system info in open data context
// 画一个loading
function drawLoading() {
console.warn('start draw loading', Date.now());
var img = document.createElement("img");
img.src= 'loading.jpg';
img.onload = () => {
console.warn('img.onload', Date.now());
var cc = window['cc'];
var gl
if (cc && cc.game && cc.game._renderContext) {
gl = cc.game._renderContext;
console.warn('gl = cc.game._renderContext');
}
else {
var opts = {
'stencil': true,
'depth': true,
'preserveDrawingBuffer': false,
// MSAA is causing serious performance dropdown on some browsers.
'antialias': false,
'alpha': false
};
gl = canvas.getContext('webgl', opts);
}
var tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
// Vertex shader program
var vsSource = ` attribute vec4 aVertexPosition; attribute vec2 a_texcoord; varying vec2 v_texcoord; void main() { gl_Position = aVertexPosition; v_texcoord = a_texcoord; } `;
var fsSource = ` precision mediump float; varying vec2 v_texcoord; uniform sampler2D u_texture; void main() { gl_FragColor = texture2D(u_texture, v_texcoord); } `;
//
// 创建指定类型的着色器,上传source源码并编译
//
function loadShader(gl, type, source) {
var shader = gl.createShader(type);
// Send the source to the shader object
gl.shaderSource(shader, source);
// Compile the shader program
gl.compileShader(shader);
// See if it compiled successfully
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
console.error('An error occurred compiling the shaders: ' + gl.getShaderInfoLog(shader));
gl.deleteShader(shader);
return null;
}
return shader;
}
// 初始化着色器程序,让WebGL知道如何绘制我们的数据
function initShaderProgram(gl, vsSource, fsSource) {
var vertexShader = loadShader(gl, gl.VERTEX_SHADER, vsSource);
var fragmentShader = loadShader(gl, gl.FRAGMENT_SHADER, fsSource);
// 创建着色器程序
var shaderProgram = gl.createProgram();
gl.attachShader(shaderProgram, vertexShader);
gl.attachShader(shaderProgram, fragmentShader);
gl.linkProgram(shaderProgram);
// 创建失败, alert
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
console.error('Unable to initialize the shader program: ' + gl.getProgramInfoLog(shaderProgram));
return null;
}
return shaderProgram;
}
var shaderProgram = initShaderProgram(gl, vsSource, fsSource);
// Tell WebGL to use our program when drawing
gl.useProgram(shaderProgram);
var programInfo = {
program: shaderProgram,
attribLocations: {
vertexPosition: gl.getAttribLocation(shaderProgram, 'aVertexPosition'),
texcoord: gl.getAttribLocation(shaderProgram, 'a_texcoord'),
},
};
var textureLocation = gl.getUniformLocation(shaderProgram, "u_texture");
function initBuffers(gl) {
var positionBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
var vertices = [
1.0, 1.0, 0.0,
-1.0, 1.0, 0.0,
1.0, -1.0, 0.0,
-1.0, -1.0, 0.0
];
gl.bufferData(gl.ARRAY_BUFFER,
new Float32Array(vertices),
gl.STATIC_DRAW);
var uvBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, uvBuffer);
var uvs = [
1.0, 0.0,
0.0, 0.0,
1.0, 1.0,
0.0, 1.0,
];
gl.bufferData(gl.ARRAY_BUFFER,
new Float32Array(uvs),
gl.STATIC_DRAW);
return {
position: positionBuffer,
uv: uvBuffer,
};
}
function drawScene(gl, programInfo, buffers) {
gl.clearColor(0.0, 0.0, 0.0, 1.0); // Clear to black, fully opaque
// gl.clearDepth(1.0); // Clear everything
// gl.enable(gl.DEPTH_TEST); // Enable depth testing
// gl.depthFunc(gl.LEQUAL); // Near things obscure far things
// Clear the canvas before we start drawing on it.
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// Tell WebGL how to pull out the positions from the position
// buffer into the vertexPosition attribute.
{
var numComponents = 3; // pull out 3 values per iteration
var type = gl.FLOAT; // the data in the buffer is 32bit floats
var normalize = false; // don't normalize
var stride = 0; // how many bytes to get from one set of values to the next
// 0 = use type and numComponents above
var offset = 0; // how many bytes inside the buffer to start from
gl.bindBuffer(gl.ARRAY_BUFFER, buffers.position);
gl.vertexAttribPointer(
programInfo.attribLocations.vertexPosition,
numComponents,
type,
normalize,
stride,
offset);
gl.enableVertexAttribArray(
programInfo.attribLocations.vertexPosition);
gl.bindBuffer(gl.ARRAY_BUFFER, buffers.uv);
gl.vertexAttribPointer(
programInfo.attribLocations.texcoord,
2,
type,
normalize,
stride,
offset);
gl.enableVertexAttribArray(programInfo.attribLocations.texcoord);
}
{
var offset = 0;
var vertexCount = 4;
gl.drawArrays(gl.TRIANGLE_STRIP, offset, vertexCount);
}
}
// 告诉着色器使用纹理单元 0
gl.uniform1i(textureLocation, 0);
var buffers = initBuffers(gl);
drawScene(gl, programInfo, buffers);
};
}
window.__globalAdapter.init(function () {
drawLoading();
require('./src/settings');
// Will be replaced with cocos2d-js path in editor
requirePlugin('cocos');
require('./libs/common/engine/index');
// Introduce Cocos Service here
require('./main');
require('./libs/common/remote-downloader');
require('./libs/wrapper/engine/index');
// Adjust devicePixelRatio
cc.view._maxPixelRatio = 4;
// downloader polyfill
window.wxDownloader = remoteDownloader;
// handle remote downloader
remoteDownloader.REMOTE_SERVER_ROOT = "https://cdn.cymini.qq.com/business/web/random_tower_wx";
remoteDownloader.SUBCONTEXT_ROOT = "";
var pipeBeforeDownloader = cc.loader.subPackPipe || cc.loader.md5Pipe || cc.loader.assetLoader;
cc.loader.insertPipeAfter(pipeBeforeDownloader, remoteDownloader);
if (cc.sys.platform === cc.sys.WECHAT_GAME_SUB) {
var SUBDOMAIN_DATA = require('src/subdomain.json.js');
cc.game.once(cc.game.EVENT_ENGINE_INITED, function () {
cc.Pipeline.Downloader.PackDownloader._doPreload("SUBDOMAIN_DATA", SUBDOMAIN_DATA);
});
require('./libs/wrapper/sub-context-adapter');
}
else {
// Release Image objects after uploaded gl texture
cc.macro.CLEANUP_IMAGE_CACHE = true;
}
remoteDownloader.init();
window.boot();
console.warn('boot time', Date.now());
});
require('./mogs-required.js');
文章评论