/*
* @title 画面高画質化
* @description ゲーム画面を高画質にし、PCなど大画面で遊んだ際のぼやけを小さくする
* @private
*/
javascript:(function(){
const d=document, v=d.getElementById('gameCanvas'), g=d.getElementById('game-container');
if(!v || !g) return;
const dpr = 2.0;
/* 1. Canvas(戦場)の高密度化 */
if(!window._hiResApplied){
const w = v.width, h = v.height;
v.width = w * dpr;
v.height = h * dpr;
v.style.width = w + 'px';
v.style.height = h + 'px';
v.getContext('2d').scale(dpr, dpr);
window._hiResApplied = true;
}
/* 2. ブラウザの自動計算機能(margin: auto)を使って中央に寄せる */
Object.assign(g.style, {
zoom: dpr,
transform: `scale(${1/dpr})`,
transformOrigin: 'top center', /* 起点を中央上に変更 */
position: 'relative', /* absoluteから変更してmarginを有効化 */
top: '0',
left: '0',
marginLeft: 'auto',
marginRight: 'auto',
width: v.style.width, /* 幅をCanvasと一致させて余白を計算させる */
height: 'auto'
});
/* 全体背景を黒にして、ズレを目立たなくする */
d.body.style.backgroundColor = '#000';
d.body.style.margin = '0';
d.body.style.overflowX = 'hidden';
const style = d.createElement('style');
style.innerHTML = `
#game-container * {
-webkit-font-smoothing: antialiased;
transform: translateZ(0);
backface-visibility: hidden;
}
`;
d.head.appendChild(style);
alert('【真・中央寄せパッチ】\nブラウザの自動レイアウトで中央配置を最適化しました。');
})();