Using Popups

Choosing a Popup

There are two types of popups available for usage, a simple popup with predetermined HTML (Use your browsers Find shortcut for simplePopup in index.html) and an advanced popup, where you declare the HTML to be used.

Simple Popups

Creating a simple popup is a trivial task using the parameters of the helper.popup.createSimple method. If you can't understand them, use the table below for an explanation.

Parameter	Usage	Type	Required?
x	Declares the width of the popup.	number	Yes
y	Declares the height of the popup.	number	Yes
text	Declares the text content of the popup.	string	Yes
noButton	Declares if your popup should have an OK button.	boolean	No, default: false
doWhat	Use "default" if your popup has no special action. For adding them, see helper.popup.simpleClicked.	string	No, default: "default"
title	Declares the title of your popup. Use "" for a blank title	string	No, default: ""
backButton	Should your popup have a clickable Back button?	boolean	No, default: false
isError	Is your popup an error (red border)?	boolean	No, default: false

Advanced Popups

Note: As of 0.6, advanced popups do not have a filter parameter. It may be re-introduced at a later date.
Advanced popups have only four parameters, x, y, html, and filter. x and y serve the same purpose as in a simple popup, for width and height. filter is a boolean to toggle whether a filter is applied when the popup is created, but html is different. html declares the HTML for the popup, and has a few differences and quirks that might need to be known. First, the default color for text is white, so you need to use the popup-text class for all of your text (this may change in the future, see #31). Second, by default, buttons aren't placed inside the popup, so you will need to manually create one. Third, popup button actions are not currently implemented as a feature within the createAdvanced popup method, so for a special button you will need to create a new function and place it in your button's onclick attribute.
Example of a valid advanced popup:

helper.popup.createAdvanced(300,200,`<p class='popup-content'>hello everyone!</p>
    <p class='popup-text'>this is another line of text!</p>
    <button onclick='helper.popup.destroyAdvanced()' id='simplePopupButton' class='popup-button'>This destroys the popup!</button>
`);

Like in the example above, you should use backticks instead of quotation marks for your html string to break it up into multiple lines for code readability.