Partial completion and sub-graph selection

.docker/nginx/conf.d/domain.conf

@@ -0,0 +1,27 @@
+server {
+    listen 80 default_server;
+
+    root /var/www/www;
+    index index.php index.html index.htm;
+
+    client_max_body_size 100M;
+
+    location / {
+         try_files $uri $uri/ /index.php$is_args$args;
+    }
+
+    location ~ \.php$ {
+        try_files $uri /index.php =404;
+        fastcgi_pass php:9000;
+        fastcgi_index index.php;
+
+        fastcgi_buffer_size 128k;
+        fastcgi_buffers 4 256k;
+        fastcgi_busy_buffers_size 256k;
+
+        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
+        #fixes timeouts
+        fastcgi_read_timeout 600;
+        include fastcgi_params;
+    }
+}

.docker/node/docker-entrypoint.sh

@@ -0,0 +1,18 @@
+#!/bin/sh
+set -e
+
+# first arg is `-f` or `--some-option`
+if [ "${1#-}" != "$1" ]; then
+	set -- node "$@"
+fi
+
+if [ "$1" = 'node' ] || [ "$1" = 'yarn' ]; then
+	yarn install
+
+	>&2 echo "Waiting for PHP to be ready..."
+	until nc -z "$PHP_HOST" "$PHP_PORT"; do
+		sleep 1
+	done
+fi
+
+exec "$@"

.docker/php/docker-entrypoint.sh

@@ -0,0 +1,9 @@
+#!/bin/sh
+set -e
+
+# first arg is `-f` or `--some-option`
+if [ "${1#-}" != "$1" ]; then
+	set -- php-fpm "$@"
+fi
+
+exec docker-php-entrypoint "$@"

Dockerfile

@@ -0,0 +1,57 @@
+ARG PHP_VERSION=8.0
+ARG NODE_VERSION=16
+ARG NGINX_VERSION=1.27.3
+
+######### PHP CONFIG
+FROM php:${PHP_VERSION}-fpm-alpine as php
+
+WORKDIR /srv/app
+COPY www www/
+
+EXPOSE 9000
+
+COPY ./.docker/php/docker-entrypoint.sh /usr/local/bin/docker-entrypoint
+RUN chmod +x /usr/local/bin/docker-entrypoint
+
+ENTRYPOINT ["docker-entrypoint"]
+CMD ["php-fpm"]
+
+######### NODE CONFIG
+FROM node:${NODE_VERSION}-alpine as node
+
+WORKDIR /srv/app
+
+RUN apk update; \
+    apk add yarn;
+RUN apk add --no-cache --virtual .build-deps alpine-sdk python3
+
+# prevent the reinstallation of vendors at every changes in the source code
+COPY package.json yarn.lock ./
+COPY tsconfig.json tslint.json webpack.config.js ./
+COPY src src/
+COPY styles styles/
+COPY templates templates/
+COPY bin bin/
+COPY data data/
+
+RUN set -eux; \
+	yarn install; \
+	yarn cache clean; \
+    yarn build
+
+RUN apk del .build-deps
+
+COPY ./.docker/node/docker-entrypoint.sh /usr/local/bin/docker-entrypoint
+RUN chmod +x /usr/local/bin/docker-entrypoint
+
+ENTRYPOINT ["docker-entrypoint"]
+CMD ["yarn", "start"]
+
+######### NGINX CONFIG
+FROM nginx:${NGINX_VERSION}-alpine as nginx
+COPY .docker/nginx/conf.d/domain.conf /etc/nginx/conf.d/default.conf
+
+WORKDIR /srv/app
+
+COPY --from=node /srv/app/www/assets www/assets
+COPY --from=php /srv/app/www/index.php www/index.php

README.md

@@ -1,6 +1,7 @@
 # SatisfactoryTools
 Satisfactory Tools for planning and building the perfect base.
 
