Add the interface and update Dockfile

Dockerfile

@@ -1,10 +1,18 @@
-FROM nvidia/cuda:10.2-base-ubuntu18.04
+FROM nvidia/cuda:11.4.3-devel-ubuntu18.04
 RUN apt-get update
-RUN apt-get install -y python3.7 curl python3-distutils
+RUN apt-get install -y python3.7 curl python3-distutils libboost-dev
 RUN ln -s /usr/bin/python3.7 /usr/bin/python
 RUN curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py
 RUN python get-pip.py
 RUN mkdir /deepcube
 COPY ./requirements.txt /deepcube
 WORKDIR /deepcube
 RUN pip install -r requirements.txt
+ADD ./ /deepcube
+WORKDIR /deepcube/cpp
+RUN make
+ENV PYTHONPATH /deepcube
+ENV CUDA_VISIBLE_DEVICES 0
+
+WORKDIR /deepcube/interface
+CMD ["python", "server.py"]

README.md

@@ -17,6 +17,21 @@ Python version used: 3.7.2
 IMPORTANT! Before running anything, please execute: `source setup.sh` in the DeepCubeA directory to add the current 
 directory to your python path.
 
+# Docker compose and interface
+You can using docker compose to run and test it.
+```
+docker-compose build
+docker-compose up -d
+```
+Then open the http://localhost:5000/, you will see the Rubik’s cube UI. 
+Pressing Scramble and Solve button to try it.
+
+<div align="center">
+    <a href="./">
+        <img src="./images/UI.png" width="60%"/>
+    </a>
+</div>
+
 # Training and A* Search
 `train.sh` contains the commands to trian the cost-to-go function as well as using it with A* search.
 Note that some of the hyperparameters may be slightly different than those in the paper as they were later 

docker-compose.yml

@@ -0,0 +1,8 @@
+version: '3.1'
+services:
+  deepcubea:
+    build:
+      context: ./
+      dockerfile: Dockerfile
+    ports:
+       - 5000:5000

interface/initState.json

@@ -0,0 +1 @@
+{"state": [2, 5, 8, 1, 4, 7, 0, 3, 6, 11, 14, 17, 10, 13, 16, 9, 12, 15, 20, 23, 26, 19, 22, 25, 18, 21, 24, 29, 32, 35, 28, 31, 34, 27, 30, 33, 42, 39, 36, 43, 40, 37, 44, 41, 38, 47, 50, 53, 46, 49, 52, 45, 48, 51], "stateToFE": [2, 5, 8, 1, 4, 7, 0, 3, 6, 11, 14, 17, 10, 13, 16, 9, 12, 15, 20, 23, 26, 19, 22, 25, 18, 21, 24, 29, 32, 35, 28, 31, 34, 27, 30, 33, 42, 39, 36, 43, 40, 37, 44, 41, 38, 47, 50, 53, 46, 49, 52, 45, 48, 51], "FEToState": [6, 3, 0, 7, 4, 1, 8, 5, 2, 15, 12, 9, 16, 13, 10, 17, 14, 11, 24, 21, 18, 25, 22, 19, 26, 23, 20, 33, 30, 27, 34, 31, 28, 35, 32, 29, 38, 41, 44, 37, 40, 43, 36, 39, 42, 51, 48, 45, 52, 49, 46, 53, 50, 47], "legalMoves": ["U_-1", "U_1", "D_-1", "D_1", "L_-1", "L_1", "R_-1", "R_1", "B_-1", "B_1", "F_-1", "F_1"], "rotateIdxs_old": {"B_1": [42, 39, 36, 36, 37, 38, 38, 41, 44, 44, 43, 42, 35, 34, 33, 15, 12, 9, 18, 19, 20, 2, 5, 8], "B_-1": [38, 41, 44, 44, 43, 42, 42, 39, 36, 36, 37, 38, 18, 19, 20, 2, 5, 8, 35, 34, 33, 15, 12, 9], "D_1": [15, 12, 9, 9, 10, 11, 11, 14, 17, 17, 16, 15, 36, 39, 42, 27, 30, 33, 45, 48, 51, 18, 21, 24], "D_-1": [11, 14, 17, 17, 16, 15, 15, 12, 9, 9, 10, 11, 45, 48, 51, 18, 21, 24, 36, 39, 42, 27, 30, 33], "F_1": [51, 48, 45, 45, 46, 47, 47, 50, 53, 53, 52, 51, 24, 25, 26, 17, 14, 11, 29, 28, 27, 0, 3, 6], "F_-1": [47, 50, 53, 53, 52, 51, 51, 48, 45, 45, 46, 47, 29, 28, 27, 0, 3, 6, 24, 25, 26, 17, 14, 11], "L_1": [24, 21, 18, 18, 19, 20, 20, 23, 26, 26, 25, 24, 44, 43, 42, 9, 10, 11, 45, 46, 47, 0, 1, 2], "L_-1": [20, 23, 26, 26, 25, 24, 24, 21, 18, 18, 19, 20, 45, 46, 47, 0, 1, 2, 44, 43, 42, 9, 10, 11], "R_1": [33, 30, 27, 27, 28, 29, 29, 32, 35, 35, 34, 33, 51, 52, 53, 15, 16, 17, 38, 37, 36, 6, 7, 8], "R_-1": [29, 32, 35, 35, 34, 33, 33, 30, 27, 27, 28, 29, 38, 37, 36, 6, 7, 8, 51, 52, 53, 15, 16, 17], "U_1": [6, 3, 0, 0, 1, 2, 2, 5, 8, 8, 7, 6, 47, 50, 53, 29, 32, 35, 38, 41, 44, 20, 23, 26], "U_-1": [2, 5, 8, 8, 7, 6, 6, 3, 0, 0, 1, 2, 38, 41, 44, 20, 23, 26, 47, 50, 53, 29, 32, 35]}, "rotateIdxs_new": {"B_1": [36, 37, 38, 38, 41, 44, 44, 43, 42, 42, 39, 36, 2, 5, 8, 35, 34, 33, 15, 12, 9, 18, 19, 20], "B_-1": [36, 37, 38, 38, 41, 44, 44, 43, 42, 42, 39, 36, 2, 5, 8, 35, 34, 33, 15, 12, 9, 18, 19, 20], "D_1": [9, 10, 11, 11, 14, 17, 17, 16, 15, 15, 12, 9, 18, 21, 24, 36, 39, 42, 27, 30, 33, 45, 48, 51], "D_-1": [9, 10, 11, 11, 14, 17, 17, 16, 15, 15, 12, 9, 18, 21, 24, 36, 39, 42, 27, 30, 33, 45, 48, 51], "F_1": [45, 46, 47, 47, 50, 53, 53, 52, 51, 51, 48, 45, 0, 3, 6, 24, 25, 26, 17, 14, 11, 29, 28, 27], "F_-1": [45, 46, 47, 47, 50, 53, 53, 52, 51, 51, 48, 45, 0, 3, 6, 24, 25, 26, 17, 14, 11, 29, 28, 27], "L_1": [18, 19, 20, 20, 23, 26, 26, 25, 24, 24, 21, 18, 0, 1, 2, 44, 43, 42, 9, 10, 11, 45, 46, 47], "L_-1": [18, 19, 20, 20, 23, 26, 26, 25, 24, 24, 21, 18, 0, 1, 2, 44, 43, 42, 9, 10, 11, 45, 46, 47], "R_1": [27, 28, 29, 29, 32, 35, 35, 34, 33, 33, 30, 27, 6, 7, 8, 51, 52, 53, 15, 16, 17, 38, 37, 36], "R_-1": [27, 28, 29, 29, 32, 35, 35, 34, 33, 33, 30, 27, 6, 7, 8, 51, 52, 53, 15, 16, 17, 38, 37, 36], "U_1": [0, 1, 2, 2, 5, 8, 8, 7, 6, 6, 3, 0, 20, 23, 26, 47, 50, 53, 29, 32, 35, 38, 41, 44], "U_-1": [0, 1, 2, 2, 5, 8, 8, 7, 6, 6, 3, 0, 20, 23, 26, 47, 50, 53, 29, 32, 35, 38, 41, 44]}}

