Please visit the contest website for more information.
I basically first thought that C# code from the initial repository was not a great idea, for the following reasons :
- Not really user-friendly,
- Limited only to Windows Platforms,
- Python packages and .NET framework need to be installed (almost) manually.
(Also, I'm very bad at C# coding...)
That is why I decided to take an other direction :
I am IN LOVE with a particular HTML / CSS / Javascript (Typescript) framework, Angular, for the following reasons :
- Web-based frameworks are extremely user-friendly,
- NPM is full of AMAZING copyright-free libraries,
- Electron enables you to compile ANY Angular project into desktop apps for all Windows, Mac and Linux platforms with Electron-builder, (just like Ionic for mobile app versions),
- Typescript as a GREAT web-based language that enables you to interface your app with any running server (see below).
I decided to use the following architecture for my software :
SINGLE executable file
+------------------------------------------------------+
| +-------------------------+ |
| | FRONT-END | |
| | Angular app | |
| | (Electron) | |
| +-------------------------+ |
| | User Interface | |
| | +---------------------+ | |
| | |Category 1|Category 2| | |
| | | | | | |
| | | | HTML | | |
| | | JIMP | canvas | | |
| | | |processing| | |
| | | | | | |
| | +---------------------+ | |
| +-------------------------+ |
| | Category 3 | |
| | | |
| | HTTP Connexion |==========++ |
| +-------+--------+--------+ || |
| | ^ || |
+----------------------|--------|-------------------||-+
| Processing request: | | Algorithm results:|| |
| * source image, | | * result image, || |
| * algorithm, | | * time, || |
| * parameters | | * percentage || |
+----------------------|--------|-------------------||-+
| v | || |
| +------+--------+-------+ || |
| | BACK-END |<==========++ |
| | Python server | launched |
| | HTTP connexion | through |
| +-----------------------+ subprocess |
| |Algorithm 1|Algorithm 2| |
| +-----------------------+ |
| |Algorithm 3|Algorithm 4| |
| +-----------------------+ |
+------------------------------------------------------+
- Front-end : Angular App (compiled into a single executable using Electron & Electron-builder),
- Back-end : Python server (compiled into a single executable using PyInstaller).
NO FRAMEWORK INSTALLATION IS NECESSARY !
THE WHOLE APP RESIDES IN A SINGLE EXECUTABLE FILE !
Indeed, PyInstaller compiles the server into a single executable file (platform-specific), then that executable is compiled into the Electron app with the ExtraResources directory.
That will enable me to reuse all of the original CVERT Python algorithms, but also simplify the process of adding a new algorithm by simply adding the Python file, and linking it to the front end. The rest will be handled during compilation.
This way, the final user doesn't have to install ANYTHING, just launch the executable file. (He can also install the software just like any other software, through an installer, then find it later on, on his OS).
Front-end:
Node & npm, with the following dev libraries:
And the following prod libraries:
You can find all of the npm libraries in package.json.
Back-end:
Python 3.6 running a web server to handle image processing requests.
It uses the following dev libraries:
And the following prod libraries:
- Flask,
- All the necessary libraries for the image processing algorithms.
NOTE: I am a Linux user. You might need to look around for equivalent Windows or Mac commands and installation processes...
Install NodeJS (that will automatically install npm), and Angular. Then:
git clone https://github.com/polofgrs/Computer-Vision-Emergency-Response-Toolkit.git
cd CVERT-ng
npm i
npm run electron
Then, if you want to compile the Electron project into an executable file on your OS :
./node_modules/.bin/electron-builder
Install Python 3.6, then the packages in requirements.txt with pip3
, then run the server:
sudo apt-get install pyhton3-pip
cd python-server
pip3 install -r requirements.txt
python3 server.py
And to compile it :
pyinstaller server.spec
-
NOTE 1: You HAVE to run
npm run electron
before running electron-builder, otherwise you will not have the updated files in/dist
. -
NOTE 2: In case you want to compile the electron-builder app, you HAVE to have the compiled executable server files in
/python-server/dist/
(by running PyInstaller) for the OS you are developing on/for. -
NOTE 3: In case you are developing a Python function and would like to try it out without using
npm run electron
for the front-end, you can still launch the front-end compiled app, and set up the server to communicate with your local python development server on an other port (bottom left panel). The other server (default port 5000) will still be running, but should not cause any trouble. (just make sure to change your server port inserver.py
, and to launch it manually).