The app theoretically allows multiple selections (for future possible feature of selecting several annotations to delete them).

Right now selecting an annotation should deselect previously selected ones.

An example of UX context explaining this need:

How to reproduce:

• create several annotations with different comments
• switch to minified mode
• select annotation A
• select annotation B

What is happening : the input still features the text of annotation A

What we want : deselect annotation A and selection annotation B only, so that its text is the one edited in the input.

As it is an advanced feature it should not necessarily revealed in editor view

For consistency and ease, it would be good to be able to select an annotation by clicking on its corresponding shape in player mode

How to reproduce : click on the input of an existing annotation in the left pannel

What happens : the input focuses and then instantly blurs, requiring to click again once the annotation has been selected.

It would be more fluid to refocus directly.

c -> circle
r -> rectangle
echap -> selection
p -> polygon

The user should be able to import an archive corresponding to an exported slideshow project and have it loaded into her version of the app.

This should be handled by the drop zone of the home view.

Depends on #27

How to reproduce :

1. create several annotations
2. go to preview mode
3. click on "play"
4. exit the play mode
5. deselect first annotation
6. click on "play" again

... this peculiar sequence results in the app crashing

How to reproduce :

1. create 3 annotations
2. try to dnd annotation 3 at level 2

What happens : the dragged annotation is destroyed, and the content of previous ones too

I did a first draft but soem part should be filled.

...for usecases that try to only use the tiling feature.

question : what to do with the left column which is then blank ?

We want to enable users to download a zip archive containing :

• a JSON file representing the slideshow data
• a folder with image tiles for the current project
• a html page facilitating publication by indicating the URL to browse to access a sharable version of the player (it should dynamically retrieve its own window.location to do so)

Sketchy idea of what the html page content would be :

Your slideshow data is now uploaded at my-dataset.netlify.com.

You can share a viewable version of it at https://medialab.github.io/glisseMontre/viewer?dataURL=my-dataset.netlify.com

This archive will also be used for the import feature.

The tool should handle most used file formats : jpe?g, png.

Question : is it possible and wishable to handle following file formats :

• svg
• gif
• tiff
• exif

For the app :

• icon
• description/baseline
• generic/dublincore meta
• opengraph meta/cover
• twitter meta/cover

For the outputs (if we confirm that we show an iframe in the exported html file) :

• icon
• title (built from slideshow title + tool mention)
• description/baseline
• generic/dublincore meta
• opengraph meta/cover
• twitter meta/cover

In the viewer, a "share" button allows to share a work.

Copiable URL

Copiable iframe code

• Untitled document → utiliser le nom de l’image
• Vocabulaire de l’application → “images” au lieu de “documents” ou “slideshows”
• icône de déplacement d’annotation → pas le bon curseur
• code couleur de forme sélection et carte sélection à harmoniser et poignées en bleu
• icône de minification ambigu -> flèche vers le bas + tooltip
• toutes petites boîtes containers -> mettre sur 2 lignes superposées verticalement (annotations / image) ?
• Download help → changer le titre → “How to : save and publish”
• quand clic sur download → affichage d’un tooltip qui indique le bouton (avec “ne plus afficher”)
• mode sélection : toute la forme comme objet possible de drag d’une forme

Example of this image :

When trying to upload it, the progress bar stops halfway, and the stack indicates:

DOMException: "Index or size is negative or greater than the allowed amount" 
The above error occurred in task _callee

Then, when reloading the page, the lower level of zoom displays no image:

• App name
• Description
• Add license (AGPL 3.0 ?)
• check and remove unnecessary dependencies
• version (should we start with 1.0.0-alpha ?)

Candidates so far :

• tesselle
• lentille
• myrtille

By default when drawing a circle or rectangle the tooltip shows a size quantity in hectares (e.g. 2000 ha). It should be removed.

To reproduce: try to import any image in chrome browser (v76.0 macos).

I get the following error:

The slice function in containers/App/saga.ts seems to raise a DOMException. Not investigated more so far.

Questions:

• zoom back or use current zoom/pan for printing?
• how to represent annotations and link shapes to text ? (numbers ?)

After our case studies meeting, we have decided to add a new feature allowing to provide ways to create annotations non related to target shapes in the editor. Targeted use cases are :

• provide a general introduction to an image storytelling
• provide a conclusion to an image storytelling
• add intermediary comments inbetween annotations when browsing a slideshow in storytelling mode

This means making the following changes :

• update model to add annotations not related to shapes to a slideshow
• add a "add free comment" button in the list of the aside column in editor mode
• in the aside column of the editor mode, differenciate visually form-attached annotations and free annotations
• in the aside column of the viewer mode, differenciate visually form-attached annotations and free annotations

instead of having "Empty annotation" as their default state

The player viewer should have a route allowing to provide a data URL for fetching JSON data and image tiles of a project.

This would be the "publication" route of the app.

Possible URL pattern (to discuss) : root/viewer?dataUrl=dataset_base_url

Which would give in production something like : https://medialab.github.io/glisseMontre/viewer?dataURL=my-dataset.netlify.com

... with a JSON file at my-dataset.netlify.com/slideshow.json and a tiles folder at my-dataset.netlify.com/tiles

Relates to #27

Something like this:

UX : toaster.

Cases :

• Failed retrieval of images
• Failed import (bad format)
• Failed import (too big)
• (if possible) indexeddb overload
• when importing, zip has the wrong format
• failed download

Separate views :

• in viewer, data is missing (json and/or tiles folder)

This can happen for instance if the indexeddb has been cleaned.

remove all unecessary assets brought from boilerplate.

Hello @robindemourat,

• Revoir les anciens icones
• il nous manque un icon "séléction"

Homepage :

• presentation text
• Drop a file : cursor pointer
• cards slideshows --> add a thumbnail ?
• delete a slideshow -> two-steps with a confirmation modal
• add a logo/icon
• add footer with medialab info & co.

Editor :

• pannel : expanded and minified states
• design header
• design name input
• better design for annotation cards
• leaflet UI : harmonize with design library style
• shapes edition : harmonize grips with the global design
• loading screen (when splashing directly on a slideshow edition view onload)

Viewer :

• differenciate UI style from editor

For some cases the minimum zoom levels does not display the whole image, like here:

It would be good to lower the minimum zoom level or adapt it to the image as here it feels "cropped".

An embedded documentation (probably in the form of a modal next to the download button) should explain how to publish and share a given slideshow.

How to reproduce:

1. import a small image (e.g. 500px X 500px) to make a new project
2. reload the editor

The image get cropped (it is not reproducible in player mode, oddly)

Example: