diff --git a/html-client/cryps.css b/html-client/cryps.css
index d03fd1fa..5f9a785a 100755
--- a/html-client/cryps.css
+++ b/html-client/cryps.css
@@ -37,6 +37,8 @@ button:hover {
 .menu-cryps {
     display: flex;
     flex-flow: row wrap;
+    align-items: stretch;
+    justify-content: flex-end;
 }
 
 .menu-cryp-ctr {
@@ -45,6 +47,7 @@ button:hover {
 }
 
 .menu-cryp {
+    height: 100%;
     margin: 0.5em;
     box-sizing: border-box;
     border: 2px solid whitesmoke;
diff --git a/html-client/src/components/vbox.component.jsx b/html-client/src/components/vbox.component.jsx
index afe0b506..c967d0c8 100644
--- a/html-client/src/components/vbox.component.jsx
+++ b/html-client/src/components/vbox.component.jsx
@@ -9,6 +9,7 @@ function Vbox(args) {
     const {
         instance,
         combiner,
+        setCombiner,
         sendVboxAccept,
         sendVboxDiscard,
         sendVboxReclaim,
@@ -18,6 +19,21 @@ function Vbox(args) {
     const { vbox } = instance;
     if (!instance.vbox) return false;
 
+    // lots of rubbish to make it flow nice
+    function combinerAdd(i) {
+        if (combiner.indexOf(i) === -1) {
+            const insert = combiner.findIndex(j => j === null);
+            combiner[insert] = i;
+            return setCombiner(combiner);
+        }
+        return setCombiner([i, null, null]);
+    }
+
+    function combinerRmv(i) {
+        combiner[i] = null;
+        return setCombiner(combiner);
+    }
+
     const free = [];
     for (let i = 0 ; i < 6; i++) {
         free.push([vbox.free[0][i], vbox.free[1][i], vbox.free[2][i]]);
@@ -41,19 +57,19 @@ function Vbox(args) {
 
     const boundRows = [
         <tr key={0} >
-            <td>{convertVar(vbox.bound[0])}</td>
-            <td>{convertVar(vbox.bound[1])}</td>
-            <td>{convertVar(vbox.bound[2])}</td>
+            <td onClick={() => combinerAdd(0) }>{convertVar(vbox.bound[0])}</td>
+            <td onClick={() => combinerAdd(1) }>{convertVar(vbox.bound[1])}</td>
+            <td onClick={() => combinerAdd(2) }>{convertVar(vbox.bound[2])}</td>
         </tr>,
         <tr key={1}>
-            <td>{convertVar(vbox.bound[3])}</td>
-            <td>{convertVar(vbox.bound[4])}</td>
-            <td>{convertVar(vbox.bound[5])}</td>
+            <td onClick={() => combinerAdd(3) }>{convertVar(vbox.bound[3])}</td>
+            <td onClick={() => combinerAdd(4) }>{convertVar(vbox.bound[4])}</td>
+            <td onClick={() => combinerAdd(5) }>{convertVar(vbox.bound[5])}</td>
         </tr>,
         <tr key={2}>
-            <td>{convertVar(vbox.bound[6])}</td>
-            <td>{convertVar(vbox.bound[7])}</td>
-            <td>{convertVar(vbox.bound[8])}</td>
+            <td onClick={() => combinerAdd(6) }>{convertVar(vbox.bound[6])}</td>
+            <td onClick={() => combinerAdd(7) }>{convertVar(vbox.bound[7])}</td>
+            <td onClick={() => combinerAdd(8) }>{convertVar(vbox.bound[8])}</td>
         </tr>,
     ];
 
@@ -61,9 +77,9 @@ function Vbox(args) {
         <table className="vbox-table">
             <tbody>
                 <tr>
-                    <td>{convertVar(combiner[0])}</td>
-                    <td>{convertVar(combiner[1])}</td>
-                    <td>{convertVar(combiner[2])}</td>
+                    <td onClick={() => combinerRmv(0)}>{convertVar(vbox.bound[combiner[0]])}</td>
+                    <td onClick={() => combinerRmv(1)}>{convertVar(vbox.bound[combiner[1]])}</td>
+                    <td onClick={() => combinerRmv(2)}>{convertVar(vbox.bound[combiner[2]])}</td>
                 </tr>
             </tbody>
         </table>
diff --git a/html-client/src/components/vbox.container.jsx b/html-client/src/components/vbox.container.jsx
index fe6a8d02..78f48028 100644
--- a/html-client/src/components/vbox.container.jsx
+++ b/html-client/src/components/vbox.container.jsx
@@ -17,13 +17,11 @@ const addState = connect(
         }
 
         function sendVboxCombine() {
-            return console.log('combine', combiner);
-            return ws.sendVboxDiscard(instance.instance);
+            return ws.sendVboxCombine(combiner);
         }
 
         function sendVboxReclaim(v) {
-            return console.log('reclaim', v);
-            return ws.sendVboxDiscard(instance.instance);
+            return ws.sendVboxDiscard(instance.instance, v);
         }
 
         return {
@@ -36,16 +34,12 @@ const addState = connect(
         };
     },
 
-    function receiveDispatch(dispatch, { combiner }) {
-        function addToCombiner(v) {
-            combiner.push(v);
-            if (combiner.length > 3) {
-                dispatch(actions.setCombiner([v]));
-            }
-            dispatch(actions.setCombiner(combiner));
+    function receiveDispatch(dispatch) {
+        function setCombiner(c) {
+            dispatch(actions.setCombiner(c));
         }
 
-        return { addToCombiner };
+        return { setCombiner };
     }
 
 );
diff --git a/html-client/src/reducers.jsx b/html-client/src/reducers.jsx
index b2493378..54cd3d57 100644
--- a/html-client/src/reducers.jsx
+++ b/html-client/src/reducers.jsx
@@ -60,7 +60,7 @@ function selectedCrypsReducer(state = defaultSelectedCryps, action) {
     }
 }
 
-const defaultCombiner = [];
+const defaultCombiner = [null, null, null];
 function combinerReducer(state = defaultCombiner, action) {
     switch (action.type) {
         case actions.SET_COMBINER:
diff --git a/server/src/account.rs b/server/src/account.rs
index 02d3cdce..b961ef52 100644
--- a/server/src/account.rs
+++ b/server/src/account.rs
@@ -201,7 +201,7 @@ pub fn account_players(tx: &mut Transaction, account: &Account) -> Result<Vec<Pl
         };
     }
 
-    list.sort_by_key(|c| c.id);
+    list.sort_by_key(|c| c.instance);
 
     return Ok(list);
 }
\ No newline at end of file