Element

All configuration objects are derived from Element. You can't create an Element directly but these are the configuration parameters from it that all other objects inherit.

{
	/*
	 * Every element needs an id.  If you don't supply one, one will
	 * be automatically generated.  If you'll need to reference this
	 * element later in your config, you must give it an id yourself.
	 */
	"id": "some_unique_id",
	
	/*
	 * You must supply a type.
	 */
	"type": "button",
	
	/*
	 * The default for "enabled" is true but if you wish to temporarily
	 * hide an element, set it to false.  Note that there are no quotes
	 * around the true/false value.
	 */
	"enabled": true,

	/*
	 * This is a standard Bootstrap button class. Since the
	 * default theme is  "Cerulean", you can visit
	 * https://bootswatch.com/cerulean/ to see how things will
	 * be displayed.  If you hover over one of the button
	 * examples, you'll see a "<>" appear off to the right.
	 * Click it and you'll be shown the classes.
	 *
	 * If you supply "classes", you have to supply all of them
	 * so to use "btn-danger" you also have to use "btn".
	 * Well, you don't "have" to but if you want the button
	 * to look like the others, you should.
	 */
	"classes": "btn btn-danger",

	/*
	 * While the use of CSS classes to provide element styling is encouraged,
	 * you may not be able to get the efffect you want with them.  In this
	 * case you can specify styles directly.
	 * 
	 * All "style" attributes are passed directly to the browser
	 * and use standard CSS naming and syntax.  You can even use
	 * CSS functions such as "calc".
	 *
	 * Styling specified here takes precedence over any styling provided
	 * by CSS classes.  
	 */
	"style": {
		"width": "96px",
		"height": "3em",
		"border-style": "dotted",
		"max-height": "calc(100% - 2.5em)"
	},
	
	/*
	 * You can certainly use styling provide layout instructions but much
	 * of your content will probably require absolute positioning.  To achieve
	 * that you can use "position".
	 *
	 * Example:
	 * Assuming you have an element with an id of "some_element" defined previously
	 * in your config and this widget's top left corner should be placed at a
	 * position that's 150 pixels right and 10 pixels down from the right top
	 * corner of "some_element".
	 * 
	 * - You can use "right", "left", "center", "top", and "bottom" as anchor keywords.
	 * - The "left/right" anchors must come before the "top/bottom" anchors.
	 * - "center center" would mean the center of the widget.
	 * - There must be NO spaces between the keywords and any operators or offsets.
	 *   "right + 10" will not work.
	 * - All coordinates are based on an origin that's at the left top of
	 *   whatever you're referencing.
	 * - "of" could be any previously defined element that has an "id" attribute.
	 * - The reference to the "of" widget MUST be preceeded by a "#".	 
	 */
	"position": {
		"my": "left top",
		"at": "right+150 top+10",
		"of": "#some_element"
	},
}