Коммит f0da7f19 создал по автору Medvedev Anton's avatar Medvedev Anton
Просмотр файлов

добавлен и протестирован Phaser

владелец 0598561e
......@@ -9,6 +9,7 @@
"version": "0.0.1",
"dependencies": {
"@quasar/extras": "^1.16.4",
"phaser": "^3.60.0",
"quasar": "^2.6.0",
"vue": "^3.0.0",
"vue-router": "^4.0.0"
......@@ -2402,6 +2403,11 @@
"node": ">= 0.6"
}
},
"node_modules/eventemitter3": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
"integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA=="
},
"node_modules/express": {
"version": "4.18.2",
"resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz",
......@@ -3854,6 +3860,14 @@
"node": ">=8"
}
},
"node_modules/phaser": {
"version": "3.60.0",
"resolved": "https://registry.npmjs.org/phaser/-/phaser-3.60.0.tgz",
"integrity": "sha512-IKUy35EnoEVcl2EmJ8WOyK4X8OoxHYdlhZLgRGpNrvD1fEagYffhVmwHcapE/tGiLgyrnezmXIo5RrH2NcrTHw==",
"dependencies": {
"eventemitter3": "^5.0.0"
}
},
"node_modules/picocolors": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
......
......@@ -14,20 +14,21 @@
},
"dependencies": {
"@quasar/extras": "^1.16.4",
"phaser": "^3.60.0",
"quasar": "^2.6.0",
"vue": "^3.0.0",
"vue-router": "^4.0.0"
},
"devDependencies": {
"@quasar/app-vite": "^1.3.0",
"@types/node": "^12.20.21",
"@typescript-eslint/eslint-plugin": "^5.10.0",
"@typescript-eslint/parser": "^5.10.0",
"autoprefixer": "^10.4.2",
"eslint": "^8.10.0",
"eslint-plugin-vue": "^9.0.0",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-vue": "^9.0.0",
"prettier": "^2.5.1",
"@types/node": "^12.20.21",
"@quasar/app-vite": "^1.3.0",
"autoprefixer": "^10.4.2",
"typescript": "^4.5.4"
},
"engines": {
......@@ -35,4 +36,4 @@
"npm": ">= 6.13.4",
"yarn": ">= 1.21.1"
}
}
\ Нет новой строки в конце файла
}
<template>
<div>
<p>{{ title }}</p>
<ul>
<li v-for="todo in todos" :key="todo.id" @click="increment">
{{ todo.id }} - {{ todo.content }}
</li>
</ul>
<p>Count: {{ todoCount }} / {{ meta.totalCount }}</p>
<p>Active: {{ active ? 'yes' : 'no' }}</p>
<p>Clicks on todos: {{ clickCount }}</p>
</div>
<div ref="gameRef"></div>
</template>
<script lang="ts">
import {
defineComponent,
PropType,
computed,
ref,
toRef,
Ref,
} from 'vue';
import { Todo, Meta } from './models';
import { ref, onMounted } from 'vue';
import * as Phaser from 'phaser';
function useClickCount() {
const clickCount = ref(0);
function increment() {
clickCount.value += 1
return clickCount.value;
}
export default {
setup() {
const gameRef = ref<HTMLDivElement | null>(null);
onMounted(() => {
const config: Phaser.Types.Core.GameConfig = {
type: Phaser.AUTO,
width: 800,
height: 600,
physics: {
default: 'arcade',
arcade: {
gravity: { y: 200 }
}
},
scene: {
preload: preload,
create: create
}
};
return { clickCount, increment };
}
new Phaser.Game(config);
function useDisplayTodo(todos: Ref<Todo[]>) {
const todoCount = computed(() => todos.value.length);
return { todoCount };
}
function preload(this: Phaser.Scene) {
this.load.setBaseURL('https://labs.phaser.io');
this.load.image('sky', 'assets/skies/space3.png');
this.load.image('logo', 'assets/sprites/phaser3-logo.png');
}
export default defineComponent({
name: 'ExampleComponent',
props: {
title: {
type: String,
required: true
},
todos: {
type: Array as PropType<Todo[]>,
default: () => []
},
meta: {
type: Object as PropType<Meta>,
required: true
},
active: {
type: Boolean
}
},
setup (props) {
return { ...useClickCount(), ...useDisplayTodo(toRef(props, 'todos')) };
},
});
function create(this: Phaser.Scene) {
this.add.image(400, 300, 'sky');
const logo = this.physics.add.image(400, 100, 'logo');
logo.setVelocity(100, 200);
logo.setBounce(1, 1);
logo.setCollideWorldBounds(true);
}
});
return { gameRef };
}
};
</script>
Поддерживает Markdown
0% или .
You are about to add 0 people to the discussion. Proceed with caution.
Сначала завершите редактирование этого сообщения!
Пожалуйста, зарегистрируйтесь или чтобы прокомментировать