interface/server.py

@@ -0,0 +1,43 @@
+from flask import Flask
+from flask import render_template
+from flask import request, jsonify
+from flask import url_for
+import json
+import types
+app=Flask(__name__)
+from tools import getResults
+import ast
+
+@app.route('/', methods=['POST','GET'])
+def index():
+    if request.method == 'GET':
+        return render_template('mofang.html')
+
+@app.route('/initState', methods=['POST'])
+def initState():
+    if request.method=='POST':
+        #rev=request.get_json()['city']
+        #result=selcity(rev)
+        with open('initState.json', 'r') as f:
+            result = json.load(f)
+        print(result)
+        return jsonify(result)
+
+@app.route('/solve', methods=['POST'])
+def solve():
+    if request.method == 'POST':
+        rev = request.form
+        print(rev)
+        print("computing...")
+        data = rev.to_dict()
+        state = []
+        data['state'] = ast.literal_eval(data['state'])
+        print(data['state'])
+        for i in data['state']:
+            state.append(int(i))
+        result = getResults(state)
+        print("complete!")
+        return jsonify(result)
+
+if __name__=='__main__':
+    app.run(debug=True, host='0.0.0.0')

interface/static/main.css

@@ -0,0 +1,94 @@
+.cube_container {
+	Margin:auto;
+	width: 200px;
+	height: 200px;
+	position: relative;
+	perspective: 1000px;
+}
+
+#solution_container {
+	background-color: #FFFFFF
+}
+
+#cube_div {
+	background-color: #e6e6e6
+}
+
+#button_container {
+	background-color: #FFFFFF
+}
+
+#cube {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+	transform-style: preserve-3d;
+}
+
+#cube figure {
+	margin: 0;
+	width: 200px;
+	height: 200px;
+	display: block;
+	position: absolute;
+	border: 1px solid black;
+	opacity:1.0;
+	background-color: #000000;
+}
+
+.sticker {
+	width: 33.3%;
+	height: 33.3%;
+	background-color: #000000;
+	border: 2px solid black;
+	float: left;
+}
+
+#cube .front {
+	transform: rotateY( 0deg) translateZ(100px);
+}
+
+#cube .back {
+	transform: rotateX( 180deg) translateZ(100px);
+}
+
+#cube .right {
+	transform: rotateY( 90deg) translateZ(100px);
+}
+
+#cube .left {
+	transform: rotateY( -90deg) translateZ(100px);
+}
+
+#cube .top {
+	transform: rotateX( 90deg) translateZ(100px);
+}
+
+#cube .bottom {
+	transform: rotateX( -90deg) translateZ(100px);
+}
+
+#cube {
+	/*transform: translateZ( -100px);*/
+}
+
+button {
+  border: 1px solid #0066cc;
+  background-color: #0099cc;
+  color: #ffffff;
+  padding: 5px 10px;
+}
+
+button:hover {
+  border: 1px solid #0099cc;
+  background-color: #00aacc;
+  color: #ffffff;
+  padding: 5px 10px;
+}
+
+button:disabled,
+button[disabled]{
+  border: 1px solid #999999;
+  background-color: #cccccc;
+  color: #666666;
+}