different game ids per game
This commit is contained in:
parent
3917c591b0
commit
d8f9f856e6
4 changed files with 39 additions and 15 deletions
|
|
@ -7,6 +7,7 @@ import Camera from './Camera.js'
|
||||||
import EventAdapter from './EventAdapter.js'
|
import EventAdapter from './EventAdapter.js'
|
||||||
import WsClient from './WsClient.js'
|
import WsClient from './WsClient.js'
|
||||||
|
|
||||||
|
if (!GAME_ID) throw '[ GAME_ID not set ]'
|
||||||
if (!WS_ADDRESS) throw '[ WS_ADDRESS not set ]'
|
if (!WS_ADDRESS) throw '[ WS_ADDRESS not set ]'
|
||||||
|
|
||||||
function createCanvas(width = 0, height = 0) {
|
function createCanvas(width = 0, height = 0) {
|
||||||
|
|
@ -207,6 +208,7 @@ function imageToBitmap(img) {
|
||||||
}
|
}
|
||||||
|
|
||||||
async function loadImageToBitmap(imagePath) {
|
async function loadImageToBitmap(imagePath) {
|
||||||
|
console.log(imagePath)
|
||||||
const img = new Image()
|
const img = new Image()
|
||||||
await new Promise((resolve) => {
|
await new Promise((resolve) => {
|
||||||
img.onload = resolve
|
img.onload = resolve
|
||||||
|
|
@ -421,11 +423,11 @@ function setupNetwork(me) {
|
||||||
async function main () {
|
async function main () {
|
||||||
|
|
||||||
// todo: maybe put in protocols, same as `me()`
|
// todo: maybe put in protocols, same as `me()`
|
||||||
let gameId = 'asdfbla' // uniqId()
|
let gameId = GAME_ID // uniqId()
|
||||||
let me = initme()
|
let me = initme()
|
||||||
|
|
||||||
let cursorGrab = await loadImageToBitmap('./grab.png')
|
let cursorGrab = await loadImageToBitmap('/grab.png')
|
||||||
let cursorHand = await loadImageToBitmap('./hand.png')
|
let cursorHand = await loadImageToBitmap('/hand.png')
|
||||||
|
|
||||||
let conn = setupNetwork(me + '|' + gameId)
|
let conn = setupNetwork(me + '|' + gameId)
|
||||||
conn.send(JSON.stringify({ type: 'init' }))
|
conn.send(JSON.stringify({ type: 'init' }))
|
||||||
|
|
@ -926,7 +928,8 @@ async function main () {
|
||||||
// if it improves performance:
|
// if it improves performance:
|
||||||
// 1. background
|
// 1. background
|
||||||
// 2. tiles
|
// 2. tiles
|
||||||
// 3. players
|
// 3. (moving tiles)
|
||||||
|
// 4. (players)
|
||||||
// (currently, if a player moves, everthing needs to be
|
// (currently, if a player moves, everthing needs to be
|
||||||
// rerendered at that position manually, maybe it is faster
|
// rerendered at that position manually, maybe it is faster
|
||||||
// when using layers)
|
// when using layers)
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@ import WebSocketServer from './WebSocketServer.js'
|
||||||
import express from 'express'
|
import express from 'express'
|
||||||
import { createPuzzle } from './puzzle.js'
|
import { createPuzzle } from './puzzle.js'
|
||||||
import config from './config.js'
|
import config from './config.js'
|
||||||
|
import { uniqId, choice } from './util.js'
|
||||||
|
|
||||||
// desired number of tiles
|
// desired number of tiles
|
||||||
// actual calculated number can be higher
|
// actual calculated number can be higher
|
||||||
|
|
@ -14,7 +15,6 @@ const IMAGES = [
|
||||||
'/example-images/saechsische_schweiz.jpg',
|
'/example-images/saechsische_schweiz.jpg',
|
||||||
'/example-images/132-2048x1365.jpg',
|
'/example-images/132-2048x1365.jpg',
|
||||||
]
|
]
|
||||||
const IMAGE_URL = IMAGES[0]
|
|
||||||
|
|
||||||
const games = {}
|
const games = {}
|
||||||
|
|
||||||
|
|
@ -22,16 +22,32 @@ const port = config.http.port
|
||||||
const hostname = config.http.hostname
|
const hostname = config.http.hostname
|
||||||
const app = express()
|
const app = express()
|
||||||
const statics = express.static('./../game/')
|
const statics = express.static('./../game/')
|
||||||
app.use('/', (req, res, next) => {
|
app.use('/g/:gid', (req, res, next) => {
|
||||||
if (req.path === '/') {
|
|
||||||
res.send(`
|
res.send(`
|
||||||
<html><head><style>
|
<html><head><style>
|
||||||
html,body {margin: 0; overflow: hidden;}
|
html,body {margin: 0; overflow: hidden;}
|
||||||
html, body, #main { background: #222 }
|
html, body, #main { background: #222 }
|
||||||
canvas {cursor: none;}
|
canvas {cursor: none;}
|
||||||
</style></head><body>
|
</style></head><body>
|
||||||
|
<script>window.GAME_ID = '${req.params.gid}'</script>
|
||||||
<script>window.WS_ADDRESS = '${config.ws.connectstring}'</script>
|
<script>window.WS_ADDRESS = '${config.ws.connectstring}'</script>
|
||||||
<script src="index.js" type="module"></script>
|
<script src="/index.js" type="module"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
`)
|
||||||
|
})
|
||||||
|
|
||||||
|
app.use('/', (req, res, next) => {
|
||||||
|
if (req.path === '/') {
|
||||||
|
res.send(`
|
||||||
|
<html><head><style>
|
||||||
|
html,body {margin: 0; overflow: hidden;}
|
||||||
|
html, body, #main { background: #222 }
|
||||||
|
</style></head><body>
|
||||||
|
<a href="/g/${uniqId()}">New game :P</a>
|
||||||
|
${Object.keys(games).map(k => {
|
||||||
|
return `<a href="/g/${k}">Game ${k}</a>`
|
||||||
|
})}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
`)
|
`)
|
||||||
|
|
@ -58,7 +74,7 @@ wss.on('message', async ({socket, data}) => {
|
||||||
switch (parsed.type) {
|
switch (parsed.type) {
|
||||||
case 'init': {
|
case 'init': {
|
||||||
// a new player (or previous player) joined
|
// a new player (or previous player) joined
|
||||||
games[gid] = games[gid] || {puzzle: await createPuzzle(TARGET_TILES, IMAGE_URL), players: {}}
|
games[gid] = games[gid] || {puzzle: await createPuzzle(TARGET_TILES, choice(IMAGES)), players: {}}
|
||||||
|
|
||||||
games[gid].players[uid] = {id: uid, x: 0, y: 0, down: false}
|
games[gid].players[uid] = {id: uid, x: 0, y: 0, down: false}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,10 +6,11 @@ import { choice } from './util.js'
|
||||||
const TILE_SIZE = 64
|
const TILE_SIZE = 64
|
||||||
|
|
||||||
async function createPuzzle(targetTiles, image) {
|
async function createPuzzle(targetTiles, image) {
|
||||||
const imgFile = './../game' + image
|
const imgPath = './../game' + image
|
||||||
const imgUrl = './' + image
|
const imgUrl = image
|
||||||
|
|
||||||
// load bitmap, to determine the original size of the image
|
// load bitmap, to determine the original size of the image
|
||||||
let dim = sizeOf(imgFile)
|
let dim = sizeOf(imgPath)
|
||||||
|
|
||||||
// determine puzzle information from the bitmap
|
// determine puzzle information from the bitmap
|
||||||
let info = determinePuzzleInfo(dim.width, dim.height, targetTiles)
|
let info = determinePuzzleInfo(dim.width, dim.height, targetTiles)
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,7 @@
|
||||||
|
|
||||||
|
// get a unique id
|
||||||
|
export const uniqId = () => Date.now().toString(36) + Math.random().toString(36).substring(2)
|
||||||
|
|
||||||
// get a random int between min and max (inclusive)
|
// get a random int between min and max (inclusive)
|
||||||
export const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min
|
export const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min
|
||||||
|
|
||||||
|
|
@ -19,6 +22,7 @@ export const shuffle = (array) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
uniqId,
|
||||||
randomInt,
|
randomInt,
|
||||||
choice,
|
choice,
|
||||||
shuffle,
|
shuffle,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue