Motivational poster creator. This site will allow you to generate a random poster or make your own. When you create your own poster, it saves the submitted data so that future posters can use it. Additionally, you have the option to save posters, delete posters from a collection, and replace individual elements (image, title, quote) on your main poster.

This site was built using JavaScript, HTML, and CSS. The main functionality of the site is created through DOM manipulation in the JavaScript file. There are three views for this page:

• Main page
• Make Your Own Poster page
• Saved Posters page

This site was built by Kim Ward and Andrew Musselman as a pair project at Turing School of Software & Design.

The site can be opened at this link. On load, you will see the main page and a poster with a randomly selected image, title, and quote.

Every time the Show Another Random Poster button is clicked, a new random poster will be displayed.

When you click the Show Saved Posters button, it will take you to the saved posters area. The Back to Main button takes you back to the main page.

Clicking on the Make Your Own Poster button will take you to a form that contains fields to enter an image URL, title, and quote for your custom poster. If you decide not to create your own poster, you can click on the Nevermind button and go back to the main page without filling out the form.

On the poster form, fill in the three fields with your desired text and image URL. Show my poster will bring you back to the main page view with your custom poster displayed. It will also save your submitted data so that you can use it for future random posters.

On the main page, there is an option to save this poster. You can use this after getting a random poster or after creating your own poster. Clicking on the Save This Poster button adds the current poster to the Saved Posters gallery. Each poster will only be saved once so the gallery does not contain duplicates. Clicking on the Show Saved Posters button opens the gallery, which displays all saved posters as a thumbnail.

In the saved posters area, double clicking any of the poster thumbnails will delete that poster from the saved posters gallery and only show the remaining posters.

On the main page, you can click on the poster image, title, or quote to randomize that element while keeping the other parts the same. For example, if you click the image it will select another random image while keeping the title and quote the same.

• Provide an error alert on the poster form to alert you if the data you have entered is incorrect or missing
• Allow you to view saved posters in the full size poster view by clicking on them in the saved posters gallery
• Allow you to rearrange the saved posters gallery by dragging the poster thumbnails