diff --git a/.eslintrc.js b/.eslintrc.js index c7a39d6..a53379d 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: [ 'plugin:vue/essential', '@vue/standard', - '@vue/typescript/recommended' + '@vue/typescript/recommended', ], parserOptions: { ecmaVersion: 2020 @@ -18,6 +18,11 @@ module.exports = { '@typescript-eslint/no-unused-vars': 'off', quotes: 'off', 'function-paren-newline': ['error', 'multiline-arguments'], - '@typescript-eslint/member-ordering': ['warn'] + '@typescript-eslint/member-ordering': ['warn'], + 'indent': 'off', + '@typescript-eslint/indent': [ + 'error', + 2 + ], } } diff --git a/src/App.vue b/src/App.vue index 94c2599..dde3559 100644 --- a/src/App.vue +++ b/src/App.vue @@ -193,4 +193,18 @@ html { /* .component-fade-leave-active below version 2.1.8 */ { opacity: 0; } + +.onomatopoeia { + font-weight: bold; + font-style: italic; + font-size: 200%; + animation: fly-in 0.4s; + animation-timing-function: ease-out; + display: inline-block; +} + +@keyframes fly-in { + 0% { transform: scale(0, 0); opacity: 0 }; + 100% { transform: scale(1, 1); opacity: 1 }; +} diff --git a/src/components/Combat.vue b/src/components/Combat.vue index 7c5f70c..808bcd2 100644 --- a/src/components/Combat.vue +++ b/src/components/Combat.vue @@ -242,6 +242,15 @@ export default class Combat extends Vue { } else { this.executedRight(this.encounter.currentMove.ai.decide(this.encounter.currentMove, this.encounter)) } + } else { + if (this.encounter.currentMove.containedIn) { + this.writeLog( + this.encounter.currentMove.containedIn.statusLine( + this.encounter.currentMove.containedIn.owner, + this.encounter.currentMove + ) + ) + } } } } @@ -397,7 +406,7 @@ export default class Combat extends Vue { } .left-stats { - flex-direction: row; + flex-direction: row-reverse; } .right-stats { diff --git a/src/components/ContainerView.vue b/src/components/ContainerView.vue index 393580f..bbe106d 100644 --- a/src/components/ContainerView.vue +++ b/src/components/ContainerView.vue @@ -15,7 +15,7 @@ import { Component, Prop, Vue, Watch, Emit } from 'vue-property-decorator' import { Creature } from '@/game/creature' import { POV } from '@/game/language' import { Stats, Stat } from '@/game/combat' -import { Container, VoreContainer } from '@/game/vore' +import { Container } from '@/game/vore' function wiggle (contents: HTMLElement) { setTimeout(() => wiggle(contents), 3000) @@ -36,12 +36,13 @@ function wiggle (contents: HTMLElement) { // yoinked from https://jsfiddle.net/yckart/0adfw47y/ -function draw (delta: number, dt: number, total: number, parent: HTMLElement, canvas: HTMLCanvasElement, container: VoreContainer, smoothedFraction: number, smoothedLiveliness: number) { +function draw (delta: number, dt: number, total: number, parent: HTMLElement, canvas: HTMLCanvasElement, container: Container, smoothedFraction: number, smoothedLiveliness: number) { const ctx = canvas.getContext('2d') as CanvasRenderingContext2D canvas.width = parent.clientWidth canvas.height = parent.clientHeight - ctx.fillStyle = container.fluidColor + // TODO: put this back on the container + ctx.fillStyle = "#00ff00" const fraction = container.fullness / container.capacity const livingFraction = container.contents.reduce((total: number, prey: Creature) => total + prey.voreStats.Bulk, 0) / container.capacity const deadFraction = container.digested.reduce((total: number, prey: Creature) => total + prey.voreStats.Bulk, 0) / container.capacity @@ -74,7 +75,7 @@ function draw (delta: number, dt: number, total: number, parent: HTMLElement, ca @Component export default class ContainerView extends Vue { @Prop({ required: true }) - container!: VoreContainer + container!: Container mounted () { const canvas = this.$el.querySelector('.container-waves') as HTMLCanvasElement @@ -82,7 +83,7 @@ export default class ContainerView extends Vue { canvas.width = (this.$el as HTMLElement).clientWidth canvas.height = (this.$el as HTMLElement).clientHeight canvas.width = canvas.width + 0 - requestAnimationFrame((delta: number) => draw(delta, delta, Math.random() * 1000, this.$el as HTMLElement, canvas, (this.container as VoreContainer), 0, 0)) + requestAnimationFrame((delta: number) => draw(delta, delta, Math.random() * 1000, this.$el as HTMLElement, canvas, (this.container as Container), 0, 0)) wiggle(this.$el.querySelector(".container-contents") as HTMLElement) } diff --git a/src/components/ItemView.vue b/src/components/ItemView.vue index 60c700f..6a0fe1b 100644 --- a/src/components/ItemView.vue +++ b/src/components/ItemView.vue @@ -12,10 +12,6 @@