fix interval per tickOM

This commit is contained in:
Robin Appelman 2023-04-29 16:36:24 +02:00
commit 7a2f4d1af0
4 changed files with 11 additions and 8 deletions

View file

@ -4,22 +4,22 @@ import {throttle, debounce} from 'throttle-debounce';
import {Timeline} from './Render/Timeline';
import {SpecHUD} from './Render/SpecHUD';
import {AnalyseMenu} from './AnalyseMenu'
import {Header, WorldBoundaries} from "./Data/Parser";
import {AsyncParser} from "./Data/AsyncParser";
import {getMapBoundaries} from "./MapBoundries";
import {createEffect, createSignal} from "solid-js";
import {createSignal} from "solid-js";
import {Session, StateUpdate} from "./Session";
import {DemoHead} from "../../header";
export interface AnalyseProps {
header: Header;
header: DemoHead;
isStored: boolean;
parser: AsyncParser;
}
export const Analyser = (props: AnalyseProps) => {
const parser = props.parser;
const intervalPerTick = props.header.interval_per_tick;
const intervalPerTick = props.header.duration / props.header.ticks;
const [tick, setTick] = createSignal<number>(0);
const [scale, setScale] = createSignal<number>(1);
@ -136,6 +136,10 @@ export const Analyser = (props: AnalyseProps) => {
const disabled = session && !session.isOwner();
const isShared = () => sessionName() !== '';
console.log(intervalPerTick);
const timeTitle = () => `${tickToTime(tick(), intervalPerTick)} (tick ${tick()})`;
return (
<div>
<div class="map-holder">
@ -163,7 +167,7 @@ export const Analyser = (props: AnalyseProps) => {
players={players()} kills={kills}/>
</div>
<div class="time-control"
title={`${tickToTime(tick(), intervalPerTick)} (tick ${tick()})`}>
title={timeTitle()}>
<input class="play-pause-button" type="button"
value={playButtonText()}
disabled={disabled}

View file

@ -22,7 +22,6 @@ export const MapContainer = (props: ParentProps<MapContainerProps>) => {
}
createEffect(() => {
const s = scale();
console.log(s)
if (isFinite(s)) {
props.onScale && props.onScale(s);
}

View file

@ -8,12 +8,13 @@ export interface TimelineProps {
}
export const Timeline = ({parser, tick, onSetTick, disabled}) => {
const background = <TimeLineBackground parser={parser}/>;
return <div class="timeline">
<input max={parser.demo.tickCount} value={tick} class="timeline-progress" type="range" min={0}
onChange={(event) => {onSetTick(parseInt(event.target.value, 10))}}
disabled={disabled}
/>
<TimeLineBackground parser={parser}/>
{background}
</div>;
}