eassey

html-client/cryps.css

@@ -11,33 +11,52 @@ button, input {
     height: auto;
     color: whitesmoke;
     border-width: 2px;
+    border-color: whitesmoke;
+    border-radius: 0;
 }
 
-@keyframes glowing {
+/*colour necesary to bash skellington*/
-    0% { box-shadow: 0 0 0px whitesmoke; }
-    20% { box-shadow: 0 0 20px whitesmoke; }
-    60% { box-shadow: 0 0 20px whitesmoke; }
-    100% { box-shadow: 0 0 0px whitesmoke; }
-}
-
 button:hover {
     color: whitesmoke;
-    animation: glowing 2000ms infinite;
+    animation: whiteglow 2000ms infinite;
     border-color: whitesmoke;
 }
 
+@keyframes whiteglow {
+    0% {
+        box-shadow: 0 0 0px whitesmoke;
+    }
+    20% {
+        box-shadow: 0 0 20px whitesmoke;
+    }
+    60% {
+        box-shadow: 0 0 20px whitesmoke;
+    }
+    100% {
+        box-shadow: 0 0 0px whitesmoke;
+    }
+}
+
 @keyframes greenglow {
     0% {
         box-shadow: 0 0 -20px forestgreen;
     }
     100% {
-        box-shadow: 0 0 -20px forestgreen;
         box-shadow: 0 0 30px forestgreen;
         color: forestgreen;
         border-color: forestgreen;
     }
 }
 
