Files
HexTrails/src/ui-skin.js
T

18 lines
1.3 KiB
JavaScript

import { SURFACES } from './design-tokens.js';
// Source rectangles shared by browser and Cocos; never substitute artwork silently.
export const PANEL_ATLAS='assets/ui-surfaces.png';
export const PANEL_SIZE={w:416,h:32};
export const ICON_ATLAS='assets/ui-icons-generated.png';
export const ICON_SIZE={w:1254,h:1254};
// Sample inside each 32px swatch so bilinear filtering cannot bleed adjacent roles.
export const PANELS=Object.fromEntries(Object.keys(SURFACES).map((name,i)=>[name,{x:i*32+2,y:2,w:28,h:28,cap:0}]));
// Measured bounds of the main artwork, padded to a square around its optical center.
const bounds=[
[64,80,281,289],[378,93,568,283],[719,101,828,282],[1005,99,1187,279],
[63,374,255,594],[377,398,592,594],[686,426,891,587],[1000,374,1193,594],
[86,679,235,902],[366,689,576,887],[687,689,890,893],[1018,706,1169,883],
[94,986,224,1189],[367,981,575,1177],[669,1005,892,1170],[1003,982,1184,1185],
];
export const ICONS=Object.fromEntries(['gear','grid','back','close','left','right','undo','restart','bulb','star','edit','play','arrow','erase','track','gem'].map((name,i)=>{const [l,t,r,b]=bounds[i],size=Math.max(r-l,b-t)+12;return[name,{x:Math.floor((l+r-size)/2),y:Math.floor((t+b-size)/2),w:size,h:size}];}));
export const UI_REFERENCE={width:390,height:844,corner:14,font:'Arial Rounded MT Bold',disabledOpacity:.55,pressedScale:.94};