demostf/frontend
1
0
Fork 0
mirror of https://codeberg.org/demostf/frontend.git synced 2026-06-03 18:24:12 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

player filter by steamid

Browse source
This commit is contained in:
Robin Appelman 2023-04-16 14:42:30 +02:00
commit 8fa199f735
5 changed files with 65 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

23
script/demo_list.js
View file

@ -3,22 +3,29 @@ import {ready} from "./ready";
import {FilterBar} from "./filterbar"
import {Api} from "./api";
let lastFilter = {
mode: "",
map: "",
players: []
};
ready(() => {
const filterBar = document.getElementById('filter-bar');
const maps = filterBar.dataset.maps.split(",");
const apiBase = filterBar.dataset.apiBase;
const api = new Api(apiBase);
const demoListBody = document.querySelector('.demolist tbody');
const searchParams = new URLSearchParams(window.location.search);
render(() => <FilterBar maps={maps} api={api} onChange={onFilter.bind(null, api, demoListBody)}/>, filterBar);
lastFilter = {
mode: searchParams.get("mode") || "",
map: searchParams.get("map") || "",
players: (searchParams.get("players") || "").split(",")
};
render(() => <FilterBar maps={maps} api={api} initialFilter={lastFilter} onChange={onFilter.bind(null, api, demoListBody)}/>, filterBar);
});
let lastFilter = {
mode: "",
map: "",
players: []
};
const filterEq = (a, b) => {
return (a.mode || "") === (b.mode || "")
&& (a.map || "") === (b.map || "")
@ -32,7 +39,7 @@ const onFilter = async (api, demoListBody, filter) => {
lastFilter = filter;
let queryParams = new URLSearchParams({
players: filter.players.map(player => player.id).join(','),
players: filter.players.map(player => player.steamid).join(','),
mode: (filter.mode || "").toLowerCase(),
map: filter.map || "",
});

13
script/filterbar.tsx
View file

@ -5,10 +5,11 @@ import {createEffect, createSignal} from "solid-js";
export interface FilterBarProps {
maps: string[],
api: Api,
initialFilter: FilterSet,
onChange: (FilterSet) => void,
}
export const FilterBar = ({maps, api, onChange}: FilterBarProps) => {
export const FilterBar = ({maps, api, onChange, initialFilter}: FilterBarProps) => {
const modes = createOptions(["4v4", "6v6", "Highlander"]);
const mapOptions = createOptions(maps, {
createable: true
@ -16,14 +17,10 @@ export const FilterBar = ({maps, api, onChange}: FilterBarProps) => {
const playerOptions = createAsyncOptions(search => api.searchPlayer(search));
const playerFormat = player => player.name;
const [initialMode, setInitialMode] = createSignal("", {equals: false});
const [initialMap, setInitialMap] = createSignal("", {equals: false});
const [initialMode, setInitialMode] = createSignal(initialFilter.mode, {equals: false});
const [initialMap, setInitialMap] = createSignal(initialFilter.map, {equals: false});
const [filterSet, setFilterSet] = createSignal({
mode: "",
map: "",
players: []
});
const [filterSet, setFilterSet] = createSignal(initialFilter);
createEffect(() => onChange(filterSet()));
return <div class="filter-bar">