RussellChamp/tpw-roller
1
0 Fork 0
mirror of https://github.com/RussellChamp/tpw-roller.git synced 2026-10-28 00:22:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

add lots of cool features

Browse Source 
add side nav
add clipboard
add remove
This commit is contained in:
RussellChamp committed 2021-08-21 16:02:35 -04:00
1 parent 5949b6ad33
commit 9e8a22cd62
28 files changed
+428 -303
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/DetailsRoller.svelte
+23 -73
View File
@@ -1,8 +1,8 @@
<script lang="ts">
import { format as formatDate } from "date-fns";
import { createEventDispatcher } from "svelte";
import { Button, Icon } from "sveltestrap";
import { Button } from "sveltestrap";
import {
Detail,
rollAbility,
rollActivity,
rollAdjective,
@@ -24,83 +24,33 @@
rollVisibility,
} from "../rollers/details";
import DieIcon from "./DieIcon.svelte";
const dispatch = createEventDispatcher();
let rollResults: { type: string; roll: number; value: string; timestamp: string }[] = [];
function roll(item: { type: string; description: string; roll: number }) {
rollResults = [
{ type: item.type, roll: item.roll, value: item.description, timestamp: formatDate(new Date(), "P kk:mm:ss") },
...rollResults,
];
dispatch("roll");
function roll(value: Detail) {
dispatch("roll", { type: "detail", value });
}
</script>
<main>
<span class="btn">
<Button color="primary" on:click={() => roll(rollAbility())}>Roll Ability</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollActivity())}>Roll Activity</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollAdjective())}>Roll Adjective</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollAge())}>Roll Age</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollAlignment())}>Roll Alignment</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollAspect())}>Roll Aspect</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollCondition())}>Roll Condition</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollDisposition())}>Roll Disposition</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollElement())}>Roll Element</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollFeature())}>Roll Feature</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollMagicType())}>Roll MagicType</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollNumAppearing())}>Roll NumAppearing</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollOddity())}>Roll Oddity</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollOrientation())}>Roll Orientation</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollRuination())}>Roll Ruination</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollSize())}>Roll Size</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollTag())}>Roll Tag</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollTerrain())}>Roll Terrain</Button>
</span>
<span class="btn">
<Button color="primary" on:click={() => roll(rollVisibility())}>Roll Visibility</Button>
</span>
{#each rollResults as { type, roll, value, timestamp }}
<h4>{timestamp}: ({type}): {value}<DieIcon value={roll} /></h4>
{/each}
<Button color="primary" on:click={() => roll(rollAbility())}>Roll Ability</Button>
<Button color="primary" on:click={() => roll(rollActivity())}>Roll Activity</Button>
<Button color="primary" on:click={() => roll(rollAdjective())}>Roll Adjective</Button>
<Button color="primary" on:click={() => roll(rollAge())}>Roll Age</Button>
<Button color="primary" on:click={() => roll(rollAlignment())}>Roll Alignment</Button>
<Button color="primary" on:click={() => roll(rollAspect())}>Roll Aspect</Button>
<Button color="primary" on:click={() => roll(rollCondition())}>Roll Condition</Button>
<Button color="primary" on:click={() => roll(rollDisposition())}>Roll Disposition</Button>
<Button color="primary" on:click={() => roll(rollElement())}>Roll Element</Button>
<Button color="primary" on:click={() => roll(rollFeature())}>Roll Feature</Button>
<Button color="primary" on:click={() => roll(rollMagicType())}>Roll MagicType</Button>
<Button color="primary" on:click={() => roll(rollNumAppearing())}>Roll NumAppearing</Button>
<Button color="primary" on:click={() => roll(rollOddity())}>Roll Oddity</Button>
<Button color="primary" on:click={() => roll(rollOrientation())}>Roll Orientation</Button>
<Button color="primary" on:click={() => roll(rollRuination())}>Roll Ruination</Button>
<Button color="primary" on:click={() => roll(rollSize())}>Roll Size</Button>
<Button color="primary" on:click={() => roll(rollTag())}>Roll Tag</Button>
<Button color="primary" on:click={() => roll(rollTerrain())}>Roll Terrain</Button>
<Button color="primary" on:click={() => roll(rollVisibility())}>Roll Visibility</Button>
</main>
<style>