Source Code

Project Structure

The source code of SILAS Web demo app is arranged in the following structure:

📦
├── 📄 .babelrc
├── 📄 .gitignore
├── 📁 .vscode
│   └── 📄 settings.json
├── 📄 README.md
├── 📁 backend
│   └── 🐍 server.py
├── 📁 build
│   ├── 📄 bundle.js
│   └── 📄 bundle.js.map
├── 📄 index.html
├── 📁 src
│   ├── 📄 actions.js
│   ├── 📄 app.js
│   ├── 📁 cloud-providers
│   ├── 📁 components
│   │   ├── 📄 announcement.js
│   │   ├── 📄 banner.js
│   │   ├── 📁 load-data-modal
│   │   │   ├── 📄 load-remote-map.js
│   │   │   ├── 📄 query-input-map.js
│   │   │   ├── 📄 sample-data-viewer.js
│   │   │   └── 📄 sample-maps-tab.js
│   │   └── 📁 map-control
│   │       └── 📄 map-control.js
│   ├── 📁 constants
│   │   ├── 📄 default-settings.js
│   │   └── 📄 localization.js
│   ├── 📁 data
│   │   ├── 📄 kepler.gl.json
│   │   ├── 📄 ...
│   │   ├── 📄 yabao-predict-trajectories-gcj02.json
│   │   └── 📄 yabao-predict-trajectories.json
│   ├── 📁 factories
│   │   ├── 📄 load-data-modal.js
│   │   ├── 📄 map-control.js
│   │   └── 📄 panel-header.js
│   ├── 📄 main.js
│   ├── 📁 reducers
│   │   └── 📄 index.js
│   ├── 📄 store.js
│   └── 📁 utils
│       ├── 📄 api.js
│       ├── 📄 request.js
│       ├── 📄 routes.js
│       ├── 📄 strings.js
│       └── 📄 url.js
└── 📄 webpack.config.js

The project is organized as follows:

• src: Contains the main application logic, components, and data.
  • actions: Defines actions for loading data, exporting maps, and handling cloud provider interactions.
  • app.js: The main application component, responsible for rendering the Kepler.gl map and handling user interactions.
  • components: Contains reusable UI components like the banner, announcement, and data loading modal.
  • cloud-providers: Defines classes for interacting with different cloud providers (Dropbox, etc.).
  • constants: Contains constants for default settings, localization messages, and cloud provider configurations.
  • data: Contains sample data files, Kepler.gl configuration files, and data processing utilities.
  • factories: Contains factories for customizing Kepler.gl components.
  • main.js: Entry point for the application.
  • utils: Contains utility functions for various tasks.
• backend: Contains the backend server for data retrieval and processing.
  • server.py: The main server script.
• webpack: Contains webpack configuration files for building the application.
  • shared-webpack-configuration.js: Contains shared webpack configuration settings.
  • webpack.config.local.js: Contains local development overrides for webpack configuration.
• .babelrc: Babel configuration file for transpiling JavaScript code.
• index.html: The main HTML file for the application.
• package.json: Contains project dependencies, scripts, and metadata.
• .gitignore: Defines files and directories to be ignored by Git.
• README.md: Provides a brief overview of the project and instructions for running the app.

Important Files

src/app.js

The main application component, responsible for rendering the Kepler.gl map and handling user interactions.

src/actions/index.js

Defines actions for loading data, exporting maps, and handling cloud provider interactions.

src/cloud-providers/index.js

Defines classes for interacting with different cloud providers.

src/data/kepler.gl.json

Contains the Kepler.gl configuration file for the app.

backend/server.py

The main server script for data retrieval and processing.

webpack/shared-webpack-configuration.js

Contains shared webpack configuration settings.

webpack/webpack.config.local.js

Contains local development overrides for webpack configuration.

.babelrc

Babel configuration file for transpiling JavaScript code.

index.html

The main HTML file for the application.

package.json

Contains project dependencies, scripts, and metadata.