Merge pull request #349 from thecodingmachine/customtextures
Adding custom character textures
This commit is contained in:
commit
e7f1f06272
back/src
Controller
Model/Websocket
Services
front/src
Connexion
Phaser
maps/characters
messages
@ -31,7 +31,6 @@ export class AuthenticateController extends BaseController {
|
|||||||
res.onAborted(() => {
|
res.onAborted(() => {
|
||||||
console.warn('Login request was aborted');
|
console.warn('Login request was aborted');
|
||||||
})
|
})
|
||||||
const host = req.getHeader('host');
|
|
||||||
const param = await res.json();
|
const param = await res.json();
|
||||||
|
|
||||||
//todo: what to do if the organizationMemberToken is already used?
|
//todo: what to do if the organizationMemberToken is already used?
|
||||||
@ -45,6 +44,7 @@ export class AuthenticateController extends BaseController {
|
|||||||
const worldSlug = data.worldSlug;
|
const worldSlug = data.worldSlug;
|
||||||
const roomSlug = data.roomSlug;
|
const roomSlug = data.roomSlug;
|
||||||
const mapUrlStart = data.mapUrlStart;
|
const mapUrlStart = data.mapUrlStart;
|
||||||
|
const textures = data.textures;
|
||||||
|
|
||||||
const authToken = jwtTokenManager.createJWTToken(userUuid);
|
const authToken = jwtTokenManager.createJWTToken(userUuid);
|
||||||
res.writeStatus("200 OK");
|
res.writeStatus("200 OK");
|
||||||
@ -56,6 +56,7 @@ export class AuthenticateController extends BaseController {
|
|||||||
worldSlug,
|
worldSlug,
|
||||||
roomSlug,
|
roomSlug,
|
||||||
mapUrlStart,
|
mapUrlStart,
|
||||||
|
textures
|
||||||
}));
|
}));
|
||||||
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import {ExSocketInterface} from "../Model/Websocket/ExSocketInterface"; //TODO fix import by "_Model/.."
|
import {CharacterLayer, ExSocketInterface} from "../Model/Websocket/ExSocketInterface"; //TODO fix import by "_Model/.."
|
||||||
import {GameRoomPolicyTypes} from "../Model/GameRoom";
|
import {GameRoomPolicyTypes} from "../Model/GameRoom";
|
||||||
import {PointInterface} from "../Model/Websocket/PointInterface";
|
import {PointInterface} from "../Model/Websocket/PointInterface";
|
||||||
import {
|
import {
|
||||||
@ -18,10 +18,9 @@ import {UserMovesMessage} from "../Messages/generated/messages_pb";
|
|||||||
import {TemplatedApp} from "uWebSockets.js"
|
import {TemplatedApp} from "uWebSockets.js"
|
||||||
import {parse} from "query-string";
|
import {parse} from "query-string";
|
||||||
import {jwtTokenManager} from "../Services/JWTTokenManager";
|
import {jwtTokenManager} from "../Services/JWTTokenManager";
|
||||||
import {adminApi, fetchMemberDataByUuidResponse} from "../Services/AdminApi";
|
import {adminApi, CharacterTexture, FetchMemberDataByUuidResponse} from "../Services/AdminApi";
|
||||||
import {socketManager} from "../Services/SocketManager";
|
import {SocketManager, socketManager} from "../Services/SocketManager";
|
||||||
import {emitInBatch, resetPing} from "../Services/IoSocketHelpers";
|
import {emitInBatch, resetPing} from "../Services/IoSocketHelpers";
|
||||||
import Jwt from "jsonwebtoken";
|
|
||||||
import {clientEventsEmitter} from "../Services/ClientEventsEmitter";
|
import {clientEventsEmitter} from "../Services/ClientEventsEmitter";
|
||||||
import {ADMIN_API_TOKEN} from "../Enum/EnvironmentVariable";
|
import {ADMIN_API_TOKEN} from "../Enum/EnvironmentVariable";
|
||||||
|
|
||||||
@ -159,25 +158,28 @@ export class IoSocketController {
|
|||||||
characterLayers = [ characterLayers ];
|
characterLayers = [ characterLayers ];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const userUuid = await jwtTokenManager.getUserUuidFromToken(token);
|
const userUuid = await jwtTokenManager.getUserUuidFromToken(token);
|
||||||
|
|
||||||
let memberTags: string[] = [];
|
let memberTags: string[] = [];
|
||||||
|
let memberTextures: CharacterTexture[] = [];
|
||||||
const room = await socketManager.getOrCreateRoom(roomId);
|
const room = await socketManager.getOrCreateRoom(roomId);
|
||||||
if (!room.anonymous && room.policyType !== GameRoomPolicyTypes.ANONYMUS_POLICY) {
|
try {
|
||||||
try {
|
const userData = await adminApi.fetchMemberDataByUuid(userUuid);
|
||||||
const userData = await adminApi.fetchMemberDataByUuid(userUuid);
|
//console.log('USERDATA', userData)
|
||||||
memberTags = userData.tags;
|
memberTags = userData.tags;
|
||||||
if (room.policyType === GameRoomPolicyTypes.USE_TAGS_POLICY && !room.canAccess(memberTags)) {
|
memberTextures = userData.textures;
|
||||||
throw new Error('No correct tags')
|
if (!room.anonymous && room.policyType === GameRoomPolicyTypes.USE_TAGS_POLICY && !room.canAccess(memberTags)) {
|
||||||
}
|
throw new Error('No correct tags')
|
||||||
console.log('access granted for user '+userUuid+' and room '+roomId);
|
|
||||||
} catch (e) {
|
|
||||||
console.log('access not granted for user '+userUuid+' and room '+roomId);
|
|
||||||
throw new Error('Client cannot acces this ressource.')
|
|
||||||
}
|
}
|
||||||
|
//console.log('access granted for user '+userUuid+' and room '+roomId);
|
||||||
|
} catch (e) {
|
||||||
|
console.log('access not granted for user '+userUuid+' and room '+roomId);
|
||||||
|
throw new Error('Client cannot acces this ressource.')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Generate characterLayers objects from characterLayers string[]
|
||||||
|
const characterLayerObjs: CharacterLayer[] = SocketManager.mergeCharacterLayersAndCustomTextures(characterLayers, memberTextures);
|
||||||
|
|
||||||
if (upgradeAborted.aborted) {
|
if (upgradeAborted.aborted) {
|
||||||
console.log("Ouch! Client disconnected before we could upgrade it!");
|
console.log("Ouch! Client disconnected before we could upgrade it!");
|
||||||
/* You must not upgrade now */
|
/* You must not upgrade now */
|
||||||
@ -192,8 +194,9 @@ export class IoSocketController {
|
|||||||
userUuid,
|
userUuid,
|
||||||
roomId,
|
roomId,
|
||||||
name,
|
name,
|
||||||
characterLayers,
|
characterLayers: characterLayerObjs,
|
||||||
tags: memberTags,
|
tags: memberTags,
|
||||||
|
textures: memberTextures,
|
||||||
position: {
|
position: {
|
||||||
x: x,
|
x: x,
|
||||||
y: y,
|
y: y,
|
||||||
@ -233,7 +236,7 @@ export class IoSocketController {
|
|||||||
resetPing(client);
|
resetPing(client);
|
||||||
|
|
||||||
//get data information and shwo messages
|
//get data information and shwo messages
|
||||||
adminApi.fetchMemberDataByUuid(client.userUuid).then((res: fetchMemberDataByUuidResponse) => {
|
adminApi.fetchMemberDataByUuid(client.userUuid).then((res: FetchMemberDataByUuidResponse) => {
|
||||||
if (!res.messages) {
|
if (!res.messages) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@ -311,6 +314,7 @@ export class IoSocketController {
|
|||||||
|
|
||||||
client.name = ws.name;
|
client.name = ws.name;
|
||||||
client.tags = ws.tags;
|
client.tags = ws.tags;
|
||||||
|
client.textures = ws.textures;
|
||||||
client.characterLayers = ws.characterLayers;
|
client.characterLayers = ws.characterLayers;
|
||||||
client.roomId = ws.roomId;
|
client.roomId = ws.roomId;
|
||||||
return client;
|
return client;
|
||||||
|
@ -3,6 +3,12 @@ import {Identificable} from "./Identificable";
|
|||||||
import {ViewportInterface} from "_Model/Websocket/ViewportMessage";
|
import {ViewportInterface} from "_Model/Websocket/ViewportMessage";
|
||||||
import {BatchMessage, SubMessage} from "../../Messages/generated/messages_pb";
|
import {BatchMessage, SubMessage} from "../../Messages/generated/messages_pb";
|
||||||
import {WebSocket} from "uWebSockets.js"
|
import {WebSocket} from "uWebSockets.js"
|
||||||
|
import {CharacterTexture} from "../../Services/AdminApi";
|
||||||
|
|
||||||
|
export interface CharacterLayer {
|
||||||
|
name: string,
|
||||||
|
url: string|undefined
|
||||||
|
}
|
||||||
|
|
||||||
export interface ExSocketInterface extends WebSocket, Identificable {
|
export interface ExSocketInterface extends WebSocket, Identificable {
|
||||||
token: string;
|
token: string;
|
||||||
@ -10,7 +16,7 @@ export interface ExSocketInterface extends WebSocket, Identificable {
|
|||||||
//userId: number; // A temporary (autoincremented) identifier for this user
|
//userId: number; // A temporary (autoincremented) identifier for this user
|
||||||
userUuid: string; // A unique identifier for this user
|
userUuid: string; // A unique identifier for this user
|
||||||
name: string;
|
name: string;
|
||||||
characterLayers: string[];
|
characterLayers: CharacterLayer[];
|
||||||
position: PointInterface;
|
position: PointInterface;
|
||||||
viewport: ViewportInterface;
|
viewport: ViewportInterface;
|
||||||
/**
|
/**
|
||||||
@ -21,5 +27,6 @@ export interface ExSocketInterface extends WebSocket, Identificable {
|
|||||||
batchTimeout: NodeJS.Timeout|null;
|
batchTimeout: NodeJS.Timeout|null;
|
||||||
pingTimeout: NodeJS.Timeout|null;
|
pingTimeout: NodeJS.Timeout|null;
|
||||||
disconnecting: boolean,
|
disconnecting: boolean,
|
||||||
tags: string[]
|
tags: string[],
|
||||||
|
textures: CharacterTexture[],
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,11 @@
|
|||||||
import {PointInterface} from "./PointInterface";
|
import {PointInterface} from "./PointInterface";
|
||||||
import {ItemEventMessage, PointMessage, PositionMessage} from "../../Messages/generated/messages_pb";
|
import {
|
||||||
import {ExSocketInterface} from "_Model/Websocket/ExSocketInterface";
|
CharacterLayerMessage,
|
||||||
|
ItemEventMessage,
|
||||||
|
PointMessage,
|
||||||
|
PositionMessage
|
||||||
|
} from "../../Messages/generated/messages_pb";
|
||||||
|
import {CharacterLayer, ExSocketInterface} from "_Model/Websocket/ExSocketInterface";
|
||||||
import Direction = PositionMessage.Direction;
|
import Direction = PositionMessage.Direction;
|
||||||
import {ItemEventMessageInterface} from "_Model/Websocket/ItemEventMessage";
|
import {ItemEventMessageInterface} from "_Model/Websocket/ItemEventMessage";
|
||||||
import {PositionInterface} from "_Model/PositionInterface";
|
import {PositionInterface} from "_Model/PositionInterface";
|
||||||
@ -89,4 +94,15 @@ export class ProtobufUtils {
|
|||||||
|
|
||||||
return itemEventMessage;
|
return itemEventMessage;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public static toCharacterLayerMessages(characterLayers: CharacterLayer[]): CharacterLayerMessage[] {
|
||||||
|
return characterLayers.map(function(characterLayer): CharacterLayerMessage {
|
||||||
|
const message = new CharacterLayerMessage();
|
||||||
|
message.setName(characterLayer.name);
|
||||||
|
if (characterLayer.url) {
|
||||||
|
message.setUrl(characterLayer.url);
|
||||||
|
}
|
||||||
|
return message;
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import {ADMIN_API_TOKEN, ADMIN_API_URL} from "../Enum/EnvironmentVariable";
|
import {ADMIN_API_TOKEN, ADMIN_API_URL} from "../Enum/EnvironmentVariable";
|
||||||
import Axios from "axios";
|
import Axios from "axios";
|
||||||
|
import {v4} from "uuid";
|
||||||
|
|
||||||
export interface AdminApiData {
|
export interface AdminApiData {
|
||||||
organizationSlug: string
|
organizationSlug: string
|
||||||
@ -9,12 +10,21 @@ export interface AdminApiData {
|
|||||||
tags: string[]
|
tags: string[]
|
||||||
policy_type: number
|
policy_type: number
|
||||||
userUuid: string
|
userUuid: string
|
||||||
messages?: unknown[]
|
messages?: unknown[],
|
||||||
|
textures: CharacterTexture[]
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface fetchMemberDataByUuidResponse {
|
export interface CharacterTexture {
|
||||||
|
id: number,
|
||||||
|
level: number,
|
||||||
|
url: string,
|
||||||
|
rights: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface FetchMemberDataByUuidResponse {
|
||||||
uuid: string;
|
uuid: string;
|
||||||
tags: string[];
|
tags: string[];
|
||||||
|
textures: CharacterTexture[];
|
||||||
messages: unknown[];
|
messages: unknown[];
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -43,16 +53,31 @@ class AdminApi {
|
|||||||
return res.data;
|
return res.data;
|
||||||
}
|
}
|
||||||
|
|
||||||
async fetchMemberDataByUuid(uuid: string): Promise<fetchMemberDataByUuidResponse> {
|
async fetchMemberDataByUuid(uuid: string): Promise<FetchMemberDataByUuidResponse> {
|
||||||
if (!ADMIN_API_URL) {
|
if (!ADMIN_API_URL) {
|
||||||
return Promise.reject('No admin backoffice set!');
|
return Promise.reject('No admin backoffice set!');
|
||||||
}
|
}
|
||||||
const res = await Axios.get(ADMIN_API_URL+'/api/membership/'+uuid,
|
try {
|
||||||
{ headers: {"Authorization" : `${ADMIN_API_TOKEN}`} }
|
const res = await Axios.get(ADMIN_API_URL+'/api/membership/'+uuid,
|
||||||
)
|
{ headers: {"Authorization" : `${ADMIN_API_TOKEN}`} }
|
||||||
return res.data;
|
)
|
||||||
|
return res.data;
|
||||||
|
} catch (e) {
|
||||||
|
if (e?.response?.status == 404) {
|
||||||
|
// If we get an HTTP 404, the token is invalid. Let's perform an anonymous login!
|
||||||
|
console.warn('Cannot find user with uuid "'+uuid+'". Performing an anonymous login instead.');
|
||||||
|
return {
|
||||||
|
uuid: v4(),
|
||||||
|
tags: [],
|
||||||
|
textures: [],
|
||||||
|
messages: [],
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
throw e;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async fetchMemberDataByToken(organizationMemberToken: string): Promise<AdminApiData> {
|
async fetchMemberDataByToken(organizationMemberToken: string): Promise<AdminApiData> {
|
||||||
if (!ADMIN_API_URL) {
|
if (!ADMIN_API_URL) {
|
||||||
return Promise.reject('No admin backoffice set!');
|
return Promise.reject('No admin backoffice set!');
|
||||||
@ -74,7 +99,7 @@ class AdminApi {
|
|||||||
)
|
)
|
||||||
return res.data;
|
return res.data;
|
||||||
}
|
}
|
||||||
|
|
||||||
reportPlayer(reportedUserUuid: string, reportedUserComment: string, reporterUserUuid: string) {
|
reportPlayer(reportedUserUuid: string, reportedUserComment: string, reporterUserUuid: string) {
|
||||||
return Axios.post(`${ADMIN_API_URL}/api/report`, {
|
return Axios.post(`${ADMIN_API_URL}/api/report`, {
|
||||||
reportedUserUuid,
|
reportedUserUuid,
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import {GameRoom} from "../Model/GameRoom";
|
import {GameRoom} from "../Model/GameRoom";
|
||||||
import {ExSocketInterface} from "../Model/Websocket/ExSocketInterface";
|
import {CharacterLayer, ExSocketInterface} from "../Model/Websocket/ExSocketInterface";
|
||||||
import {
|
import {
|
||||||
GroupDeleteMessage,
|
GroupDeleteMessage,
|
||||||
GroupUpdateMessage,
|
GroupUpdateMessage,
|
||||||
@ -23,6 +23,7 @@ import {
|
|||||||
WebRtcStartMessage,
|
WebRtcStartMessage,
|
||||||
QueryJitsiJwtMessage,
|
QueryJitsiJwtMessage,
|
||||||
SendJitsiJwtMessage,
|
SendJitsiJwtMessage,
|
||||||
|
CharacterLayerMessage,
|
||||||
SendUserMessage
|
SendUserMessage
|
||||||
} from "../Messages/generated/messages_pb";
|
} from "../Messages/generated/messages_pb";
|
||||||
import {PointInterface} from "../Model/Websocket/PointInterface";
|
import {PointInterface} from "../Model/Websocket/PointInterface";
|
||||||
@ -34,7 +35,7 @@ import {isSetPlayerDetailsMessage} from "../Model/Websocket/SetPlayerDetailsMess
|
|||||||
import {GROUP_RADIUS, JITSI_ISS, MINIMUM_DISTANCE, SECRET_JITSI_KEY} from "../Enum/EnvironmentVariable";
|
import {GROUP_RADIUS, JITSI_ISS, MINIMUM_DISTANCE, SECRET_JITSI_KEY} from "../Enum/EnvironmentVariable";
|
||||||
import {Movable} from "../Model/Movable";
|
import {Movable} from "../Model/Movable";
|
||||||
import {PositionInterface} from "../Model/PositionInterface";
|
import {PositionInterface} from "../Model/PositionInterface";
|
||||||
import {adminApi} from "./AdminApi";
|
import {adminApi, CharacterTexture} from "./AdminApi";
|
||||||
import Direction = PositionMessage.Direction;
|
import Direction = PositionMessage.Direction;
|
||||||
import {Gauge} from "prom-client";
|
import {Gauge} from "prom-client";
|
||||||
import {emitError, emitInBatch} from "./IoSocketHelpers";
|
import {emitError, emitInBatch} from "./IoSocketHelpers";
|
||||||
@ -54,7 +55,7 @@ export interface AdminSocketData {
|
|||||||
users: AdminSocketUsersList,
|
users: AdminSocketUsersList,
|
||||||
}
|
}
|
||||||
|
|
||||||
class SocketManager {
|
export class SocketManager {
|
||||||
private Worlds: Map<string, GameRoom> = new Map<string, GameRoom>();
|
private Worlds: Map<string, GameRoom> = new Map<string, GameRoom>();
|
||||||
private sockets: Map<number, ExSocketInterface> = new Map<number, ExSocketInterface>();
|
private sockets: Map<number, ExSocketInterface> = new Map<number, ExSocketInterface>();
|
||||||
private nbClientsGauge: Gauge<string>;
|
private nbClientsGauge: Gauge<string>;
|
||||||
@ -71,7 +72,7 @@ class SocketManager {
|
|||||||
help: 'Number of clients per room',
|
help: 'Number of clients per room',
|
||||||
labelNames: [ 'room' ]
|
labelNames: [ 'room' ]
|
||||||
});
|
});
|
||||||
|
|
||||||
clientEventsEmitter.registerToClientJoin((clientUUid, roomId) => {
|
clientEventsEmitter.registerToClientJoin((clientUUid, roomId) => {
|
||||||
this.nbClientsGauge.inc();
|
this.nbClientsGauge.inc();
|
||||||
// Let's log server load when a user joins
|
// Let's log server load when a user joins
|
||||||
@ -83,7 +84,7 @@ class SocketManager {
|
|||||||
console.log('A user left (', this.sockets.size, ' connected users)');
|
console.log('A user left (', this.sockets.size, ' connected users)');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getAdminSocketDataFor(roomId:string): AdminSocketData {
|
getAdminSocketDataFor(roomId:string): AdminSocketData {
|
||||||
const data:AdminSocketData = {
|
const data:AdminSocketData = {
|
||||||
rooms: {},
|
rooms: {},
|
||||||
@ -125,7 +126,7 @@ class SocketManager {
|
|||||||
const userJoinedMessage = new UserJoinedMessage();
|
const userJoinedMessage = new UserJoinedMessage();
|
||||||
userJoinedMessage.setUserid(thing.id);
|
userJoinedMessage.setUserid(thing.id);
|
||||||
userJoinedMessage.setName(player.name);
|
userJoinedMessage.setName(player.name);
|
||||||
userJoinedMessage.setCharacterlayersList(player.characterLayers);
|
userJoinedMessage.setCharacterlayersList(ProtobufUtils.toCharacterLayerMessages(player.characterLayers));
|
||||||
userJoinedMessage.setPosition(ProtobufUtils.toPositionMessage(player.position));
|
userJoinedMessage.setPosition(ProtobufUtils.toPositionMessage(player.position));
|
||||||
|
|
||||||
roomJoinedMessage.addUser(userJoinedMessage);
|
roomJoinedMessage.addUser(userJoinedMessage);
|
||||||
@ -251,8 +252,7 @@ class SocketManager {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
client.name = playerDetails.name;
|
client.name = playerDetails.name;
|
||||||
client.characterLayers = playerDetails.characterLayers;
|
client.characterLayers = SocketManager.mergeCharacterLayersAndCustomTextures(playerDetails.characterLayers, client.textures);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
handleSilentMessage(client: ExSocketInterface, silentMessage: SilentMessage) {
|
handleSilentMessage(client: ExSocketInterface, silentMessage: SilentMessage) {
|
||||||
@ -438,7 +438,7 @@ class SocketManager {
|
|||||||
}
|
}
|
||||||
userJoinedMessage.setUserid(clientUser.userId);
|
userJoinedMessage.setUserid(clientUser.userId);
|
||||||
userJoinedMessage.setName(clientUser.name);
|
userJoinedMessage.setName(clientUser.name);
|
||||||
userJoinedMessage.setCharacterlayersList(clientUser.characterLayers);
|
userJoinedMessage.setCharacterlayersList(ProtobufUtils.toCharacterLayerMessages(clientUser.characterLayers));
|
||||||
userJoinedMessage.setPosition(ProtobufUtils.toPositionMessage(clientUser.position));
|
userJoinedMessage.setPosition(ProtobufUtils.toPositionMessage(clientUser.position));
|
||||||
|
|
||||||
const subMessage = new SubMessage();
|
const subMessage = new SubMessage();
|
||||||
@ -691,6 +691,33 @@ class SocketManager {
|
|||||||
}
|
}
|
||||||
return socket;
|
return socket;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Merges the characterLayers received from the front (as an array of string) with the custom textures from the back.
|
||||||
|
*/
|
||||||
|
static mergeCharacterLayersAndCustomTextures(characterLayers: string[], memberTextures: CharacterTexture[]): CharacterLayer[] {
|
||||||
|
const characterLayerObjs: CharacterLayer[] = [];
|
||||||
|
for (const characterLayer of characterLayers) {
|
||||||
|
if (characterLayer.startsWith('customCharacterTexture')) {
|
||||||
|
const customCharacterLayerId: number = +characterLayer.substr(22);
|
||||||
|
for (const memberTexture of memberTextures) {
|
||||||
|
if (memberTexture.id == customCharacterLayerId) {
|
||||||
|
characterLayerObjs.push({
|
||||||
|
name: characterLayer,
|
||||||
|
url: memberTexture.url
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
characterLayerObjs.push({
|
||||||
|
name: characterLayer,
|
||||||
|
url: undefined
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return characterLayerObjs;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const socketManager = new SocketManager();
|
export const socketManager = new SocketManager();
|
||||||
|
@ -21,7 +21,7 @@ class ConnectionManager {
|
|||||||
if(connexionType === GameConnexionTypes.register) {
|
if(connexionType === GameConnexionTypes.register) {
|
||||||
const organizationMemberToken = urlManager.getOrganizationToken();
|
const organizationMemberToken = urlManager.getOrganizationToken();
|
||||||
const data = await Axios.post(`${API_URL}/register`, {organizationMemberToken}).then(res => res.data);
|
const data = await Axios.post(`${API_URL}/register`, {organizationMemberToken}).then(res => res.data);
|
||||||
this.localUser = new LocalUser(data.userUuid, data.authToken);
|
this.localUser = new LocalUser(data.userUuid, data.authToken, data.textures);
|
||||||
localUserStore.saveUser(this.localUser);
|
localUserStore.saveUser(this.localUser);
|
||||||
|
|
||||||
const organizationSlug = data.organizationSlug;
|
const organizationSlug = data.organizationSlug;
|
||||||
@ -34,7 +34,7 @@ class ConnectionManager {
|
|||||||
} else if (connexionType === GameConnexionTypes.anonymous || connexionType === GameConnexionTypes.empty) {
|
} else if (connexionType === GameConnexionTypes.anonymous || connexionType === GameConnexionTypes.empty) {
|
||||||
const localUser = localUserStore.getLocalUser();
|
const localUser = localUserStore.getLocalUser();
|
||||||
|
|
||||||
if (localUser && localUser.jwtToken && localUser.uuid) {
|
if (localUser && localUser.jwtToken && localUser.uuid && localUser.textures) {
|
||||||
this.localUser = localUser;
|
this.localUser = localUser;
|
||||||
try {
|
try {
|
||||||
await this.verifyToken(localUser.jwtToken);
|
await this.verifyToken(localUser.jwtToken);
|
||||||
@ -78,12 +78,12 @@ class ConnectionManager {
|
|||||||
|
|
||||||
private async anonymousLogin(): Promise<void> {
|
private async anonymousLogin(): Promise<void> {
|
||||||
const data = await Axios.post(`${API_URL}/anonymLogin`).then(res => res.data);
|
const data = await Axios.post(`${API_URL}/anonymLogin`).then(res => res.data);
|
||||||
this.localUser = new LocalUser(data.userUuid, data.authToken);
|
this.localUser = new LocalUser(data.userUuid, data.authToken, []);
|
||||||
localUserStore.saveUser(this.localUser);
|
localUserStore.saveUser(this.localUser);
|
||||||
}
|
}
|
||||||
|
|
||||||
public initBenchmark(): void {
|
public initBenchmark(): void {
|
||||||
this.localUser = new LocalUser('', 'test');
|
this.localUser = new LocalUser('', 'test', []);
|
||||||
}
|
}
|
||||||
|
|
||||||
public connectToRoomSocket(roomId: string, name: string, characterLayers: string[], position: PositionInterface, viewport: ViewportInterface): Promise<RoomConnection> {
|
public connectToRoomSocket(roomId: string, name: string, characterLayers: string[], position: PositionInterface, viewport: ViewportInterface): Promise<RoomConnection> {
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import {PlayerAnimationNames} from "../Phaser/Player/Animation";
|
import {PlayerAnimationNames} from "../Phaser/Player/Animation";
|
||||||
import {UserSimplePeerInterface} from "../WebRtc/SimplePeer";
|
import {UserSimplePeerInterface} from "../WebRtc/SimplePeer";
|
||||||
import {SignalData} from "simple-peer";
|
import {SignalData} from "simple-peer";
|
||||||
|
import {BodyResourceDescriptionInterface} from "../Phaser/Entity/body_character";
|
||||||
|
|
||||||
export enum EventMessage{
|
export enum EventMessage{
|
||||||
WEBRTC_SIGNAL = "webrtc-signal",
|
WEBRTC_SIGNAL = "webrtc-signal",
|
||||||
@ -49,7 +50,7 @@ export class Point implements PointInterface{
|
|||||||
export interface MessageUserPositionInterface {
|
export interface MessageUserPositionInterface {
|
||||||
userId: number;
|
userId: number;
|
||||||
name: string;
|
name: string;
|
||||||
characterLayers: string[];
|
characterLayers: BodyResourceDescriptionInterface[];
|
||||||
position: PointInterface;
|
position: PointInterface;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -61,7 +62,7 @@ export interface MessageUserMovedInterface {
|
|||||||
export interface MessageUserJoined {
|
export interface MessageUserJoined {
|
||||||
userId: number;
|
userId: number;
|
||||||
name: string;
|
name: string;
|
||||||
characterLayers: string[];
|
characterLayers: BodyResourceDescriptionInterface[];
|
||||||
position: PointInterface
|
position: PointInterface
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,9 +1,11 @@
|
|||||||
|
export interface CharacterTexture {
|
||||||
|
id: number,
|
||||||
|
level: number,
|
||||||
|
url: string,
|
||||||
|
rights: string
|
||||||
|
}
|
||||||
|
|
||||||
export class LocalUser {
|
export class LocalUser {
|
||||||
public uuid: string;
|
constructor(public readonly uuid:string, public readonly jwtToken: string, public readonly textures: CharacterTexture[]) {
|
||||||
public jwtToken: string;
|
|
||||||
|
|
||||||
constructor(uuid:string, jwtToken: string) {
|
|
||||||
this.uuid = uuid;
|
|
||||||
this.jwtToken = jwtToken;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -22,7 +22,11 @@ import {
|
|||||||
WebRtcSignalToServerMessage,
|
WebRtcSignalToServerMessage,
|
||||||
WebRtcStartMessage,
|
WebRtcStartMessage,
|
||||||
ReportPlayerMessage,
|
ReportPlayerMessage,
|
||||||
TeleportMessageMessage, QueryJitsiJwtMessage, SendJitsiJwtMessage, SendUserMessage
|
TeleportMessageMessage,
|
||||||
|
QueryJitsiJwtMessage,
|
||||||
|
SendJitsiJwtMessage,
|
||||||
|
CharacterLayerMessage,
|
||||||
|
SendUserMessage
|
||||||
} from "../Messages/generated/messages_pb"
|
} from "../Messages/generated/messages_pb"
|
||||||
|
|
||||||
import {UserSimplePeerInterface} from "../WebRtc/SimplePeer";
|
import {UserSimplePeerInterface} from "../WebRtc/SimplePeer";
|
||||||
@ -36,6 +40,7 @@ import {
|
|||||||
ViewportInterface, WebRtcDisconnectMessageInterface,
|
ViewportInterface, WebRtcDisconnectMessageInterface,
|
||||||
WebRtcSignalReceivedMessageInterface,
|
WebRtcSignalReceivedMessageInterface,
|
||||||
} from "./ConnexionModels";
|
} from "./ConnexionModels";
|
||||||
|
import {BodyResourceDescriptionInterface} from "../Phaser/Entity/body_character";
|
||||||
|
|
||||||
export class RoomConnection implements RoomConnection {
|
export class RoomConnection implements RoomConnection {
|
||||||
private readonly socket: WebSocket;
|
private readonly socket: WebSocket;
|
||||||
@ -169,10 +174,10 @@ export class RoomConnection implements RoomConnection {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public emitPlayerDetailsMessage(userName: string, characterLayersSelected: string[]) {
|
public emitPlayerDetailsMessage(userName: string, characterLayersSelected: BodyResourceDescriptionInterface[]) {
|
||||||
const message = new SetPlayerDetailsMessage();
|
const message = new SetPlayerDetailsMessage();
|
||||||
message.setName(userName);
|
message.setName(userName);
|
||||||
message.setCharacterlayersList(characterLayersSelected);
|
message.setCharacterlayersList(characterLayersSelected.map((characterLayer) => characterLayer.name));
|
||||||
|
|
||||||
const clientToServerMessage = new ClientToServerMessage();
|
const clientToServerMessage = new ClientToServerMessage();
|
||||||
clientToServerMessage.setSetplayerdetailsmessage(message);
|
clientToServerMessage.setSetplayerdetailsmessage(message);
|
||||||
@ -277,10 +282,18 @@ export class RoomConnection implements RoomConnection {
|
|||||||
if (position === undefined) {
|
if (position === undefined) {
|
||||||
throw new Error('Invalid JOIN_ROOM message');
|
throw new Error('Invalid JOIN_ROOM message');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const characterLayers = message.getCharacterlayersList().map((characterLayer: CharacterLayerMessage): BodyResourceDescriptionInterface => {
|
||||||
|
return {
|
||||||
|
name: characterLayer.getName(),
|
||||||
|
img: characterLayer.getUrl()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
return {
|
return {
|
||||||
userId: message.getUserid(),
|
userId: message.getUserid(),
|
||||||
name: message.getName(),
|
name: message.getName(),
|
||||||
characterLayers: message.getCharacterlayersList(),
|
characterLayers,
|
||||||
position: ProtobufClientUtils.toPointInterface(position)
|
position: ProtobufClientUtils.toPointInterface(position)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -61,22 +61,7 @@ export abstract class Character extends Container {
|
|||||||
|
|
||||||
this.sprites = new Map<string, Sprite>();
|
this.sprites = new Map<string, Sprite>();
|
||||||
|
|
||||||
for (const texture of textures) {
|
this.addTextures(textures, frame);
|
||||||
const sprite = new Sprite(scene, 0, 0, texture, frame);
|
|
||||||
sprite.setInteractive({useHandCursor: true});
|
|
||||||
this.add(sprite);
|
|
||||||
this.getPlayerAnimations(texture).forEach(d => {
|
|
||||||
this.scene.anims.create({
|
|
||||||
key: d.key,
|
|
||||||
frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}),
|
|
||||||
frameRate: d.frameRate,
|
|
||||||
repeat: d.repeat
|
|
||||||
});
|
|
||||||
})
|
|
||||||
// Needed, otherwise, animations are not handled correctly.
|
|
||||||
this.scene.sys.updateList.add(sprite);
|
|
||||||
this.sprites.set(texture, sprite);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*this.teleportation = new Sprite(scene, -20, -10, 'teleportation', 3);
|
/*this.teleportation = new Sprite(scene, -20, -10, 'teleportation', 3);
|
||||||
this.teleportation.setInteractive();
|
this.teleportation.setInteractive();
|
||||||
@ -107,6 +92,25 @@ export abstract class Character extends Container {
|
|||||||
this.playAnimation(direction, moving);
|
this.playAnimation(direction, moving);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public addTextures(textures: string[], frame?: string | number): void {
|
||||||
|
for (const texture of textures) {
|
||||||
|
const sprite = new Sprite(this.scene, 0, 0, texture, frame);
|
||||||
|
sprite.setInteractive({useHandCursor: true});
|
||||||
|
this.add(sprite);
|
||||||
|
this.getPlayerAnimations(texture).forEach(d => {
|
||||||
|
this.scene.anims.create({
|
||||||
|
key: d.key,
|
||||||
|
frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}),
|
||||||
|
frameRate: d.frameRate,
|
||||||
|
repeat: d.repeat
|
||||||
|
});
|
||||||
|
})
|
||||||
|
// Needed, otherwise, animations are not handled correctly.
|
||||||
|
this.scene.sys.updateList.add(sprite);
|
||||||
|
this.sprites.set(texture, sprite);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
private getPlayerAnimations(name: string): AnimationData[] {
|
private getPlayerAnimations(name: string): AnimationData[] {
|
||||||
return [{
|
return [{
|
||||||
key: `${name}-${PlayerAnimationNames.WalkDown}`,
|
key: `${name}-${PlayerAnimationNames.WalkDown}`,
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import LoaderPlugin = Phaser.Loader.LoaderPlugin;
|
import LoaderPlugin = Phaser.Loader.LoaderPlugin;
|
||||||
import {PLAYER_RESOURCES, PlayerResourceDescriptionInterface} from "./Character";
|
import {PLAYER_RESOURCES, PlayerResourceDescriptionInterface} from "./Character";
|
||||||
|
import {CharacterTexture} from "../../Connexion/LocalUser";
|
||||||
|
|
||||||
export interface BodyResourceDescriptionInterface {
|
export interface BodyResourceDescriptionInterface {
|
||||||
name: string,
|
name: string,
|
||||||
@ -312,6 +313,15 @@ export const loadAllLayers = (load: LoaderPlugin) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const loadCustomTexture = (load: LoaderPlugin, texture: CharacterTexture) => {
|
||||||
|
const name = 'customCharacterTexture'+texture.id;
|
||||||
|
load.spritesheet(
|
||||||
|
name,
|
||||||
|
texture.url,
|
||||||
|
{frameWidth: 32, frameHeight: 32}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
export const OBJECTS: Array<PlayerResourceDescriptionInterface> = [
|
export const OBJECTS: Array<PlayerResourceDescriptionInterface> = [
|
||||||
{name:'layout_modes', img:'resources/objects/layout_modes.png'},
|
{name:'layout_modes', img:'resources/objects/layout_modes.png'},
|
||||||
{name:'teleportation', img:'resources/objects/teleportation.png'},
|
{name:'teleportation', img:'resources/objects/teleportation.png'},
|
||||||
|
@ -1,8 +1,9 @@
|
|||||||
import {PointInterface} from "../../Connexion/ConnexionModels";
|
import {PointInterface} from "../../Connexion/ConnexionModels";
|
||||||
|
import {BodyResourceDescriptionInterface} from "../Entity/body_character";
|
||||||
|
|
||||||
export interface AddPlayerInterface {
|
export interface AddPlayerInterface {
|
||||||
userId: number;
|
userId: number;
|
||||||
name: string;
|
name: string;
|
||||||
characterLayers: string[];
|
characterLayers: BodyResourceDescriptionInterface[];
|
||||||
position: PointInterface;
|
position: PointInterface;
|
||||||
}
|
}
|
||||||
|
@ -32,7 +32,7 @@ import {RemotePlayer} from "../Entity/RemotePlayer";
|
|||||||
import {Queue} from 'queue-typescript';
|
import {Queue} from 'queue-typescript';
|
||||||
import {SimplePeer, UserSimplePeerInterface} from "../../WebRtc/SimplePeer";
|
import {SimplePeer, UserSimplePeerInterface} from "../../WebRtc/SimplePeer";
|
||||||
import {ReconnectingSceneName} from "../Reconnecting/ReconnectingScene";
|
import {ReconnectingSceneName} from "../Reconnecting/ReconnectingScene";
|
||||||
import {loadAllLayers, loadObject, loadPlayerCharacters} from "../Entity/body_character";
|
import {loadAllLayers, loadCustomTexture, loadObject, loadPlayerCharacters} from "../Entity/body_character";
|
||||||
import {CenterListener, layoutManager, LayoutMode} from "../../WebRtc/LayoutManager";
|
import {CenterListener, layoutManager, LayoutMode} from "../../WebRtc/LayoutManager";
|
||||||
import Texture = Phaser.Textures.Texture;
|
import Texture = Phaser.Textures.Texture;
|
||||||
import Sprite = Phaser.GameObjects.Sprite;
|
import Sprite = Phaser.GameObjects.Sprite;
|
||||||
@ -475,7 +475,6 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
if (newValue === undefined) {
|
if (newValue === undefined) {
|
||||||
this.stopJitsi();
|
this.stopJitsi();
|
||||||
} else {
|
} else {
|
||||||
console.log("JITSI_PRIVATE_MODE", JITSI_PRIVATE_MODE);
|
|
||||||
if (JITSI_PRIVATE_MODE) {
|
if (JITSI_PRIVATE_MODE) {
|
||||||
const adminTag = allProps.get("jitsiRoomAdminTag") as string|undefined;
|
const adminTag = allProps.get("jitsiRoomAdminTag") as string|undefined;
|
||||||
|
|
||||||
@ -1022,7 +1021,7 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
/**
|
/**
|
||||||
* Create new player
|
* Create new player
|
||||||
*/
|
*/
|
||||||
private doAddPlayer(addPlayerData : AddPlayerInterface) : void {
|
private async doAddPlayer(addPlayerData : AddPlayerInterface) : Promise<void> {
|
||||||
//check if exist player, if exist, move position
|
//check if exist player, if exist, move position
|
||||||
if(this.MapPlayersByKey.has(addPlayerData.userId)){
|
if(this.MapPlayersByKey.has(addPlayerData.userId)){
|
||||||
this.updatePlayerPosition({
|
this.updatePlayerPosition({
|
||||||
@ -1031,6 +1030,20 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
});
|
});
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
// Load textures (in case it is a custom texture)
|
||||||
|
const characterLayerList: string[] = [];
|
||||||
|
const loadPromises: Promise<void>[] = [];
|
||||||
|
for (const characterLayer of addPlayerData.characterLayers) {
|
||||||
|
characterLayerList.push(characterLayer.name);
|
||||||
|
if (characterLayer.img) {
|
||||||
|
console.log('LOADING ', characterLayer.name, characterLayer.img)
|
||||||
|
loadPromises.push(this.loadSpritesheet(characterLayer.name, characterLayer.img));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (loadPromises.length > 0) {
|
||||||
|
this.load.start();
|
||||||
|
}
|
||||||
|
|
||||||
//initialise player
|
//initialise player
|
||||||
const player = new RemotePlayer(
|
const player = new RemotePlayer(
|
||||||
addPlayerData.userId,
|
addPlayerData.userId,
|
||||||
@ -1038,7 +1051,7 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
addPlayerData.position.x,
|
addPlayerData.position.x,
|
||||||
addPlayerData.position.y,
|
addPlayerData.position.y,
|
||||||
addPlayerData.name,
|
addPlayerData.name,
|
||||||
addPlayerData.characterLayers,
|
[], // Let's go with no textures and let's load textures when promises have returned.
|
||||||
addPlayerData.position.direction,
|
addPlayerData.position.direction,
|
||||||
addPlayerData.position.moving
|
addPlayerData.position.moving
|
||||||
);
|
);
|
||||||
@ -1046,10 +1059,15 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
this.MapPlayersByKey.set(player.userId, player);
|
this.MapPlayersByKey.set(player.userId, player);
|
||||||
player.updatePosition(addPlayerData.position);
|
player.updatePosition(addPlayerData.position);
|
||||||
|
|
||||||
|
|
||||||
|
await Promise.all(loadPromises);
|
||||||
|
|
||||||
|
player.addTextures(characterLayerList, 1);
|
||||||
//init collision
|
//init collision
|
||||||
/*this.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => {
|
/*this.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => {
|
||||||
CurrentPlayer.say("Hello, how are you ? ");
|
CurrentPlayer.say("Hello, how are you ? ");
|
||||||
});*/
|
});*/
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -1245,4 +1263,18 @@ export class GameScene extends ResizableScene implements CenterListener {
|
|||||||
CoWebsiteManager.closeCoWebsite();
|
CoWebsiteManager.closeCoWebsite();
|
||||||
mediaManager.showGameOverlay();
|
mediaManager.showGameOverlay();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private loadSpritesheet(name: string, url: string): Promise<void> {
|
||||||
|
return new Promise<void>(((resolve, reject) => {
|
||||||
|
this.load.spritesheet(
|
||||||
|
name,
|
||||||
|
url,
|
||||||
|
{frameWidth: 32, frameHeight: 32}
|
||||||
|
);
|
||||||
|
this.load.on('filecomplete-spritesheet-'+name, () => {
|
||||||
|
console.log('RESOURCE LOADED!');
|
||||||
|
resolve();
|
||||||
|
});
|
||||||
|
}))
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,12 +2,13 @@ import {EnableCameraSceneName} from "./EnableCameraScene";
|
|||||||
import {TextField} from "../Components/TextField";
|
import {TextField} from "../Components/TextField";
|
||||||
import Image = Phaser.GameObjects.Image;
|
import Image = Phaser.GameObjects.Image;
|
||||||
import Rectangle = Phaser.GameObjects.Rectangle;
|
import Rectangle = Phaser.GameObjects.Rectangle;
|
||||||
import {LAYERS, loadAllLayers} from "../Entity/body_character";
|
import {BodyResourceDescriptionInterface, LAYERS, loadAllLayers, loadCustomTexture} from "../Entity/body_character";
|
||||||
import Sprite = Phaser.GameObjects.Sprite;
|
import Sprite = Phaser.GameObjects.Sprite;
|
||||||
import Container = Phaser.GameObjects.Container;
|
import Container = Phaser.GameObjects.Container;
|
||||||
import {gameManager} from "../Game/GameManager";
|
import {gameManager} from "../Game/GameManager";
|
||||||
import {ResizableScene} from "./ResizableScene";
|
import {ResizableScene} from "./ResizableScene";
|
||||||
import {localUserStore} from "../../Connexion/LocalUserStore";
|
import {localUserStore} from "../../Connexion/LocalUserStore";
|
||||||
|
import {PlayerResourceDescriptionInterface} from "../Entity/Character";
|
||||||
|
|
||||||
export const CustomizeSceneName = "CustomizeScene";
|
export const CustomizeSceneName = "CustomizeScene";
|
||||||
|
|
||||||
@ -36,6 +37,7 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
private selectedLayers: number[] = [0];
|
private selectedLayers: number[] = [0];
|
||||||
private containersRow: Container[][] = [];
|
private containersRow: Container[][] = [];
|
||||||
private activeRow:number = 0;
|
private activeRow:number = 0;
|
||||||
|
private layers: BodyResourceDescriptionInterface[][] = [];
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
super({
|
super({
|
||||||
@ -51,6 +53,23 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
|
|
||||||
//load all the png files
|
//load all the png files
|
||||||
loadAllLayers(this.load);
|
loadAllLayers(this.load);
|
||||||
|
|
||||||
|
// load custom layers
|
||||||
|
this.layers = LAYERS;
|
||||||
|
|
||||||
|
const localUser = localUserStore.getLocalUser();
|
||||||
|
|
||||||
|
const textures = localUser?.textures;
|
||||||
|
if (textures) {
|
||||||
|
for (const texture of textures) {
|
||||||
|
loadCustomTexture(this.load, texture);
|
||||||
|
const name = 'customCharacterTexture'+texture.id;
|
||||||
|
this.layers[texture.level].unshift({
|
||||||
|
name,
|
||||||
|
img: texture.url
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
create() {
|
create() {
|
||||||
@ -94,7 +113,7 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
let i = 0;
|
let i = 0;
|
||||||
for (const layerItem of this.selectedLayers) {
|
for (const layerItem of this.selectedLayers) {
|
||||||
if (layerItem !== undefined) {
|
if (layerItem !== undefined) {
|
||||||
layers.push(LAYERS[i][layerItem].name);
|
layers.push(this.layers[i][layerItem].name);
|
||||||
}
|
}
|
||||||
i++;
|
i++;
|
||||||
}
|
}
|
||||||
@ -108,7 +127,7 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
this.input.keyboard.on('keydown-LEFT', () => this.moveCursorHorizontally(-1));
|
this.input.keyboard.on('keydown-LEFT', () => this.moveCursorHorizontally(-1));
|
||||||
this.input.keyboard.on('keydown-DOWN', () => this.moveCursorVertically(1));
|
this.input.keyboard.on('keydown-DOWN', () => this.moveCursorVertically(1));
|
||||||
this.input.keyboard.on('keydown-UP', () => this.moveCursorVertically(-1));
|
this.input.keyboard.on('keydown-UP', () => this.moveCursorVertically(-1));
|
||||||
|
|
||||||
const customCursorPosition = localUserStore.getCustomCursorPosition();
|
const customCursorPosition = localUserStore.getCustomCursorPosition();
|
||||||
if (customCursorPosition) {
|
if (customCursorPosition) {
|
||||||
this.activeRow = customCursorPosition.activeRow;
|
this.activeRow = customCursorPosition.activeRow;
|
||||||
@ -117,34 +136,34 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
this.updateSelectedLayer();
|
this.updateSelectedLayer();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private moveCursorHorizontally(index: number): void {
|
private moveCursorHorizontally(index: number): void {
|
||||||
this.selectedLayers[this.activeRow] += index;
|
this.selectedLayers[this.activeRow] += index;
|
||||||
if (this.selectedLayers[this.activeRow] < 0) {
|
if (this.selectedLayers[this.activeRow] < 0) {
|
||||||
this.selectedLayers[this.activeRow] = 0
|
this.selectedLayers[this.activeRow] = 0
|
||||||
} else if(this.selectedLayers[this.activeRow] > LAYERS[this.activeRow].length - 1) {
|
} else if(this.selectedLayers[this.activeRow] > this.layers[this.activeRow].length - 1) {
|
||||||
this.selectedLayers[this.activeRow] = LAYERS[this.activeRow].length - 1
|
this.selectedLayers[this.activeRow] = this.layers[this.activeRow].length - 1
|
||||||
}
|
}
|
||||||
this.moveLayers();
|
this.moveLayers();
|
||||||
this.updateSelectedLayer();
|
this.updateSelectedLayer();
|
||||||
this.saveInLocalStorage();
|
this.saveInLocalStorage();
|
||||||
}
|
}
|
||||||
|
|
||||||
private moveCursorVertically(index:number): void {
|
private moveCursorVertically(index:number): void {
|
||||||
this.activeRow += index;
|
this.activeRow += index;
|
||||||
if (this.activeRow < 0) {
|
if (this.activeRow < 0) {
|
||||||
this.activeRow = 0
|
this.activeRow = 0
|
||||||
} else if (this.activeRow > LAYERS.length - 1) {
|
} else if (this.activeRow > this.layers.length - 1) {
|
||||||
this.activeRow = LAYERS.length - 1
|
this.activeRow = this.layers.length - 1
|
||||||
}
|
}
|
||||||
this.moveLayers();
|
this.moveLayers();
|
||||||
this.saveInLocalStorage();
|
this.saveInLocalStorage();
|
||||||
}
|
}
|
||||||
|
|
||||||
private saveInLocalStorage() {
|
private saveInLocalStorage() {
|
||||||
localUserStore.setCustomCursorPosition(this.activeRow, this.selectedLayers);
|
localUserStore.setCustomCursorPosition(this.activeRow, this.selectedLayers);
|
||||||
}
|
}
|
||||||
|
|
||||||
update(time: number, delta: number): void {
|
update(time: number, delta: number): void {
|
||||||
super.update(time, delta);
|
super.update(time, delta);
|
||||||
this.enterField.setVisible(!!(Math.floor(time / 500) % 2));
|
this.enterField.setVisible(!!(Math.floor(time / 500) % 2));
|
||||||
@ -153,7 +172,7 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
/**
|
/**
|
||||||
* @param x, the layer's vertical position
|
* @param x, the layer's vertical position
|
||||||
* @param y, the layer's horizontal position
|
* @param y, the layer's horizontal position
|
||||||
* @param layerNumber, index of the LAYERS array
|
* @param layerNumber, index of the this.layers array
|
||||||
* create the layer and display it on the scene
|
* create the layer and display it on the scene
|
||||||
*/
|
*/
|
||||||
private createCustomizeLayer(x: number, y: number, layerNumber: number): void {
|
private createCustomizeLayer(x: number, y: number, layerNumber: number): void {
|
||||||
@ -161,7 +180,7 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
this.selectedLayers[layerNumber] = 0;
|
this.selectedLayers[layerNumber] = 0;
|
||||||
let alpha = 0;
|
let alpha = 0;
|
||||||
let layerPosX = 0;
|
let layerPosX = 0;
|
||||||
for (let i = 0; i < LAYERS[layerNumber].length; i++) {
|
for (let i = 0; i < this.layers[layerNumber].length; i++) {
|
||||||
const container = this.generateCharacter(300 + x + layerPosX, y, layerNumber, i);
|
const container = this.generateCharacter(300 + x + layerPosX, y, layerNumber, i);
|
||||||
|
|
||||||
this.containersRow[layerNumber][i] = container;
|
this.containersRow[layerNumber][i] = container;
|
||||||
@ -190,13 +209,13 @@ export class CustomizeScene extends ResizableScene {
|
|||||||
const children: Array<Sprite> = new Array<Sprite>();
|
const children: Array<Sprite> = new Array<Sprite>();
|
||||||
for (let j = 0; j <= layerNumber; j++) {
|
for (let j = 0; j <= layerNumber; j++) {
|
||||||
if (j === layerNumber) {
|
if (j === layerNumber) {
|
||||||
children.push(this.generateLayers(0, 0, LAYERS[j][selectedItem].name));
|
children.push(this.generateLayers(0, 0, this.layers[j][selectedItem].name));
|
||||||
} else {
|
} else {
|
||||||
const layer = this.selectedLayers[j];
|
const layer = this.selectedLayers[j];
|
||||||
if (layer === undefined) {
|
if (layer === undefined) {
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
children.push(this.generateLayers(0, 0, LAYERS[j][layer].name));
|
children.push(this.generateLayers(0, 0, this.layers[j][layer].name));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return children;
|
return children;
|
||||||
|
BIN
maps/characters/tenue-f-jolicode.png
Normal file
BIN
maps/characters/tenue-f-jolicode.png
Normal file
Binary file not shown.
After (image error) Size: 14 KiB |
BIN
maps/characters/tenue-f-vanoix.png
Normal file
BIN
maps/characters/tenue-f-vanoix.png
Normal file
Binary file not shown.
After (image error) Size: 13 KiB |
BIN
maps/characters/tenue-f.png
Normal file
BIN
maps/characters/tenue-f.png
Normal file
Binary file not shown.
After (image error) Size: 13 KiB |
BIN
maps/characters/tenue-m-jolicode.png
Normal file
BIN
maps/characters/tenue-m-jolicode.png
Normal file
Binary file not shown.
After (image error) Size: 14 KiB |
BIN
maps/characters/tenue-m-vanoix.png
Normal file
BIN
maps/characters/tenue-m-vanoix.png
Normal file
Binary file not shown.
After (image error) Size: 13 KiB |
BIN
maps/characters/tenue-m.png
Normal file
BIN
maps/characters/tenue-m.png
Normal file
Binary file not shown.
After (image error) Size: 12 KiB |
@ -31,6 +31,11 @@ message SilentMessage {
|
|||||||
bool silent = 1;
|
bool silent = 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
message CharacterLayerMessage {
|
||||||
|
string url = 1;
|
||||||
|
string name = 2;
|
||||||
|
}
|
||||||
|
|
||||||
/*********** CLIENT TO SERVER MESSAGES *************/
|
/*********** CLIENT TO SERVER MESSAGES *************/
|
||||||
|
|
||||||
message SetPlayerDetailsMessage {
|
message SetPlayerDetailsMessage {
|
||||||
@ -129,7 +134,7 @@ message GroupDeleteMessage {
|
|||||||
message UserJoinedMessage {
|
message UserJoinedMessage {
|
||||||
int32 userId = 1;
|
int32 userId = 1;
|
||||||
string name = 2;
|
string name = 2;
|
||||||
repeated string characterLayers = 3;
|
repeated CharacterLayerMessage characterLayers = 3;
|
||||||
PositionMessage position = 4;
|
PositionMessage position = 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user