A photo manager for VRChat.
1import { Show } from "solid-js";
2import { FilterType } from "./Structs/FilterType";
3
4let FilterMenu = () => {
5 let selectionButtons: HTMLDivElement[] = [];
6
7 let select = ( index: number ) => {
8 selectionButtons.forEach(e => e.classList.remove('selected-filter'));
9 selectionButtons[index].classList.add('selected-filter');
10 }
11
12 return (
13 <>
14 <Show when={!window.PhotoManager.HasBeenIndexed()}>
15 <div>Your photos aren't indexed due to the large number, filters may take a while to load.</div>
16 <div style={{ height: '8px' }}></div>
17 </Show>
18 <div class="filter-type-select">
19 <div class="selected-filter" ref={( el ) => selectionButtons.push(el)} onClick={() => {
20 select(0);
21 window.PhotoManager.SetFilterType(FilterType.USER);
22 }}>User</div>
23 <div ref={( el ) => selectionButtons.push(el)} onClick={() => {
24 select(1);
25 window.PhotoManager.SetFilterType(FilterType.WORLD);
26 }}>World</div>
27 </div>
28
29 <input class="filter-search" type="text" onInput={( el ) => window.PhotoManager.SetFilter(el.target.value)} placeholder="Enter Search Term..."></input>
30 </>
31 )
32}
33
34export default FilterMenu
35export { FilterType }