vue 2 to 3 #1

Merged
gator merged 25 commits from dev into master 2022-12-02 11:23:43 +01:00
3 changed files with 48 additions and 12 deletions
Showing only changes of commit 523dda45e9 - Show all commits

View File

@ -29,7 +29,8 @@ export default {
canvasHeight: 'getCanvasHeight',
refreshRate: 'getRefreshRate',
initial1dState: 'getInitial1dState',
drawingDirection: 'getDrawingDirection'
drawingDirection: 'getDrawingDirection',
lastBoard: 'getLastBoard'
}),
boardWidth: function() {
return Math.floor(
@ -46,7 +47,8 @@ export default {
this.canvas = this.$refs['canvas']
this.ctx = this.canvas.getContext('2d')
this.$root.$on('draw1d', () => { this.draw1d() })
this.$root.$on('draw2d', () => { this.draw2d() })
this.$root.$on('draw2dNew', () => { this.draw2dNew() })
this.$root.$on('draw2dLast', () => { this.draw2dLast() })
this.$root.$on('reset', () => { this.reset() })
this.$root.$on('stop', () => { this.stop() })
},
@ -83,17 +85,11 @@ export default {
this.rules,
this.boardWidth
)
this.$store.commit('setLastBoard', board)
this.drawCanvas(board)
},
async draw2d() {
async draw2d(board) {
if (this.drawing === 0) return
const initialState = create2dState(
this.boardWidth,
this.boardHeight,
getRandomInt,
[0, 2],
);
const board = evolve2d(initialState, conwayRules);
const draw2dNext = async (b) => {
if (this.drawing === 0) return
@ -104,6 +100,21 @@ export default {
}
return draw2dNext(board)
},
async draw2dNew() {
const initialState = create2dState(
this.boardWidth,
this.boardHeight,
getRandomInt,
[0, 2],
);
const board = evolve2d(initialState, conwayRules);
this.$store.commit('setLastBoard', board)
this.draw2d(board)
},
async draw2dLast() {
console.log(this.lastBoard)
this.draw2d(this.lastBoard)
},
stop() {
this.$store.commit('setDrawingStatus', 0)
},

View File

@ -1,5 +1,13 @@
<template>
<MenuRow row-title="2D Cellular Automata">
<div class="form-field">
<label>Start from last result</label>
<input
type="button"
value="start"
@click="startFromLast"
>
</div>
<div class="form-field">
<input
type="button"
@ -27,15 +35,22 @@
<script>
import MenuRow from './MenuRow.vue'
import {mapGetters} from 'vuex'
export default {
name: 'Menu2dCA',
components: {
MenuRow
},
computed: {
...mapGetters({
lastBoard: 'getLastBoard',
})
},
methods: {
draw2d() {
this.$root.$store.state.drawing = 1
this.$root.$emit('draw2d')
this.$root.$emit('draw2dNew')
},
reset() {
this.$root.$emit('reset')
@ -43,6 +58,9 @@ export default {
stop() {
this.$root.$emit('stop')
},
startFromLast() {
this.$root.$emit('draw2dLast')
}
}
}
</script>

View File

@ -26,7 +26,8 @@ export default new Vuex.Store({
refreshRate: 300,
initial1dState: "onecell",
activeMenu: "Elementary Cellular Automata",
drawingDirection: "y"
drawingDirection: "y",
lastBoard: {}
},
mutations: {
update1dSingleRule(state, data) {
@ -59,6 +60,9 @@ export default new Vuex.Store({
setDrawingDirection(state, data) {
state.drawingDirection = data
},
setLastBoard(state, data) {
state.lastBoard = data
},
},
getters: {
getCellProperties(state) {
@ -90,6 +94,9 @@ export default new Vuex.Store({
},
getDrawingDirection(state) {
return state.drawingDirection
},
getLastBoard(state) {
return state.lastBoard
}
},
actions: {