Welcome to the programmer's documentation of PMA.UI.

Intended audience

This documentation is targeted towards software developers that build web applications on top of PMA.core, the digital slide publishing platform of Pathomation.

Quick introduction

PMA.UI is a Javascript library that provides UI and programmatic components to interact with PMA.core. The library is both available as a module, from npm, and as a single bundle, for classic client applications.

Tutorials

Check out the tutorials and the documentation on the left menu to discover how to use the components in your project.

Installation

You can install the library using one of the following ways, according to your requirements:

  • Via npm npm i @pathomation/pma.ui.
  • Download the bundle and include the css and js files in your page / application.

PMA.UI.View.Viewport

It represents a UI component that can display a digital slide in a web browser that allows the user to navigate through it. PMA.UI.View.Viewport includes OpenLayers and builds it's functionality around it.

See the tutorials and the documentation to get ideas on how to use the viewport in your projects.

PMA.UI.Components

The PMA.UI.Components namespace contains several UI and programmatic components that interact with the PMA.UI.View.Viewport class and also provide extra functionality such as authentication, file & directory browsing, form management, annotation drawing & slide gallery displaying.

Check out the tutorials and the documentation to discover how to use the components in your project.

Drag n' Drop Features

Drag n' Drop features are enabled using the HTML5 API Drag and Drop Both Gallery and SlideLoader are by default drop targets. The Tree is by default a drag target. The DataTranfer object of the HTML5 Drag and Drop API is expected to be of MIME TYPE "application/x-pma-node" and of the type PMA.UI.Components~dragDropObject