roller!
HeNine
1 year ago
commit
ed61e856ea
@ -0,0 +1,15 @@
|
|||||||
|
/* eslint-env node */
|
||||||
|
require('@rushstack/eslint-patch/modern-module-resolution')
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
root: true,
|
||||||
|
'extends': [
|
||||||
|
'plugin:vue/vue3-essential',
|
||||||
|
'eslint:recommended',
|
||||||
|
'@vue/eslint-config-typescript',
|
||||||
|
'@vue/eslint-config-prettier/skip-formatting'
|
||||||
|
],
|
||||||
|
parserOptions: {
|
||||||
|
ecmaVersion: 'latest'
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,29 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
.DS_Store
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
coverage
|
||||||
|
*.local
|
||||||
|
|
||||||
|
/cypress/videos/
|
||||||
|
/cypress/screenshots/
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
# .vscode/*
|
||||||
|
# !.vscode/extensions.json
|
||||||
|
.vscode
|
||||||
|
.idea
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"$schema": "https://json.schemastore.org/prettierrc",
|
||||||
|
"semi": false,
|
||||||
|
"tabWidth": 2,
|
||||||
|
"singleQuote": true,
|
||||||
|
"printWidth": 100,
|
||||||
|
"trailingComma": "none"
|
||||||
|
}
|
||||||
@ -0,0 +1,2 @@
|
|||||||
|
FROM nginx
|
||||||
|
COPY dist /usr/share/nginx/html
|
||||||
@ -0,0 +1,46 @@
|
|||||||
|
# kartsroller
|
||||||
|
|
||||||
|
This template should help get you started developing with Vue 3 in Vite.
|
||||||
|
|
||||||
|
## Recommended IDE Setup
|
||||||
|
|
||||||
|
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
|
||||||
|
|
||||||
|
## Type Support for `.vue` Imports in TS
|
||||||
|
|
||||||
|
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
|
||||||
|
|
||||||
|
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
|
||||||
|
|
||||||
|
1. Disable the built-in TypeScript Extension
|
||||||
|
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
|
||||||
|
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
|
||||||
|
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
|
||||||
|
|
||||||
|
## Customize configuration
|
||||||
|
|
||||||
|
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||||
|
|
||||||
|
## Project Setup
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compile and Hot-Reload for Development
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
### Type-Check, Compile and Minify for Production
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm run build
|
||||||
|
```
|
||||||
|
|
||||||
|
### Lint with [ESLint](https://eslint.org/)
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm run lint
|
||||||
|
```
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<link rel="icon" href="/favicon.ico">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>KaRTS Dice Roller</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.ts"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,36 @@
|
|||||||
|
{
|
||||||
|
"name": "kartsroller",
|
||||||
|
"version": "0.0.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "run-p type-check build-only",
|
||||||
|
"preview": "vite preview",
|
||||||
|
"build-only": "vite build",
|
||||||
|
"type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false",
|
||||||
|
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
|
||||||
|
"format": "prettier --write src/"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"bootstrap": "^5.2.3",
|
||||||
|
"vue": "^3.3.2"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@rushstack/eslint-patch": "^1.2.0",
|
||||||
|
"@tsconfig/node18": "^2.0.1",
|
||||||
|
"@types/node": "^18.16.8",
|
||||||
|
"@vitejs/plugin-vue": "^4.2.3",
|
||||||
|
"@vitejs/plugin-vue-jsx": "^3.0.1",
|
||||||
|
"@vue/eslint-config-prettier": "^7.1.0",
|
||||||
|
"@vue/eslint-config-typescript": "^11.0.3",
|
||||||
|
"@vue/tsconfig": "^0.4.0",
|
||||||
|
"eslint": "^8.39.0",
|
||||||
|
"eslint-plugin-vue": "^9.11.0",
|
||||||
|
"npm-run-all": "^4.1.5",
|
||||||
|
"prettier": "^2.8.8",
|
||||||
|
"sass": "^1.62.1",
|
||||||
|
"typescript": "~5.0.4",
|
||||||
|
"vite": "^4.3.5",
|
||||||
|
"vue-tsc": "^1.6.4"
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,13 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
|
||||||
|
import Roller from './components/Roller.vue';
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Roller />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#000" d="M450.169 181.354L379.685 84.29 265.629 47.325v92.652l96.384 70.031zm-91.46-28.416a19.735 19.735 0 0 1-3.004 6.606 16.563 16.563 0 0 1-11.924 6.857q-7.548.918-15.729-5.056-8.18-5.974-9.599-13.439a16.563 16.563 0 0 1 2.922-13.414 19.747 19.747 0 0 1 5.378-4.866q3.422-2.206 9.026-1.574a18.757 18.757 0 0 1-1.717-10.421 21.082 21.082 0 0 1 4.03-9.802 19.246 19.246 0 0 1 13.666-7.99q8.633-1.108 17.779 5.57 9.146 6.677 10.326 14.952a20.033 20.033 0 0 1-3.827 15.204 20.772 20.772 0 0 1-8.145 6.797 16.312 16.312 0 0 1-10.17 1.192q2.038 5.461.989 9.384zm-10.731-8.287a8.252 8.252 0 0 1-1.717 6.189 8.907 8.907 0 0 1-15.669-3.685 8.562 8.562 0 0 1 1.908-6.367 8.347 8.347 0 0 1 5.33-3.578 8.252 8.252 0 0 1 6.451 1.825 8.347 8.347 0 0 1 3.757 5.628zm9.54-11.77a10.732 10.732 0 0 1-11.472-8.346q-.548-3.709 2.504-7.894a10.851 10.851 0 0 1 6.654-4.77 10.732 10.732 0 0 1 11.543 8.43 10.851 10.851 0 0 1-2.469 7.775q-2.945 4.198-6.653 4.806zm-110.968 7.096V47.325L132.494 84.29 62.01 181.354l88.156 28.618zm-112.66-21.798l37.895-26.52a31.73 31.73 0 0 1 5.056 12.664q1.55 7.155-2.79 19.413a98.304 98.304 0 0 0-4.341 14.524 13.904 13.904 0 0 0 2.158 10.314 10.732 10.732 0 0 0 6.034 4.472 8.347 8.347 0 0 0 7.154-1.574q4.961-3.47 4.162-8.43a22.418 22.418 0 0 0-3.577-7.644l10.577-7.393q4.674 7.25 5.425 13.2 1.443 11.328-9.682 19.079-8.789 6.153-17.386 4.913-8.597-1.24-14.214-9.242a21.237 21.237 0 0 1-3.97-13.486 44.513 44.513 0 0 1 3.112-12.568l2.194-6.141q2.063-5.76 2.659-8.12a15.025 15.025 0 0 0 .43-4.77l-24.16 16.908zm64.7 215.412h114.998l35.51-109.37-93.009-67.598-93.009 67.599zm89.266-95.072a8.347 8.347 0 0 0-6.797-2.838q-6.058 0-8.24 4.52a22.382 22.382 0 0 0-1.49 8.346h-12.855q.322-8.62 3.124-13.927 5.319-10.112 18.889-10.112 10.731 0 17.063 5.962 6.332 5.962 6.237 15.633a21.25 21.25 0 0 1-4.484 13.32 44.585 44.585 0 0 1-9.659 8.62l-5.318 3.769q-4.996 3.577-6.832 5.127a15 15 0 0 0-3.1 3.685h29.488v11.685h-46.207a31.73 31.73 0 0 1 3.125-13.271q2.838-6.75 13.414-14.31a98.602 98.602 0 0 0 11.925-9.408 13.916 13.916 0 0 0 4.15-9.682 10.732 10.732 0 0 0-2.433-7.13zm-79.607-1.812a58.536 58.536 0 0 0 8.776-.835 12.377 12.377 0 0 0 6.511-3.577 11.686 11.686 0 0 0 2.6-4.842 11.125 11.125 0 0 0 .512-2.707h11.09v67.54h-13.606v-46.553H208.25v-9.038zM196.468 352.67l-54.434 75.04 114.055 36.965 114.056-36.965-54.434-75.04H196.468zm77.27 83.792q-5.64 7.226-17.517 7.214-12.76 0-18.817-10.672-4.71-8.347-4.71-21.464a97.78 97.78 0 0 1 .656-12.58 38.444 38.444 0 0 1 4.52-14.309 23.121 23.121 0 0 1 7.571-7.87 20.414 20.414 0 0 1 11.197-2.981q9.408 0 15 4.77a18.328 18.328 0 0 1 6.285 12.83h-13.165a6.773 6.773 0 0 0-1.252-3.577 7.286 7.286 0 0 0-6.475-3.172q-6.474 0-9.217 7.262a45.062 45.062 0 0 0-2.051 11.829 14.905 14.905 0 0 1 5.724-4.281 20.975 20.975 0 0 1 22.19 4.77 21.833 21.833 0 0 1 5.748 15.609 26.34 26.34 0 0 1-5.64 16.61zm-10.732-24.612q2.885 3.148 2.885 9.063a13.868 13.868 0 0 1-2.54 8.645 8.275 8.275 0 0 1-6.963 3.327 9.36 9.36 0 0 1-7.453-3.446 13.248 13.248 0 0 1-2.862-8.884q0-6.75 3.911-9.778a9.456 9.456 0 0 1 5.962-2.05 9.241 9.241 0 0 1 7.131 3.111zm119.147-112.195l27.879 8.347-4.77 16.157zm-14.31-71.546l-36.81 113.28 54.483 74.993L456 319.366V199.503zm66.073 86.952l-13.927-4.162-7.656 25.614-11.113-3.315-32.196-35.523 4.27-14.309 40.434 12.08 2.183-7.322 9.956 2.97-2.182 7.32 13.928 4.162zm-289.76-86.952L56 199.491v119.934l70.484 97.016 54.482-74.992zM72.54 286.24l44.43-14-4.77-15.143 8.621-2.719a58.536 58.536 0 0 0 3.435 8.12 12.377 12.377 0 0 0 5.33 5.14 11.686 11.686 0 0 0 5.401 1.026 11.137 11.137 0 0 0 2.731-.322l3.327 10.576-64.391 20.272zm18.47 58.596l-4.09-12.974 44.43-13.999-4.77-15.144 8.622-2.718a58.68 58.68 0 0 0 3.434 8.12 12.365 12.365 0 0 0 5.33 5.14 11.65 11.65 0 0 0 5.402 1.025 11.102 11.102 0 0 0 2.73-.322l3.328 10.577z"/></svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
@ -0,0 +1,38 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
viewBox="0 0 512 512"
|
||||||
|
version="1.1"
|
||||||
|
id="svg1422"
|
||||||
|
sodipodi:docname="d12blank.svg"
|
||||||
|
inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg">
|
||||||
|
<defs
|
||||||
|
id="defs1426" />
|
||||||
|
<sodipodi:namedview
|
||||||
|
id="namedview1424"
|
||||||
|
pagecolor="#505050"
|
||||||
|
bordercolor="#eeeeee"
|
||||||
|
borderopacity="1"
|
||||||
|
inkscape:showpageshadow="0"
|
||||||
|
inkscape:pageopacity="0"
|
||||||
|
inkscape:pagecheckerboard="0"
|
||||||
|
inkscape:deskcolor="#505050"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:zoom="3.609375"
|
||||||
|
inkscape:cx="256"
|
||||||
|
inkscape:cy="256"
|
||||||
|
inkscape:window-width="3840"
|
||||||
|
inkscape:window-height="2080"
|
||||||
|
inkscape:window-x="2869"
|
||||||
|
inkscape:window-y="-11"
|
||||||
|
inkscape:window-maximized="1"
|
||||||
|
inkscape:current-layer="svg1422" />
|
||||||
|
<path
|
||||||
|
fill="#000000"
|
||||||
|
d="M 450.169,181.354 379.685,84.29 265.629,47.325 v 92.652 l 96.384,70.031 z M 246.55,139.977 V 47.325 L 132.494,84.29 62.01,181.354 l 88.156,28.618 z m -47.96,193.614 h 114.998 l 35.51,-109.37 -93.009,-67.598 -93.009,67.599 z m -2.122,19.079 -54.434,75.04 114.055,36.965 114.056,-36.965 -54.434,-75.04 z m 171.375,-124.561 -36.81,113.28 54.483,74.993 L 456,319.366 V 199.503 Z m -223.687,0 L 56,199.491 v 119.934 l 70.484,97.016 54.482,-74.992 z"
|
||||||
|
id="path1420"
|
||||||
|
sodipodi:nodetypes="cccccccccccccccccccccccccccccccccccc" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
@ -0,0 +1,25 @@
|
|||||||
|
@import url('https://fonts.cdnfonts.com/css/century-schoolbook');
|
||||||
|
|
||||||
|
#app {
|
||||||
|
max-width: 1024px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 1em;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
font-family: 'Century Schoolbook', 'Times New Roman', Times, serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
$theme-colors: (
|
||||||
|
"primary": rgb(89, 25, 9)
|
||||||
|
);
|
||||||
|
|
||||||
|
$body-bg: hsl(34, 65%, 85%);
|
||||||
|
|
||||||
|
$accordion-button-color: white;
|
||||||
|
$accordion-button-bg: rgb(89, 25, 9);
|
||||||
|
$accordion-button-active-bg: white;
|
||||||
|
$accordion-button-active-color: rgb(89, 25, 9);
|
||||||
|
|
||||||
|
@import 'bootstrap/scss/bootstrap.scss'
|
||||||
@ -0,0 +1,46 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed } from 'vue';
|
||||||
|
|
||||||
|
const props = defineProps<{ roll: number, dt: number }>();
|
||||||
|
|
||||||
|
const rollProps = computed(() => ({
|
||||||
|
critical: props.roll == 12 || props.roll == 1,
|
||||||
|
success: props.roll > props.dt,
|
||||||
|
failure: props.roll <= props.dt
|
||||||
|
}));
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="die" :class="rollProps">
|
||||||
|
{{ props.roll }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
* {
|
||||||
|
--die-size: 2.8cm;
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
display: inline-block;
|
||||||
|
width: var(--die-size);
|
||||||
|
height: var(--die-size);
|
||||||
|
line-height: var(--die-size);
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
color: white;
|
||||||
|
font-size: x-large;
|
||||||
|
mask-image: url('@/assets/d12blank.svg');
|
||||||
|
-webkit-mask-image: url('@/assets/d12blank.svg');
|
||||||
|
margin: 0.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.success {
|
||||||
|
background-color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.failure {
|
||||||
|
background-color: rgb(194, 54, 19);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,85 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { Roll } from '@/kartsroller';
|
||||||
|
import Die from "@/components/Die.vue"
|
||||||
|
|
||||||
|
const props = defineProps<{ roll: Roll, i: number }>();
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<div class="summary accordion-header">
|
||||||
|
<button class="accordion-button" :class="i != 0 ? 'collapsed' : ''" type="button" data-bs-toggle="collapse"
|
||||||
|
:data-bs-target="'#collapse' + i" aria-expanded="true" :aria-controls="'collapse' + i">
|
||||||
|
{{ roll.margin }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="accordion-collapse collapse" :class="i == 0 ? 'show' : ''" :id="'collapse' + i">
|
||||||
|
<div class="accordion-body rollgrid">
|
||||||
|
<div class="critSuccesses">
|
||||||
|
<template v-for="r in roll.rolls.filter((x) => x == 12)">
|
||||||
|
<Die :roll=r :dt=roll.dt />
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="successes">
|
||||||
|
<template v-for="r in roll.rolls.filter((x) => x > roll.dt && x != 12)">
|
||||||
|
<Die :roll=r :dt=roll.dt />
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="critFailures">
|
||||||
|
<template v-for="r in roll.rolls.filter((x) => x == 1)">
|
||||||
|
<Die :roll=r :dt=roll.dt />
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="failures">
|
||||||
|
<template v-for="r in roll.rolls.filter((x) => x <= roll.dt && x != 1)">
|
||||||
|
<Die :roll=r :dt=props.roll.dt />
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
div.rollgrid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: [crits] 1fr [norm] 1fr;
|
||||||
|
grid-template-rows: [successes] 1fr [failures] 1fr;
|
||||||
|
grid-template-areas:
|
||||||
|
"critSuccesses successes"
|
||||||
|
"critFailures failures";
|
||||||
|
gap: 0.3em;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
div.rollgrid>div {
|
||||||
|
background-color: antiquewhite;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.summary>button {
|
||||||
|
grid-area: summary;
|
||||||
|
padding: 0.3em 1em;
|
||||||
|
font-size: xx-large;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.critSuccesses {
|
||||||
|
grid-area: critSuccesses;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.successes {
|
||||||
|
grid-area: successes;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.critFailures {
|
||||||
|
grid-area: critFailures;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.failures {
|
||||||
|
grid-area: failures;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,61 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { reactive } from 'vue'
|
||||||
|
import { Roller } from '../kartsroller'
|
||||||
|
import Roll from '@/components/Roll.vue'
|
||||||
|
|
||||||
|
const state = reactive(new Roller());
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<h1>Kingdoms and Rulers: Tides of Savits</h1>
|
||||||
|
<h2>Dice Roller</h2>
|
||||||
|
<div id="roller">
|
||||||
|
<div>
|
||||||
|
<label>CON</label>
|
||||||
|
<input type="number" id="con" :value="state.con"
|
||||||
|
@change="event => state.con = Number.parseFloat((<HTMLInputElement>event.target).value)" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>Dice Pool</label>
|
||||||
|
<input type="number" id="dice_pool" :value="state.pool" min="0"
|
||||||
|
@change="event => state.pool = Number.parseFloat((<HTMLInputElement>event.target).value)" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>DT</label>
|
||||||
|
<input type="number" id="dt" :value="state.dt" min="1" max="11"
|
||||||
|
@change="event => state.dt = Number.parseFloat((<HTMLInputElement>event.target).value)" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<input type="button" value="Roll" @click="state.roll" class="btn btn-primary" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="history" class="accordion accordion-flush">
|
||||||
|
<Roll v-for="(roll, i) in state.history" :roll="roll" :i="i" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
#roller {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-end;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#roller>div {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
font-size: large;
|
||||||
|
font-weight: bold;
|
||||||
|
font-variant: small-caps;
|
||||||
|
width: 4em;
|
||||||
|
margin: 0.3em
|
||||||
|
}
|
||||||
|
|
||||||
|
#roller input {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,56 @@
|
|||||||
|
export class Roller {
|
||||||
|
history: Roll[];
|
||||||
|
pool: number;
|
||||||
|
dt: number;
|
||||||
|
con: number;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.history = [];
|
||||||
|
this.pool = 7;
|
||||||
|
this.dt = 6;
|
||||||
|
this.con = 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
public roll() {
|
||||||
|
this.history.unshift(new Roll(this.pool, this.dt));
|
||||||
|
|
||||||
|
// console.log(this.history[0]);
|
||||||
|
// console.log(this.history[0].failures)
|
||||||
|
|
||||||
|
this.pool = Math.max(this.pool - this.history[0].failures, 0) + this.con;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Roll {
|
||||||
|
readonly rolls: number[];
|
||||||
|
readonly dt: number;
|
||||||
|
|
||||||
|
constructor(d: number, dt: number) {
|
||||||
|
|
||||||
|
this.dt = dt;
|
||||||
|
|
||||||
|
const rolls = [];
|
||||||
|
|
||||||
|
for (let i = 0; i < d; i++) {
|
||||||
|
rolls[i] = Math.floor(Math.random() * 12 + 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.rolls = rolls;
|
||||||
|
}
|
||||||
|
|
||||||
|
public get margin(): number {
|
||||||
|
const cf = this.rolls.filter((r) => r == 1).length;
|
||||||
|
const f = this.rolls.filter((r) => r > 1 && r <= this.dt).length;
|
||||||
|
const s = this.rolls.filter((r) => r < 12 && r > this.dt).length;
|
||||||
|
const cs = this.rolls.filter((r) => r == 12).length;
|
||||||
|
|
||||||
|
return 2 * cs + s - f - 2 * cf;
|
||||||
|
}
|
||||||
|
|
||||||
|
public get failures(): number {
|
||||||
|
const cf = this.rolls.filter((r) => r == 1).length;
|
||||||
|
const f = this.rolls.filter((r) => r > 1 && r <= this.dt).length;
|
||||||
|
|
||||||
|
return cf + f;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
import "bootstrap"
|
||||||
|
|
||||||
|
import './assets/main.scss'
|
||||||
|
|
||||||
|
import { createApp } from 'vue'
|
||||||
|
|
||||||
|
import App from './App.vue'
|
||||||
|
|
||||||
|
const app = createApp(App);
|
||||||
|
app.mount('#app');
|
||||||
|
|
||||||
@ -0,0 +1,12 @@
|
|||||||
|
{
|
||||||
|
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||||
|
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||||
|
"exclude": ["src/**/__tests__/*"],
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["./src/*"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
{
|
||||||
|
"files": [],
|
||||||
|
"references": [
|
||||||
|
{
|
||||||
|
"path": "./tsconfig.node.json"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "./tsconfig.app.json"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -0,0 +1,9 @@
|
|||||||
|
{
|
||||||
|
"extends": "@tsconfig/node18/tsconfig.json",
|
||||||
|
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"],
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"types": ["node"]
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import { fileURLToPath, URL } from 'node:url'
|
||||||
|
|
||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import vue from '@vitejs/plugin-vue'
|
||||||
|
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [vue(), vueJsx()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
Loading…
Reference in New Issue