remove demo
This commit is contained in:
parent
883e3c551d
commit
267a4ef742
@ -174,59 +174,3 @@ section {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.demo {
|
|
||||||
margin-top: 1em;
|
|
||||||
|
|
||||||
display: block;
|
|
||||||
|
|
||||||
button {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
|
||||||
margin-bottom: 0.5em;
|
|
||||||
|
|
||||||
div:first-child {
|
|
||||||
padding-right: 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.construct-section {
|
|
||||||
.construct-list {
|
|
||||||
height: 25em;
|
|
||||||
grid-area: unset;
|
|
||||||
|
|
||||||
.instance-construct {
|
|
||||||
// border: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.colour-info {
|
|
||||||
grid-area: vinfo;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
div {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
svg {
|
|
||||||
flex: 1;
|
|
||||||
height: 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-demo {
|
|
||||||
.game {
|
|
||||||
height: 25em;
|
|
||||||
display: flex;
|
|
||||||
flex-flow: column;
|
|
||||||
|
|
||||||
.game-construct {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|||||||
@ -7,8 +7,6 @@ export const setAnimSource = value => ({ type: 'SET_ANIM_SOURCE', value });
|
|||||||
export const setAnimTarget = value => ({ type: 'SET_ANIM_TARGET', value });
|
export const setAnimTarget = value => ({ type: 'SET_ANIM_TARGET', value });
|
||||||
export const setResolution = value => ({ type: 'SET_RESOLUTION', value });
|
export const setResolution = value => ({ type: 'SET_RESOLUTION', value });
|
||||||
|
|
||||||
export const setDemo = value => ({ type: 'SET_DEMO', value });
|
|
||||||
|
|
||||||
export const setChatShow = value => ({ type: 'SET_CHAT_SHOW', value });
|
export const setChatShow = value => ({ type: 'SET_CHAT_SHOW', value });
|
||||||
export const setChatWheel = value => ({ type: 'SET_CHAT_WHEEL', value });
|
export const setChatWheel = value => ({ type: 'SET_CHAT_WHEEL', value });
|
||||||
export const setInstanceChat = value => ({ type: 'SET_INSTANCE_CHAT', value });
|
export const setInstanceChat = value => ({ type: 'SET_INSTANCE_CHAT', value });
|
||||||
|
|||||||
@ -1,190 +0,0 @@
|
|||||||
const { connect } = require('preact-redux');
|
|
||||||
const preact = require('preact');
|
|
||||||
|
|
||||||
// const actions = require('../actions');
|
|
||||||
const shapes = require('./shapes');
|
|
||||||
|
|
||||||
const { ConstructAvatar } = require('./construct');
|
|
||||||
// const { ConstructAnimation } = require('./animations');
|
|
||||||
|
|
||||||
const addState = connect(
|
|
||||||
function receiveState(state) {
|
|
||||||
const {
|
|
||||||
account,
|
|
||||||
itemInfo,
|
|
||||||
demo,
|
|
||||||
} = state;
|
|
||||||
|
|
||||||
return {
|
|
||||||
account,
|
|
||||||
itemInfo,
|
|
||||||
demo,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
/* function receiveDispatch(dispatch) {
|
|
||||||
function setAnimTarget(anim) {
|
|
||||||
dispatch(actions.setAnimTarget(anim));
|
|
||||||
}
|
|
||||||
|
|
||||||
return { setAnimTarget };
|
|
||||||
} */
|
|
||||||
);
|
|
||||||
|
|
||||||
|
|
||||||
function Demo(args) {
|
|
||||||
const {
|
|
||||||
demo,
|
|
||||||
itemInfo,
|
|
||||||
account,
|
|
||||||
|
|
||||||
// setAnimTarget,
|
|
||||||
} = args;
|
|
||||||
|
|
||||||
if (!demo || !itemInfo.items.length || account) return false;
|
|
||||||
|
|
||||||
const { combiner, items, equipping, equipped, players, combo } = demo;
|
|
||||||
|
|
||||||
const vboxDemo = () => {
|
|
||||||
function stashBtn(i, j) {
|
|
||||||
if (!i) return <button disabled class='empty' > </button>;
|
|
||||||
const highlighted = combiner.indexOf(j) > -1;
|
|
||||||
const classes = `${highlighted ? 'highlight' : ''}`;
|
|
||||||
|
|
||||||
if (shapes[i]) {
|
|
||||||
return <button class={classes} key={j}>{shapes[i]()}</button>;
|
|
||||||
}
|
|
||||||
|
|
||||||
return <button class={classes}>{i}</button>;
|
|
||||||
}
|
|
||||||
|
|
||||||
function combinerBtn() {
|
|
||||||
let text = '';
|
|
||||||
|
|
||||||
if (combiner.length < 3) {
|
|
||||||
for (let i = 0; i < 3; i++) {
|
|
||||||
if (combiner.length > i) {
|
|
||||||
text += '■ ';
|
|
||||||
} else {
|
|
||||||
text += '▫ ';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
text = 'combine';
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
class='vbox-btn'
|
|
||||||
disabled={combiner.length !== 3}>
|
|
||||||
{text}
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function stashElement() {
|
|
||||||
return (
|
|
||||||
<div class="vbox">
|
|
||||||
<div class='vbox-section'>
|
|
||||||
<h2 class='colour-info'>
|
|
||||||
VBOX PHASE {shapes.Red()} {shapes.Green()} {shapes.Blue()}
|
|
||||||
</h2>
|
|
||||||
<p>
|
|
||||||
Combine colours with base skills and specialisations to build an array of powerful variants.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div> </div>
|
|
||||||
<div class='vbox-section'>
|
|
||||||
<div class='vbox-items'>
|
|
||||||
{items.map((i, j) => stashBtn(i, j))}
|
|
||||||
</div>
|
|
||||||
{combinerBtn()}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div class="news vbox-demo">
|
|
||||||
{stashElement()}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const vboxConstructs = () => {
|
|
||||||
const btnClass = equipping
|
|
||||||
? 'equipping empty gray'
|
|
||||||
: 'empty gray';
|
|
||||||
|
|
||||||
const constructEl = c => (
|
|
||||||
<div class="instance-construct">
|
|
||||||
<h2 class="name" >{c.name}</h2>
|
|
||||||
<ConstructAvatar construct={c} />
|
|
||||||
<div class="skills">
|
|
||||||
{equipped
|
|
||||||
? <button>{combo}</button>
|
|
||||||
: <button disabled={!equipping} class={btnClass}>SKILL</button>
|
|
||||||
}
|
|
||||||
<button disabled={!equipping} class={btnClass}>SKILL</button>
|
|
||||||
<button disabled={!equipping} class={btnClass}>SKILL</button>
|
|
||||||
</div>
|
|
||||||
<div class="specs">
|
|
||||||
</div>
|
|
||||||
<div class="stats">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<section class="construct-section">
|
|
||||||
<div>
|
|
||||||
<h2>CONSTRUCTS</h2>
|
|
||||||
<p><b>Constructs</b> are the units you control. They are reset every game and their initial appearance is randomly generated.</p>
|
|
||||||
<p><b>Skills</b> and <b>Specs</b> you create in the <b>VBOX Phase</b> are equipped to your constructs to create a build.</p>
|
|
||||||
</div>
|
|
||||||
<div class='construct-list'>
|
|
||||||
{constructEl(players[0].constructs[0])}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const gameDemo = () => {
|
|
||||||
return (
|
|
||||||
<section class="game-demo">
|
|
||||||
<div>
|
|
||||||
<h2>COMBAT PHASE</h2>
|
|
||||||
<p>Battle your opponent using dynamic team builds from the VBOX phase.</p>
|
|
||||||
<p>The skills crafted can be used to damage the opponent or support your team.</p>
|
|
||||||
<p>Simultaneous turn based combat: each team picks targets for their skills during this phase.</p>
|
|
||||||
<p>The damage dealt by skills, cast order and construct life depend on your decisions in the VBOX phase.</p>
|
|
||||||
</div>
|
|
||||||
<div class="game">
|
|
||||||
<div class="game-construct">
|
|
||||||
<div class="left"></div>
|
|
||||||
<div class="right">
|
|
||||||
<ConstructAvatar construct={players[1].constructs[0]} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div></div>
|
|
||||||
<div class="game-construct">
|
|
||||||
<div class="left"></div>
|
|
||||||
<div class="right">
|
|
||||||
<ConstructAvatar construct={players[1].constructs[1]} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<section class='demo news top'>
|
|
||||||
{gameDemo()}
|
|
||||||
{vboxDemo()}
|
|
||||||
{vboxConstructs()}
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = addState(Demo);
|
|
||||||
@ -5,7 +5,6 @@ const Login = require('./welcome.login');
|
|||||||
const Register = require('./welcome.register');
|
const Register = require('./welcome.register');
|
||||||
const Help = require('./welcome.help');
|
const Help = require('./welcome.help');
|
||||||
// const About = require('./welcome.about');
|
// const About = require('./welcome.about');
|
||||||
const Demo = require('./demo');
|
|
||||||
|
|
||||||
function Welcome() {
|
function Welcome() {
|
||||||
const page = this.state.page || 'register';
|
const page = this.state.page || 'register';
|
||||||
@ -33,9 +32,7 @@ function Welcome() {
|
|||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
const main = (['login', 'register', 'help'].includes(page))
|
const main = <section>{news}{pageEl()}</section>;
|
||||||
? <section>{news}{pageEl()}</section>
|
|
||||||
: <Demo />;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main class="menu welcome">
|
<main class="menu welcome">
|
||||||
@ -58,12 +55,6 @@ function Welcome() {
|
|||||||
onClick={() => this.setState({ page: 'register' })}>
|
onClick={() => this.setState({ page: 'register' })}>
|
||||||
Register
|
Register
|
||||||
</button>
|
</button>
|
||||||
<button
|
|
||||||
class={`login-btn ${page === 'info' ? 'highlight' : ''}`}
|
|
||||||
disabled={page === 'info'}
|
|
||||||
onClick={() => this.setState({ page: 'info' })}>
|
|
||||||
Info
|
|
||||||
</button>
|
|
||||||
<button
|
<button
|
||||||
class={`login-btn ${page === 'help' ? 'highlight' : ''}`}
|
class={`login-btn ${page === 'help' ? 'highlight' : ''}`}
|
||||||
disabled={page === 'help'}
|
disabled={page === 'help'}
|
||||||
|
|||||||
@ -207,94 +207,6 @@ function registerEvents(store) {
|
|||||||
return store.dispatch(actions.setItemInfo(v));
|
return store.dispatch(actions.setItemInfo(v));
|
||||||
}
|
}
|
||||||
|
|
||||||
function setDemo(d) {
|
|
||||||
|
|
||||||
const vboxDemo = {
|
|
||||||
players: d,
|
|
||||||
combiner: [],
|
|
||||||
equipped: false,
|
|
||||||
equipping: false,
|
|
||||||
};
|
|
||||||
|
|
||||||
const startDemo = () => {
|
|
||||||
const { account, itemInfo } = store.getState();
|
|
||||||
if (account) return false;
|
|
||||||
if (!itemInfo || itemInfo.items.length === 0) return setTimeout(startDemo, 500);
|
|
||||||
store.dispatch(actions.setAnimTarget(null));
|
|
||||||
const bases = ['Attack', 'Stun', 'Buff', 'Debuff', 'Block'];
|
|
||||||
const combo = sample(itemInfo.combos.filter(i => bases.some(b => i.components.includes(b))));
|
|
||||||
vboxDemo.combo = combo.item;
|
|
||||||
vboxDemo.items = combo.components;
|
|
||||||
store.dispatch(actions.setDemo(vboxDemo));
|
|
||||||
|
|
||||||
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [0] }))), 500);
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [0, 1] }))), 1000);
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [0, 1, 2] }))), 1500);
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [], items: [vboxDemo.combo, '', ''] }))), 2500);
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [0], items: [vboxDemo.combo, '', ''], equipping: true }))), 3000);
|
|
||||||
setTimeout(() => store.dispatch(actions.setDemo(Object.assign({}, vboxDemo, { combiner: [], items: ['', '', ''], equipped: true, equipping: false }))), 4000);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
return store.dispatch(actions.setAnimTarget({
|
|
||||||
skill: sample(itemInfo.items.filter(i => i.skill)).item,
|
|
||||||
constructId: d[1].constructs[0].id,
|
|
||||||
player: false,
|
|
||||||
direction: 0,
|
|
||||||
}));
|
|
||||||
}, 500);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
return store.dispatch(actions.setAnimTarget({
|
|
||||||
skill: sample(itemInfo.items.filter(i => i.skill)).item,
|
|
||||||
constructId: d[1].constructs[1].id,
|
|
||||||
player: true,
|
|
||||||
direction: 0,
|
|
||||||
}));
|
|
||||||
}, 3000);
|
|
||||||
|
|
||||||
return setTimeout(startDemo, 5000);
|
|
||||||
};
|
|
||||||
|
|
||||||
startDemo();
|
|
||||||
}
|
|
||||||
|
|
||||||
// store.subscribe(setInfo);
|
|
||||||
// store.on('SET_INFO', setInfo);
|
|
||||||
|
|
||||||
// events.on('SET_PLAYER', setInstance);
|
|
||||||
|
|
||||||
// events.on('SEND_SKILL', function skillActive(gameId, constructId, targetConstructId, skill) {
|
|
||||||
// ws.sendGameSkill(gameId, constructId, targetConstructId, skill);
|
|
||||||
// setConstructStatusUpdate(constructId, skill, targetConstructId);
|
|
||||||
// });
|
|
||||||
|
|
||||||
// events.on('CONSTRUCT_ACTIVE', function constructActiveCb(construct) {
|
|
||||||
// for (let i = 0; i < constructs.length; i += 1) {
|
|
||||||
// if (constructs[i].id === construct.id) constructs[i].active = !constructs[i].active;
|
|
||||||
// }
|
|
||||||
// return setConstructs(constructs);
|
|
||||||
// });
|
|
||||||
|
|
||||||
/* function errorPrompt(type) {
|
|
||||||
const message = errMessages[type];
|
|
||||||
const OK_BUTTON = '<button type="submit">OK</button>';
|
|
||||||
toast.error({
|
|
||||||
theme: 'dark',
|
|
||||||
color: 'black',
|
|
||||||
timeout: false,
|
|
||||||
drag: false,
|
|
||||||
position: 'center',
|
|
||||||
maxWidth: window.innerWidth / 2,
|
|
||||||
close: false,
|
|
||||||
buttons: [
|
|
||||||
[OK_BUTTON, (instance, thisToast) => instance.hide({ transitionOut: 'fadeOut' }, thisToast)],
|
|
||||||
],
|
|
||||||
message,
|
|
||||||
});
|
|
||||||
} */
|
|
||||||
// setup / localstorage
|
|
||||||
|
|
||||||
function urlHashChange() {
|
function urlHashChange() {
|
||||||
const { ws } = store.getState();
|
const { ws } = store.getState();
|
||||||
const cmds = querystring.parse(location.hash);
|
const cmds = querystring.parse(location.hash);
|
||||||
@ -317,7 +229,6 @@ function registerEvents(store) {
|
|||||||
setActiveItem,
|
setActiveItem,
|
||||||
setActiveSkill,
|
setActiveSkill,
|
||||||
setChatWheel,
|
setChatWheel,
|
||||||
setDemo,
|
|
||||||
setConstructList,
|
setConstructList,
|
||||||
setNewConstruct,
|
setNewConstruct,
|
||||||
setGame,
|
setGame,
|
||||||
|
|||||||
@ -20,8 +20,6 @@ module.exports = {
|
|||||||
|
|
||||||
resolution: createReducer(null, 'SET_RESOLUTION'),
|
resolution: createReducer(null, 'SET_RESOLUTION'),
|
||||||
|
|
||||||
demo: createReducer(null, 'SET_DEMO'),
|
|
||||||
|
|
||||||
chatShow: createReducer(null, 'SET_CHAT_SHOW'),
|
chatShow: createReducer(null, 'SET_CHAT_SHOW'),
|
||||||
chatWheel: createReducer([], 'SET_CHAT_WHEEL'),
|
chatWheel: createReducer([], 'SET_CHAT_WHEEL'),
|
||||||
|
|
||||||
|
|||||||
@ -256,10 +256,6 @@ function createSocket(events) {
|
|||||||
events.setItemInfo(info);
|
events.setItemInfo(info);
|
||||||
}
|
}
|
||||||
|
|
||||||
function onDemo(v) {
|
|
||||||
events.setDemo(v);
|
|
||||||
}
|
|
||||||
|
|
||||||
let pongTimeout;
|
let pongTimeout;
|
||||||
function onPong() {
|
function onPong() {
|
||||||
events.setPing(Date.now() - ping);
|
events.setPing(Date.now() - ping);
|
||||||
@ -285,7 +281,6 @@ function createSocket(events) {
|
|||||||
InstanceState: onInstanceState,
|
InstanceState: onInstanceState,
|
||||||
ItemInfo: onItemInfo,
|
ItemInfo: onItemInfo,
|
||||||
Pong: onPong,
|
Pong: onPong,
|
||||||
Demo: onDemo,
|
|
||||||
|
|
||||||
// QueueRequested: () => events.notify('PVP queue request received.'),
|
// QueueRequested: () => events.notify('PVP queue request received.'),
|
||||||
QueueRequested: () => true,
|
QueueRequested: () => true,
|
||||||
|
|||||||
@ -804,26 +804,6 @@ pub fn bot_instance() -> Instance {
|
|||||||
return instance;
|
return instance;
|
||||||
}
|
}
|
||||||
|
|
||||||
pub fn demo() -> Result<Vec<Player>, Error> {
|
|
||||||
let bot = bot_player();
|
|
||||||
|
|
||||||
// generate bot imgs for the client to see
|
|
||||||
for c in bot.constructs.iter() {
|
|
||||||
img::shapes_write(c.img)?;
|
|
||||||
};
|
|
||||||
|
|
||||||
let bot2 = bot_player();
|
|
||||||
|
|
||||||
// generate bot imgs for the client to see
|
|
||||||
for c in bot2.constructs.iter() {
|
|
||||||
img::shapes_write(c.img)?;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
Ok(vec![bot, bot2])
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
pub fn vbox_refill(tx: &mut Transaction, account: &Account, instance_id: Uuid) -> Result<Instance, Error> {
|
pub fn vbox_refill(tx: &mut Transaction, account: &Account, instance_id: Uuid) -> Result<Instance, Error> {
|
||||||
let instance = instance_get(tx, instance_id)?
|
let instance = instance_get(tx, instance_id)?
|
||||||
.vbox_refill(account.id)?;
|
.vbox_refill(account.id)?;
|
||||||
|
|||||||
@ -23,7 +23,6 @@ use ws::{Builder, CloseCode, Message, Handler, Request, Response, Settings, Send
|
|||||||
use ws::deflate::DeflateHandler;
|
use ws::deflate::DeflateHandler;
|
||||||
|
|
||||||
use pg::{
|
use pg::{
|
||||||
demo,
|
|
||||||
game_concede,
|
game_concede,
|
||||||
game_offer_draw,
|
game_offer_draw,
|
||||||
game_ready,
|
game_ready,
|
||||||
@ -48,7 +47,6 @@ use events::{Event};
|
|||||||
|
|
||||||
use mnml_core::construct::{Construct};
|
use mnml_core::construct::{Construct};
|
||||||
use mnml_core::game::{Game};
|
use mnml_core::game::{Game};
|
||||||
use mnml_core::player::Player;
|
|
||||||
|
|
||||||
use mnml_core::vbox::{ItemType};
|
use mnml_core::vbox::{ItemType};
|
||||||
use mnml_core::item::Item;
|
use mnml_core::item::Item;
|
||||||
@ -73,8 +71,6 @@ pub enum RpcMessage {
|
|||||||
AccountInstances(Vec<Instance>),
|
AccountInstances(Vec<Instance>),
|
||||||
AccountShop(mtx::Shop),
|
AccountShop(mtx::Shop),
|
||||||
|
|
||||||
Demo(Vec<Player>),
|
|
||||||
|
|
||||||
ConstructSpawn(Construct),
|
ConstructSpawn(Construct),
|
||||||
GameState(Game),
|
GameState(Game),
|
||||||
ItemInfo(ItemInfoCtr),
|
ItemInfo(ItemInfoCtr),
|
||||||
@ -391,8 +387,6 @@ impl Handler for Connection {
|
|||||||
|
|
||||||
// tx should do nothing
|
// tx should do nothing
|
||||||
tx.commit().unwrap();
|
tx.commit().unwrap();
|
||||||
} else {
|
|
||||||
self.send(RpcMessage::Demo(demo().unwrap())).unwrap();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Ok(())
|
Ok(())
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user