+# Standard application development
 ## Requirements
 - node.js version 16 (lower may work, 17+ doesn't work)
 - yarn
@@ -12,15 +13,26 @@ Satisfactory Tools for planning and building the perfect base.
 - `yarn build`
 - Set up a virtual host pointing to `/www` directory (using e.g. Apache or ngnix)
 
+## Development
+Run `yarn start` to start the automated build process. It will watch over the code and rebuild it on change.
+
+# Dockerized application development
+## Requirements
+- docker
+- docker-compose
+
+## Installation / Building
+- docker build .
+
+## Development
+- docker compose up -d
+
 ## Contributing
 Any pull requests are welcome, though some rules must be followed:
 - try to follow current coding style (there's `tslint` and `.editorconfig`, those should help you with that)
 - one PR per feature
 - all PRs must target `dev` branch
 
-## Development
-Run `yarn start` to start the automated build process. It will watch over the code and rebuild it on change.
-
 ## Updating data
 Get the latest Docs.json from your game installation and place it into `data` folder.
 Then run `yarn parseDocs`command and the `data.json` file would get updated automatically.

docker-compose.yml

@@ -0,0 +1,38 @@
+version: "3.2"
+services:
+    nginx:
+        build:
+            context: .
+            target: nginx
+        depends_on:
+            - php
+            - node
+        ports:
+            - "80:80"
+        links:
+            - php
+        volumes:
+            - ./.docker/nginx/conf.d/domain.conf:/etc/nginx/conf.d/default.conf:ro
+            - ./www:/var/www/www:ro
+    php:
+        build:
+            context: .
+            target: php
+        depends_on:
+            - node
+        volumes:
+            - ./www:/var/www/www
+            - ./node_modules:/var/www/node_modules
+    node:
+        build:
+            context: .
+            target: node
+        environment:
+            PHP_HOST: php
+            PHP_PORT: 9000
+        volumes:
+            - ./src:/var/www/src
+            - ./styles:/var/www/styles
+            - ./templates:/var/www/templates
+            - ./bin:/var/www/bin
+            - ./data:/var/www/data

package.json

@@ -5,9 +5,10 @@
 	"author": "greeny",
 	"private": true,
 	"scripts": {
-		"build": "export SET NODE_OPTIONS=--openssl-legacy-provider && webpack --mode production",
+		"build": "webpack --mode production",
 		"buildCI": "webpack --mode production",
-		"start": "export SET NODE_OPTIONS=--openssl-legacy-provider && webpack --mode development --progress --color --watch",
+		"start": "webpack --mode development --progress --color --watch",
+		"serve": "webpack serve --open",
 		"parseDocs": "ts-node -r tsconfig-paths/register bin/parseDocs.ts",
 		"parsePak": "ts-node -r tsconfig-paths/register bin/parsePak.ts",
 		"generateImages": "ts-node -r tsconfig-paths/register bin/generateImages.ts"

src/Module/Components/VisualizationComponent.ts

@@ -8,6 +8,7 @@ export class VisualizationComponent implements IComponentOptions
 	public controller = VisualizationComponentController;
 	public bindings = {
 		result: '=',
+		settings: '=',
 	};
 
 }

src/Module/Components/VisualizationComponentController.ts

@@ -5,18 +5,20 @@ import cytoscape from 'cytoscape';
 import {IVisNode} from '@src/Tools/Production/Result/IVisNode';
 import {IVisEdge} from '@src/Tools/Production/Result/IVisEdge';
 import {IElkGraph} from '@src/Solver/IElkGraph';
-import {Strings} from '@src/Utils/Strings';
-import model from '@src/Data/Model';
 import {ProductionResult} from '@src/Tools/Production/Result/ProductionResult';
+import {GraphSettings} from '@src/Tools/Production/Result/Graph';
 
 export class VisualizationComponentController implements IController
 {
 
 	public result: ProductionResult;
+	public settings: GraphSettings;
 
 	public static $inject = ['$element', '$scope', '$timeout'];
 
-	private unregisterWatcherCallback: () => void;
+	private unregisterResultWatcher: () => void;
+	private unregisterSettingsWatcher: () => void;
+
 	private network: Network;
 	private fitted: boolean = false;
 
@@ -25,16 +27,26 @@ export class VisualizationComponentController implements IController
 
 	public $onInit(): void
 	{
-		this.unregisterWatcherCallback = this.$scope.$watch(() => {
+		this.unregisterResultWatcher = this.$scope.$watch(() => {
 			return this.result;
-		}, (newValue) => {
-			this.updateData(newValue);
+		}, (data) => {
+			this.updateData(data);
 		});
+
+		this.unregisterSettingsWatcher = this.$scope.$watch(() => {
+			return this.settings;
+		}, (data) => {
+			if (this.result) {
+				this.result.graph.setSettings(data);
+				this.updateData(this.result);
+			}
+		}, true);
 	}
 
 	public $onDestroy(): void
 	{
-		this.unregisterWatcherCallback();
+		this.unregisterResultWatcher();
+		this.unregisterSettingsWatcher();
 	}
 
 	public useCytoscape(result: ProductionResult): void
@@ -112,10 +124,16 @@ export class VisualizationComponentController implements IController
 		const edges = new DataSet<IVisEdge>();
 
 		for (const node of result.graph.nodes) {
-			nodes.add(node.getVisNode());
+			if (node.visible) {
+				nodes.add(node.getVisNode());
+			}
 		}
 
 		for (const edge of result.graph.edges) {
+			if (!edge.isAvailable()) {
+				continue
+			}
+
 			const smooth: any = {
 				enabled: false,
 			};
@@ -130,7 +148,7 @@ export class VisualizationComponentController implements IController
 				id: edge.id,
 				from: edge.from.id,
 				to: edge.to.id,
-				label: model.getItem(edge.itemAmount.item).prototype.name + '\n' + Strings.formatNumber(edge.itemAmount.amount) + ' / min',
+				label: edge.getText(),
 				color: {
 					color: 'rgba(105, 125, 145, 1)',
 					highlight: 'rgba(134, 151, 167, 1)',
@@ -219,7 +237,7 @@ export class VisualizationComponentController implements IController
 
 	private drawVisualisation(nodes: DataSet<IVisNode>, edges: DataSet<IVisEdge>): Network
 	{
-		return new Network(this.$element[0], {
+		const network = new Network(this.$element[0], {
 			nodes: nodes,
 			edges: edges,
 		}, {
@@ -264,6 +282,24 @@ export class VisualizationComponentController implements IController
 				tooltipDelay: 0,
 			},
 		});
+
+		network.on('doubleClick', (event) => {
+			if (event.nodes?.length) {
+				(event.nodes as number[]).forEach((nodeId) => {
+					const node = this.result.graph.nodes.find((graphNode) => graphNode.id === nodeId);
+					if (node) {
+						if (event.event?.srcEvent?.ctrlKey) {
+							this.result.graph.toogleNode(node);
+						} else {
+							this.result.graph.highlight(node);
+						}
+						this.updateData(this.result);
+					}
+				});
+			}
+		});
+
+		return network;
 	}
 
 }

src/Module/Controllers/ProductionController.ts

@@ -33,6 +33,7 @@ export class ProductionController
 	public readonly alternateRecipes: IRecipeSchema[] = data.getAlternateRecipes();
 	public readonly basicRecipes: IRecipeSchema[] = data.getBaseItemRecipes();
 	public readonly machines: IBuildingSchema[] = data.getManufacturers();
+	public readonly recipes: IRecipeSchema[] = this.basicRecipes.concat(this.alternateRecipes);
 
 	public result: string;
 

src/Tools/Production/IProductionData.ts

@@ -31,6 +31,7 @@ export interface IProductionDataRequest
 
 	production: IProductionDataRequestItem[];
 	input: IProductionDataRequestInput[];
+	completed?: IProductionDataRequestCompleted[];
 
 }
 
@@ -59,6 +60,14 @@ export interface IProductionDataRequestInput
 
 }
 
+export interface IProductionDataRequestCompleted
+{
+
+	recipe: string|null; // classname of the recipe
+	amount: number; // amount of factories executing the recipe
+
+}
+
 export interface IProductionDataApiResponse
 {