Open Water Foundation (OWF) general Angular web application to display information via configurable menus that display maps and other visualizations.
- Introduction
- Repository Contents
- Getting Started
- Deploying the Site to Amazon Web Servers
- Contributing
- Maintainers
- Contributors
- License
- Resources
This repository contains files for developing and deploying the OWF InfoMapper application, developed using the Angular web framework.
The InfoMapper software can be installed as a static website, with configuration files and data to create a web application. New features made available in the general product are therefore available to each implementation of the tool.
The following table lists deployed websites and corresponding repositories.
Website | Content Generation Repository |
---|---|
Poudre Basin Information | owf-infomapper-poudre |
StateMod Dataset viewer - under development | cdss-app-statemod-web |
The following folder structure is recommended for development.
Top-level folders should be created as necessary.
The following folder structure clearly separates user files (as per operating system),
development area (owf-dev
), product (InfoMapper
),
repositories for product (git-repos
), and specific repositories for the product.
Repository folder names should agree with GitHub repository names.
Scripts in repository folders that process data should detect their starting location
and then locate other folders using relative paths, based on the following convention.
C:\Users\user\ User's home folder for Windows.
/c/Users/user/ User's home folder for Git Bash.
/cygdrive/C/Users/user/ User's home folder for Cygwin.
/home/user/ User's home folder for Linux.
owf-dev/ Work done on Open Water Foundation projects.
InfoMapper/ InfoMapper product files.
---- below here folder names should match exactly ----
git-repos/ Git repositories for InfoMapper.
owf-app-infomapper-ng/ Angular InfoMapper web application.
This repository contains the following:
owf-app-infomapper-ng/
build-util/ Scripts to manage repository, as needed.
infomapper/ Software development files for the InfoMapper.
.git/ Standard Git software folder for repository (DO NOT TOUCH).
.gitattributes/ Standard Git configuration file for repository (for portability).
.gitignore/ Standard Git configuration file to ignore dynamic working files.
README.md This readme file.
Implementations of the InfoMapper should typically have a folder structure similar the the following, where the InfoMapper will be used in a supporting role. In the future, an installer for InfoMapper will be provided so that a repository clone is not required.
C:\Users\user\ User's home folder for Windows.
/c/Users/user/ User's home folder for Git Bash.
/cygdrive/C/Users/user/ User's home folder for Cygwin.
/home/user/ User's home folder for Linux.
owf-dev/ Work done on Open Water Foundation projects.
SomeProject/ Project that uses InfoMapper software to implement a website.
---- below here folder names should match exactly ----
git-repos/ Git repositories for the Angular portal web application.
owf-app-infomapper-ng/ Angular web application.
owf-infomapper-poudre/ Workflow files to process input for web application.
Development and deployment of this Angular based web application requires the following tools:
- Node.js (version 10.x or higher) and npm (version 5.5.1 or higher):
- Check which version of Node.js is installed by running
node -v
. To get Node.js, go to nodejs.org. - Check which version of npm is installed by running
npm -v
. To update npm runnpm install npm@latest -g
.
- Check which version of Node.js is installed by running
- Angular CLI (Command Line Interface):
- Check which version of Angular CLI is installed by running
ng --version
. If Angular CLI needs installed runnpm install -g @angular/cli
.
- Check which version of Angular CLI is installed by running
Once all prerequisites have been installed, clone this repository onto the
local machine and move into the infomapper
directory. Use the command
npm install
to have npm download all necessary packages and dependencies
used by the InfoMapper. Run the site by running the command ng serve
.
Optionally add the flag --open
to automatically open the project in a new web browser tab.
The site can be built in a dist
folder for local testing by using
the command
ng build --prod --aot=true --baseHref=. --prod=true --extractCss=true --namedChunks=false --outputHashing=all --sourceMap=false
The content of the dist
folder can imitate a production build of the
InfoMapper. To run the InfoMapper in its distributable form, navigate to
the build-util
folder and run the run-http-server-8000.sh
file. In a
web browser, type in http://localhost:8000/
, then click on
dist/ > infomapper to run the InfoMapper.
Once checked locally, deploy to the Amazon S3 site by
running the following in the build-util
folder using a Windows command shell:
copy-to-owf-amazon-s3.bat
For example, see the deployment script for the Poudre Basin Information InfoMapper implementation. Poudre Basin Information
The above can be run if Amazon Web Services credentials are provided. A batch file is used to overcome known issues running in Git Bash.
Contributions can be made via normal Git/GitHub protocols:
- Those with commit permissions can make changes to the repository.
- Use GitHub Issues to suggest changes (preferred for small changes).
- Fork the repository and use pull requests. Any pull requests should be based on current master branch contents.
The InfoMapper is maintained by the Open Water Foundation.
The InfoMapper is licensed under the GPL v3+ license. See the GPL v3 license.