nginx change

client/.eslintrc.js

@@ -1,7 +1,7 @@
 module.exports = {
-    // extends: [
+    extends: [
-    //    'plugin:react/recommended',
+       'plugin:react/recommended',
-    // ],
+    ],
     env: {
         browser: true,
         node: true
@@ -14,10 +14,10 @@ module.exports = {
         'import'
     ],
     settings: {
-        // react: {
+        react: {
-        //     pragma: "preact",
+            pragma: "preact",
-        //     version: "15.0",
+            version: "15.0",
-        // },
+        },
         'import/resolver': {
           node: {
             extensions: ['.mjs', '.js', '.jsx', '.json']
@@ -55,12 +55,12 @@ module.exports = {
         'key-spacing': ['error'],
 
         // for preact
-        // "react/react-in-jsx-scope": [0],
+        "react/react-in-jsx-scope": [0],
-        // "react/jsx-indent": [2, 4],
+        "react/jsx-indent": [2, 4],
-        // "react/jsx-uses-react": 1,
+        "react/jsx-uses-react": 1,
-        // "react/jsx-uses-vars": 1,
+        "react/jsx-uses-vars": 1,
-        // "react/prefer-stateless-function": 1,
+        "react/prefer-stateless-function": 1,
-        // "react/prop-types": 0,
+        "react/prop-types": 0,
 
         // airbnb copypasta
         // enforces getter/setter pairs in objects
@@ -539,7 +539,7 @@ module.exports = {
         // require parens in arrow function arguments
         // https://eslint.org/docs/rules/arrow-parens
         'arrow-parens': ['error', 'as-needed', {
-          requireForBlockBody: true,
+          requireForBlockBody: false,
         }],
 
         // require space before/after arrow function's arrow
@@ -927,7 +927,7 @@ module.exports = {
 
         // specify the maximum length of a line in your program
         // https://eslint.org/docs/rules/max-len
-        'max-len': ['error', 120, 2, {
+        'max-len': ['error', 100, 2, {
           ignoreUrls: true,
           ignoreComments: false,
           ignoreRegExpLiterals: true,

client/cryps.css

@@ -1,24 +1,438 @@
-/*@font-face {
+/*
-    font-family: 'nowayregular';
+    GLOBAL
-    src: url('./assets/fonts/noway-regular-webfont.eot');
-    src: url('./assets/fonts/noway-regular-webfont.eot?#iefix') format('embedded-opentype'),
-         url('./assets/fonts/noway-regular-webfont.woff2') format('woff2'),
-         url('./assets/fonts/noway-regular-webfont.woff') format('woff'),
-         url('./assets/fonts/noway-regular-webfont.ttf') format('truetype'),
-         url('./assets/fonts/noway-regular-webfont.svg#nowayregular') format('svg');
-    font-weight: normal;
-    font-style: normal;
-}
 */
-body {
+
-    background-color: #181818;
+html, body, .cryps {
+    width: 100%;
+    height: 100%;
+    margin: 0;
+
+    background-color: #000000;
+    font-family: 'Jura';
+    color: whitesmoke;
+    font-size: 16pt;
+    user-select: none;
+
+    /* this is the sweet nectar to keep it full page*/
+    max-height: 100%;
+    overflow: hidden;
 }
 
-canvas{
+html {
-    display:block;
+    box-sizing: border-box;
     margin: 0;
-    position: absolute;
+    padding: 0;
-    top: 50%;
+    height: 100%;
-    left: 50%;
+}
-    transform: translate(-50%, -50%);
+
+*, *:before, *:after {
+  box-sizing: inherit;
+}
+
+
+/* main container */
+.cryps {
+    padding: 0 2em;
+    display: flex;
+    flex-flow: column;
+    position: fixed;
+}
+
+main {
+    display: flex;
+    flex-flow: row wrap;
+    flex: 1 1 90%;
+
+    padding-top: 1em;
+
+    align-content: flex-start;
+    justify-content: flex-start;
+    align-items: flex-start;
+
+}
+
+button, input {
+    font-family: 'Jura';
+    height: auto;
+    color: whitesmoke;
+    border-width: 2px;
+    border-color: whitesmoke;
+    border-radius: 0;
+    letter-spacing: 0.25em;
+    box-sizing: border-box;
+
+    /*the transitions */
+    transition-property: all;
+    transition-duration: 0.5s;
+    transition-delay: 0;
+    transition-timing-function: ease;
+}
+
+button:hover, button:focus {
+    /*colour necesary to bash skellington*/
+    color: whitesmoke;
+    border-color: whitesmoke;
+}
+
+button.right[disabled]:hover, button.left[disabled]:hover {
+    box-shadow: none;
+}
+
+button.right:hover, button.right:focus {
+    box-shadow: inset -0.5em 0 0 0 whitesmoke;
+}
+
+button.left:hover, button.left:focus {
+    box-shadow: inset 0.5em 0 0 0 whitesmoke;
+}
+
+/*
+    MENU
+*/
+header {
+    display: flex;
+    flex-flow: row;
+    flex: 1;
+}
+
+.header-title {
+    flex: 1;
+    font-size: 2em;
+    letter-spacing: 0.05em;
+}
+
+.header-username {
+    letter-spacing: 0.25em;
+    font-size: 2em;
+    display: inline;
+}
+
+.header-status {
+    text-align: right;
+}
+
+.header-status svg {
+    margin-left: 1em;
+    height: 1em;
+    background-color: black;
+}
+
+.login {
+    display: inline;
+    margin-right: 0;
+}
+
+.ping-path {
+    fill: none;
+    stroke-width: 4px;
+    stroke-dasharray: 121, 242;
+    animation: saw 2s infinite linear;
+}
+
+@keyframes saw {
+    0% {
+        stroke-dashoffset: 363;
+    }
+    100% {
+        stroke-dashoffset: 0;
+    }
+}
+
+.menu-cryps {
+    display: flex;
+    flex-flow: row wrap;
+
+    flex: 0 0 50%;
+}
+
+.menu-cryp-ctr {
+    flex: 0 0 33%;
+    flex-flow: column;
+
+    text-align: center;
+    display: flex;
+}
+
+.menu-cryp {
+    height: 100%;
+    margin: 0.5em;
+    box-sizing: border-box;
+    border: 1px solid black;
+
+    transition-property: border;
+    transition-duration: 0.5s;
+    transition-delay: 0;
+    transition-timing-function: ease;
+}
+
+.menu-cryp h2 {
+    font-size: 2em;
+}
+
+.menu-instance-list {
+    flex: 0 0 50%;
+    flex-flow: row wrap;
+
+    display: flex;
+    align-content: flex-start;
+    height: 100%;
+}
+
+.menu-instance-btn {
+    box-sizing: border-box;
+    flex: 1 0 20%;
+    font-size: 150%;
+    /*min-width: 20%;*/
+    border-width: 2px;
+    padding: 0.5em;
+    margin: 0.5em;
+}
+
+.menu-instance-btn.full {
+    flex: 1 0 100%;
+}
+
+/*
+    INSTANCE
+*/
+
+
+.instance {
+    display: flex;
+    flex-flow: row wrap;
+    align-content: flex-start;
+}
+
+.instance-hdr {
+    display: flex;
+    flex-flow: row;
+
+    flex: 0 0 100%;
+    margin-bottom: 1em;
+}
+
+.instance-info {
+    flex: 0 0 50%;
+}
+
+.instance .spacer {
+    flex-grow: 1
+}
+
+.menu-btn {
+    flex: 1 0 25%;
+}
+
+.ready-btn {
+    flex: 1 0 50%;
+}
+
+.ready-btn:hover {
+    transition-property: all;
+    transition-duration: 2s;
+    transition-timing-function: ease;
+    color: forestgreen;
+    border-color: forestgreen;
+    /*box-shadow: inset -0.5em 0 0 0 forestgreen;*/
+}
+
+.instance-ui-btn {
+    font-size: 100%;
+    padding: 0;
+    margin: 0;
+}
+
+.vbox {
+    flex: 1 1 25%;
+
+    display: flex;
+    flex-flow: row wrap;
+    align-content: flex-start;
+}
+
+.vbox-hdr {
+    display: flex;
+    align-items: flex-end;
+
+    flex: 1 0 100%;
+}
+
+.vbox-hdr div:first-child {
+    flex-grow: 1;
+}
+
+.vbox-hdr .bits {
+    font-size: 2em;
+    line-height: 1em;
+}
+
+.vbox-btn {
+    flex: 1 0 100%;
+    margin: 0;
+    padding: 0 0.5em;
+    background-color: whitesmoke;
+    color: black;
+}
+
+.vbox-btn:hover {
+    color: black;
+}
+
+.vbox-table {
+    table-layout: fixed;
+    width: 100%;
+}
+
+.vbox-table td {
+    border: 1px solid whitesmoke;
+    padding: 0.2em;
+    text-align: center;
+    height: 40px;
+    cursor: pointer;
+    text-transform: uppercase;
+}
+
+.spacer {
+    flex: 1 0 25%;
+}
+
+.cryp-list {
+    flex: 1 1 25%;
+
+    display: flex;
+    flex-flow: column;
+    height: 95%;
+    padding: 0 2em 0 2em;
+}
+
+/* CRYP BOX */
+.cryp-box {
+    flex: 1 1 100%;
+
+    display: flex;
+    flex-flow: column;
+    border: 1px solid whitesmoke;
+    margin-bottom: 1em;
+    justify-content: center;
+}
+
+.cryp-box-top {
+    display: flex;
+    flex: 1 1 80%;
+    width: 100%;
+    justify-content: center;
+    align-items: stretch;
+}
+
+.cryp-box .particle {
+    position: fixed;
+    z-index: -10;
+}
+
+.cryp-box figure {
+    margin: 0;
+    flex: 0 0 50%;
+    text-align: center;
+    box-sizing: border-box;
+    display: flex;
+    flex-flow: column;
+}
+
+.cryp-box .stats {
+    flex: 0 0 20%;
+    width: 100%;
+    display: flex;
+    border-top: 1px solid whitesmoke;
+}
+
+.cryp-box .stats figure {
+    flex: 1 1 0;
+    border: 0;
+    align-items: center;
+    padding: 0.25em 0;
+}
+
+.cryp-box .stats figcaption {
+    font-size: 75%;
+}
+
+
+.cryp-box .stats svg {
+    height: 1.5em;
+    stroke-width: 2px;
+}
+
+.cryp-box .skills {
+    display: flex;
+    flex-flow: row wrap;
+    flex: 1 1 50%;
+}
+
+.cryp-skill-btn {
+    flex: 1 1 100%;
+    font-size: 16pt;
+    border-width: 1px;
+    padding: 0;
+    margin: 0;
+    border-bottom-width: 0px;
+    border-left-width: 1px;
+    border-right-width: 0px;
+}
+
+.cryp-skill-btn:first-child {
+    border-top-width: 0;
+}
+
+
+/* GAME */
+.game-back-btn {
+    flex: 0 0 20%;
+}
+
+.cryp-skill-btn[disabled] {
+    color: #333333;
+    font-size: 14pt;
+}
+
+.cryp-box.ko {
+    animation: none;
+    opacity: 0.5;
+}
+
+.team-player {
+    display: flex;
+    flex: 1 0 20%;
+    height: 90%;
+    padding: 0;
+}
+
+.team-opponent {
+    display: flex;
+    flex: 1 0 20%;
+    height: 90%;
+    padding: 0;
+}
+
+.logs {
+    padding-left: 2em;
+    display: flex;
+    flex-flow: row wrap;
+    flex: 0 0 20%;
+}
+
+.selected-skills {
+    flex: 1 1 25%;
+
+    display: flex;
+    flex-flow: column;
+    height: 95%;
+    padding: 0 2em 0 2em;
+    justify-content: center;
+}
+
+.stack-line {
+    display: flex;
+    align-items: center;
+    padding-left: 2em;
+    flex: 1;
 }

client/index.html

@@ -4,10 +4,12 @@
     <title>cryps.gg - mnml pvp atbs</title>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <meta name="description" content="cryps.gg - mnml pvp atbs">
+    <meta name="author" content="ntr@smokestack.io">
     <link rel="stylesheet" href="./node_modules/izitoast/dist/css/iziToast.min.css"></script>
     <link href="https://fonts.googleapis.com/css?family=Jura" rel="stylesheet">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
+    <link rel="stylesheet" href="assets/normalize.css">
-    <script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
+    <link rel="stylesheet" href="assets/skeleton.css">
   </head>
   </head>
   <body>

client/package.json

@@ -4,30 +4,37 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "parcel index.html --port 40080 --no-hmr --no-source-maps",
+    "start": "parcel index.html --port 40080 --no-source-maps",
-    "build": "rm -rf dist && parcel build --no-source-maps index.html",
+    "build": "rm -rf dist && parcel build index.html",
-    "lint": "eslint --fix src/",
+    "lint": "eslint --fix --ext .jsx src/",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "",
   "license": "UNLICENSED",
   "dependencies": {
-    "async": "^2.6.1",
     "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",
-    "parcel": "^1.11.0",
+    "parcel": "^1.12.3",
-    "phaser": "^3.16.1",
+    "particles.js": "^2.0.0",
+    "phaser": "^3.15.1",
+    "preact": "^8.3.1",
+    "preact-redux": "^2.0.3",
     "redux": "^4.0.0"
   },
   "devDependencies": {
+    "babel-core": "^6.26.3",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
     "eslint": "^5.6.0",
     "eslint-config-airbnb-base": "^13.1.0",
     "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-react": "^7.11.1",
     "jest": "^18.0.0"
   }
 }

html-client/cryps.css

@@ -1,438 +0,0 @@
-/*
-    GLOBAL
-*/
-
-html, body, .cryps {
-    width: 100%;
-    height: 100%;
-    margin: 0;
-
-    background-color: #000000;
-    font-family: 'Jura';
-    color: whitesmoke;
-    font-size: 16pt;
-    user-select: none;
-
-    /* this is the sweet nectar to keep it full page*/
-    max-height: 100%;
-    overflow: hidden;
-}
-
-html {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-    height: 100%;
-}
-
-*, *:before, *:after {
-  box-sizing: inherit;
-}
-
-
-/* main container */
-.cryps {
-    padding: 0 2em;
-    display: flex;
-    flex-flow: column;
-    position: fixed;
-}
-
-main {
-    display: flex;
-    flex-flow: row wrap;
-    flex: 1 1 90%;
-
-    padding-top: 1em;
-
-    align-content: flex-start;
-    justify-content: flex-start;
-    align-items: flex-start;
-
-}
-
-button, input {
-    font-family: 'Jura';
-    height: auto;
-    color: whitesmoke;
-    border-width: 2px;
-    border-color: whitesmoke;
-    border-radius: 0;
-    letter-spacing: 0.25em;
-    box-sizing: border-box;
-
-    /*the transitions */
-    transition-property: all;
-    transition-duration: 0.5s;
-    transition-delay: 0;
-    transition-timing-function: ease;
-}
-
-button:hover, button:focus {
-    /*colour necesary to bash skellington*/
-    color: whitesmoke;
-    border-color: whitesmoke;
-}
-
-button.right[disabled]:hover, button.left[disabled]:hover {
-    box-shadow: none;
-}
-
-button.right:hover, button.right:focus {
-    box-shadow: inset -0.5em 0 0 0 whitesmoke;
-}
-
-button.left:hover, button.left:focus {
-    box-shadow: inset 0.5em 0 0 0 whitesmoke;
-}
-
-/*
-    MENU
-*/
-header {
-    display: flex;
-    flex-flow: row;
-    flex: 1;
-}
-
-.header-title {
-    flex: 1;
-    font-size: 2em;
-    letter-spacing: 0.05em;
-}
-
-.header-username {
-    letter-spacing: 0.25em;
-    font-size: 2em;
-    display: inline;
-}
-
-.header-status {
-    text-align: right;
-}
-
-.header-status svg {
-    margin-left: 1em;
-    height: 1em;
-    background-color: black;
-}
-
-.login {
-    display: inline;
-    margin-right: 0;
-}
-
-.ping-path {
-    fill: none;
-    stroke-width: 4px;
-    stroke-dasharray: 121, 242;
-    animation: saw 2s infinite linear;
-}
-
-@keyframes saw {
-    0% {
-        stroke-dashoffset: 363;
-    }
-    100% {
-        stroke-dashoffset: 0;
-    }
-}
-
-.menu-cryps {
-    display: flex;
-    flex-flow: row wrap;
-
-    flex: 0 0 50%;
-}
-
-.menu-cryp-ctr {
-    flex: 0 0 33%;
-    flex-flow: column;
-
-    text-align: center;
-    display: flex;
-}
-
-.menu-cryp {
-    height: 100%;
-    margin: 0.5em;
-    box-sizing: border-box;
-    border: 1px solid black;
-
-    transition-property: border;
-    transition-duration: 0.5s;
-    transition-delay: 0;
-    transition-timing-function: ease;
-}
-
-.menu-cryp h2 {
-    font-size: 2em;
-}
-
-.menu-instance-list {
-    flex: 0 0 50%;
-    flex-flow: row wrap;
-
-    display: flex;
-    align-content: flex-start;
-    height: 100%;
-}
-
-.menu-instance-btn {
-    box-sizing: border-box;
-    flex: 1 0 20%;
-    font-size: 150%;
-    /*min-width: 20%;*/
-    border-width: 2px;
-    padding: 0.5em;
-    margin: 0.5em;
-}
-
-.menu-instance-btn.full {
-    flex: 1 0 100%;
-}
-
-/*
-    INSTANCE
-*/
-
-
-.instance {
-    display: flex;
-    flex-flow: row wrap;
-    align-content: flex-start;
-}
-
-.instance-hdr {
-    display: flex;
-    flex-flow: row;
-
-    flex: 0 0 100%;
-    margin-bottom: 1em;
-}
-
-.instance-info {
-    flex: 0 0 50%;
-}
-
-.instance .spacer {
-    flex-grow: 1
-}
-
-.menu-btn {
-    flex: 1 0 25%;
-}
-
-.ready-btn {
-    flex: 1 0 50%;
-}
-
-.ready-btn:hover {
-    transition-property: all;
-    transition-duration: 2s;
-    transition-timing-function: ease;
-    color: forestgreen;
-    border-color: forestgreen;
-    /*box-shadow: inset -0.5em 0 0 0 forestgreen;*/
-}
-
-.instance-ui-btn {
-    font-size: 100%;
-    padding: 0;
-    margin: 0;
-}
-
-.vbox {
-    flex: 1 1 25%;
-
-    display: flex;
-    flex-flow: row wrap;
-    align-content: flex-start;
-}
-
-.vbox-hdr {
-    display: flex;
-    align-items: flex-end;
-
-    flex: 1 0 100%;
-}
-
-.vbox-hdr div:first-child {
-    flex-grow: 1;
-}
-
-.vbox-hdr .bits {
-    font-size: 2em;
-    line-height: 1em;
-}
-
-.vbox-btn {
-    flex: 1 0 100%;
-    margin: 0;
-    padding: 0 0.5em;
-    background-color: whitesmoke;
-    color: black;
-}
-
-.vbox-btn:hover {
-    color: black;
-}
-
-.vbox-table {
-    table-layout: fixed;
-    width: 100%;
-}
-
-.vbox-table td {
-    border: 1px solid whitesmoke;
-    padding: 0.2em;
-    text-align: center;
-    height: 40px;
-    cursor: pointer;
-    text-transform: uppercase;
-}
-
-.spacer {
-    flex: 1 0 25%;
-}
-
-.cryp-list {
-    flex: 1 1 25%;
-
-    display: flex;
-    flex-flow: column;
-    height: 95%;
-    padding: 0 2em 0 2em;
-}
-
-/* CRYP BOX */
-.cryp-box {
-    flex: 1 1 100%;
-
-    display: flex;
-    flex-flow: column;
-    border: 1px solid whitesmoke;
-    margin-bottom: 1em;
-    justify-content: center;
-}
-
-.cryp-box-top {
-    display: flex;
-    flex: 1 1 80%;
-    width: 100%;
-    justify-content: center;
-    align-items: stretch;
-}
-
-.cryp-box .particle {
-    position: fixed;
-    z-index: -10;
-}
-
-.cryp-box figure {
-    margin: 0;
-    flex: 0 0 50%;
-    text-align: center;
-    box-sizing: border-box;
-    display: flex;
-    flex-flow: column;
-}
-
-.cryp-box .stats {
-    flex: 0 0 20%;
-    width: 100%;
-    display: flex;
-    border-top: 1px solid whitesmoke;
-}
-
-.cryp-box .stats figure {
-    flex: 1 1 0;
-    border: 0;
-    align-items: center;
-    padding: 0.25em 0;
-}
-
-.cryp-box .stats figcaption {
-    font-size: 75%;
-}
-
-
-.cryp-box .stats svg {
-    height: 1.5em;
-    stroke-width: 2px;
-}
-
-.cryp-box .skills {
-    display: flex;
-    flex-flow: row wrap;
-    flex: 1 1 50%;
-}
-
-.cryp-skill-btn {
-    flex: 1 1 100%;
-    font-size: 16pt;
-    border-width: 1px;
-    padding: 0;
-    margin: 0;
-    border-bottom-width: 0px;
-    border-left-width: 1px;
-    border-right-width: 0px;
-}
-
-.cryp-skill-btn:first-child {
-    border-top-width: 0;
-}
-
-
-/* GAME */
-.game-back-btn {
-    flex: 0 0 20%;
-}
-
-.cryp-skill-btn[disabled] {
-    color: #333333;
-    font-size: 14pt;
-}
-
-.cryp-box.ko {
-    animation: none;
-    opacity: 0.5;
-}
-
-.team-player {
-    display: flex;
-    flex: 1 0 20%;
-    height: 90%;
-    padding: 0;
-}
-
-.team-opponent {
-    display: flex;
-    flex: 1 0 20%;
-    height: 90%;
-    padding: 0;
-}
-
-.logs {
-    padding-left: 2em;
-    display: flex;
-    flex-flow: row wrap;
-    flex: 0 0 20%;
-}
-
-.selected-skills {
-    flex: 1 1 25%;
-
-    display: flex;
-    flex-flow: column;
-    height: 95%;
-    padding: 0 2em 0 2em;
-    justify-content: center;
-}
-
-.stack-line {
-    display: flex;
-    align-items: center;
-    padding-left: 2em;
-    flex: 1;
-}

phaser-client/.eslintrc.js

@@ -1,7 +1,7 @@
 module.exports = {
-    extends: [
+    // extends: [
-       'plugin:react/recommended',
+    //    'plugin:react/recommended',
-    ],
+    // ],
     env: {
         browser: true,
         node: true
@@ -14,10 +14,10 @@ module.exports = {
         'import'
     ],
     settings: {
-        react: {
+        // react: {
-            pragma: "preact",
+        //     pragma: "preact",
-            version: "15.0",
+        //     version: "15.0",
-        },
+        // },
         'import/resolver': {
           node: {
             extensions: ['.mjs', '.js', '.jsx', '.json']
@@ -55,12 +55,12 @@ module.exports = {
         'key-spacing': ['error'],
 
         // for preact
-        "react/react-in-jsx-scope": [0],
+        // "react/react-in-jsx-scope": [0],
-        "react/jsx-indent": [2, 4],
+        // "react/jsx-indent": [2, 4],
-        "react/jsx-uses-react": 1,
+        // "react/jsx-uses-react": 1,
-        "react/jsx-uses-vars": 1,
+        // "react/jsx-uses-vars": 1,
-        "react/prefer-stateless-function": 1,
+        // "react/prefer-stateless-function": 1,
-        "react/prop-types": 0,
+        // "react/prop-types": 0,
 
         // airbnb copypasta
         // enforces getter/setter pairs in objects
@@ -539,7 +539,7 @@ module.exports = {
         // require parens in arrow function arguments
         // https://eslint.org/docs/rules/arrow-parens
         'arrow-parens': ['error', 'as-needed', {
-          requireForBlockBody: false,
+          requireForBlockBody: true,
         }],
 
         // require space before/after arrow function's arrow
@@ -927,7 +927,7 @@ module.exports = {
 
         // specify the maximum length of a line in your program
         // https://eslint.org/docs/rules/max-len
-        'max-len': ['error', 100, 2, {
+        'max-len': ['error', 120, 2, {
           ignoreUrls: true,
           ignoreComments: false,
           ignoreRegExpLiterals: true,

phaser-client/cryps.css

@@ -0,0 +1,24 @@
+/*@font-face {
+    font-family: 'nowayregular';
+    src: url('./assets/fonts/noway-regular-webfont.eot');
+    src: url('./assets/fonts/noway-regular-webfont.eot?#iefix') format('embedded-opentype'),
+         url('./assets/fonts/noway-regular-webfont.woff2') format('woff2'),
+         url('./assets/fonts/noway-regular-webfont.woff') format('woff'),
+         url('./assets/fonts/noway-regular-webfont.ttf') format('truetype'),
+         url('./assets/fonts/noway-regular-webfont.svg#nowayregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+*/
+body {
+    background-color: #181818;
+}
+
+canvas{
+    display:block;
+    margin: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}

phaser-client/index.html

@@ -4,12 +4,10 @@
     <title>cryps.gg - mnml pvp atbs</title>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="description" content="cryps.gg - mnml pvp atbs">
-    <meta name="author" content="ntr@smokestack.io">
     <link rel="stylesheet" href="./node_modules/izitoast/dist/css/iziToast.min.css"></script>
     <link href="https://fonts.googleapis.com/css?family=Jura" rel="stylesheet">
-    <link rel="stylesheet" href="assets/normalize.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
-    <link rel="stylesheet" href="assets/skeleton.css">
+    <script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
   </head>
   </head>
   <body>

phaser-client/package.json

@@ -4,37 +4,30 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "parcel index.html --port 40080 --no-source-maps",
+    "start": "parcel index.html --port 40080 --no-hmr --no-source-maps",
-    "build": "rm -rf dist && parcel build index.html",
+    "build": "rm -rf dist && parcel build --no-source-maps index.html",
-    "lint": "eslint --fix --ext .jsx src/",
+    "lint": "eslint --fix src/",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "",
   "license": "UNLICENSED",
   "dependencies": {
+    "async": "^2.6.1",
     "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",
-    "parcel": "^1.12.3",
+    "parcel": "^1.11.0",
-    "particles.js": "^2.0.0",
+    "phaser": "^3.16.1",
-    "phaser": "^3.15.1",
-    "preact": "^8.3.1",
-    "preact-redux": "^2.0.3",
     "redux": "^4.0.0"
   },
   "devDependencies": {
-    "babel-core": "^6.26.3",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-react": "^6.24.1",
     "eslint": "^5.6.0",
     "eslint-config-airbnb-base": "^13.1.0",
     "eslint-plugin-import": "^2.14.0",
-    "eslint-plugin-react": "^7.11.1",
     "jest": "^18.0.0"
   }
 }