Update app to incorporate sigcrafting inventory endpoints

docker-compose.yml

@@ -19,14 +19,33 @@ services:
         max-size: "1m"
         max-file: "3"
 
-  imgparser:
-    build: imgparser
-    restart: always
+  server2:
+    build: server2
+    depends_on:
+      - postgres
     ports:
-      - "4503:4503"
+      - "443:443"
+    working_dir: /server2
     volumes:
-        - ./imgparser:/imgparser
-    working_dir: /imgparser/projectDivaImgParser
+        - ./server2:/server2
+    env_file:
+        - ./server/.env.twitter
+    logging:
+      options:
+        max-size: "1m"
+        max-file: "3"
+
+  server3:
+    build: server3
+    depends_on:
+      - postgres
+    ports:
+      - "4505:4505"
+    working_dir: /server3
+    volumes:
+        - ./server3:/server3
+    env_file:
+        - ./server/.env.twitter
     logging:
       options:
         max-size: "1m"
@@ -38,7 +57,7 @@ services:
     ports:
       - "4502:5432"
     volumes:
-        - ./init.sql:/docker-entrypoint-initdb.d/init.sql
+        - ./init2.sql:/docker-entrypoint-initdb.d/init.sql
         - ./postgres-data:/var/lib/postgresql/data
     environment:
       POSTGRES_USER: postgres
@@ -57,7 +76,7 @@ services:
       - postgres
       - server
     ports:
-      - "80:3000"
+      - "4500:3000"
     environment:
       - CHOKIDAR_USEPOLLING=true
     stdin_open: true
@@ -72,6 +91,30 @@ services:
         max-size: "1m"
         max-file: "3"
 
+  sigcrafting:
+    build: 
+        context: sigcrafting
+        dockerfile: Dockerfile
+    restart: on-failure
+    depends_on:
+      - postgres
+      - server
+    ports:
+      - "3001:3001"
+    environment:
+      - CHOKIDAR_USEPOLLING=true
+    stdin_open: true
+    working_dir: /sigcrafting
+    env_file:
+        - ./sigcrafting/.env
+    volumes:
+        - /app/node_modules
+        - ./sigcrafting:/sigcrafting
+    logging:
+      options:
+        max-size: "1m"
+        max-file: "3"
+        
       
 #  prod-frontend:
 #    build:

docker_terminal

@@ -0,0 +1 @@
+docker exec -it $1 bash

frontend/Dockerfile

@@ -9,7 +9,7 @@ ENV PATH /app/node_modules/.bin:$PATH
 
 COPY . /app
 
-RUN npm install --silent
+RUN npm install -y --silent
 RUN npm rebuild node-sass
 
 CMD ["npm", "start"]

frontend/package-lock.json

@@ -1361,6 +1361,11 @@
       "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.4.4.tgz",
       "integrity": "sha512-1oO6+dN5kdIA3sKPZhRGJTfGVP4SWV6KqlMOwry4J3HfyD68sl/3KmG7DeYUzvN+RbhXDnv/D8vNNB8168tAMg=="
     },
+    "@reach/observe-rect": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@reach/observe-rect/-/observe-rect-1.2.0.tgz",
+      "integrity": "sha512-Ba7HmkFgfQxZqqaeIWWkNK0rEhpxVQHIoVyW1YDSkGsGIXzcaW4deC8B0pZrNSSyLTdIk7y+5olKt5+g0GmFIQ=="
+    },
     "@restart/context": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/@restart/context/-/context-2.1.4.tgz",
@@ -3710,6 +3715,11 @@
       "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
       "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg=="
     },
+    "components": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/components/-/components-0.1.0.tgz",
+      "integrity": "sha1-IFfAjpx78mYv7slcSeX/Kpq4XtU="
+    },
     "compose-function": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/compose-function/-/compose-function-3.0.3.tgz",
@@ -4273,6 +4283,83 @@
         "type": "^1.0.1"
       }
     },
