mirror of
https://codeberg.org/demostf/frontend.git
synced 2026-10-01 08:54:12 +02:00
add "fix player count" option to editor
All checks were successful
CI / checks (push) Successful in 32s
All checks were successful
CI / checks (push) Successful in 32s
This commit is contained in:
parent
fa9a57793d
commit
26c3cd67ae
4 changed files with 156 additions and 98 deletions
8
package-lock.json
generated
8
package-lock.json
generated
|
|
@ -5,7 +5,7 @@
|
|||
"packages": {
|
||||
"": {
|
||||
"dependencies": {
|
||||
"@demostf/edit": "0.2.0",
|
||||
"@demostf/edit": "0.2.1",
|
||||
"@demostf/tf-demos-viewer": "^0.3.3",
|
||||
"@lutaok/solid-modal": "^0.1.1",
|
||||
"@solid-primitives/autofocus": "^0.0.111",
|
||||
|
|
@ -18,9 +18,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@demostf/edit": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@demostf/edit/-/edit-0.2.0.tgz",
|
||||
"integrity": "sha512-s9wk3QVm+aTpMhIyfdGIHRm5qHp7FQ1dq/Jn0fms+lXsB1xY3wgjfWH+5gwRjjo/Dd3UMNM0o3atjO2uh+CxOQ=="
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@demostf/edit/-/edit-0.2.1.tgz",
|
||||
"integrity": "sha512-0wtwe717/iyO8awK2iZV2gUopZxl/ApBq1w3h9sDfPdI+58CBUMFlIItJMuWtpis8VfiHoQRR3l1qmTe49+5vQ=="
|
||||
},
|
||||
"node_modules/@demostf/tf-demos-viewer": {
|
||||
"version": "0.3.3",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"@demostf/edit": "0.2.0",
|
||||
"@demostf/edit": "0.2.1",
|
||||
"@demostf/tf-demos-viewer": "^0.3.3",
|
||||
"@lutaok/solid-modal": "^0.1.1",
|
||||
"@solid-primitives/autofocus": "^0.0.111",
|
||||
|
|
|
|||
|
|
@ -1,17 +1,17 @@
|
|||
import {Duration, formatDuration} from '../components/Duration';
|
||||
import { Duration, formatDuration } from "../components/Duration";
|
||||
|
||||
import Element = JSX.Element;
|
||||
import {Section} from "../components/Section";
|
||||
import { Section } from "../components/Section";
|
||||
import MultiRangeSlider from "../components/MultiSlider";
|
||||
import {DemoHead} from "../header";
|
||||
import {createSignal} from "solid-js";
|
||||
import {downloadBuffer, edit} from "./tools";
|
||||
import { DemoHead } from "../header";
|
||||
import { createSignal } from "solid-js";
|
||||
import { downloadBuffer, edit } from "./tools";
|
||||
|
||||
export interface EditPageProps {
|
||||
header: DemoHead;
|
||||
demoData: ArrayBuffer;
|
||||
setDropText: (string) => void,
|
||||
name: string,
|
||||
setDropText: (string) => void;
|
||||
name: string;
|
||||
}
|
||||
|
||||
export const Editor = (props: EditPageProps) => {
|
||||
|
|
@ -19,8 +19,7 @@ export const Editor = (props: EditPageProps) => {
|
|||
demoInfo = (
|
||||
<div className="demo-info">
|
||||
{props.header.map}
|
||||
<Duration className="time"
|
||||
duration={Math.floor(props.header.duration)}/>
|
||||
<Duration className="time" duration={Math.floor(props.header.duration)} />
|
||||
</div>
|
||||
);
|
||||
|
||||
|
|
@ -29,43 +28,67 @@ export const Editor = (props: EditPageProps) => {
|
|||
const [cutTo, setCutTo] = createSignal(props.header.ticks);
|
||||
const intervalPerTick = props.header.duration / props.header.ticks;
|
||||
const [unlockPov, setUnlockPov] = createSignal(false);
|
||||
const [fixPlayerCount, setFixPlayerCount] = createSignal(true);
|
||||
|
||||
const editCb = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
(props.setDropText)("Editing...");
|
||||
await doEdit(props.name, props.demoData, props.header, unlockPov(), cutFrom(), cutTo());
|
||||
(props.setDropText)(props.name);
|
||||
props.setDropText("Editing...");
|
||||
await doEdit(
|
||||
props.name,
|
||||
props.demoData,
|
||||
props.header,
|
||||
unlockPov(),
|
||||
fixPlayerCount(),
|
||||
cutFrom(),
|
||||
cutTo(),
|
||||
);
|
||||
props.setDropText(props.name);
|
||||
setLoading(false);
|
||||
} catch (e) {
|
||||
(props.setDropText)("Error: " + e.toString());
|
||||
props.setDropText("Error: " + e.toString());
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
{demoInfo}
|
||||
<Section title="Unlock camera">
|
||||
<ul key={1}>
|
||||
<li key={1}>Unlocks the camera in pov demos, allowing free movement as if it were an stv demo.</li>
|
||||
<li key={1}>
|
||||
Unlocks the camera in pov demos, allowing free movement as if it
|
||||
were an stv demo.
|
||||
</li>
|
||||
<li key={2}>When the player respawns the camera will be moved.</li>
|
||||
<li key={3}>As pov demos only contain data near the player, far away players might freeze, teleport or otherwise behave weirdly.</li>
|
||||
<li key={3}>
|
||||
As pov demos only contain data near the player, far away players
|
||||
might freeze, teleport or otherwise behave weirdly.
|
||||
</li>
|
||||
</ul>
|
||||
<p key={2}>
|
||||
<input type="checkbox" id="pov-unlock"
|
||||
<input
|
||||
type="checkbox"
|
||||
id="pov-unlock"
|
||||
checked={unlockPov() ? "checked" : null}
|
||||
onChange={() => {
|
||||
setUnlockPov(!unlockPov())
|
||||
}}/>
|
||||
setUnlockPov(!unlockPov());
|
||||
}}
|
||||
/>
|
||||
<label htmlFor="pov-unlock">Unlock camara for pov demo</label>
|
||||
</p>
|
||||
</Section>
|
||||
<Section title="Cut demo">
|
||||
<ul key={1}>
|
||||
<li key={1}>Cuts the demo file to the selected tick range.</li>
|
||||
<li key={2}>Cutting demos is experimental, resulting demo files might crash, have broken animations or have other issues.</li>
|
||||
<li key={3}>Changing the specific cut range can sometimes work around issues with broken demos.</li>
|
||||
<li key={2}>
|
||||
Cutting demos is experimental, resulting demo files might crash,
|
||||
have broken animations or have other issues.
|
||||
</li>
|
||||
<li key={3}>
|
||||
Changing the specific cut range can sometimes work around issues
|
||||
with broken demos.
|
||||
</li>
|
||||
</ul>
|
||||
<p key={2}>
|
||||
<MultiRangeSlider
|
||||
|
|
@ -81,26 +104,60 @@ export const Editor = (props: EditPageProps) => {
|
|||
/>
|
||||
</p>
|
||||
</Section>
|
||||
<Section title="Fix player count">
|
||||
<ul key={1}>
|
||||
<li key={1}>
|
||||
The 2023-07-25 update increased the max player count from 32 to 100,
|
||||
this broke playing some demos from before the update.
|
||||
</li>
|
||||
<li key={2}>
|
||||
This option attempts to make demos from before the update
|
||||
compatible.
|
||||
</li>
|
||||
<li key={3}>Using it on newer demos should have no effect.</li>
|
||||
</ul>
|
||||
<p key={2}>
|
||||
<input
|
||||
type="checkbox"
|
||||
id="fix-player-count"
|
||||
checked={fixPlayerCount() ? "checked" : null}
|
||||
onChange={() => {
|
||||
setFixPlayerCount(!fixPlayerCount());
|
||||
}}
|
||||
/>
|
||||
<label htmlFor="fix-player-count">Fix player count</label>
|
||||
</p>
|
||||
</Section>
|
||||
<Section title="Process">
|
||||
<p key={1}>
|
||||
<button onClick={editCb}
|
||||
<button
|
||||
onClick={editCb}
|
||||
className="pure-button pure-button-primary"
|
||||
disabled={loading() ? "disabled" : null}>
|
||||
{() => loading() ? 'Processing...' : 'Edit'}
|
||||
disabled={loading() ? "disabled" : null}
|
||||
>
|
||||
{() => (loading() ? "Processing..." : "Edit")}
|
||||
</button>
|
||||
</p>
|
||||
</Section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
async function doEdit(name: string, data: ArrayBuffer, header: DemoHead, unlockPov: boolean, from: number, to: number) {
|
||||
async function doEdit(
|
||||
name: string,
|
||||
data: ArrayBuffer,
|
||||
header: DemoHead,
|
||||
unlockPov: boolean,
|
||||
fixPlayerCount: boolean,
|
||||
from: number,
|
||||
to: number,
|
||||
) {
|
||||
let options = {
|
||||
unlock_pov: unlockPov,
|
||||
cut: (from > 0 || to < header.ticks) ? {from, to} : undefined,
|
||||
}
|
||||
fix_player_count: fixPlayerCount,
|
||||
cut: from > 0 || to < header.ticks ? { from, to } : undefined,
|
||||
};
|
||||
console.log(options);
|
||||
const edited = await edit(data, options);
|
||||
downloadBuffer(edited, name.replace('.dem', '_edited.dem'));
|
||||
downloadBuffer(edited, name.replace(".dem", "_edited.dem"));
|
||||
}
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
export interface EditOptions {
|
||||
unlock_pov: boolean,
|
||||
fix_player_count: boolean,
|
||||
cut?: TickRange,
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue