109 lines
3.6 KiB
JavaScript
109 lines
3.6 KiB
JavaScript
//libmain.js
|
|
|
|
(async function() {
|
|
if(typeof PIXI!="object") {
|
|
if(typeof loadfail=="function") {
|
|
loadfail("libmain.js: PIXI(type of "+(typeof PIXI)+") is not an object");
|
|
} else {
|
|
window.alert("libmain.js: PIXI(type of "+(typeof PIXI)+") is not an object");
|
|
}
|
|
return;
|
|
}
|
|
|
|
var libmain= {};
|
|
libmain.settings= {};
|
|
|
|
/////////////////////////////////////// set default settings
|
|
|
|
libmain.settings.fixed_ratio=16/9;
|
|
libmain.settings.use_fixed_aspect_ratio=true;
|
|
libmain.settings.show_fps=true;
|
|
libmain.settings.use_anti_alias=true;
|
|
|
|
/////////////////////////////////////// init canvas and frame
|
|
|
|
console.log("[libmain] setting up basic pixi application...");
|
|
// set up main canvas element
|
|
libmain.canvas=document.getElementById("maincanvas");
|
|
if(libmain.canvas==null) {
|
|
libmain.canvas=document.createElement("canvas");
|
|
libmain.canvas.id="maincanvas";
|
|
document.body.appendChild(libmain.canvas);
|
|
}
|
|
libmain.canvas.style.width=0;
|
|
libmain.canvas.style.height=0;
|
|
libmain.canvas.width=0;
|
|
libmain.canvas.height=0;
|
|
libmain.canvas.style.background="rgba(0,0,0,0.5)";
|
|
libmain.canvas.style.display="inline-block";
|
|
libmain.canvas.style.position="absolute";
|
|
libmain.canvas.style.zIndex=1;
|
|
|
|
// setup pixi application
|
|
libmain.renderer=await PIXI.autoDetectRenderer({
|
|
"preference":"webgpu",
|
|
"canvas":libmain.canvas,
|
|
"antialias":libmain.settings.use_anti_alias,
|
|
"backgroundAlpha":0,
|
|
"width":0,
|
|
"height":0
|
|
});
|
|
|
|
libmain.stage= {};
|
|
|
|
libmain.stage.root=new PIXI.Container();
|
|
libmain.stage.root.sortableChildren=true;
|
|
libmain.stage.root.boundsArea=new PIXI.Rectangle(0, 0, 0, 0);
|
|
libmain.stage.root.cullArea=libmain.stage.root.boundsArea;
|
|
libmain.render_tick=function() {
|
|
try {
|
|
libmain.renderer.render(libmain.stage.root);
|
|
} catch(e) {
|
|
console.error(e);
|
|
if(typeof loadfail=="function") {
|
|
loadfail(libutil.error2str(e));
|
|
} else {
|
|
window.alert(libutil.error2str(e));
|
|
}
|
|
return;
|
|
}
|
|
requestAnimationFrame(libmain.render_tick);
|
|
};
|
|
requestAnimationFrame(libmain.render_tick);
|
|
|
|
/////////////////////////////////////// add layered containers
|
|
|
|
libmain.stage.menu= {};
|
|
|
|
libmain.stage.menu.start=new PIXI.Container();
|
|
libmain.stage.menu.pause=new PIXI.Container();
|
|
libmain.stage.menu.settings=new PIXI.Container();
|
|
libmain.stage.hud=new PIXI.Container();
|
|
|
|
/////////////////////////////////////// end of setup
|
|
|
|
// document resize handler
|
|
libmain.onresize=function() {
|
|
var res=[document.body.clientWidth, document.body.clientHeight, 0, 0];
|
|
if(libmain.settings.use_fixed_aspect_ratio) {
|
|
res=libutil.calcresize(document.body.clientWidth, document.body.clientHeight, libmain.settings.fixed_ratio);
|
|
}
|
|
libmain.canvas.width=res[0];
|
|
libmain.canvas.height=res[1];
|
|
libmain.canvas.style.width=res[0]+"px";
|
|
libmain.canvas.style.height=res[1]+"px";
|
|
libmain.canvas.style.left=res[2]+"px";
|
|
libmain.canvas.style.top=res[3]+"px";
|
|
libmain.stageroot.boundsArea.width=res[0];
|
|
libmain.stageroot.boundsArea.height=res[1];
|
|
libmain.renderer.width=res[0];
|
|
libmain.renderer.height=res[1];
|
|
};
|
|
|
|
window.addEventListener("resize", libmain.onresize);
|
|
libmain.onresize();
|
|
|
|
window.libmain=libmain;
|
|
console.log("[libmain] all components initialized successfully.");
|
|
})();
|