mirror of
https://codeberg.org/demostf/frontend.git
synced 2026-06-03 10:14:13 +02:00
viewer: initial center
This commit is contained in:
parent
f5f553c446
commit
be6ff11093
3 changed files with 10 additions and 11 deletions
|
|
@ -22,7 +22,7 @@ function getBuildingType(type: BuildingType) {
|
|||
case BuildingType.Dispenser:
|
||||
return require("inline://images/building_icons/dispenser.png");
|
||||
case BuildingType.Level1Sentry:
|
||||
return require("inline://images/building_icons/sentry_1.png");
|
||||
return require("inline://images/building_icons/sentry_1.svg");
|
||||
case BuildingType.Level2Sentry:
|
||||
return require("inline://images/building_icons/sentry_2.png");
|
||||
case BuildingType.Level3Sentry:
|
||||
|
|
@ -57,9 +57,7 @@ export function Building(props: BuildingProp) {
|
|||
opacity={alpha()}>
|
||||
<circle r={16} stroke-width={1} stroke="white" fill={teamColor()}
|
||||
opacity={alpha()}/>
|
||||
<image href={image()} className={"player-icon"} height={32}
|
||||
width={32}
|
||||
transform={`translate(-16 -16)`}/>
|
||||
<image href={image()} className={"player-icon"} height={32} width={32} transform={`translate(-16 -16)`}/>
|
||||
<Show when={props.building.angle}>
|
||||
<polygon points="-6,14 0, 16 6,14 0,24" fill="white"
|
||||
transform={rotate()}/>
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ export class CenteredPanZoom {
|
|||
};
|
||||
|
||||
constructor(options: CenteredPanZoomOptions) {
|
||||
const scale = options.scale || (options.screenWidth / options.contentSize.width);
|
||||
this.screen = new Viewport({
|
||||
x: 0,
|
||||
y: 0,
|
||||
|
|
@ -27,12 +28,12 @@ export class CenteredPanZoom {
|
|||
height: options.screenHeight
|
||||
});
|
||||
this.viewport = new Viewport({
|
||||
x: 0,
|
||||
y: 0,
|
||||
x: (options.screenWidth - (options.contentSize.width * scale)) / 2,
|
||||
y: ( options.screenHeight - (options.contentSize.height * scale)) / 2,
|
||||
width: options.screenWidth,
|
||||
height: options.screenHeight
|
||||
});
|
||||
this.scale = options.scale || 1;
|
||||
this.scale = scale;
|
||||
this.contentSize = options.contentSize;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -13,10 +13,6 @@ export interface PannerProps {
|
|||
}
|
||||
|
||||
export const Panner = (props: ParentProps<PannerProps>) => {
|
||||
const [scale, setScale] = createSignal(0);
|
||||
const [translateX, setTranslateX] = createSignal(0);
|
||||
const [translateY, setTranslateY] = createSignal(0);
|
||||
|
||||
const panner = new CenteredPanZoom({
|
||||
screenHeight: props.height,
|
||||
screenWidth: props.width,
|
||||
|
|
@ -24,6 +20,10 @@ export const Panner = (props: ParentProps<PannerProps>) => {
|
|||
contentSize: props.contentSize
|
||||
});
|
||||
|
||||
const [scale, setScale] = createSignal(props.scale);
|
||||
const [translateX, setTranslateX] = createSignal(Math.floor(panner.viewport.x));
|
||||
const [translateY, setTranslateY] = createSignal(Math.floor(panner.viewport.y));
|
||||
|
||||
let startX = 0;
|
||||
let startY = 0;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue