DEV Community

Cover image for Matrix-roulette - Physics + Server game regime
Nikola
Nikola

Posted on

Matrix-roulette - Physics + Server game regime

matrix-roulette 1.0.0

Prerequirement

You need Node.js and npm to be instaled.

 npm install -g browserify 

Install frontend deps in root foledr with:

 npm i 

Install backend deps in folder ./server

 npm i 

Watch/build frontend (from root folder) with:

 npm run roulette 

Build your Application (from root folder) script bundle with:

 npm run build.roulette 

You need to run any web server.
And navigate to /projects/matrix-roulette/?server=manual

Matrix Roulette - Server regime

In projects\matrix-roulette Used Server Events tech.

New feature is ServerEvent tech.

Run matrix-roulette-server on localhost with:

 npm run dev 

Run matrix-roulette-server on public server with:

 npm start 

For production you need to change this part and put your own SSL domain name:
I use setup frendly with letsencrypt services.
Change path whatever be...

If you wanna server regime navigate to:
/projects/matrix-roulette/?server=true

Setup SSL for server part

 if(URL_ARG.indexOf("localhost") !== -1) { console.log('Dev regime is active...'); options = { key: fs.readFileSync(__dirname + "/self-cert/privatekey.pem"), cert: fs.readFileSync(__dirname + "/self-cert/certificate.pem") }; } else { options = { key: fs.readFileSync("/etc/letsencrypt/live/[YOR_OWN_DOMAIN_ENTER_HERE]/privkey.pem"), cert: fs.readFileSync("/etc/letsencrypt/live/[YOR_OWN_DOMAIN_ENTER_HERE]/fullchain.pem") }; } 

File roulette\server\matrix-roulette-server.js is example for node.js webserver running stanalone with
roulette feature. If you already have your web server then you no need this file just import
roulette\server\core.js

For node.js looks like:

let facts = []; const matrixRouletteCore = require("./core.js"); matrixRouletteCore.clients = []; matrixRouletteCore.init(); hostingHTTP.get('/matrix-roulette-status', (request, response) => response.json({clients: matrixRouletteCore.clients.length})); function eventsHandler(request, response, next) { const headers = { 'Content-Type': 'text/event-stream', 'Connection': 'keep-alive', 'Cache-Control': 'no-cache' }; response.writeHead(200, headers); const data = `data: ${JSON.stringify(facts)}\n\n`; response.write(data); const clientId = Date.now(); const newClient = {id: clientId, response}; matrixRouletteCore.clients.push(newClient); request.on('close', () => { console.log(`${clientId} Connection closed`); matrixRouletteCore.clients = matrixRouletteCore.clients.filter(client => client.id !== clientId); }); } hostingHTTP.get('/matrix-roulette', eventsHandler); 
Enter fullscreen mode Exit fullscreen mode

Look like:

 const events = new EventSource("https://maximumroulette.com/matrix-roulette"); events.onmessage = event => { console.log("MatrixRoulette:", event); }; 

If you see in browser debuger logs msg:

 EventSource failed loading: GET "https://localhost:8080/matrix-roulette". 

It means you dont have runned server part.

Url parameters:

 +-----------------------------------------------------------------------------------+ |-----------------------------------------------------------------------------------+ || URLParameter value Description | +-----------------------------------------------------------------------------------+ | | | ?server= manual Server is used for video chat etc not | | gameplay results.Wheel view is called | | on SPIN procedure. | | ?server= true Server dictate results but no wheel | | | | | | &sounds= true/false Sounds are active only if url param | | is true. | | | | &cameraSpeed= Number Best range values from 0.5 to 1 | | | | | +-----------------------------------------------------------------------------------+ 

Dev links looks like:

Notes
  • Used cannon.js integration for matrix-engine.

Video chat support (bonus feature [wip]):

(You need to run your own openvide/kurento server)

matrixEngine.Engine.activateNet2(undefined, { sessionName: "matrix-roulette", resolution: "240x160", }); 
Enter fullscreen mode Exit fullscreen mode

Table bet view and Wheel view

Image description

Image description

Demo from this repo:

Code:

Engine source link:

Credits

Join chat on slack

(GamePlay platform Rock)[https://join.slack.com/t/gameplay-rock/shared_invite/zt-ffcgl80x-CYu4s~YC0bD9Od9_bkqmzw]

Top comments (1)

Collapse
 
v_systems profile image
V_Systems

Hey Nikola, would you be interested in joining our WebGL Shader Hackathon?

Until 8 May, create your original shader and publish it on our blockchain to compete for prizes ranging between $500 and $1000!