<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title> Module: wcDocker</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/sunlight.dark.css">
<link type="text/css" rel="stylesheet" href="styles/site.slate.css">
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top ">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html"><div style='font-size:15px;line-height:15px;margin-top:-5px;'>Web Cabin Docker<br>v3.0.0 (pre-release)</div></a>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#topNavigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="topNavigation">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="modules.list.html" class="dropdown-toggle" data-toggle="dropdown">Modules<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="module-wcBase.html">wcBase</a></li><li><a href="module-wcCollapser.html">wcCollapser</a></li><li><a href="module-wcDocker.html">wcDocker</a></li><li><a href="module-wcDrawer.html">wcDrawer</a></li><li><a href="module-wcFrame.html">wcFrame</a></li><li><a href="module-wcGhost.html">wcGhost</a></li><li><a href="module-wcIFrame.html">wcIFrame</a></li><li><a href="module-wcLayout.html">wcLayout</a></li><li><a href="module-wcLayoutSimple.html">wcLayoutSimple</a></li><li><a href="module-wcLayoutTable.html">wcLayoutTable</a></li><li><a href="module-wcPanel.html">wcPanel</a></li><li><a href="module-wcSplitter.html">wcSplitter</a></li><li><a href="module-wcTabFrame.html">wcTabFrame</a></li>
</ul>
</li>
<li class="dropdown">
<a href="events.list.html" class="dropdown-toggle" data-toggle="dropdown">Events<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="module-wcDocker.html#event:onEvent">wcDocker#event:onEvent</a></li>
</ul>
</li>
<li class="dropdown">
<a href="tutorials.list.html" class="dropdown-toggle" data-toggle="dropdown">Tutorials<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="tutorial-1.0-getting-started.html">Getting Started</a></li><li><a href="tutorial-2.0-tips-and-tricks.html">Tips and Tricks</a></li><li><a href="tutorial-3.0-widgets.html">Widgets</a></li>
</ul>
</li>
<li class="dropdown">
<a href="externals.list.html" class="dropdown-toggle" data-toggle="dropdown">Externals<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="external-domNode.html">domNode</a></li><li><a href="external-jQuery.html">jQuery</a></li>
</ul>
</li>
</ul>
<div class="col-sm-3 col-md-3">
<form class="navbar-form" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search" name="q" id="search-input">
<div class="input-group-btn">
<button class="btn btn-default" id="search-submit"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="container" id="toc-content">
<div class="row">
<div class="col-md-8">
<div id="main">
<h1 class="page-title">Module: wcDocker</h1>
<section>
<header>
</header>
<article>
<div class="container-overview">
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-17">line 17</a>
</li>
</ul>
</dd>
</dl>
</div>
<h3 class="subsection-title">Members</h3>
<dl>
<hr>
<dt class="name" id=".COLLAPSED">
<h4 id=".COLLAPSED"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>COLLAPSED</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Used when <a href="module-wcDocker.html#addPanel">adding</a> or <a href="module-wcDocker.html#movePanel">moving</a> a panel to designate the target location as collapsed.<br>
Must be used with <a href="module-wcDocker.html#.DOCK">docking</a> positions LEFT, RIGHT, or BOTTOM only.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">String</span>
</li>
</ul>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-113">line 113</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id=".DOCK">
<h4 id=".DOCK"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>DOCK</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Enumerated Docking positions.</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>MODAL</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"modal"
</td>
<td class="description last">A floating panel that blocks input until closed</td>
</tr>
<tr>
<td class="name"><code>FLOAT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"float"
</td>
<td class="description last">A floating panel</td>
</tr>
<tr>
<td class="name"><code>TOP</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"top"
</td>
<td class="description last">Docks to the top of a target or window</td>
</tr>
<tr>
<td class="name"><code>LEFT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"left"
</td>
<td class="description last">Docks to the left of a target or window</td>
</tr>
<tr>
<td class="name"><code>RIGHT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"right"
</td>
<td class="description last">Docks to the right of a target or window</td>
</tr>
<tr>
<td class="name"><code>BOTTOM</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"bottom"
</td>
<td class="description last">Docks to the bottom of a target or window</td>
</tr>
<tr>
<td class="name"><code>STACKED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"stacked"
</td>
<td class="description last">Docks as another tabbed item along with the target</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-6">line 6</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id=".EVENT">
<h4 id=".EVENT"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>EVENT</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Enumerated Internal events</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>INIT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelInit"
</td>
<td class="description last">When the panel is initialized</td>
</tr>
<tr>
<td class="name"><code>LOADED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"dockerLoaded"
</td>
<td class="description last">When all panels have finished loading</td>
</tr>
<tr>
<td class="name"><code>UPDATED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelUpdated"
</td>
<td class="description last">When the panel is updated</td>
</tr>
<tr>
<td class="name"><code>VISIBILITY_CHANGED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelVisibilityChanged"
</td>
<td class="description last">When the panel has changed its visibility<br>This event is called with the current visibility state as the first parameter</td>
</tr>
<tr>
<td class="name"><code>BEGIN_DOCK</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelBeginDock"
</td>
<td class="description last">When the user begins moving any panel from its current docked position</td>
</tr>
<tr>
<td class="name"><code>END_DOCK</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelEndDock"
</td>
<td class="description last">When the user finishes moving or docking a panel</td>
</tr>
<tr>
<td class="name"><code>GAIN_FOCUS</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelGainFocus"
</td>
<td class="description last">When the user brings any panel within a tabbed frame into focus</td>
</tr>
<tr>
<td class="name"><code>LOST_FOCUS</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelLostFocus"
</td>
<td class="description last">When the user leaves focus on any panel within a tabbed frame</td>
</tr>
<tr>
<td class="name"><code>CLOSING</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelClosing"
</td>
<td class="description last">When the panel is about to be closed, but before it closes. If any event handler returns a falsey value, the close action will be canceled.</td>
</tr>
<tr>
<td class="name"><code>CLOSED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelClosed"
</td>
<td class="description last">When the panel is being closed</td>
</tr>
<tr>
<td class="name"><code>PERSISTENT_CLOSED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelPersistentClosed"
</td>
<td class="description last">When a persistent panel is being hidden</td>
</tr>
<tr>
<td class="name"><code>PERSISTENT_OPENED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelPersistentOpened"
</td>
<td class="description last">When a persistent panel is being shown</td>
</tr>
<tr>
<td class="name"><code>BUTTON</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelButton"
</td>
<td class="description last">When a custom button is clicked, See wcPanel.addButton</td>
</tr>
<tr>
<td class="name"><code>ATTACHED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelAttached"
</td>
<td class="description last">When the panel has moved from floating to a docked position</td>
</tr>
<tr>
<td class="name"><code>DETACHED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelDetached"
</td>
<td class="description last">When the panel has moved from a docked position to floating</td>
</tr>
<tr>
<td class="name"><code>MOVE_STARTED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelMoveStarted"
</td>
<td class="description last">When the user has started moving the panel (top-left coordinates changed)<br>This event is called with an object of the current {x, y} position as the first parameter</td>
</tr>
<tr>
<td class="name"><code>MOVE_ENDED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelMoveEnded"
</td>
<td class="description last">When the user has finished moving the panel<br>This event is called with an object of the current {x, y} position as the first parameter</td>
</tr>
<tr>
<td class="name"><code>MOVED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelMoved"
</td>
<td class="description last">When the top-left coordinates of the panel has changed<br>This event is called with an object of the current {x, y} position as the first parameter</td>
</tr>
<tr>
<td class="name"><code>RESIZE_STARTED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelResizeStarted"
</td>
<td class="description last">When the user has started resizing the panel (width or height changed)<br>This event is called with an object of the current {width, height} size as the first parameter</td>
</tr>
<tr>
<td class="name"><code>RESIZE_ENDED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelResizeEnded"
</td>
<td class="description last">When the user has finished resizing the panel<br>This event is called with an object of the current {width, height} size as the first parameter</td>
</tr>
<tr>
<td class="name"><code>RESIZED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelResized"
</td>
<td class="description last">When the panels width or height has changed<br>This event is called with an object of the current {width, height} size as the first parameter</td>
</tr>
<tr>
<td class="name"><code>ORDER_CHANGED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelOrderChanged"
</td>
<td class="description last">This only happens with floating windows when the order of the windows have changed.</td>
</tr>
<tr>
<td class="name"><code>SCROLLED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"panelScrolled"
</td>
<td class="description last">When the contents of the panel has been scrolled</td>
</tr>
<tr>
<td class="name"><code>SAVE_LAYOUT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"layoutSave"
</td>
<td class="description last">When the layout is being saved, See <a href="module-wcDocker.html#save">wcDocker.save</a></td>
</tr>
<tr>
<td class="name"><code>RESTORE_LAYOUT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"layoutRestore"
</td>
<td class="description last">When the layout is being restored, See <a href="module-wcDocker.html#restore">wcDocker.restore</a></td>
</tr>
<tr>
<td class="name"><code>CUSTOM_TAB_CHANGED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"customTabChanged"
</td>
<td class="description last">When the current tab on a custom tab widget associated with this panel has changed, See <a href="module-wcTabFrame.html">module:wcTabFrame</a></td>
</tr>
<tr>
<td class="name"><code>CUSTOM_TAB_CLOSED</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"customTabClosed"
</td>
<td class="description last">When a tab has been closed on a custom tab widget associated with this panel, See <a href="module-wcTabFrame.html">module:wcTabFrame</a></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-42">line 42</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id=".LAYOUT">
<h4 id=".LAYOUT"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>LAYOUT</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Enumerated Layout wcDocker.</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>SIMPLE</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"wcLayoutSimple"
</td>
<td class="description last">Contains a single div item without management using a <a href="module-wcLayoutSimple.html">module:wcLayoutSimple</a>, it is up to you to populate it however you wish.</td>
</tr>
<tr>
<td class="name"><code>TABLE</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"wcLayoutTable"
</td>
<td class="description last">Manages a table grid layout using <a href="module-wcLayoutTable.html">module:wcLayoutTable</a>, this is the default layout used if none is specified.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-29">line 29</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id=".ORIENTATION">
<h4 id=".ORIENTATION"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>ORIENTATION</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Used for the splitter bar orientation.</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>VERTICAL</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="default">
false
</td>
<td class="description last">Top and Bottom panes</td>
</tr>
<tr>
<td class="name"><code>HORIZONTAL</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="default">
true
</td>
<td class="description last">Left and Right panes</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-121">line 121</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id=".TAB">
<h4 id=".TAB"><toc class="attribs"><span class="type-signature"><static, constant> </span></toc>var <toc class="member"><b>TAB</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Used to determine the position of tabbed widgets for stacked panels.<br>
<b>Note:</b> Not supported on IE8 or below.</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>TOP</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"top"
</td>
<td class="description last">The default, puts tabs at the top of the frame</td>
</tr>
<tr>
<td class="name"><code>LEFT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"left"
</td>
<td class="description last">Puts tabs on the left side of the frame</td>
</tr>
<tr>
<td class="name"><code>RIGHT</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"right"
</td>
<td class="description last">Puts tabs on the right side of the frame</td>
</tr>
<tr>
<td class="name"><code>BOTTOM</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="default">
"bottom"
</td>
<td class="description last">Puts tabs on the bottom of the frame</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="types.js.html">types.js</a>,
<a href="types.js.html#sunlight-1-line-133">line 133</a>
</li>
</ul>
</dd>
</dl>
</dd>
</dl>
<h3 class="subsection-title">Methods</h3>
<dl>
<hr>
<dt>
<h4 class="name" id=".constructor"><toc class="attribs"><span class="type-signature"><static> </span></toc>function <toc class="method"><b>constructor</b>(container [, options])</toc>
</h4>
</dt>
<dd>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>container</code></td>
<td class="type">
<span class="param-type"><a href="external-jQuery.html#~selector">external:jQuery~selector</a></span>
|
<span class="param-type"><a href="external-jQuery.html#~Object">external:jQuery~Object</a></span>
|
<span class="param-type"><a href="external-domNode.html">external:domNode</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">A container element to store the contents of wcDocker.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#~Options">module:wcDocker~Options</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Options for constructing the instance.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-65">line 65</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="addPanel"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>addPanel</b>(typeName, location [, targetPanel] [, options])</toc>
->
<i><small>
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Add a new docked panel to the docker instance.<br>
<b>Note:</b> It is best to use wcDocker.COLLAPSED after you have added your other docked panels, as it may ensure proper placement.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>typeName</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
</td>
<td class="description last">The name identifier of the panel to create.</td>
</tr>
<tr>
<td class="name"><code>location</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.DOCK">module:wcDocker.DOCK</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The docking location to place this panel.</td>
</tr>
<tr>
<td class="name"><code>targetPanel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type"><a href="module-wcDocker.html#.COLLAPSED">module:wcDocker.COLLAPSED</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">A target panel to dock relative to, or use wcDocker.COLLAPSED to collapse it to the side or bottom.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#~PanelOptions">module:wcDocker~PanelOptions</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Other options for panel placement.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-280">line 280</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- The newly created panel object, or false if no panel was created.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="basicMenu"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>basicMenu</b>(selector, itemListOrBuildFunc, includeDefault)</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Assigns a basic context menu to a selector element. The context
Menu is a simple list of options, no nesting or special options.<br><br>
If you wish to use a more complex context menu, you can use
<a href="http://medialize.github.io/jQuery-contextMenu/docs.html">jQuery.contextMenu</a> directly.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>selector</code></td>
<td class="type">
<span class="param-type"><a href="external-jQuery.html#~selector">external:jQuery~selector</a></span>
</td>
<td class="description last">A selector string that designates the elements who use this menu.</td>
</tr>
<tr>
<td class="name"><code>itemListOrBuildFunc</code></td>
<td class="type">
<span class="param-type">Array.<<a href="external-jQuery.html#contextMenu#~item">external:jQuery#contextMenu~item</a>></span>
|
<span class="param-type">function</span>
</td>
<td class="description last">An array with each context menu item in it, or a function to call that returns one.</td>
</tr>
<tr>
<td class="name"><code>includeDefault</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">If true, all default menu options will be included.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="important tag-deprecated method-doc-label method-doc-details-label">Deprecated:</dt>
<dd>
<ul class="dummy">
<li>Renamed to [wcDocker.menu}wcDocker#menu.</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-776">line 776</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="bypassMenu"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>bypassMenu</b>()</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Bypasses the next context menu event.
Use this during a mouse up event in which you do not want the
context menu to appear when it normally would have.</p>
</div>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-1130">line 1130</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="clear"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>clear</b>()</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Clears all contents from the docker instance.</p>
</div>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-1227">line 1227</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="findPanels"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>findPanels</b>( [typeName])</toc>
->
<i><small>
<span class="param-type">Array.<<a href="module-wcPanel.html">module:wcPanel</a>></span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Finds all instances of a given panel type.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>typeName</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">The name identifier for the panel. If not supplied, all panels are retrieved.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-620">line 620</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- A list of all panels found of the given type.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array.<<a href="module-wcPanel.html">module:wcPanel</a>></span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="finishLoading"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>finishLoading</b>( [fadeDuration])</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Hides the loading screen.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>fadeDuration</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
0
</td>
<td class="description last">The fade out duration for the loading screen.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-681">line 681</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="isCollapseEnabled"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>isCollapseEnabled</b>()</toc>
->
<i><small>
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Retrieves whether panel collapsers are enabled.</p>
</div>
<dl class="details">
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-195">line 195</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- Collapsers are enabled.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="menu"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>menu</b>(selector, itemListOrBuildFunc, includeDefault)</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Assigns a basic context menu to a selector element. The context
Menu is a simple list of options, no nesting or special options.<br><br>
If you wish to use a more complex context menu, you can use
<a href="http://medialize.github.io/jQuery-contextMenu/docs.html">jQuery.contextMenu</a> directly.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>selector</code></td>
<td class="type">
<span class="param-type"><a href="external-jQuery.html#~selector">external:jQuery~selector</a></span>
</td>
<td class="description last">A selector string that designates the elements who use this menu.</td>
</tr>
<tr>
<td class="name"><code>itemListOrBuildFunc</code></td>
<td class="type">
<span class="param-type">Array.<<a href="external-jQuery.html#contextMenu#~item">external:jQuery#contextMenu~item</a>></span>
|
<span class="param-type">function</span>
</td>
<td class="description last">An array with each context menu item in it, or a function to call that returns one.</td>
</tr>
<tr>
<td class="name"><code>includeDefault</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">If true, all default menu options will be included.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-793">line 793</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="movePanel"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>movePanel</b>(panel, location [, targetPanel] [, options])</toc>
->
<i><small>
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Moves a docking panel from its current location to another.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>panel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The panel to move.</td>
</tr>
<tr>
<td class="name"><code>location</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.DOCK">module:wcDocker.DOCK</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The new docking location of the panel.</td>
</tr>
<tr>
<td class="name"><code>targetPanel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">wcDocker.COLLAPSED</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">A target panel to dock relative to, or use wcDocker.COLLAPSED to collapse it to the side or bottom.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#~PanelOptions">module:wcDocker~PanelOptions</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Other options for panel placement.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-464">line 464</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- The panel that was created, or false on failure.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="off"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>off</b>(eventType [, handler])</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Unregisters a global event.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>eventType</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.EVENT">module:wcDocker.EVENT</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The event type, can be a custom event string or a predefined event.</td>
</tr>
<tr>
<td class="name"><code>handler</code></td>
<td class="type">
<span class="param-type">module:wcDocker~event:onEvent</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">The handler function registered with the event. If omitted, all events registered to the event type are unregistered.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-725">line 725</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="on"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>on</b>(eventType, handler)</toc>
->
<i><small>
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Registers a global event.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>eventType</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.EVENT">module:wcDocker.EVENT</a></span>
</td>
<td class="description last">The event type, can be a custom event string or a predefined event.</td>
</tr>
<tr>
<td class="name"><code>handler</code></td>
<td class="type">
<span class="param-type">module:wcDocker~event:onEvent</span>
</td>
<td class="description last">A handler function to be called for the event.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-701">line 701</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Success or failure that the event has been registered.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="panelTypeInfo"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>panelTypeInfo</b>(typeName)</toc>
->
<i><small>
<span class="param-type"><a href="module-wcDocker.html#~registerOptions">module:wcDocker~registerOptions</a></span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Retrieves the options data associated with a given panel type when it was registered.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>typeName</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">The name identifier of the panel.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-265">line 265</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- Registered options of the panel type, or false if the panel was not found.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="module-wcDocker.html#~registerOptions">module:wcDocker~registerOptions</a></span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="panelTypes"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>panelTypes</b>(includePrivate)</toc>
->
<i><small>
<span class="param-type">Array.<String></span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Retrieves a list of all currently registered panel types.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>includePrivate</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">If true, panels registered as private will also be included with this list.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-249">line 249</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- A list of panel type names.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array.<String></span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="registerPanelType"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>registerPanelType</b>(name, options [, isPrivate])</toc>
->
<i><small>
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Registers a new docking panel type to be used later.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>name</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
</td>
<td class="description last">The name identifier for the new panel type.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#~registerOptions">module:wcDocker~registerOptions</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">An options object for describing the panel type.</td>
</tr>
<tr>
<td class="name"><code>isPrivate</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last"><b>DEPRECATED:</b> Use options.isPrivate instead.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-version method-doc-label method-doc-details-label">Version:</dt>
<dd class="tag-version">
<ul class="dummy">
<li>3.0.0</li>
</ul>
</dd>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-205">line 205</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- Success or failure. Failure usually indicates the type name already exists.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="removePanel"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>removePanel</b>(panel, dontDestroy)</toc>
->
<i><small>
<span class="param-type">Boolean</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Removes a docked panel from the window.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>panel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
</td>
<td class="description last">The panel to remove.</td>
</tr>
<tr>
<td class="name"><code>dontDestroy</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">If true, the panel itself will not be destroyed.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-335">line 335</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- Success or failure.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Boolean</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="restore"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>restore</b>(dataString)</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Restores a previously saved configuration.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>dataString</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">A previously saved serialized string, See wcDocker.save.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-1188">line 1188</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="save"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>save</b>()</toc>
->
<i><small>
<span class="param-type">String</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Saves the current panel configuration into a serialized
string that can be used later to restore it.</p>
</div>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-1156">line 1156</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- A serialized string that describes the current panel configuration.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">String</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="startLoading"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>startLoading</b>( [label] [, opacity] [, textOpacity])</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Shows the loading screen.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>label</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">An optional label to display.</td>
</tr>
<tr>
<td class="name"><code>opacity</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
0.4
</td>
<td class="description last">If supplied, assigns a custom opacity value to the loading screen.</td>
</tr>
<tr>
<td class="name"><code>textOpacity</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
1
</td>
<td class="description last">If supplied, assigns a custom opacity value to the loading icon and text displayed.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-641">line 641</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="theme"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>theme</b>(themeName)</toc>
->
<i><small>
<span class="param-type">String</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Gets, or Sets the current theme used by docker.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>themeName</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">If supplied, will activate a theme with the given name.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-164">line 164</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- The currently active theme.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">String</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="themePath"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>themePath</b>(path)</toc>
->
<i><small>
<span class="param-type">String</span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Gets, or Sets the path where all theme files can be found.
"Themes" is the default folder path.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>path</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">If supplied, will set the path where all themes can be found.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-150">line 150</a>
</li>
</ul>
</dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- The currently assigned path.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">String</span>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="trigger"><toc class="attribs"><span class="type-signature"></span></toc>function <toc class="method"><b>trigger</b>(eventType [, data])</toc>
->
<i><small>
<span class="param-type">Array.<Object></span>
</small></i>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Trigger an event on all panels.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>eventType</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.EVENT">module:wcDocker.EVENT</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The event type, can be a custom event string or a predefined event.</td>
</tr>
<tr>
<td class="name"><code>data</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">A custom data object to be passed along with the event.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.js.html">docker.js</a>,
<a href="docker.js.html#sunlight-1-line-750">line 750</a>
</li>
</ul>
</dd>
</dl>
<h5>Fires:</h5>
<ul>
<li>wcDocker~event:onEvent</li>
</ul>
<h5>Returns:</h5>
<div class="param-desc">
results - Returns an array with all results returned by event handlers.
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array.<Object></span>
</dd>
</dl>
</dd>
</dl>
<h3 class="subsection-title">Type Definitions</h3>
<dl>
<hr>
<dt class="name" id="~Anchor">
<h4 id="~Anchor"><toc class="attribs"></toc>typedef var <toc class="member"><b>Anchor</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Anchor data.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>self</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
</td>
<td class="description last">Whether the anchor is hovering over the moving panel.</td>
</tr>
<tr>
<td class="name"><code>loc</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.DOCK">module:wcDocker.DOCK</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The location of the anchor on the panel.</td>
</tr>
<tr>
<td class="name"><code>item</code></td>
<td class="type">
<span class="param-type"><a href="module-wcLayout.html">module:wcLayout</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The panel layout being hovered over.</td>
</tr>
<tr>
<td class="name"><code>tab</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.TAB">module:wcDocker.TAB</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The tab location.</td>
</tr>
<tr>
<td class="name"><code></code></td>
<td class="type">
</td>
<td class="attributes">
</td>
<td class="description last"></td>
</tr>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">X coordinate of the anchor.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Y coordinate of the anchor.</td>
</tr>
<tr>
<td class="name"><code>w</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Width of the anchor.</td>
</tr>
<tr>
<td class="name"><code>h</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Height of the anchor.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-123">line 123</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~AnchorRect">
<h4 id="~AnchorRect"><toc class="attribs"></toc>typedef var <toc class="member"><b>AnchorRect</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A rectangle structure.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">X coordinate of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Y coordinate of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>w</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Width of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>h</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Height of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>tabOrientation</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.TAB">module:wcDocker.TAB</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Desired orientation of tab widgets.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-37">line 37</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Bounds">
<h4 id="~Bounds"><toc class="attribs"></toc>typedef var <toc class="member"><b>Bounds</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A bounding structure</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>top</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">The upper, or top bound (percentage value between 0 and 1).</td>
</tr>
<tr>
<td class="name"><code>bottom</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">The lower, or bottom bound (percentage value between 0 and 1).</td>
</tr>
<tr>
<td class="name"><code>left</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">The left bound (percentage value between 0 and 1).</td>
</tr>
<tr>
<td class="name"><code>right</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">The right bound (percentage value between 0 and 1).</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-47">line 47</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Coordinate">
<h4 id="~Coordinate"><toc class="attribs"></toc>typedef var <toc class="member"><b>Coordinate</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A coordinate structure.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">X coordinate.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">Y coordinate.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-56">line 56</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~FitContents">
<h4 id="~FitContents"><toc class="attribs"></toc>typedef var <toc class="member"><b>FitContents</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Determines whether the container should fit the size of its contents instead of scroll for each axis.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">Whether scrolling is enabled in the horizontal direction.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">Whether scrolling is enabled in the vertical direction.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-77">line 77</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt>
<h4 class="name" id="~onCreatePanel"><toc class="attribs"><span class="type-signature"></span></toc>typedef function <toc class="method"><b>onCreatePanel</b>(panel [, options])</toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A function or an object constructor for the panel. This function is called using the 'new' operator.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>panel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
</td>
<td class="attributes">
</td>
<td class="description last">The panel being constructed.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html#~options">module:wcPanel~options</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">An options object passed in from <a href="module-wcDocker.html#registerPanelType">wcDocker.registerPanelType()</a>'s options.options parameter.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-108">line 108</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Options">
<h4 id="~Options"><toc class="attribs"></toc>typedef var <toc class="member"><b>Options</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Options for a <a href="module-wcDocker.html">docker</a> instance.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>themePath</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'Themes'
</td>
<td class="description last">A folder path where all docker theme files can be found.</td>
</tr>
<tr>
<td class="name"><code>theme</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'default'
</td>
<td class="description last">The active docker theme.</td>
</tr>
<tr>
<td class="name"><code>loadingClass</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'fa fa-spinner fa-pulse'
</td>
<td class="description last">Any class name to use for the loading screen icon.</td>
</tr>
<tr>
<td class="name"><code>allowContextMenu</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
true
</td>
<td class="description last">Overrides the default right click menu with ones that interact with docker.</td>
</tr>
<tr>
<td class="name"><code>hideOnResize</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
false
</td>
<td class="description last">If true, panels will hide their contents as they are being resized.</td>
</tr>
<tr>
<td class="name"><code>allowCollapse</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
true
</td>
<td class="description last">Allows users to collapse panels to the sides of the docker view.</td>
</tr>
<tr>
<td class="name"><code>responseRate</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
10
</td>
<td class="description last">This determines how often updates are performed (in milliseconds).</td>
</tr>
<tr>
<td class="name"><code>moveStartDelay</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
300
</td>
<td class="description last">The time delay (in milliseconds) before a panel drag operation will start.</td>
</tr>
<tr>
<td class="name"><code>edgeAnchorSize</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
50
</td>
<td class="description last">Determines the size of the anchor points when docking a panel to the outer edge of the window. Can be a pixel value, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>panelAnchorSize</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'15%'
</td>
<td class="description last">Determines the size of the anchor points when docking a panel along the side of another panel. Can be a pixel value, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>detachToWidth</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
600
</td>
<td class="description last">Determines the new width when a panel is detached (0 = Don't change). Can be a pixel value, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>detachToHeight</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
400
</td>
<td class="description last">Determines the new height when a panel is detached (0 = Don't change). Can be a pixel value, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>wcPanelClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcPanel object.</td>
</tr>
<tr>
<td class="name"><code>wcGhostClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcGhost object.</td>
</tr>
<tr>
<td class="name"><code>wcSplitterClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcSplitter object.</td>
</tr>
<tr>
<td class="name"><code>wcFrameClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcFrame object.</td>
</tr>
<tr>
<td class="name"><code>wcCollapserClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcCollapser object.</td>
</tr>
<tr>
<td class="name"><code>wcLayoutSimpleClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcLayoutSimple object.</td>
</tr>
<tr>
<td class="name"><code>wcLayoutTableClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcLayoutTable object.</td>
</tr>
<tr>
<td class="name"><code>wcDrawerClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcDrawer object.</td>
</tr>
<tr>
<td class="name"><code>wcTabFrameClass</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Defines a class object to use in replacement of the default wcTabFrame object.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-1">line 1</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~PanelOptions">
<h4 id="~PanelOptions"><toc class="attribs"></toc>typedef var <toc class="member"><b>PanelOptions</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Options for adding a new panel.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">X coordinate of the panel center (if floating). Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Y coordinate of the panel center (if floating). Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>w</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Desired width of the panel. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>h</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Desired height of the panel. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>tabOrientation</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.TAB">module:wcDocker.TAB</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Desired position of tab widgets when using <a href="module-wcDocker.html#.DOCK">wcDocker.DOCK.STACKED</a>. <b>Not supported on IE8 or below.</b></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-84">line 84</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Rect">
<h4 id="~Rect"><toc class="attribs"></toc>typedef var <toc class="member"><b>Rect</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A rectangle structure.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">X coordinate of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Y coordinate of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>w</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Width of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
<tr>
<td class="name"><code>h</code></td>
<td class="type">
<span class="param-type">Number</span>
|
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Height of the rectangle. Can be a pixel position, or a string with a 'px' or '%' suffix.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-28">line 28</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~registerOptions">
<h4 id="~registerOptions"><toc class="attribs"></toc>typedef var <toc class="member"><b>registerOptions</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Options object for registering new panel types.</p>
</div>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>onCreate</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#~onCreatePanel">module:wcDocker~onCreatePanel</a></span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last">A function or an object constructor for the panel.</td>
</tr>
<tr>
<td class="name"><code>layout</code></td>
<td class="type">
<span class="param-type"><a href="module-wcDocker.html#.LAYOUT">module:wcDocker.LAYOUT</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
wcDocker.LAYOUT.TABLE
</td>
<td class="description last">If supplied, overrides the default layout used for this panel.</td>
</tr>
<tr>
<td class="name"><code>icon</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">A CSS class name to draw an icon in the panels tab widget.</td>
</tr>
<tr>
<td class="name"><code>faicon</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">An icon name using the <a href="http://fortawesome.github.io/Font-Awesome/">Font-Awesome</a> library. You must download and link to the library first.</td>
</tr>
<tr>
<td class="name"><code>title</code></td>
<td class="type">
<span class="param-type">String</span>
|
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Assign a custom name to the panels tab. A false value will hide the tab entirely.</td>
</tr>
<tr>
<td class="name"><code>isPrivate</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">If true, the user will not be able to create this panel type.</td>
</tr>
<tr>
<td class="name"><code>isPersistent</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">If true, when the user closes this panel, it will only be hidden instead of completely destroyed. When the user creates an instance of this panel, it will first attempt to un-hide an already existing panel before creating a new instance.</td>
</tr>
<tr>
<td class="name"><code>limit</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">Enforces a limited number of this panel type from being created by the user.</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">A custom options object to be passed into the new panel constructor or creation function as the second parameter.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-94">line 94</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Scrollable">
<h4 id="~Scrollable"><toc class="attribs"></toc>typedef var <toc class="member"><b>Scrollable</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">Determines whether the container will allow scroll bars to appear on each axis.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">Whether scrolling is enabled in the horizontal direction.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Boolean</span>
</td>
<td class="description last">Whether scrolling is enabled in the vertical direction.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-70">line 70</a>
</li>
</ul>
</dd>
</dl>
</dd>
<hr>
<dt class="name" id="~Size">
<h4 id="~Size"><toc class="attribs"></toc>typedef var <toc class="member"><b>Size</b></toc></h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">A 2D size structure.</p>
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Object</span>
</li>
</ul>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">Width.</td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">Height.</td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-63">line 63</a>
</li>
</ul>
</dd>
</dl>
</dd>
</dl>
<h3 class="subsection-title">Events</h3>
<dl>
<hr>
<dt>
<h4 class="name" id="event:onEvent"><toc class="attribs"></toc>function <toc class="method"><b>onEvent</b></toc>
</h4>
</dt>
<dd>
<div class="description">
<p style="margin-left:20px;">An event handler callback. Each is registered to a event type using the <a href="module-wcDocker.html#on">wcDocker.on()</a> or wcPanel.on() functions.</p>
</div>
<h5>Type:
<span class="param-type">function</span>
</h5>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>panel</code></td>
<td class="type">
<span class="param-type"><a href="module-wcPanel.html">module:wcPanel</a></span>
|
<span class="param-type">NULL</span>
</td>
<td class="attributes">
</td>
<td class="description last">The panel invoking the event, or NULL if global.</td>
</tr>
<tr>
<td class="name"><code>data</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">A data object passed by the invoker.</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source method-doc-label method-doc-details-label">Source:</dt>
<dd class="tag-source">
<ul class="dummy">
<li>
<a href="docker.jsdoc.html">docker.jsdoc</a>,
<a href="docker.jsdoc.html#sunlight-1-line-115">line 115</a>
</li>
</ul>
</dd>
</dl>
</dd>
</dl>
</article>
</section>
</div>
</div>
<div class="clearfix"></div>
<div class="col-md-3">
<div id="toc" class="col-md-3 hidden-xs hidden-sm hidden-md"></div>
</div>
</div>
</div>
<div class="modal fade" id="searchResults">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Search results</h4>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<footer>
<span class="copyright">
2014-2016 Jeff Houde (<a href='mailto:lochemage@webcabin.org'>lochemage@webcabin.org</a>)
</span>
<span class="jsdoc-message">
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.0</a>
on 2016-08-28
using the <a href="https://github.com/docstrap/docstrap">DocStrap template</a>.
</span>
</footer>
<script src="scripts/docstrap.lib.js"></script>
<script src="scripts/toc.js"></script>
<script type="text/javascript" src="scripts/fulltext-search-ui.js"></script>
<script>
$( function () {
$( "[id*='$']" ).each( function () {
var $this = $( this );
$this.attr( "id", $this.attr( "id" ).replace( "$", "__" ) );
} );
$( ".tutorial-section pre, .readme-section pre" ).each( function () {
var $this = $( this );
var example = $this.find( "code" );
exampleText = example.html();
var lang = /{@lang (.*?)}/.exec( exampleText );
if ( lang && lang[1] ) {
exampleText = exampleText.replace( lang[0], "" );
example.html( exampleText );
lang = lang[1];
} else {
var langClassMatch = example.parent()[0].className.match(/lang\-(\S+)/);
lang = langClassMatch ? langClassMatch[1] : "javascript";
}
if ( lang ) {
$this
.addClass( "sunlight-highlight-" + lang )
.addClass( "linenums" )
.html( example.html() );
}
} );
Sunlight.highlightAll( {
lineNumbers : true,
showMenu : true,
enableDoclinks : true
} );
$.catchAnchorLinks( {
navbarOffset: 10
} );
$( "#toc" ).toc( {
anchorName : function ( i, heading, prefix ) {
return $( heading ).attr( "id" ) || ( prefix + i );
},
selectors : "#toc-content h1,#toc-content h2,#toc-content h3,#toc-content h4",
showAndHide : false,
smoothScrolling: true
} );
$( "#main span[id^='toc']" ).addClass( "toc-shim" );
$( '.dropdown-toggle' ).dropdown();
$( "table" ).each( function () {
var $this = $( this );
$this.addClass('table');
} );
} );
</script>
<!--Navigation and Symbol Display-->
<!-- Piwik Analytics -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://analytics.webcabin.org/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 6]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="https://analytics.webcabin.org/piwik.php?idsite=6" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->
<script type="text/javascript">
$(document).ready(function() {
SearcherDisplay.init();
});
</script>
</body>
</html>