Ralph Gasser edited this page Nov 8, 2017 · 11 revisions

Welcome to the Vitrivr NG, the user interface component in the vitrivr stack - a software stack aimed at big multimedia retrieval. The NG stands for 'Angular' or 'Next generation'.

Vitrivr NG is a web-based user interface developed to be used with the latest version if Cineast. It allows the user to browse in and retrieve from mixed multimedia collections.

Getting started

For development, you require NodeJS and the NPM package manager to be installed on your machine. The Vitrivr NG project was created with Angular CLI so you need to install that as well. Once npm is available, you can install Angular CLI globally using the following command:

npm install -g @angular/cli

To prepare Vitrivr NG, pull it from GitHub and install the dependencies using the package manager.

git pull https://github.com/vitrivr/vitrivr-ng.git
npm install

Now you are ready to start development and run Vitrivr NG! You can do the latter using the following command, which makes Vitrivr NG available under http://localhost:4200.

ng serve


Vitrivr NG requires a working Cineast backend, usually in conjunction with the ADAMpro database. Please refer to the Cineast documentation for how to setup Cineast and how to run extraction on multimedia collections.

For serving the original media files and derived thumbnails you'll also need a web server like Apache or Nginx. The web server should Cross Origin Resource Sharing.


Vitrivr NG can be configured using a JSON configuration file, which can be found under src/config.json. The following settings are the most important ones in order to get started. A complete list of possible settings can be found on the configuration page.

"api": {
    "host" : "",
    "port" : 4567,
    "protocol_http": "http",
    "protocol_ws": "ws",
    "ping_interval": 10000
"resources": {
    "host_thumbnails" : "",
    "host_object": ""

The api.host and api.port entries can be used to specify the Cineast endpoint. Optionally, you can adjust the protocols for HTTP or WebSocket communication (http://, https://, ws:// or wss://). The resources.host_thumbnails and resources.host_object entries must point to a base path that contains the original media files and the derived thumbnails. All file references in Vitrivr NG will be resolved against those base paths.

Important: Under the respective base path, Vitrivr NG expects a folder per media type ('video', 'audio', 'image', 'model3d'). In the case of an original media file, the path which is stored in the database and thus known to Cineast will be resolved against that media type folder. For thumbnails, the media type folder is followed by another folder containing the media object's ID which then contains one or multiple thumbnails. Here are two examples:

Clone this wiki locally
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.