Skip to content

Commit

Permalink
workin on #9, #3, and #1
Browse files Browse the repository at this point in the history
  • Loading branch information
Michael Joseph committed Dec 6, 2018
1 parent be9562c commit 1c2ae9a
Show file tree
Hide file tree
Showing 6 changed files with 108 additions and 194 deletions.
1 change: 1 addition & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
node_modules/
dist/
OnPaste.ts
10 changes: 10 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 2 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,12 @@
"webpack-dev-server": "^3.1.10"
},
"dependencies": {
"@types/ramda": "^0.25.42",
"@types/webpack": "^4.4.17",
"chart.js": "^2.7.3",
"material-design-icons-iconfont": "^4.0.2",
"ramda": "^0.26.1",
"tsmonad": "^0.8.0",
"vue-chartjs": "^3.4.0",
"vue-echarts": "^3.1.3",
"vuetify": "^1.3.5"
Expand Down
2 changes: 1 addition & 1 deletion src/Stat.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,6 @@ export class Stat {
}

public static Char(val: number) {
return new Stat('Char', 'Charisma', val);
return new Stat('CHAR', 'Charisma', val);
}
}
181 changes: 84 additions & 97 deletions src/components/StatsCard.vue
View file
Original file line number Diff line number Diff line change
@@ -1,111 +1,98 @@
<template>
<v-card color="grey lighten-2">
<v-card-text>
<h3>Main Stats</h3>
<v-divider></v-divider>
<p>
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
<!-- YOU WERE HERE -->
DEX: {{ stats.dex }}
<br>
STR: {{ stats.str }}
<br>
INT: {{ stats.int }}
<br>
CHAR: {{ stats.char }}
</p>
</v-card-text>
<v-card-actions>
<!-- OLD -->
<!-- <v-btn dark small color="indigo" @click="editStats()">EDIT</v-btn> -->
<v-spacer></v-spacer>
<v-dialog
v-model="dialog"
width="500"
>
<v-btn
slot="activator"
color="indigo"
dark
small
>
EDIT
</v-btn>
<v-card color="grey lighten-2">
<v-card-title>
<h2>Edit Main Stats</h2>
</v-card-title>
<v-container grid-list-md>
<v-layout row wrap>
<v-flex v-for="(stat, index) in mainStats" :key="`stat-${index}`" xs3>
<v-text-field
:label="stat.shortName"
:placeholder="`${stat.val}`"
outline
v-model="formStats[index]"
></v-text-field>
</v-flex>
</v-layout>
</v-container>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="indigo"
dark
@click="submitForm()"
>
Save
</v-btn>
<v-btn
color="indigo"
flat
@click="dialog = false"
<!-- <v-card color="grey lighten-2"> -->
<v-card>
<v-card-text>
<h3>Main Stats</h3>
<v-divider></v-divider>
<v-list dense>
<v-list-tile
v-for="(stat, index) in mainStats"
:key="index"
>
Cancel
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-card-actions>
</v-card>
<v-list-tile-content>
<v-list-tile-title>{{stat.shortName}}</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-content
class="align-end"
>
<v-list-tile-sub-title>{{stat.val}}</v-list-tile-sub-title>
</v-list-tile-content>
</v-list-tile>
</v-list>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-dialog
v-model="dialog"
width="500"
>
<v-btn
slot="activator"
color="indigo"
dark
small
>
EDIT
</v-btn>
<v-card color="grey lighten-2">
<v-card-title>
<h2>Edit Main Stats</h2>
</v-card-title>
<v-container grid-list-md>
<v-layout row wrap>
<v-flex
v-for="(stat, index) in mainStats"
:key="index"
xs3
>
<v-text-field
:label="stat.shortName"
:placeholder="`${stat.val}`"
outline
v-model="formStats[index].val"
></v-text-field>
</v-flex>
</v-layout>
</v-container>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="indigo"
dark
@click="submitForm()"
>
Save
</v-btn>
<v-btn
color="indigo"
flat
@click="dialog = false"
>
Cancel
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-card-actions>
</v-card>
</template>

<script lang="ts">
import Vue from 'vue'
import { Component, Prop, Watch } from 'vue-property-decorator'
import { Component, Prop } from 'vue-property-decorator'
import { Stat } from '../Stat'
// import { Maybe } from 'tsmonad';
@Component
export default class CharacterSummary extends Vue {
@Prop({required: true})
export default class StatsCard extends Vue {
@Prop({
default: () => [Stat.Dex(10), Stat.Int(14), Stat.Char(6), Stat.AC(10)]
})
mainStats!: Stat[];
dialog: boolean = false;
formStats = this.mainStats;
submitForm(): void {
Expand Down
106 changes: 10 additions & 96 deletions src/components/app.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,102 +14,13 @@
<v-layout row wrap>
<v-flex xs12 md6>
<character-summary
:character-class="characterClass"
:name="name"
:bio="bio"
></character-summary>
:character-class="characterClass"
:name="name"
:bio="bio"
></character-summary>
</v-flex>
<v-flex xs4 md2>
<v-card color="grey lighten-2">
<v-card-text>
<h3>Main Stats</h3>
<v-divider></v-divider>
<p>
DEX: {{ stats.dex }}
<br>
STR: {{ stats.str }}
<br>
INT: {{ stats.int }}
<br>
CHAR: {{ stats.char }}
</p>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-dialog
v-model="dialog"
width="500"
>
<v-btn
slot="activator"
color="indigo"
dark
small
>
EDIT
</v-btn>
<v-card color="grey lighten-2">
<v-card-title>
<h2>Edit Main Stats</h2>
</v-card-title>
<v-container grid-list-md>
<v-layout row wrap>
<v-flex xs3>
<v-text-field
label="DEX"
:placeholder="`${stats.dex}`"
outline
v-model="formStats.dex"
></v-text-field>
</v-flex>
<v-flex xs3>
<v-text-field
label="STR"
:placeholder="`${stats.str}`"
outline
v-model="formStats.str"
></v-text-field>
</v-flex>
<v-flex xs3>
<v-text-field
label="INT"
:placeholder="`${stats.int}`"
outline
v-model="formStats.int"
></v-text-field>
</v-flex>
<v-flex xs3>
<v-text-field
label="CHAR"
:placeholder="`${stats.char}`"
outline
v-model="formStats.char"
></v-text-field>
</v-flex>
</v-layout>
</v-container>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="indigo"
dark
@click="submitForm()"
>
Save
</v-btn>
<v-btn
color="indigo"
flat
@click="dialog = false"
>
Cancel
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-card-actions>
</v-card>
<stats-card></stats-card>
</v-flex>
<v-flex xs4 md2>
<v-card color="grey lighten-2">
Expand Down Expand Up @@ -147,12 +58,16 @@
import Vue from "vue";
// import RadarChart from './RadarChart.vue';
import CharacterSummary from './CharacterSummary.vue'
import StatsCard from './StatsCard.vue'
// import R from 'ramda';



// Vue.extend({components: [CharacterSummary]})

export default Vue.extend({
name: 'CharacterSheet',
components: { CharacterSummary },
components: { CharacterSummary, StatsCard },
data()
{
return {
Expand Down Expand Up @@ -195,7 +110,6 @@ export default Vue.extend({
init: function (): number {
return this.stats.dex
}

},
methods:
{
Expand Down

0 comments on commit 1c2ae9a

Please sign in to comment.