Requirements.txt

Collage
-------

Hand-cut workshops

- Pre-cut-out images
- Board of existing images.
- Student's dragging and moving images.
- 13+
- Restrict the input images.

- Collection/Box of images - provided by Artist (named collection)
- Participant - drags images.

1. Artist creates set of SVGs.
2. There is a valid set of SVGs for a given workshop (at the moment only one Workshop).
3. Each Image can only be used once.
4. Board size determined by physical size defined by Artist (not by physical size of Participant device).
5. Board displayed 100% at start.
6. Activities for a Participant:
    - Move an Image from the Box onto the Board.
    - Move an Image around on the Board.
    - Bring forward 1 
       - Bounding Rectangle of image - may need to change to polygon intersection.
       - Adjust z-order to be 1 higher than the next image in the bounding rectangle.
    - Push back 1
    - Select an image.
        - Need to have calculated the 'path' around the edge of the image to ensure that 
          we can determine location correctly. Use SVG built-in path data for that.
    - Put image back in the box.
    - Rotate through 360 degrees.
    - Zoom in
    - Zoom out
    - Pan
    - Glue Down (image cannot be moved, no images underneath that image can be moved)
    - Take a picture of their board.
    - Change colour of background (use the colour picker control).
7. Store the state of the board somewhere:
    - Local storage?
    - Cloud...?
    - Robots.txt file to ignore workshop folder

Implementation
--------------

- React SPA using React Components for Canvas to draw.
   - Free hosting in the cloud (static app).

- Workshop file:

    {
        name: 'Science Arts'
        images: [
            'image1.svg',
            'image2.svg',
            'image3.svg'
        ]
    } 

- Images

- Artist creates url for workshop (https://collage.keithbloodymary.com/workshop/[workshopname])
- On load URL, create unique URL for board (https://collage.keithbloodymary.com/workshop/[workshopname]/sdkfgjhsdfjhs)
- Put board in local storage (list of SVG images on the board, positions in 3D, and background colour).






1. Safari on phones is better than Chrome, zooming out causes chrome to think you want to open a new tab
    - Issue resolved. 

2. Background colour palette doesn’t appear on phones
    Need to add one.

3. I think the “add box” icon would be better for the box, as it goes with the add image icon IN the draw
    Change "image box icon" to "AddBox" from material UI list    

4. Where it says ‘workshop’ it would be better if it just said CollageIT - although, is this supposed to be the workshop name? CollageIT would be fine I think? Could it have the logo there too perhaps?
5. Your name and details? 
6. Two things I noticed when using it, 1. when I open the box, but I don’t want an image, I can’t just close the box again and 2. If I’ve clicked an image but I want to get a new image out I instinctively click on the ‘workshop’ rectangle to get back to the box - is that something that could be done, rather than having to click on the background?
    - Clicking on the pink box bar should close it.
    - Clicking on the Logo/Name area should de-select an image.
7. Did you pay for the domain? I need to give you the money for this?!
8. Am ok to use it as is? and show some people for feedback etc?
9. Would replacing or loading images into it be an easy process? Or does it require lots of work your end?
10. I think zoom to fit would be helpful, but after using it, I’m not sure what the glue function would add - what are your thoughts on this, perhaps we could come back to this if feedback from participants warrants it?


Sharing
    - Hash fragment contains the name of the workshop folder.
    - Without a hash fragment, show a 'default' folder.
    - Watermark the 'default' workshop with some text.