Cadmus Frontend

The Cadmus frontend is an Angular editor built by composition. You create an Angular application, add Cadmus packages to it, and optionally add new packages for your own models. The frontend layer of a Cadmus editor has these main components:

  • core packages: these provide most of the editor’s business logic and related UI components. These packages are developed in their own workspace, providing a shell application for their testing.
  • part and fragment editors packages: these provide data models and their editors for the UI, and are assembled together to build your own data architecture.
  • app pages: a few pages are added to the app for wrapping logic related to user account handling (homepage, login, registration, password reset, user management). Apart from the homepage, which is of course freely designed, usually you just copy-paste the other pages, unless you want to customize them.
  • app configuration: files used to define which data models and editors are used at which routes in the web app.
  • app assets: custom resources like images, icons, and optionally local data.

Most of the packages make use of a set of UI widgets named bricks, as they represent the building blocks for many model editors. Also, many data packages are shared among several projects, and are grouped under distinct knowledge domains, each in its own development shell.

All the packages are distributed via NPM under the base namespace @myrmidon and adopt semantic versioning.

Core Repositories

This diagram shows the dependencies among some core @myrmidon frontend repositories used for Cadmus. Some of them are more general-purpose, and thus do not include cadmus in their name.

graph LR;
  ngx-tools
  ngx-mat-tools
  ngx-annotorious
  auth-jwt-login
  auth-jwt-login --> ngx-tools
  auth-jwt-admin --> ngx-tools
  auth-jwt-admin --> ngx-mat-tools
  auth-jwt-admin --> auth-jwt-login
  bricks --> ngx-tools
  bricks --> ngx-mat-tools
  bricks --> paged-data-browsers
  bricks --> cadmus-core
  bricks --> cadmus-api
  shell --> ngx-tools
  shell --> ngx-mat-tools
  shell --> paged-data-browsers
  shell --> bricks
  shell --> auth-jwt-login
  shell --> auth-jwt-admin

Throughout all this documentation, the diagrams showing packages omit the @myrmidon/ prefix for short.

The NGX tools and Material tools are generic extensions used for Angular-based apps. They mostly include generic services and pipes. NGX Annotorious can be used to provide visual annotations via an Angular wrapper for Annotorious V3.

The auth- packages are used to provide JWT-based authentication and account management, including both business logic and ready to use UI components. This provides a shared foundation for handling user accounts in every Cadmus app.

Finally, two core Cadmus packages include the basic data models (cadmus-core) and the services which connect to the backend API (cadmus-api).

The corresponding code repositories are:

Table of contents