+@keyframes whiteblackglow {
+    0% {
+        box-shadow: 0 0 0px black;
+    }
+    100% {
+        box-shadow: 0 0 -30px black;
+    }
+}
+
 .green-btn:hover {
     animation: greenglow 2s ease 0s 1 normal forwards;
     animation-iteration-count: 1;
@@ -53,10 +72,22 @@ button:hover {
 
 .instance-ui-btn {
     font-size: 100%;
-    min-width: 20%;
+    min-width: 100%;
     padding: 0;
 }
 
+.vbox-btn {
+    margin: 0;
+    padding: 0.5em;
+    background-color: whitesmoke;
+    color: black;
+}
+
+.vbox-btn:hover {
+    color: black;
+    animation: whiteblackglow 2s ease 0s 1 normal forwards;
+}
+
 .header {
     margin-bottom: 2em;
 }
@@ -86,9 +117,20 @@ button:hover {
     display: inline;
 }
 
+.header-status {
+    text-align: right;
+}
+
+.vbox-table {
+    table-layout: fixed;
+    width: 100%;
+}
+
 .vbox-table td {
     border: 1px solid whitesmoke;
     padding: 0.5em;
+    text-align: center;
+    height: 40px;
 }
 
 .vbox-table th:first-child, td:first-child {
@@ -117,3 +159,7 @@ button:hover {
     stroke-dashoffset: 0;
   }
 }
+
+.spacer {
+    min-width: 100%;
+}

html-client/lib/fizzy-noise.js

@@ -1,189 +0,0 @@
-// http://mrl.nyu.edu/~perlin/noise/
-
-const ImprovedNoise = function () {
-    const p = [151, 160, 137, 91, 90, 15, 131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140, 36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10,
-        23, 190, 6, 148, 247, 120, 234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33, 88, 237, 149, 56, 87,
-        174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71, 134, 139, 48, 27, 166, 77, 146, 158, 231, 83, 111, 229, 122, 60, 211,
-        133, 230, 220, 105, 92, 41, 55, 46, 245, 40, 244, 102, 143, 54, 65, 25, 63, 161, 1, 216, 80, 73, 209, 76, 132, 187, 208,
-        89, 18, 169, 200, 196, 135, 130, 116, 188, 159, 86, 164, 100, 109, 198, 173, 186, 3, 64, 52, 217, 226, 250, 124, 123, 5,
-        202, 38, 147, 118, 126, 255, 82, 85, 212, 207, 206, 59, 227, 47, 16, 58, 17, 182, 189, 28, 42, 223, 183, 170, 213, 119,
-        248, 152, 2, 44, 154, 163, 70, 221, 153, 101, 155, 167, 43, 172, 9, 129, 22, 39, 253, 19, 98, 108, 110, 79, 113, 224, 232,
-        178, 185, 112, 104, 218, 246, 97, 228, 251, 34, 242, 193, 238, 210, 144, 12, 191, 179, 162, 241, 81, 51, 145, 235, 249,
-        14, 239, 107, 49, 192, 214, 31, 181, 199, 106, 157, 184, 84, 204, 176, 115, 121, 50, 45, 127, 4, 150, 254, 138, 236, 205,
-        93, 222, 114, 67, 29, 24, 72, 243, 141, 128, 195, 78, 66, 215, 61, 156, 180];
-
-    for (let i = 0; i < 256; i++) {
-        p[256 + i] = p[i];
-    }
-
-    function fade(t) {
-        return t * t * t * (t * (t * 6 - 15) + 10);
-    }
-
-    function lerp(t, a, b) {
-        return a + t * (b - a);
-    }
-
-    function grad(hash, x, y, z) {
-        const h = hash & 15;
-        const u = h < 8 ? x : y; const
-            v = h < 4 ? y : h == 12 || h == 14 ? x : z;
-        return ((h & 1) == 0 ? u : -u) + ((h & 2) == 0 ? v : -v);
-    }
-
-    return {
-
-        noise(x, y, z) {
-            const floorX = Math.floor(x); const floorY = Math.floor(y); const
-                floorZ = Math.floor(z);
-
-            const X = floorX & 255; const Y = floorY & 255; const
-                Z = floorZ & 255;
-
-            x -= floorX;
-            y -= floorY;
-            z -= floorZ;
-
-            const xMinus1 = x - 1; const yMinus1 = y - 1; const
-                zMinus1 = z - 1;
-
-            const u = fade(x); const v = fade(y); const
-                w = fade(z);
-
-            const A = p[X] + Y; const AA = p[A] + Z; const AB = p[A + 1] + Z; const B = p[X + 1] + Y; const BA = p[B] + Z; const
-                BB = p[B + 1] + Z;
-
-            return lerp(w, lerp(v, lerp(u, grad(p[AA], x, y, z),
-                grad(p[BA], xMinus1, y, z)),
-            lerp(u, grad(p[AB], x, yMinus1, z),
-                grad(p[BB], xMinus1, yMinus1, z))),
-            lerp(v, lerp(u, grad(p[AA + 1], x, y, zMinus1),
-                grad(p[BA + 1], xMinus1, y, z - 1)),
-            lerp(u, grad(p[AB + 1], x, yMinus1, zMinus1),
-                grad(p[BB + 1], xMinus1, yMinus1, zMinus1))));
-        },
-    };
-};
-
-const currentRandom = Math.random;
-
-// Pseudo-random generator
-function Marsaglia(i1, i2) {
-    // from http://www.math.uni-bielefeld.de/~sillke/ALGORITHMS/random/marsaglia-c
-    let z = i1 || 362436069; let
-        w = i2 || 521288629;
-    const nextInt = function () {
-        z = (36969 * (z & 65535) + (z >>> 16)) & 0xFFFFFFFF;
-        w = (18000 * (w & 65535) + (w >>> 16)) & 0xFFFFFFFF;
-        return (((z & 0xFFFF) << 16) | (w & 0xFFFF)) & 0xFFFFFFFF;
-    };
-
-    this.nextDouble = function () {
-        const i = nextInt() / 4294967296;
-        return i < 0 ? 1 + i : i;
-    };
-    this.nextInt = nextInt;
-}
-Marsaglia.createRandomized = function () {
-    const now = new Date();
-    return new Marsaglia((now / 60000) & 0xFFFFFFFF, now & 0xFFFFFFFF);
-};
-
-// Noise functions and helpers
-function PerlinNoise(seed) {
-    const rnd = seed !== undefined ? new Marsaglia(seed) : Marsaglia.createRandomized();
-    let i; let
-        j;
-    // http://www.noisemachine.com/talk1/17b.html
-    // http://mrl.nyu.edu/~perlin/noise/
-    // generate permutation
-    const p = new Array(512);
-    for (i = 0; i < 256; ++i) { p[i] = i; }
-    for (i = 0; i < 256; ++i) { const t = p[j = rnd.nextInt() & 0xFF]; p[j] = p[i]; p[i] = t; }
-    // copy to avoid taking mod in p[0];
-    for (i = 0; i < 256; ++i) { p[i + 256] = p[i]; }
-
-    function grad3d(i, x, y, z) {
-        const h = i & 15; // convert into 12 gradient directions
-        const u = h < 8 ? x : y;
-
-
-        const v = h < 4 ? y : h === 12 || h === 14 ? x : z;
-        return ((h & 1) === 0 ? u : -u) + ((h & 2) === 0 ? v : -v);
-    }
-
-    function grad2d(i, x, y) {
-        const v = (i & 1) === 0 ? x : y;
-        return (i & 2) === 0 ? -v : v;
-    }
-
-    function grad1d(i, x) {
-        return (i & 1) === 0 ? -x : x;
-    }
-
-    function lerp(t, a, b) { return a + t * (b - a); }
-
-    this.noise3d = function (x, y, z) {
-        const X = Math.floor(x) & 255; const Y = Math.floor(y) & 255; const
-            Z = Math.floor(z) & 255;
-        x -= Math.floor(x); y -= Math.floor(y); z -= Math.floor(z);
-        const fx = (3 - 2 * x) * x * x; const fy = (3 - 2 * y) * y * y; const
-            fz = (3 - 2 * z) * z * z;
-        const p0 = p[X] + Y; const p00 = p[p0] + Z; const p01 = p[p0 + 1] + Z; const p1  = p[X + 1] + Y; const p10 = p[p1] + Z; const
-            p11 = p[p1 + 1] + Z;
-        return lerp(fz,
-            lerp(fy, lerp(fx, grad3d(p[p00], x, y, z), grad3d(p[p10], x - 1, y, z)),
-                lerp(fx, grad3d(p[p01], x, y - 1, z), grad3d(p[p11], x - 1, y - 1, z))),
-            lerp(fy, lerp(fx, grad3d(p[p00 + 1], x, y, z - 1), grad3d(p[p10 + 1], x - 1, y, z - 1)),
-                lerp(fx, grad3d(p[p01 + 1], x, y - 1, z - 1), grad3d(p[p11 + 1], x - 1, y - 1, z - 1))));
-    };
-
-    this.noise2d = function (x, y) {
-        const X = Math.floor(x) & 255; const
-            Y = Math.floor(y) & 255;
-        x -= Math.floor(x); y -= Math.floor(y);
-        const fx = (3 - 2 * x) * x * x; const
-            fy = (3 - 2 * y) * y * y;
-        const p0 = p[X] + Y; const
-            p1  = p[X + 1] + Y;
-        return lerp(fy,
-            lerp(fx, grad2d(p[p0], x, y), grad2d(p[p1], x - 1, y)),
-            lerp(fx, grad2d(p[p0 + 1], x, y - 1), grad2d(p[p1 + 1], x - 1, y - 1)));
-    };
-
-    this.noise1d = function (x) {
-        const X = Math.floor(x) & 255;
-        x -= Math.floor(x);
-        const fx = (3 - 2 * x) * x * x;
-        return lerp(fx, grad1d(p[X], x), grad1d(p[X + 1], x - 1));
-    };
-}
-
-//  these are lifted from Processing.js
-// processing defaults
-const noiseProfile = {
-    generator: undefined, octaves: 4, fallout: 0.5, seed: undefined,
-};
-
-module.exports = function noise(x, y, z) {
-    if (noiseProfile.generator === undefined) {
-    // caching
-        noiseProfile.generator = new PerlinNoise(noiseProfile.seed);
-    }
-    const generator = noiseProfile.generator;
-    let effect = 1; let k = 1; let
-        sum = 0;
-    for (let i = 0; i < noiseProfile.octaves; ++i) {
-        effect *= noiseProfile.fallout;
-        switch (arguments.length) {
-        case 1:
-            sum += effect * (1 + generator.noise1d(k * x)) / 2; break;
-        case 2:
-            sum += effect * (1 + generator.noise2d(k * x, k * y)) / 2; break;
-        case 3:
-            sum += effect * (1 + generator.noise3d(k * x, k * y, k * z)) / 2; break;
-        }
-        k *= 2;
-    }
-    return sum;
-};

html-client/lib/fizzy-text.js

@@ -1,220 +0,0 @@
-const noise = require('./fizzy-noise');
-
-function fizzyText(message) {
-    const that = this;
-
-    // These are the variables that we manipulate with gui-dat.
-    // Notice they're all defined with "this". That makes them public.
-    // Otherwise, gui-dat can't see them.
-
-    this.growthSpeed = 0.8;       // how fast do particles change size?
-    this.minSize = 1;
-    this.maxSize = 4;          // how big can they get?
-    this.noiseStrength = 10;      // how turbulent is the flow?
-    this.speed = 0.4;             // how fast do particles move?
-    this.displayOutline = false;  // should we draw the message as a stroke?
-    this.framesRendered = 0;
-
-    // //////////////////////////////////////////////////////////////
-
-    const _this = this;
-
-    const width = 550;
-    const height = 200;
-    const textAscent = 101;
-    const textOffsetLeft = 80;
-    const noiseScale = 300;
-    const frameTime = 30;
-
-    const colors = ['#000000', '#1A1A1A', '#163C50', '#205A79', '#2A78A2'];
-
-    // This is the context we use to get a bitmap of text using
-    // the getImageData function.
-    const r = document.createElement('canvas');
-    const s = r.getContext('2d');
-
-    // This is the context we actually use to draw.
-    const c = document.createElement('canvas');
-    const g = c.getContext('2d');
-
-    r.setAttribute('width', width);
-    c.setAttribute('width', width);
-    r.setAttribute('height', height);
-    c.setAttribute('height', height);
-
-    // Add our demo to the HTML
-    document.getElementById('fizzytext').appendChild(c);
-
-    // Stores bitmap image
-    let pixels = [];
-
-    // Stores a list of particles
-    const particles = [];
-
-    // Set g.font to the same font as the bitmap canvas, incase we
-    // want to draw some outlines.
-    s.font = g.font = '800 82px monospace, monospace';
-
-    // Instantiate some particles
-    for (let i = 0; i < 1000; i++) {
-        particles.push(new Particle(Math.random() * width, Math.random() * height));
-    }
-
-    // This function creates a bitmap of pixels based on your message
-    // It's called every time we change the message property.
-    const createBitmap = function (msg) {
-        s.fillStyle = '#fff';
-        s.fillRect(0, 0, width, height);
-
-        s.fillStyle = '#222';
-        s.fillText(msg, textOffsetLeft, textAscent);
-
-        // Pull reference
-        const imageData = s.getImageData(0, 0, width, height);
-        pixels = imageData.data;
-    };
-
-    // Called once per frame, updates the animation.
-    const render = function () {
-        that.framesRendered++;
-
-        g.clearRect(0, 0, width, height);
-
-        if (_this.displayOutline) {
-            g.globalCompositeOperation = 'source-over';
-            g.strokeStyle = '#000';
-            g.lineWidth = 0.5;
-            g.strokeText(message, textOffsetLeft, textAscent);
-        }
-
-        g.globalCompositeOperation = 'darker';
-
-        for (let i = 0; i < particles.length; i++) {
-            g.fillStyle = colors[i % colors.length];
-            particles[i].render();
-        }
-    };
-
-    // Returns x, y coordinates for a given index in the pixel array.
-    const getPosition = function (i) {
-        return {
-            x: (i - (width * 4) * Math.floor(i / (width * 4))) / 4,
-            y: Math.floor(i / (width * 4)),
-        };
-    };
-
-    // Returns a color for a given pixel in the pixel array.
-    const getColor = function (x, y) {
-        const base = (Math.floor(y) * width + Math.floor(x)) * 4;
-        const c = {
-            r: pixels[base + 0],
-            g: pixels[base + 1],
-            b: pixels[base + 2],
-            a: pixels[base + 3],
-        };
-
-        return `rgb(${c.r},${c.g},${c.b})`;
-    };
-
-    this.message = message;
-    createBitmap(message);
-
-    var loop = function () {
-        requestAnimationFrame(loop);
-        render();
-    };
-
-    // This calls the render function every 30 milliseconds.
-    loop();
-
-    // This class is responsible for drawing and moving those little
-    // colored dots.
-    function Particle(x, y, c) {
-    // Position
-        this.x = x;
-        this.y = y;
-
-        // Size of particle
-        this.r = 1;
-
-        // This velocity is used by the explode function.
-        this.vx = 0;
-        this.vy = 0;
-
-        this.constrain = function constrainFn(v, o1, o2) {
-            if (v < o1) v = o1;
-            else if (v > o2) v = o2;
-            return v;
-        };
-
-        // Called every frame
-        this.render = function renderFrame() {
-            // What color is the pixel we're sitting on top of?
-            const c = getColor(this.x, this.y);
-
-            // Where should we move?
-            const angle = noise(this.x / noiseScale, this.y / noiseScale) * _this.noiseStrength;
-            // var angle = -Math.PI/2;
-
-            // Are we within the boundaries of the image?
-            const onScreen = this.x > 0 && this.x < width && this.y > 0 && this.y < height;
-
-            const isBlack = c !== 'rgb(255,255,255)' && onScreen;
-
-            // If we're on top of a black pixel, grow.
-            // If not, shrink.
-            if (isBlack) {
-                this.r += _this.growthSpeed;
-            } else {
-                this.r -= _this.growthSpeed;
-            }
-
-            // This velocity is used by the explode function.
-            this.vx *= 0.5;
-            this.vy *= 0.5;
-
-            // Change our position based on the flow field and our
-            // explode velocity.
-            this.x += Math.cos(angle) * _this.speed + this.vx;
-            this.y += -Math.sin(angle) * _this.speed + this.vy;
-
-            if (this.r > _this.maxSize) {
-                this.r = _this.maxSize;
-            } else if (this.r < 0) {
-                this.r = 0;
-                this.x = Math.random() * width;
-                this.y = Math.random() * height;
-                return false;
-            }
-
-            // this.r = 3;
-            // debugger
-            // console.log(DAT.GUI.constrain(this.r, 0, _this.maxSize));
-            // this.r = this.constrain(this.r, _this.minSize, _this.maxSize);
-
-            // If we're tiny, keep moving around until we find a black
-            // pixel.
-            if (this.r <= 0) {
-                this.x = Math.random() * width;
-                this.y = Math.random() * height;
-                return false; // Don't draw!
-            }
-
-            // If we're off the screen, go over to other side
-            if (this.x < 0) this.x = width;
-            if (this.x > width) this.x = 0;
-            if (this.y < 0) this.y = height;
-            if (this.y > height) this.y = 0;
-
-            // Draw the circle.
-            g.beginPath();
-            // g.arc(this.x, this.y, this.r, 0, Math.PI * 2, false);
-            g.rect(this.x, this.y, this.r, this.r);
-            g.fill();
-
-            return true;
-        };
-    }
-}
-
-module.exports = fizzyText;

html-client/src/actions.jsx

@@ -13,8 +13,8 @@ export const setInstance = value => ({ type: SET_INSTANCE, value });
 export const SET_GAME = 'SET_GAME';
 export const setGame = value => ({ type: SET_GAME, value });
 
-export const SET_ACTIVE_ITEM = 'SET_ACTIVE_ITEM';
+export const SET_COMBINER = 'SET_COMBINER';
-export const setActiveItem = value => ({ type: SET_ACTIVE_ITEM, value });
+export const setCombiner = value => ({ type: SET_COMBINER, value });
 
 export const SET_ACTIVE_INCOMING = 'SET_ACTIVE_INCOMING';
 export const setActiveIncoming = value => ({ type: SET_ACTIVE_INCOMING, value });

html-client/src/components/instance.component.jsx

@@ -1,53 +1,22 @@
 const preact = require('preact');
-const key = require('keymaster');
+// const key = require('keymaster');
 
-function convertVar(v) {
+const VboxContainer = require('./vbox.container');
-    return v || '';
-}
 
-function Vbox(vbox) {
+function InstanceComponent(args) {
-    if (!vbox) return false;
-
-    const free = [];
-    for (let i = 0 ; i < vbox.free[0].length; i++) {
-        free.push([vbox.free[0][i], vbox.free[1][i], vbox.free[2][i]]);
-    }
-
-    const rows = free.map((row, i) => (
-        <tr key={i}>
-            <td>{convertVar(row[0])}</td>
-            <td>{convertVar(row[1])}</td>
-            <td>{convertVar(row[2])}</td>
-        </tr>
-    ));
-
-    return (
-        <div className="four columns">
-            <span>vBox</span>
-            <table className="vbox-table">
-                <tbody>
-                    {rows}
-                </tbody>
-            </table>
-            {JSON.stringify(vbox)}
-        </div>
-    );
-}
-
-function InstanceComponent(props) {
     const {
+        // account,
         instance,
-        account,
-        sendInstanceReady,
         quit,
-    } = props;
+        sendInstanceReady,
+    } = args;
 
     if (!instance) return <div>...</div>;
 
     return (
         <section>
             <div className="row">
-                <div className="six columns">
+                <div className="three columns">
                     <button
                         className="instance-btn instance-ui-btn glow-btn"
                         onClick={quit}>
@@ -55,6 +24,9 @@ function InstanceComponent(props) {
                     </button>
                 </div>
                 <div className="six columns">
+                    <h4>next game against: mmmmmashy</h4>
+                </div>
+                <div className="three columns">
                     <button
                         className="instance-btn instance-ui-btn green-btn u-pull-right"
                         onClick={() => sendInstanceReady()}>
@@ -63,13 +35,10 @@ function InstanceComponent(props) {
                 </div>
             </div>
             <div className="row">
-                {Vbox(instance.vbox)}
+                <VboxContainer />
-                <div className="four columns">
+                <div className="three columns">
                     {JSON.stringify(instance.cryps)}
                 </div>
-                <div className="four columns">
-                    ready btn
-                </div>
             </div>
         </section>
     );

html-client/src/components/instance.container.jsx

@@ -6,19 +6,20 @@ const Instance = require('./instance.component');
 
 const addState = connect(
     function receiveState(state) {
-        const { ws, instance, account } = state;
+        const { ws, instance, account, combiner } = state;
 
         function sendInstanceReady() {
-            return ws.sendInstanceReady(instance.id);
+            return ws.sendInstanceReady(instance.instance);
         }
 
         return { instance, account, sendInstanceReady };
     },
 
-    function receiveDispatch(dispatch, { instance }) {
+    function receiveDispatch(dispatch, { instance, combiner }) {
         function quit() {
             dispatch(actions.setInstance(null));
         }
+
         return { quit };
     }
 

html-client/src/components/login.component.jsx

@@ -3,7 +3,7 @@ const preact = require('preact');
 
 function renderLogin({ account, submitLogin, submitRegister }) {
     if (account) return (
-        <div>
+        <div className="header-status">
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" className="ping-svg">
               <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
               <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>

html-client/src/events.jsx

@@ -43,8 +43,8 @@ function registerEvents(store) {
         return store.dispatch(actions.setInstances(v));
     }
 
-    function setPlayer(player) {
+    function setPlayer(v) {
-        console.log('EVENT ->', 'player', player);
+        return store.dispatch(actions.setInstance(v));
     }
 
     function setZone(zone) {

html-client/src/main.jsx

@@ -7,7 +7,6 @@ const { createStore, combineReducers } = require('redux');
 const reducers = require('./reducers');
 const actions = require('./actions');
 // const setupKeys = require('./keyboard');
-// const fizzyText = require('../lib/fizzy-text');
 const createSocket = require('./socket');
 const registerEvents = require('./events');
 
@@ -18,6 +17,7 @@ const Body = require('./components/body.component');
 const store = createStore(
     combineReducers({
         account: reducers.accountReducer,
+        combiner: reducers.combinerReducer,
         game: reducers.gameReducer,
         cryps: reducers.crypsReducer,
         instances: reducers.instancesReducer,
@@ -56,6 +56,4 @@ document.fonts.load('10pt "Jura"').then(() => {
 
     // eslint-disable-next-line
     preact.render(<Main />, document.body);
-
-    // fizzyText('cryps.gg');
 });

html-client/src/reducers.jsx

@@ -40,6 +40,16 @@ function instanceReducer(state = defaultInstance, action) {
     }
 }
 
+const defaultCombiner = [];
+function combinerReducer(state = defaultCombiner, action) {
+    switch (action.type) {
+        case actions.SET_COMBINER:
+            return action.value;
+        default:
+            return state;
+    }
+}
+
 const defaultGame = null;
 function gameReducer(state = defaultGame, action) {
     switch (action.type) {
@@ -62,6 +72,7 @@ function wsReducer(state = defaultWs, action) {
 
 module.exports = {
     accountReducer,
+    combinerReducer,
     crypsReducer,
     gameReducer,
     instancesReducer,