---
# System prepended metadata

title: Clicktests

---

# Clicktests
### What are the clicktests for? 
The civil MRCC App finally reached a point where we can start testing it in order to publish a beta version after it.
In this document you will find certain features of the App which need to be tested. This means to test if they are working as they should. 
To make sure we have a reliable testing procedure, we created this clicktest which show you how you can test a feature, that is to say which clicks you have to make. 
To give us a feedback use this **[QUESTIONNAIRE](https://hackmd.io/NaMR35PAQ3iDfm4qlYgQNQ)** and tell us what did not work for you, what you did not understand or what suggestions for an improvement you have. 

## *Login*
![](https://i.imgur.com/KvyCnmK.png)

1. In order to login in open the link: https://testing.civilmrcc.eu/
2. With the login data (username+password) you received from us you can log in there. 
&rarr; if you don't have an account to log in, sent an e-mail to mareike@sea-watch.org. 
3. **Currenty we still have a bug that the inital setup after login fails.** To work around that wait 10s after login, and reload the app. 

That's what the App should look like then: 
![](https://i.imgur.com/96dXq7j.jpg)

## *Vehicle*
In the left navigation in a drop-down menu you see all the vehicles, which means not only boats but also the planes. We want to test the creation and updating of a new vehicle. 

### Create vehicle with mmsi
1. Click on "add" in the top-navigation
![](https://i.imgur.com/nEdSE3M.jpg)
2. A window should pop up where you have to choose from the template case, vehicle or sighting. Choose vehicle.
![](https://i.imgur.com/QrnlYIu.png)
3. Fill in the blanks.
&rarr; if you want to create an airplane choose "true" in the field *air*
&rarr; it is important that you got a MMSI
4. After you created the vehicle you should be able to see it in the left-navigation 

### Update vehicle
You can either click on the vehicle in the left-navigation or on the item of the vehicle on the map. Then a window with the information should pop up. You should then be able to edit and save this information. 
![](https://i.imgur.com/BSspSon.png)

## *Sighting*
In the left navigation in a drop-down menu you see all the sightings. Sightings are for example military vessels or oil plattforms. 

### Create sighting
1. It works like the creation of a vehicle. Click on  "add" in the top-navigation 
2. A window should pop up where you have to choose the template "sighting".
3. Fill in the blanks. 
![](https://i.imgur.com/3ODtfDj.png)

### Update sighting
You can either click on the sighting in the left-navigation or on the item of the sighting on the map. Then a window with the information should pop up. You should then be able to edit and save this information. 

## *Case*
In the left navigation in a drop-down menu you see all the cases.

### Create case
1. It works like the creation of a vehicle or sighting. Click on  "add" in the top-navigation.
2. A window should pop up where you have to choose the template "case".
3. Fill in the blanks. 
![](https://i.imgur.com/jXpD5c9.png)

### Update case
You can either click on the case in the left-navigation or on the item of the case on the map. Then a window with the information should pop up. You should then be able to edit and save this information. 
&rarr; we still have this weird bug, that if you click on the item in the left-navigation the template is not popping up. But we are currently taking care of it. So you have to find the item on the map and then click on it. 


## *altitude diagram*
If you click on "air" in the upper right corner, an altitude diagram will pop up, which shows you how the airplane flew. 
**Notice:** this is only working if an airplane is in the vehicle list 
![](https://i.imgur.com/Ml8O91F.jpg)

## *SAR Zones*
1. Initally when you start the app, you will see the different SAR-Zones. You can also switch them off trough clicking on the green X in the left menu in the map: 
![](https://i.imgur.com/Bqj8NQC.jpg)
2. After clicking on the X an eye will appeare instead. If you click on that, you should see the SAR-Zones again.
![](https://i.imgur.com/6X9SiQu.jpg)

## *Toggle Buttons*
With toggle buttons you can switch something "on" or "off": 
![](https://i.imgur.com/jjosmKb.png)
In the App you can hide or show an item and its track:
![](https://i.imgur.com/iNJQuV4.jpg)
Try to toggle the different items like vehicle, cases or sightings. 

## *measurement tools*
On the left side of the map you see a toolbar with different tools to measure things on the map. 
![](https://i.imgur.com/0urz1KG.png)

### Polyline Measure
With this tool you can draw lines between two points and you will get the distance in nm, miles or meter and also the angle in degrees. 
**SCREEENSHOT FEHLT**
1. Click on "Turn on PolylineMeasure"
![](https://i.imgur.com/MXaglfo.png)
2. Choose which kind of measurement you want: miles, nm, meter
![](https://i.imgur.com/GjEebuZ.png)
3. Draw a line between two points and click on the last point to finish the measurement
4. If you want to delete a point or cancel the process press shift and click on the point or click on the x beneath the PolylineMeasure
![](https://i.imgur.com/CHm8eHO.png)

### Line
Create a line to measure distance: Click on the tool "draw a polyline" Just click on the map for the points from which you want to measure.
![](https://i.imgur.com/lzZJORo.png)

If you want to finish the line either click on the last point again or click on "finish" next to the tool "draw a polyline"
![](https://i.imgur.com/dpbvxs6.png)

You can also delete the last point or cancel the whole action with clicking on "delete last position" or "cancel"
![](https://i.imgur.com/iUKGPoO.png)

### Draw a Polygone
Click on the tool "draw a polygone" in the left bar to create an area from which you can get the historic ais data or add a sighting
**NOT WORKing**
1. Click on the tool "draw a polygone"
![](https://i.imgur.com/wPpy6yq.png)
2. Create an area with as much points as you want. Click on the first point or on "finish" next to the item of the tool to finish the polygone. 
![](https://i.imgur.com/jkWZ3X0.png)
3. Get the historic AIS data or add a sighting
![](https://i.imgur.com/JqafJFW.png)
Like for the line you can delete the last point or cancel the whole action. 

### Draw a Rectangle
With this function you can mark an area in shape of a rectangle and get the historical AIS data of this area or add a sighting. 
![](https://i.imgur.com/GgEqEKW.png)

### Draw a Circle
You can draw a circle but currently not do anymore with this. We are working on it. 

### Draw a Marker
You can set a marker and get the position of this. 
![](https://i.imgur.com/bdi9vqS.png)

### Edit and Delete Layers
With the last two buttons you can edit the measurements you took or delete them. 
![](https://i.imgur.com/rg6xI5e.png)
![](https://i.imgur.com/wvbeVlL.png)

&rarr; **Maybe just play a bit with all this functions, try to edit and delete the measurements**

## *Distances in the template*
If you click on an item and then coose "Distances" you see how far it is away from other items. 
![](https://i.imgur.com/3uIXCcQ.png)
Please check if the distances are correct. You can do this with the measurement tools. 

## *replay function*
With the replay function you can display the movements on the map for a certain timeframe in fast motion. This might be helpful to reconstruct cases. 
1. Choose a start date and time
2. Choose an end date and time
3. choose the time in hours for a movement to change
&rarr; e.g. 2 hours, start time 9am: you will see the situation at 9am, than at 11am, that 1pm and so on. 
4. choose how long this movement should be displayed in seconds
&rarr; e.g. 3 seconds: you will see the situation at 9am for three seconds, that it changes to the situation at 11am which you will again see for three seconds. 
**SCREENSHOT MISSING**

## *settings*
On the upper right corner you see an icon of a person with you username under it. If you click on it a drop-down menu will open with "logout" and "setting": 
![](https://i.imgur.com/YYTTmTY.jpg)
Click on "settings" and a window should pop up: 
![](https://i.imgur.com/MfsSPGz.png)

### change map type
From the drop-down at tileset choose the "Onfleet (offline)"
![](https://i.imgur.com/a2hgUBg.png)

### Max track lenght
You can track the data either choosing the number of positions, number of days or in a date range. 
Try all three. 
![](https://i.imgur.com/6BFgpG0.png)

## What happens next? 
First of all thank you a lot for testing the App and giving us your feedback. Without this we couldn't improve the App. 
With the feedback we can evaluate what is not working yet and what we have to fix. We will also try to make the App more user-friendly with you feedback. 

## Glossar
- **left-navigation**
![](https://i.imgur.com/Tq098OS.jpg)

- **drop down menu**
A drop-down list (abbreviated drop-down; also known as a drop-down menu, drop menu, pull-down list, picklist) is a graphical control element, similar to a list box, that allows the user to choose one value from a list. When a drop-down list is inactive, it displays a single value. When activated, it displays (drops down) a list of values, from which the user may select one. When the user selects a new value, the control reverts to its inactive state, displaying the selected value. It is often used in the design of graphical user interfaces, including web design.
E.g. in the app: 

- **top-navigation**
![](https://i.imgur.com/y9CjnKq.jpg)


