123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178 |
- /* Layout()
- * ========
- * Implements AdminLTE layout.
- * Fixes the layout height in case min-height fails.
- *
- * @usage activated automatically upon window load.
- * Configure any options by passing data-option="value"
- * to the body tag.
- */
- +function ($) {
- 'use strict';
- var DataKey = 'lte.layout';
- var Default = {
- slimscroll : true,
- resetHeight: true
- };
- var Selector = {
- wrapper : '.wrapper',
- contentWrapper: '.content-wrapper',
- layoutBoxed : '.layout-boxed',
- mainFooter : '.main-footer',
- mainHeader : '.main-header',
- sidebar : '.sidebar',
- controlSidebar: '.control-sidebar',
- fixed : '.fixed',
- sidebarMenu : '.sidebar-menu',
- logo : '.main-header .logo'
- };
- var ClassName = {
- fixed : 'fixed',
- holdTransition: 'hold-transition'
- };
- var Layout = function (options) {
- this.options = options;
- this.bindedResize = false;
- this.activate();
- };
- Layout.prototype.activate = function () {
- this.fix();
- this.fixSidebar();
- $('body').removeClass(ClassName.holdTransition);
- if (this.options.resetHeight) {
- $('body, html, ' + Selector.wrapper).css({
- 'height' : 'auto',
- 'min-height': '100%'
- });
- }
- if (!this.bindedResize) {
- $(window).resize(function () {
- this.fix();
- this.fixSidebar();
- $(Selector.logo + ', ' + Selector.sidebar).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
- this.fix();
- this.fixSidebar();
- }.bind(this));
- }.bind(this));
- this.bindedResize = true;
- }
- $(Selector.sidebarMenu).on('expanded.tree', function () {
- this.fix();
- this.fixSidebar();
- }.bind(this));
- $(Selector.sidebarMenu).on('collapsed.tree', function () {
- this.fix();
- this.fixSidebar();
- }.bind(this));
- };
- Layout.prototype.fix = function () {
- // Remove overflow from .wrapper if layout-boxed exists
- $(Selector.layoutBoxed + ' > ' + Selector.wrapper).css('overflow', 'hidden');
- // Get window height and the wrapper height
- var footerHeight = $(Selector.mainFooter).outerHeight() || 0;
- var headerHeight = $(Selector.mainHeader).outerHeight() || 0;
- var neg = headerHeight + footerHeight;
- var windowHeight = $(window).height();
- var sidebarHeight = $(Selector.sidebar).height() || 0;
- // Set the min-height of the content and sidebar based on
- // the height of the document.
- if ($('body').hasClass(ClassName.fixed)) {
- $(Selector.contentWrapper).css('min-height', windowHeight - footerHeight);
- } else {
- var postSetHeight;
- if (windowHeight >= sidebarHeight + headerHeight) {
- $(Selector.contentWrapper).css('min-height', windowHeight - neg);
- postSetHeight = windowHeight - neg;
- } else {
- $(Selector.contentWrapper).css('min-height', sidebarHeight);
- postSetHeight = sidebarHeight;
- }
- // Fix for the control sidebar height
- var $controlSidebar = $(Selector.controlSidebar);
- if (typeof $controlSidebar !== 'undefined') {
- if ($controlSidebar.height() > postSetHeight)
- $(Selector.contentWrapper).css('min-height', $controlSidebar.height());
- }
- }
- };
- Layout.prototype.fixSidebar = function () {
- // Make sure the body tag has the .fixed class
- if (!$('body').hasClass(ClassName.fixed)) {
- if (typeof $.fn.slimScroll !== 'undefined') {
- $(Selector.sidebar).slimScroll({ destroy: true }).height('auto');
- }
- return;
- }
- // Enable slimscroll for fixed layout
- if (this.options.slimscroll) {
- if (typeof $.fn.slimScroll !== 'undefined') {
- // Destroy if it exists
- // $(Selector.sidebar).slimScroll({ destroy: true }).height('auto')
- // Add slimscroll
- $(Selector.sidebar).slimScroll({
- height: ($(window).height() - $(Selector.mainHeader).height()) + 'px'
- });
- }
- }
- };
- // Plugin Definition
- // =================
- function Plugin(option) {
- return this.each(function () {
- var $this = $(this);
- var data = $this.data(DataKey);
- if (!data) {
- var options = $.extend({}, Default, $this.data(), typeof option === 'object' && option);
- $this.data(DataKey, (data = new Layout(options)));
- }
- if (typeof option === 'string') {
- if (typeof data[option] === 'undefined') {
- throw new Error('No method named ' + option);
- }
- data[option]();
- }
- });
- }
- var old = $.fn.layout;
- $.fn.layout = Plugin;
- $.fn.layout.Constuctor = Layout;
- // No conflict mode
- // ================
- $.fn.layout.noConflict = function () {
- $.fn.layout = old;
- return this;
- };
- // Layout DATA-API
- // ===============
- $(window).on('load', function () {
- Plugin.call($('body'));
- });
- }(jQuery);
|