Problems with adminlte javascript embedding

Hello. I try to make my own meteor app, based on adminlte 2 FREE template. So i took the page starter.html, converted it into layout.html + layout.js, put the css files in the clinet folder, and manually imported javascripts like so layout.js:

import '/public/js/bootstrap'
import '/public/js/adminlte.min'

import '../parts/sidebar'
import './layout.html'


BlazeLayout.setRoot('body');

So everything works, but i get the same problem as shown here

According to this issue thread on github https://github.com/ColorlibHQ/AdminLTE/issues/1797 i found out that the solution should be to do this in Template.layout.onRendered:

$('body').layout('fix');

But the problem is that, the layout is a jquery plugin, and it looks like this (from adminlte.js):

> 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'));
>   });

So as you can see it iis nitiliazed via $(window).on('load') but of course it never gets executed beacause blaze have its own trigger. Is there a way i can load this js somehow with all the events, without rewriting it? And if i have to rewrite it, can someone kick me in the right direction, how to do it. I mean there are prototype/classes used, can i use those in Template.layout ? By the way i use BlazeLayout. Hope someone helps

Short answer, i just took the layout.fix() function and added it in the layout.onRendered:

Template.layout.onRendered(function(){


    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'
    };


    $(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;


    var Default = {
        slimscroll : true,
        resetHeight: true
    };

    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());
        }
    }


});;

Use it and everything will be ok.