forked from noxious/client
Worked on zone manager
This commit is contained in:
@ -1,23 +1,7 @@
|
||||
<template>
|
||||
<Container>
|
||||
<Rectangle
|
||||
:x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)"
|
||||
:y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)"
|
||||
:origin-x="0.5"
|
||||
:origin-y="10.5"
|
||||
:fillColor="0xFFFFFF"
|
||||
:width="74"
|
||||
:height="8"
|
||||
>
|
||||
<Rectangle
|
||||
:x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)"
|
||||
:y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)"
|
||||
:origin-x="0.5"
|
||||
:origin-y="20.5"
|
||||
:fillColor="0x09ad19"
|
||||
:width="70"
|
||||
:height="4"
|
||||
/>
|
||||
<Rectangle :x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)" :y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)" :origin-x="0.5" :origin-y="10.5" :fillColor="0xffffff" :width="74" :height="8">
|
||||
<Rectangle :x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)" :y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)" :origin-x="0.5" :origin-y="20.5" :fillColor="0x09ad19" :width="70" :height="4" />
|
||||
</Rectangle>
|
||||
<Text
|
||||
@create="createText"
|
||||
@ -29,20 +13,16 @@
|
||||
:style="{
|
||||
fontFamily: 'Helvetica, Arial',
|
||||
color: '#FFF',
|
||||
fontSize: '14px',
|
||||
fontSize: '14px'
|
||||
}"
|
||||
/>
|
||||
<Sprite
|
||||
ref="sprite"
|
||||
:x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)"
|
||||
:y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)"
|
||||
play="walk" />
|
||||
<Sprite ref="sprite" :x="tileToWorldX(layer, props.character?.position_x, props.character?.position_y)" :y="tileToWorldY(layer, props.character?.position_x, props.character?.position_y)" play="walk" />
|
||||
</Container>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { Container, Rectangle, Sprite, Text, useScene } from 'phavuer'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { onBeforeMount, onMounted, ref } from 'vue'
|
||||
import { useSocketStore } from '@/stores/socket'
|
||||
import { type Character as CharacterT } from '@/types'
|
||||
import { getTile, tileToWorldX, tileToWorldXY, tileToWorldY } from '@/services/zone'
|
||||
@ -55,33 +35,32 @@ const props = defineProps({
|
||||
})
|
||||
|
||||
const scene = useScene()
|
||||
const isSelf = props.character.id === socket.character.id;
|
||||
const isSelf = props.character.id === socket.character.id
|
||||
|
||||
const createText = (text: Phaser.GameObjects.Text) => {
|
||||
text.setLetterSpacing(1.5);
|
||||
text.setLetterSpacing(1.5)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
onBeforeMount(() => {
|
||||
if (isSelf) setupSelf()
|
||||
});
|
||||
})
|
||||
|
||||
function setupSelf()
|
||||
{
|
||||
function setupSelf() {
|
||||
scene.input.on(Phaser.Input.Events.POINTER_UP, onPointerClick)
|
||||
}
|
||||
|
||||
function onPointerClick(pointer: Phaser.Input.Pointer) {
|
||||
if (!isSelf) return;
|
||||
if (!isSelf) return
|
||||
|
||||
const px = scene.cameras.main.worldView.x + pointer.x
|
||||
const py = scene.cameras.main.worldView.y + pointer.y
|
||||
|
||||
const pointer_tile = getTile(px, py, props.layer) as Phaser.Tilemaps.Tile
|
||||
if (!pointer_tile) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
|
||||
socket.getConnection.emit('character:move', { position_x: pointer_tile.x, position_y: pointer_tile.y })
|
||||
socket.connection.emit('character:move', { position_x: pointer_tile.x, position_y: pointer_tile.y })
|
||||
|
||||
//Directions for player sprites + animations
|
||||
if (px < 0 && py > 0) {
|
||||
@ -95,9 +74,6 @@ function onPointerClick(pointer: Phaser.Input.Pointer) {
|
||||
}
|
||||
}
|
||||
|
||||
// spacing
|
||||
|
||||
|
||||
/**
|
||||
* Resources:
|
||||
* https://www.youtube.com/watch?v=9sWrGohw9qo
|
||||
|
Reference in New Issue
Block a user