## Spec for "Picture/Image" Plugin...

A web component that lets you add pictures to my pages

## Table of Contents​

- [Spec for "Picture/Image" Plugin...](#spec-for-%22pictureimage%22-plugin)
- [Table of Contents​](#table-of-contents%e2%80%8b)
- [Workflow](#workflow)
- [User Stories](#user-stories)
- [Screens / States​](#screens--states%e2%80%8b)
- [Sections Used](#sections-used)
  - [Basic](#basic)
  - [Advanced](#advanced)
- [Test Plan](#test-plan)

## Workflow

(N/A)​

## User Stories

As a user, I can...

- Add pictures to my pages

## Screens / States​

![](http://ambid-backups.s3.amazonaws.com/screenshots/picture-widget.png)

## Sections Used

### Basic

    Upload/Paste URL
    Actions
    Size
    Position/padding
    Alignment

### Advanced

    Borders/Shadow

## Test Plan

| √   | Scenario                                                            | Expected                                                                       |
| --- | ------------------------------------------------------------------- | ------------------------------------------------------------------------------ |
| √   | When a user opens the [add new] tab                                 | A [Picture Widget] appears                                                     |
| √   | When a user drags the picture widget to the canvas                  | A simple Picture/Image appears                                                 |
| √   | When a user clicks the [*] button on the widget                     | The Picture/Image properties box appears                                       |
| √   | When a user configures which time dimensions show                   | Picture settings adjust accordingly (both editor & live mode)                  |
| √   | When a user changes the layout (align, position)                    | Picture settings adjust accordingly (both editor & live mode)                  |
| √   | When a user configures the design (font, color, bg, border, shadow) | Picture settings adjust accordingly (both editor & live mode)                  |
| √   | When a user publishes a page with the picture                       | The destination page shows the picture as specified on the live page           |
| √   | When a user specifies an post Picture action (redirect, popup, tag) | Picture settings adjust accordingly (both editor & live mode)                  |
| √   | When a user specifies a date based on first visit                   | Live page sets the picture time based on first visit date (as seen in cookies) |
| x   | When a user chooses a preset                                        | Picture settings overwrite to the preset settings                              |