create editor store
This commit is contained in:
parent
82ab9cef78
commit
fa4c684475
3 changed files with 38 additions and 14 deletions
|
@ -3,13 +3,14 @@
|
|||
import { getBotName, saveBotName } from "$lib/bot_code";
|
||||
|
||||
import { currentUser } from "$lib/stores/current_user";
|
||||
import { selectedOpponent } from "$lib/stores/editor_state";
|
||||
|
||||
import { createEventDispatcher, onMount } from "svelte";
|
||||
import Select from "svelte-select";
|
||||
|
||||
export let editSession;
|
||||
|
||||
let availableBots: object[] = [];
|
||||
let selectedOpponent = undefined;
|
||||
let botName: string | undefined = undefined;
|
||||
// whether to show the "save succesful" message
|
||||
let saveSuccesful = false;
|
||||
|
@ -27,14 +28,16 @@
|
|||
|
||||
if (res.ok) {
|
||||
availableBots = await res.json();
|
||||
selectedOpponent = availableBots.find((b) => b["name"] === "simplebot");
|
||||
if (!$selectedOpponent) {
|
||||
selectedOpponent.set(availableBots.find((b) => b["name"] === "simplebot"));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
async function submitBot() {
|
||||
const opponentName = selectedOpponent["name"];
|
||||
const opponentName = $selectedOpponent["name"];
|
||||
|
||||
let response = await fetch("/api/submit_bot", {
|
||||
method: "POST",
|
||||
|
@ -106,7 +109,7 @@
|
|||
optionIdentifier="name"
|
||||
labelIdentifier="name"
|
||||
items={availableBots}
|
||||
bind:value={selectedOpponent}
|
||||
bind:value={$selectedOpponent}
|
||||
isClearable={false}
|
||||
/>
|
||||
</div>
|
||||
|
|
26
web/pw-server/src/lib/stores/editor_state.ts
Normal file
26
web/pw-server/src/lib/stores/editor_state.ts
Normal file
|
@ -0,0 +1,26 @@
|
|||
import { writable } from "svelte/store";
|
||||
|
||||
const MAX_MATCHES = 100;
|
||||
|
||||
function createMatchHistory() {
|
||||
const { subscribe, update } = writable([]);
|
||||
|
||||
function pushMatch(match: object) {
|
||||
update((matches) => {
|
||||
if (matches.length == MAX_MATCHES) {
|
||||
matches.pop();
|
||||
}
|
||||
matches.unshift(match);
|
||||
|
||||
return matches;
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
subscribe,
|
||||
pushMatch,
|
||||
};
|
||||
}
|
||||
|
||||
export const matchHistory = createMatchHistory();
|
||||
export const selectedOpponent = writable(null);
|
|
@ -2,26 +2,22 @@
|
|||
import Visualizer from "$lib/components/Visualizer.svelte";
|
||||
import EditorView from "$lib/components/EditorView.svelte";
|
||||
import { onMount } from "svelte";
|
||||
|
||||
import { DateTime } from "luxon";
|
||||
|
||||
import type { Ace } from "ace-builds";
|
||||
import ace from "ace-builds/src-noconflict/ace?client";
|
||||
import * as AcePythonMode from "ace-builds/src-noconflict/mode-python?client";
|
||||
import { getBotCode, saveBotCode, hasBotCode } from "$lib/bot_code";
|
||||
import { getBotCode, saveBotCode } from "$lib/bot_code";
|
||||
import { matchHistory } from "$lib/stores/editor_state";
|
||||
import { debounce } from "$lib/utils";
|
||||
import SubmitPane from "$lib/components/SubmitPane.svelte";
|
||||
import OutputPane from "$lib/components/OutputPane.svelte";
|
||||
import RulesView from "$lib/components/RulesView.svelte";
|
||||
import Leaderboard from "$lib/components/Leaderboard.svelte";
|
||||
|
||||
enum ViewMode {
|
||||
Editor,
|
||||
MatchVisualizer,
|
||||
}
|
||||
|
||||
let matches = [];
|
||||
|
||||
let viewMode = ViewMode.Editor;
|
||||
let selectedMatchId: string | undefined = undefined;
|
||||
let selectedMatchLog: string | undefined = undefined;
|
||||
|
@ -47,8 +43,7 @@
|
|||
|
||||
async function onMatchCreated(e: CustomEvent) {
|
||||
const matchData = e.detail["match"];
|
||||
matches.unshift(matchData);
|
||||
matches = matches;
|
||||
matchHistory.pushMatch(matchData);
|
||||
await selectMatch(matchData["id"]);
|
||||
}
|
||||
|
||||
|
@ -123,7 +118,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
$: selectedMatch = matches.find((m) => m["id"] === selectedMatchId);
|
||||
$: selectedMatch = $matchHistory.find((m) => m["id"] === selectedMatchId);
|
||||
</script>
|
||||
|
||||
<div class="container">
|
||||
|
@ -137,7 +132,7 @@
|
|||
</div>
|
||||
<div class="sidebar-header">match history</div>
|
||||
<ul class="match-list">
|
||||
{#each matches as match}
|
||||
{#each $matchHistory as match}
|
||||
<li
|
||||
class="match-card sidebar-item"
|
||||
on:click={() => selectMatch(match.id)}
|
||||
|
|
Loading…
Reference in a new issue