+    "d3-array": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.11.0.tgz",
+      "integrity": "sha512-26clcwmHQEdsLv34oNKq5Ia9tQ26Y/4HqS3dQzF42QBUqymZJ+9PORcN1G52bt37NsL2ABoX4lvyYZc+A9Y0zw==",
+      "requires": {
+        "internmap": "^1.0.0"
+      }
+    },
+    "d3-color": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
+      "integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
+    },
+    "d3-delaunay": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-5.3.0.tgz",
+      "integrity": "sha512-amALSrOllWVLaHTnDLHwMIiz0d1bBu9gZXd1FiLfXf8sHcX9jrcj81TVZOqD4UX7MgBZZ07c8GxzEgBpJqc74w==",
+      "requires": {
+        "delaunator": "4"
+      }
+    },
+    "d3-format": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
+      "integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
+    },
+    "d3-interpolate": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
+      "integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
+      "requires": {
+        "d3-color": "1 - 2"
+      }
+    },
+    "d3-path": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
+      "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg=="
+    },
+    "d3-scale": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.2.3.tgz",
+      "integrity": "sha512-8E37oWEmEzj57bHcnjPVOBS3n4jqakOeuv1EDdQSiSrYnMCBdMd3nc4HtKk7uia8DUHcY/CGuJ42xxgtEYrX0g==",
+      "requires": {
+        "d3-array": "^2.3.0",
+        "d3-format": "1 - 2",
+        "d3-interpolate": "1.2.0 - 2",
+        "d3-time": "1 - 2",
+        "d3-time-format": "2 - 3"
+      }
+    },
+    "d3-shape": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
+      "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
+      "requires": {
+        "d3-path": "1"
+      }
+    },
+    "d3-time": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.0.0.tgz",
+      "integrity": "sha512-2mvhstTFcMvwStWd9Tj3e6CEqtOivtD8AUiHT8ido/xmzrI9ijrUUihZ6nHuf/vsScRBonagOdj0Vv+SEL5G3Q=="
+    },
+    "d3-time-format": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
+      "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
+      "requires": {
+        "d3-time": "1 - 2"
+      }
+    },
+    "d3-voronoi": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/d3-voronoi/-/d3-voronoi-1.1.4.tgz",
+      "integrity": "sha512-dArJ32hchFsrQ8uMiTBLq256MpnZjeuBtdHpaDlYuQyjU0CVzCJl/BVW+SkszaAeH95D/8gxqAhgx0ouAWAfRg=="
+    },
     "damerau-levenshtein": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.6.tgz",
@@ -4448,6 +4535,11 @@
         }
       }
     },
+    "delaunator": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-4.0.1.tgz",
+      "integrity": "sha512-WNPWi1IRKZfCt/qIDMfERkDp93+iZEmOxN2yy4Jg+Xhv8SLk2UTqqbe1sfiipn0and9QrE914/ihdx82Y/Giag=="
+    },
     "delayed-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -6849,6 +6941,11 @@
         "side-channel": "^1.0.2"
       }
     },
+    "internmap": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.0.tgz",
+      "integrity": "sha512-SdoDWwNOTE2n4JWUsLn4KXZGuZPjPF9yyOGc8bnfWnBQh7BD/l80rzSznKc/r4Y0aQ7z3RTk9X+tV4tHBpu+dA=="
+    },
     "invariant": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
@@ -10573,6 +10670,18 @@
         "prop-types": "^15.7.2"
       }
     },
