<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title> Source: collapser.js</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-12">
<div id="main">
<h1 class="page-title">Source: collapser.js</h1>
<section>
<article>
<pre
class="sunlight-highlight-javascript linenums">/** @module wcCollapser */
define([
"dcl/dcl",
"./types",
"./splitter",
"./drawer",
"./base"
], function (dcl, wcDocker, wcSplitter, wcDrawer, base) {
/**
* A collapsable container for carrying panels.<br>
*
* @class module:wcCollapser
* @version 3.0.0
* @description A docker container for carrying its own arrangement of docked panels as a slide out drawer.<br/>
* <b><i>PRIVATE<i> - Handled internally by [docker]{@link module:wcDocker} and <u>should never be constructed by the user.</u></b>
*/
var Module = dcl(base, {
declaredClass:'wcCollapser',
/**
* @memberOf module:wcCollapser
* @param {external:jQuery~selector|external:jQuery~Object|external:domNode} container - A container element for this drawer.
* @param {module:wcSplitter|wcDocker} parent - The drawer's parent object.
* @param {module:wcDocker.DOCK} position - A docking position to place this drawer.
*/
constructor: function (container, parent, position) {
this.$container = $(container);
this.$frame = null;
this._position = position;
this._parent = parent;
this._splitter = null;
this._drawer = null;
this._size = 0;
this._orientation = (this._position === wcDocker.DOCK.LEFT || this._position === wcDocker.DOCK.RIGHT) ? wcDocker.ORIENTATION.HORIZONTAL : wcDocker.ORIENTATION.VERTICAL;
this.__init();
},
///////////////////////////////////////////////////////////////////////////////////////////////////////
// Public Functions
///////////////////////////////////////////////////////////////////////////////////////////////////////
/**
* Collapses the drawer to its respective side wall.
* @function module:wcCollapser#collapse
*/
collapse: function (instant) {
this._drawer.collapse();
},
/**
* Expands the drawer.
* @function module:wcCollapser#expand
*/
expand: function () {
this._drawer.expand();
},
/**
* Gets whether the drawer is expanded.
* @function module:wcCollapser#isExpanded
* @returns {Boolean} - The current expanded state.
*/
isExpanded: function () {
return this._drawer.isExpanded();
},
/**
* The minimum size constraint for the side bar area.
* @function module:wcCollapser#minSize
* @returns {module:wcDocker~Size} - The minimum size.
*/
minSize: function () {
return {x: this._size, y: this._size};
},
/**
* The maximum size constraint for the side bar area.
* @function module:wcCollapser#maxSize
* @returns {module:wcDocker~Size} - The maximum size.
*/
maxSize: function () {
var isHorizontal = (this._orientation === wcDocker.ORIENTATION.HORIZONTAL) ? true : false;
return {
x: (isHorizontal ? this._size : Infinity),
y: (!isHorizontal ? this._size : Infinity)
};
},
///////////////////////////////////////////////////////////////////////////////////////////////////////
// Private Functions
///////////////////////////////////////////////////////////////////////////////////////////////////////
__init: function () {
this.$frame = $('<div class="wcCollapserFrame">');
this.__container(this.$container);
var docker = this.docker();
this._splitter = new (this.docker().__getClass('wcSplitter'))(docker.$container, this, this._orientation);
this._drawer = new (this.docker().__getClass('wcDrawer'))(docker.$transition, this._splitter, this._position);
switch (this._position) {
case wcDocker.DOCK.LEFT:
this._splitter.pane(0, this._drawer);
this._splitter.$pane[1].remove();
this._splitter.$pane[0].addClass('wcDrawer');
this._splitter.pos(0);
break;
case wcDocker.DOCK.RIGHT:
case wcDocker.DOCK.BOTTOM:
this._splitter.pane(1, this._drawer);
this._splitter.$pane[0].remove();
this._splitter.$pane[1].addClass('wcDrawer');
this._splitter.pos(1);
break;
}
this._parent.$bar.addClass('wcSplitterHidden');
},
// Updates the size of the collapser.
__update: function (opt_dontMove) {
this._splitter.__update();
this.__adjustSize();
},
// Adjusts the size of the collapser based on css
__adjustSize: function () {
if (this._drawer._frame._panelList.length) {
this._size = this._drawer._frame.$tabBar.outerHeight();
} else {
this._size = 0;
}
},
// Retrieves the bounding rect for this collapser.
__rect: function () {
return this._drawer.__rect();
},
// Saves the current panel configuration into a meta
// object that can be used later to restore it.
__save: function () {
var data = {};
data.size = this._size;
data.drawer = this._drawer.__save();
return data;
},
// Restores a previously saved configuration.
__restore: function (data, docker) {
this._size = data.size;
this._drawer.__restore(data.drawer, docker);
this.__adjustSize();
},
// Gets, or Sets a new container for this layout.
// Params:
// $container If supplied, sets a new container for this layout.
// parent If supplied, sets a new parent for this layout.
// Returns:
// JQuery collection The current container.
__container: function ($container) {
if (typeof $container === 'undefined') {
return this.$container;
}
this.$container = $container;
if (this.$container) {
this.$container.append(this.$frame);
} else {
this.$frame.remove();
}
return this.$container;
},
// Disconnects and prepares this widget for destruction.
__destroy: function () {
if (this._splitter) {
this._splitter.__destroy();
this._splitter = null;
this._frame = null;
}
this.__container(null);
this._parent = null;
}
});
return Module;
});
</pre>
</article>
</section>
</div>
</div>
<div class="clearfix"></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>