Example 1. v1 Modal Window

config.json for v1 app with Modal Window explained

Introduction

Modal Window is designed to have all app pre-launch configuration options or contain critical information about app in a centralized dialog within one tab. We'll use Import Images app as an example in this section. This is a common app that import images without annotations to Supervisely.

supervisely-ecosystem/import-images/config.json

{
  "name": "Import Images",
  "type": "app",
  "categories": ["import", "images", "essentials"],
  "description": "Drag and drop images to Supervisely, supported formats: .jpg, .jpeg, jpe, .mpo, .bmp, .png, .tiff, .tif, .webp, .nrrd",
  "docker_image": "supervisely/base-py-sdk:6.68.1",
  "main_script": "src/main.py",
  "modal_template": "src/modal.html",
  "modal_template_state": {
    "normalize_exif": false,
    "remove_alpha_channel": false,
    "remove_source": true,
    "project_name": ""
  },
  "task_location": "workspace_tasks",
  "icon": "https://github.com/supervisely-ecosystem/import-images/releases/download/v1.0.0/icon.png",
  "icon_cover": true,
  "icon_background": "#FFFFFF",
  "min_agent_version": "6.7.4",
  "min_instance_version": "6.5.46",
  "headless": true,
  "context_menu": {
    "context_category": "Import",
    "target": ["files_folder", "images_project", "images_dataset", "agent_folder"]
  },
  "poster": "https://github.com/supervisely-ecosystem/import-images/releases/download/v1.0.0/poster.png"
}

Modal window properties

Properties

name

Name of the app in Supervisely

"name": "Import Images"

type

Entity type in Supervisely Ecosystem

"type": "app"

categories

Сategories under which the app will be displayed in Ecosystem

"categories": ["import", "images", "essentials"]

description

Description of the app in Supervisely

"description": "Drag and drop images to Supervisely, supported formats: .jpg, .jpeg, jpe, .mpo, .bmp, .png, .tiff, .tif, .webp, .nrrd"

docker_image

Docker image used to launch the app with all pre-installed requirements

"docker_image": "supervisely/base-py-sdk:6.68.1"

main_script

Relative path to the main script of the application from the root of the project

"main_script": "src/main.py"

modal_template

Relative path to the modal window template from the root of the project

"modal_template": "src/modal.html"

modal_template_state

Controls default values for modal window variables.

modal template state

"modal_template_state": {
    "normalize_exif": false,
    "remove_alpha_channel": false,
    "remove_source": true,
    "project_name": ""
  }

task_location

Specifies where to display task

workspace task

"task_location": "workspace_tasks"

icon

Link to the app icon

"icon": "https://github.com/supervisely-ecosystem/import-images/releases/download/v1.0.0/icon.png"

icon_cover

Stretches the icon to full width.

Comparison of icon cover true (left) and false (right)

"icon_cover": true

"icon_cover": false

"icon_cover": true

icon_background

Background of app icon in hex color code

"icon_background": "#FFFFFF"

min_agent_version

Minimum required agent version to launch the app. Agent version can be found at Team Cluster page

Agent version

"min_agent_version": "6.7.4"

min_instance_version

Minimum required instance version to launch the app. Current instance version can be found at the bottom right corner of the Supervisely page.

"min_instance_version": "6.5.46"

headless

Specifies that app does not have GUI

"headless": true

context_menu

App context menu configuration

files_folder/agent_folder

files_folder/agent_folder

images_project/images_dataset

"context_menu": {
    "context_category": "Import",
    "target": ["files_folder", "images_project", "images_dataset", "agent_folder"]
  }

poster

Link to app poster

"poster": "https://github.com/supervisely-ecosystem/import-images/releases/download/v1.0.0/poster.png"