+    "react-charts": {
+      "version": "2.0.0-beta.7",
+      "resolved": "https://registry.npmjs.org/react-charts/-/react-charts-2.0.0-beta.7.tgz",
+      "integrity": "sha512-iUspg9rnx7kD0H/wsK67HNUioOgKgJ8WRXr/Tk3EGP2qcFb9Vo7pjDk4oz1jH12TC+mqL+HFxNYraMkhWd6CUw==",
+      "requires": {
+        "@reach/observe-rect": "^1.1.0",
+        "d3-delaunay": "^5.2.1",
+        "d3-scale": "^3.2.1",
+        "d3-shape": "^1.3.7",
+        "d3-voronoi": "^1.1.2"
+      }
+    },
     "react-dev-utils": {
       "version": "10.2.1",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.2.1.tgz",

frontend/package.json

@@ -9,11 +9,13 @@
     "@testing-library/user-event": "^7.2.1",
     "axios": "^0.21.1",
     "chart.js": "^2.9.4",
+    "components": "^0.1.0",
     "http-proxy-middleware": "^1.0.5",
     "moment": "^2.29.0",
     "react": "^16.13.1",
     "react-bootstrap": "^1.3.0",
     "react-chartjs-2": "^2.11.1",
+    "react-charts": "^2.0.0-beta.7",
     "react-dom": "^16.13.1",
     "react-router-dom": "^5.2.0",
     "react-router-hash-link": "^2.1.0",

frontend/src/App.js

@@ -1,3 +1,5 @@
+
+import { Chart } from 'react-charts'
 import React, {useState,useEffect,useRef} from 'react';
 import logo from './logo.svg';
 import './App.css';
@@ -840,7 +842,7 @@ function BestPlaysPanel(p) {
 	var [update,setUpdate] = useState(false)
 	
 	useEffect(()=>{
-		axios.get("http://www.projectdivar.com/bestplays/"+p.username+"?fails=false&limit=5&offset=0")
+		axios.get("http://projectdivar.com/bestplays/"+p.username+"?fails=false&limit=5&offset=0")
 		.then((data)=>{setBestPlays(data.data);})
 	},[p.profileUpdate,update,p.username])
 	
@@ -849,7 +851,7 @@ function BestPlaysPanel(p) {
 			{bestPlays.map((play,i)=>{return <li key={i} className={"list-group-item list-group-item-action "+(i%2==0?"background-list-1":"background-list-2")}>
 					<Play setModalSrc={p.setModalSrc} setModalVisible={p.setModalVisible} index={i} play={play} song={p.songs[play.songid]}/>
 				</li>})}
-			<LoadMore username={p.username} profileUpdate={p.profileUpdate} listItem={true} url={"http://www.projectdivar.com/bestplays/"+p.username} params={{fails:false,limit:15,offset:5}} value={bestPlays} setValue={setBestPlays}/>
+			<LoadMore username={p.username} profileUpdate={p.profileUpdate} listItem={true} url={"http://projectdivar.com/bestplays/"+p.username} params={{fails:false,limit:15,offset:5}} value={bestPlays} setValue={setBestPlays}/>
 			</ul>
 		</div>
 	
@@ -946,7 +948,7 @@ function PlayData(p) {
 			<h5>Individual Plays for {p.song.name} from {p.username}</h5>
 			<div className="border rounded">
 				{data.map((play,i)=><Play setModalSrc={p.setModalSrc} setModalVisible={p.setModalVisible} key={i} play={play} mini={true} song={p.song}/>)}
-				<LoadMore profileUpdate={p.profileUpdate} username={p.username} url={"http://www.projectdivar.com/plays/"+p.username+"/"+p.song.id} params={{limit:15,offset:5}} value={data} setValue={setData}/>
+				<LoadMore profileUpdate={p.profileUpdate} username={p.username} url={"http://projectdivar.com/plays/"+p.username+"/"+p.song.id} params={{limit:15,offset:5}} value={data} setValue={setData}/>
 			</div>
 		</div>
 	</>
@@ -2224,7 +2226,7 @@ function EventEditor() {
 	const[send,setSend] = useState(false)
 	const[message,setMessage] = useState("")
 	
-	const EVENTID = 10;
+	const EVENTID = 17;
 	
 	//console.log(moment().format("YYYY-MM-DDTHH:mm"))
 	
@@ -2311,246 +2313,89 @@ function EventEditor() {
 	</>
 }
 
-function ChartData() {
-	const[eventData,setEventData] = useState([])
+function CanEditor() {
+	const [password,setPassword] = useState("");
+	const [cans,setCans] = useState(0);
+	const [games,setGames] = useState(0);
 	const [update,setUpdate] = useState(false)
-	const [chartData,setChartData] = useState([])
 	
 	useEffect(()=>{
+		refreshCount()
 		const interval = setInterval(()=>{
-			axios.get("http://projectdivar.com/eventdata/t20")
-			.then((data)=>{
-				var values;
-				data.data.map((obj)=>{if (values[obj.rank]) {values[obj.rank]=[...values[obj.rank],obj]} else {values[obj.rank]=[obj]}})
-				setEventData(values);
-				console.log(data.data)
-			})
-			.catch((err)=>{})
-		},30000);
+			refreshCount()
+		},5000);
 		return ()=>{clearInterval(interval)}
 	},[update])
 	
 	useEffect(()=>{
-		console.log(eventData)
-		setChartData(
-			{
-			  datasets: [{
-					label: 'T1',
-					data: GetChartData(eventData,1),
-					backgroundColor: [
-						'rgba(255, 99, 132, 0.05)',
-						'rgba(54, 162, 235, 0.05)',
-						'rgba(255, 206, 86, 0.05)',
-						'rgba(75, 192, 192, 0.05)',
-						'rgba(153, 102, 255, 0.05)',
-						'rgba(255, 159, 64, 0.05)'
-					],
-					borderColor: [
-						'rgba(255, 99, 132, 1)',
-						'rgba(54, 162, 235, 1)',
-						'rgba(255, 206, 86, 1)',
-						'rgba(75, 192, 192, 1)',
-						'rgba(153, 102, 255, 1)',
-						'rgba(255, 159, 64, 1)'
-					]
-				},{
-					label: 'T2',
-					data: GetChartData(eventData,2),
-					backgroundColor: [
-						'rgba(54, 162, 235, 0.05)'
-					],
-					borderColor: [
-						'rgba(54, 162, 235, 1)'
-					]
-				},{
-					label: 'T3',
-					data: GetChartData(eventData,3),
-					backgroundColor: [
-						'rgba(255, 206, 86, 0.05)',
-					],
-					borderColor: [
-						'rgba(255, 206, 86, 1)',
-					]
-				},{
-					label: 'T4',
-					data: GetChartData(eventData,4),
-					backgroundColor: [
-						'rgba(75, 192, 192, 0.05)',
-					],
-					borderColor: [
-						'rgba(75, 192, 192, 1)',
-					]
-				},{
-					label: 'T5',
-					data: GetChartData(eventData,5),
-					backgroundColor: [
-						'rgba(153, 102, 255, 0.05)',
-					],
-					borderColor: [
-						'rgba(153, 102, 255, 1)',
-					]
-				},{
-					label: 'T6',
-					data: GetChartData(eventData,6),
-					backgroundColor: [
-						'rgba(255, 159, 64, 0.05)'
-					],
-					borderColor: [
-						'rgba(255, 159, 64, 1)'
-					]
-				},{
-					label: 'T7',
-					data: GetChartData(eventData,7),
-					backgroundColor: [
-						'rgba(255, 99, 132, 0.05)'
-					],
-					borderColor: [
-						'rgba(255, 99, 132, 1)'
-					]
-				},{
-					label: 'T8',
-					data: GetChartData(eventData,8),
-					backgroundColor: [
-						'rgba(54, 162, 235, 0.05)'
-					],
-					borderColor: [
-						'rgba(54, 162, 235, 1)'
-					]
-				},{
-					label: 'T9',
-					data: GetChartData(eventData,9),
-					backgroundColor: [
-						'rgba(255, 206, 86, 0.05)'
-					],
-					borderColor: [
-						'rgba(255, 206, 86, 1)'
-					]
-				},{
-					label: 'T10',
-					data: GetChartData(eventData,10),
-					backgroundColor: [
-						'rgba(75, 192, 192, 0.05)'
-					],
-					borderColor: [
-						'rgba(75, 192, 192, 1)'
-					]
-				},{
-					label: 'T20',
-					data: GetChartData(eventData,20),
-					backgroundColor: [
-						'rgba(0, 0, 0, 0.05)'
-					],
-					borderColor: [
-						'rgba(0, 0, 0, 1)'
-					]
-				},{
-					label: 'T50',
-					data: GetChartData(eventData,50),
-					backgroundColor: [
-						'rgba(255, 255, 255, 0.5)'
-					],
-					borderColor: [
-						'rgba(255, 255, 255, 1)'
-					]
-				}
-				,{
-					label: 'T100',
-					data: GetChartData(eventData,100),
-					backgroundColor: [
-						'rgba(150, 255, 150, 0.5)'
-					],
-					borderColor: [
-						'rgba(150, 255, 150, 1)'
-					]
-				},{
-					label: 'T500',
-					data: GetChartData(eventData,500),
-					backgroundColor: [
-						'rgba(160, 0, 0, 0.5)'
-					],
-					borderColor: [
-						'rgba(160, 0, 0, 1)'
-					]
-				},{
-					label: 'T1000',
-					data: GetChartData(eventData,1000),
-					backgroundColor: [
-						'rgba(255, 150, 150, 0.5)'
-					],
-					borderColor: [
-						'rgba(255, 150, 150, 1)'
-					]
-				},{
-					label: 'T5000',
-					data: GetChartData(eventData,5000),
-					backgroundColor: [
-						'rgba(0, 140, 0, 0.5)'
-					],
-					borderColor: [
-						'rgba(0, 140, 0, 1)'
-					]
-				},{
-					label: 'T10000',
-					data: GetChartData(eventData,10000),
-					backgroundColor: [
-						'rgba(30, 30, 255, 0.5)'
-					],
-					borderColor: [
-						'rgba(30, 30, 255, 1)'
-					]
-				}/*,{
-					label: 'T100 HAPPY FORTUNE NEW YEAR',
-					data: [
-						{x:moment('2021-01-12 12:00:00+09:00').add(0,'days').add(0,'hours'),y:0},
-						{x:moment('2021-01-12 12:00:00+09:00').add(0,'days').add(7,'hours'),y:54036},
-						{x:moment('2021-01-12 12:00:00+09:00').add(4,'days').add(23,'hours'),y:451398},
-						{x:moment('2021-01-12 12:00:00+09:00').add(5,'days').add(3,'hours'),y:470204},
-						{x:moment('2021-01-12 12:00:00+09:00').add(7,'days').add(18,'hours'),y:671150},
-						{x:moment('2021-01-12 12:00:00+09:00').add(8,'days').add(15,'hours'),y:915147},
-						{x:moment('2021-01-12 12:00:00+09:00').add(8,'days').add(17,'hours'),y:952330},
-						{x:moment('2021-01-12 12:00:00+09:00').add(8,'days').add(19,'hours'),y:988548},
-						{x:moment('2021-01-12 12:00:00+09:00').add(8,'days').add(21,'hours'),y:1027488},
-					],
-					backgroundColor: [
-						'rgba(255, 255, 150, 0.5)'
-					],
-					borderColor: [
-						'rgba(255, 255, 150, 1)'
-					]
-				}*/],
-				options: {
-					scales: {
-						yAxes: [{
-							ticks: {
-								beginAtZero: true,
-							}
-						}],
-						xAxes: [{
-							type: 'time',
-							time: {
-								unit: 'hours',
-								displayFormats: {
-									hours: 'MMM D hA'
-								}
-							},
-							ticks: {
-								min:EVENTSTART,
-								max:EVENTEND
-							},
-							distribution: 'linear'
-						}]
-					}
-				}
-			}
-		)
-	},[eventData])
 		
-	return (
-		<>
-			<h1>繋ぎ手たちは導かれ～前編～</h1>
-			<Line data={chartData} />
+	},[password])
+	
+	function refreshCount() {
+		axios.get("http://projectdivar.com/cans")
+		.then((data)=>{
+			if (data.data.cans>cans) {
+				setCans(data.data.cans)
+			}
+			if (data.data.cans+data.data.notcan>games) {
+				setGames(Number(data.data.cans)+Number(data.data.notcan))
+				}
+		})
+	}
+	
+	function sendRequest(cans) {
+		axios.post("http://projectdivar.com/cans",{cans:cans})
+		.then((data)=>{
+			refreshCount()
+		})
+	}
+	
+	function addCan(t) {
+		setCans(Number(cans)+1)
+		setGames(Number(games)+1)
+		sendRequest(true)
+	}
+	function addGame(t) {
+		setGames(Number(games)+1)
+		sendRequest(false)
+	}
+	
+	return <>
+		<div className="container">
+			<div className="row">
+				<div className="col-12 text-center">
+					<h3>Can %</h3>
+					<h1>{((cans/games)*100).toFixed(2)+"%"}</h1>
+				</div>
+			</div>
+			<div className="row">
+				<div className="col-6 text-center">
+					<h5>Cans</h5>
+					<h1>{cans}</h1>
+				</div>
+				<div className="col-6 text-center">
+					<h5>Total Games</h5>
+					<h1>{games}</h1>
+				</div>
+			</div>
+		</div>
+		{/*{password!=="muni_62"&&<>
+		<b>Password to Edit:</b>
+		<input type="password" placeholder="Password" onChange={(t)=>{
+			setPassword(t.currentTarget.value)
+		}}
+		/></>}
+		{password=="muni_62"&&<>
+			<div className="row">
+				<div className="col-6 text-center">
+					<button onClick={(t)=>{addGame(t)}}>No Can</button>
+				</div>
+				<div className="col-6 text-center">
+					<button onClick={(t)=>{addCan(t)}}>Can</button>
+				</div>
+			</div>
+		</>}*/}
 	</>
-	)
 }
 
 function Website() {
@@ -2562,7 +2407,7 @@ function Website() {
 	const [userSettings,setUserSettings] = useState({})
 	
 	useEffect(()=>{
-		axios.get("http://www.projectdivar.com/songs")
+		axios.get("http://.projectdivar.com/songs")
 		.then((data)=>{
 			setSongs(data.data)
 		})
@@ -2570,7 +2415,7 @@ function Website() {
 	
 	return (
 		<div className="row">
-		{/*<div className="col-md-2 pt-3 pb-3 overflow-hidden text-center">
+			<div className="col-md-2 pt-3 pb-3 overflow-hidden text-center">
 					<h3 className="d-none d-md-block">Menu</h3>
 						<LoginInfo setUserSettings={setUserSettings} setUsername={setUsername} update={loginPanelUpdate}/>
 						<br/><br/>
@@ -2579,7 +2424,7 @@ function Website() {
 						<Link to="/divabot#content">DivaBot</Link><br/>
 						<hr/>
 						<a href="http://discord.gg/eJ3cMzM"><img src="http://projectdivar.com/files/discord_button_small.png"/></a>
-		</div>*/}
+			</div>
 			<div className="col-md-10 pt-3 pb-3">
 				<div id="content"/>
 				<Switch>
@@ -2621,12 +2466,16 @@ function Website() {
 					</Route>
 					<Route path="/event">
 						<h1 className="title">Event Data</h1>
-						<ChartData/>
+						<EventData/>
 					</Route>
 					<Route path="/eventedit">
 						<h1 className="title">Event Editor</h1>
 						<EventEditor/>
 					</Route>
+					<Route path="/cancount">
+						<h1 className="title">Can or no Can?</h1>
+						<CanEditor/>
+					</Route>
 					<Route path="/">
 						<h1 className="title">Project DivaR</h1>
 						Welcome! This website is here to store and track all your Project Diva records for yours and others' enjoyment!
@@ -2776,7 +2625,7 @@ function App() {
 	return (
 	<Router>
 		<div className="container-fluid content">
-		{/*<div className="row">
+		<div className="row">
 				<div className="topbar col-md-12 pt-1 overflow-hidden border rounded text-center">
 					<div>
 						<Link to="/">
@@ -2784,7 +2633,7 @@ function App() {
 						</Link>
 					</div>
 				</div>
-		</div>*/}
+		</div>
 			<Website/>
 		</div>
 	</Router>

frontend/src/setupProxy.js

@@ -1,6 +1,181 @@
 const { createProxyMiddleware } = require('http-proxy-middleware');
 
 module.exports = function (app) {
+    /*app.use(
+        "/event/query",
+        createProxyMiddleware({
+          target: 'http://server:4501',
+          changeOrigin: true,
+        })
+        );*/
+    app.use(
+        "/sigcrafting",
+        createProxyMiddleware({
+            target: 'http://server:3001',
+            changeOrigin: true,
+        })
+    );
+        app.use(
+        "/gitea",
+        createProxyMiddleware({
+                target: 'http://sig.projectdivar.com',
+                changeOrigin:false,
+        })
+        );
+    app.use(
+        "/ngsplanner/class",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/class_level_data",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/class_weapon_type_data",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/weapon",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/weapon_existence_data",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/weapon_type",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/armor",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/potential",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/potential_data",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/builds",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/skill",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/skill_type",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/skill_data",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/augment",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/augment_type",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/food_mult",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/roles",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/users",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner/food",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ngsplanner",
+        createProxyMiddleware({
+            target: 'https://server2:4504',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/ev",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/cans",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
     app.use(
         "/eventchart",
         createProxyMiddleware({
@@ -8,6 +183,20 @@ module.exports = function(app) {
             changeOrigin: true,
         })
     );
+    app.use(
+        "/create-event",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
+    app.use(
+        "/event/leaderboard",
+        createProxyMiddleware({
+            target: 'http://server:4501',
+            changeOrigin: true,
+        })
+    );
     app.use(
         "/eventsubmit",
         createProxyMiddleware({