MADAME App

Model Assessment and Decision Analysis for Marine Environments web application. Prototype Decision Support app for the ADRIA.jl platform and CoralBlox model. This project also contains the Reef Guide app.

Table of Contents

• Quick Start
• Angular Developer Setup
• Development Server
• ReefGuide Web API Integration
• Code Scaffolding
• Configuration
• Build
• Deploy
• Testing
• Further Help

Quick Start

# Clone the repository
git clone https://github.com/open-AIMS/MADAME-app.git
cd MADAME-app

# For Linux: Install Node with NVM
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
source ~/.bashrc
nvm install 22
nvm use 22

# Install dependencies
npm install --legacy-peer-deps

# Start development server
ng serve

# Access the application at http://localhost:4200/

Angular Developer Setup

This project was generated with Angular CLI version 18.0.6.

One-time setup:

1. Install Node v22
   In a Linux environment consider using Node Version Manager:

   curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
   source ~/.bashrc
   nvm install 22
   nvm use 22

2. Install Angular CLI globally:

   npm install -g @angular/cli

3. Install project dependencies:

   npm install --legacy-peer-deps

Note: --legacy-peer-deps will be necessary until ArcGIS updates peer deps to Angular 18.

A script security error may be raised if using PowerShell. If this occurs, run the following to fix Powershell execution policy:

Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned

Development Server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The application will automatically reload if you change any of the source files.

The APIs are proxied to avoid CSRF issues; see proxy.conf.json

ReefGuide Web API Integration

A working ReefGuide Web API instance is required to use the application.

Option 1: Use existing API instance

• Configure the webApiUrl in the environment file to point to your API instance

Option 2: Set up local API instance

1. Clone the ReefGuide Web API repository:

   git clone https://github.com/open-AIMS/reefguide-web-api.git

2. Follow the setup instructions in the repository README
3. Update the webApiUrl in your environment configuration

The webApiUrl entry in the configuration file needs to point to this, or an alternate, API instance. See the Configuration section.

Code Scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Configuration

The environment pattern is used for configuration:

• Development: environment.development.ts
• Production: environment.ts

The APIs are proxied by the local dev server to avoid CORS issues, see proxy.conf.json.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory.

Deploy

After the Build step:

1. Navigate to the build output:

   cd dist/adria-app/browser

2. Sync to AWS S3 bucket:

   aws s3 sync . s3://BUCKET_NAME --delete

(This assumes you have configured your AWS CLI)

Testing

Unit Tests

Run ng test to execute the unit tests via Karma.

End-to-End Tests

Run ng e2e to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

Further Help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.