ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update to preact x

Browse Source
This commit is contained in:
ntr 2019-05-24 15:01:50 +10:00
parent 4469d901e3
commit f7e53f23b1
23 changed files with 56 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/assets/styles/game.css
View File

@ -299,8 +299,6 @@ CRYP DAMAGE
.game .img {
position: relative;
height: 100%;
min-width: 200px;
/*animation: rotate 1s infinite ease-in-out alternate;*/
}
/*@keyframes rotate {

16
client/package.json
View File

@ -13,28 +13,22 @@
"author": "",
"license": "UNLICENSED",
"dependencies": {
"anime": "^0.1.2",
"animejs": "^3.0.1",
"async": "^2.6.2",
"borc": "^2.0.3",
"bulma-toast": "^1.2.0",
"docco": "^0.7.0",
"izitoast": "^1.4.0",
"jdenticon": "^2.1.0",
"key": "^0.1.11",
"keymaster": "^1.6.2",
"lodash": "^4.17.11",
"node-sass": "^4.12.0",
"parcel": "^1.12.3",
"particles.js": "^2.0.0",
"phaser": "^3.15.1",
"preact": "^8.3.1",
"preact-redux": "^2.0.3",
"preact": "^10.0.0-beta.1",
"react-redux": "^7.0.3",
"redux": "^4.0.0",
"redux-diff-logger": "0.0.9"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-plugin-module-resolver": "^3.2.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"eslint": "^5.6.0",
@ -42,5 +36,9 @@
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-react": "^7.11.1",
"jest": "^18.0.0"
},
"alias": {
"react": "preact/compat",
"react-dom": "preact/compat"
}
}

2
client/src/app.jsx
View File

@ -1,7 +1,7 @@
const preact = require('preact');
// const logger = require('redux-diff-logger');
const { Provider } = require('preact-redux');
const { Provider } = require('react-redux');
const { createStore, combineReducers } = require('redux');
const reducers = require('./reducers');

2
client/src/components/cryp.spawn.container.js
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const CrypSpawnButton = require('./cryp.spawn.button');

2
client/src/components/game.container.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const actions = require('../actions');

4
client/src/components/game.cryp.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const preact = require('preact');
const range = require('lodash/range');
@ -106,7 +106,7 @@ function GameCryp(props) {
<figure
className="img"
onClick={() => selectSkillTarget(cryp.id)} >
{crypAvatar(cryp.name)}
{crypAvatar(cryp.name, cryp.id)}
{combatTextEl}
{anim}
</figure>

2
client/src/components/header.container.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const Header = require('./header.component');

2
client/src/components/info.container.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const actions = require('../actions');
const Info = require('./info.component');

2
client/src/components/instance.component.jsx
View File

@ -1,5 +1,5 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const Vbox = require('./vbox.component');
const InfoContainer = require('./info.container');

2
client/src/components/instance.create.form.jsx
View File

@ -1,5 +1,5 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const { Component } = require('preact');
const addState = connect(

4
client/src/components/instance.cryps.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const preact = require('preact');
const range = require('lodash/range');
@ -205,7 +205,7 @@ function Cryp(props) {
return (
<div key={cryp.id} className={crypClass} onClick={onClick} >
{instanceCryp(cryp.name)}
{instanceCryp(cryp.name, cryp.id)}
<h2 className="name" >{cryp.name}</h2>
<div className="skills" onMouseOver={e => hoverInfo(e, 'crypSkills')} >
{skills}

2
client/src/components/instance.equip.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const preact = require('preact');
const range = require('lodash/range');

2
client/src/components/list.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const preact = require('preact');
const { NULL_UUID } = require('./../utils');

2
client/src/components/login.container.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const Login = require('./login.component');

2
client/src/components/main.jsx
View File

@ -1,6 +1,6 @@
// eslint-disable-next-line
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const LoginContainer = require('./login.container');
const GameContainer = require('./game.container');

2
client/src/components/menu.container.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const Menu = require('./menu.component');
const actions = require('./../actions');

2
client/src/components/nav.jsx
View File

@ -1,4 +1,4 @@
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const preact = require('preact');
const actions = require('../actions');

2
client/src/components/skill.btn.jsx
View File

@ -1,5 +1,5 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const actions = require('../actions');

2
client/src/components/targeting.arrows.jsx
View File

@ -1,5 +1,5 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const addState = connect(
({ game, account, resolution }) => ({ game, account, resolution })

4
client/src/components/team.jsx
View File

@ -1,5 +1,5 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const range = require('lodash/range');
const actions = require('./../actions');
@ -94,7 +94,7 @@ function Team(args) {
className="menu-cryp"
style={ { 'border-color': borderColour || 'whitesmoke' } }
onClick={() => selectCryp(cryp.id)} >
{crypAvatar(cryp.name)}
{crypAvatar(cryp.name, cryp.id)}
<h2>{cryp.name}</h2>
</div>
</div>

2
client/src/components/vbox.component.jsx
View File

@ -1,6 +1,6 @@
const preact = require('preact');
const range = require('lodash/range');
const { connect } = require('preact-redux');
const { connect } = require('react-redux');
const shapes = require('./shapes');
const { convertItem } = require('./../utils');

21
client/src/utils.jsx
View File

@ -1,4 +1,6 @@
const preact = require('preact');
const { useEffect } = require('preact/hooks');
const get = require('lodash/get');
const anime = require('animejs').default;
@ -54,9 +56,12 @@ function requestAvatar(name) {
.then(svg => svg);
}
function crypAvatar(name) {
function crypAvatar(name, id) {
useEffect(() => animateCryp(id));
return (
<img
id={id}
src={`/molecules/${genAvatar(name)}.svg`}
height="500"
onError={event => event.target.setAttribute('src', '/molecules/726.svg')}
@ -64,12 +69,14 @@ function crypAvatar(name) {
);
}
function instanceCryp(name) {
function instanceCryp(name, id) {
useEffect(() => animateCryp(id));
return (
<div
className="avatar"
id={id}
style={{'background-image': `url(/molecules/${genAvatar(name)}.svg)`}}
onError={event => event.target.setAttribute('src', '/molecules/726.svg')}
/>
);
}
@ -531,13 +538,14 @@ function convertItem(v) {
}
function animateCryp(id) {
const target = document.getElementById(id);
return anime({
targets: `#${id}`,
targets: target,
translateX: () => anime.random(-20, 20),
translateY: () => anime.random(0, -40),
rotate: () => anime.random(-15, 15),
duration: () => anime.random(5000, 6000),
delay: () => anime.random(0, 1000),
duration: () => anime.random(2000, 5000),
delay: () => anime.random(0, 2000),
direction: 'alternate',
easing: 'linear',
loop: true,
@ -545,6 +553,7 @@ function animateCryp(id) {
}
module.exports = {
animateCryp,
stringSort,
convertItem,
numSort,

12
ops/fix.molecule.holes.js Normal file
View File

@ -0,0 +1,12 @@
const fs = require('fs');
for (let i = 10000; i >= 0; i--) {
fs.access(`./../client/assets/molecules/${i}.svg`, (err) => {
if (err) {
fs.copyFileSync(`./../client/assets/molecules/726.svg`, `./../client/assets/molecules/${i}.svg`);
console.log('defaulted', i);
}
return true;
})
}