Premium Bootstrap Admin Dashboard Themes

Keen's JS codes are written in pure (vanila) Javascript (no jquery dependency) in order to make it easier to integrate with HTML, Angular, React, VueJS and Laravel frameworks. During the build process the JS codes are minified and moved to the assets folder (e.g: dist).

There are 2 types of the JS codes: Custom and Bundlable. The custom JS code is written in a JS file and minified and moved to the assets folder as a single file for each page or element that requires a certain level of customization, while the bundlable JS files are written in separate JS files that are also minified and added bundled into 1 main JS file.

The Layout Folder in [keen]/theme/[demo]/src/js/layout/ contains javascript files that handle the Layout Partials(Aside, Header, Footer, Subheader, etc). The Layout Javascript files are devided into Base and Extended groups where Base Javascript files are mandatory and Extended Javascript files are optional.

The Base Layout Javascript files in [keen]/theme/[demo]/src/js/layout/base handle the following Layout Partials:

File	Description
`header.js`	Defines `KTLayoutHeader` class to handle the Header behavior and provide a basic API methods.
`header-topbar.js`	Defines `KTLayoutHeaderTopbar` class to handle the Header Topbar behavior and provide a basic API methods.
`header-menu.js`	Defines `KTLayoutHeaderTopbar` class to handle the Header Menu for desktop, tablet and mobile breakpoints and provide a basic API methods.
`brand.js`	Defines `KTLayoutBrand` class to handle the Brand(logo) Panel behavior and provide a basic API methods.
`aside.js`	Defines `KTLayoutAside` class to handle the Aside behavior and provide a basic API methods.
`aside-toggle.js`	Defines `KTLayoutMenu` class to handle the Aside Toggle behavior and provide a basic API methods.
`aside-menu.js`	Defines `KTLayoutAsideMenu` class to handle the Aside Menu for desktop, tablet and mobile breakpoints and provide a basic API methods.
`subheader.js`	Defines `KTLayoutSubheader` class to handle the Subheader behavior and provide a basic API methods.
`content.js`	Defines `KTLayoutAside` class to handle the Content behavior and provide a basic API methods.
`footer.js`	Defines `KTLayoutFooter` class to handle the Footer behavior and provide a basic API methods.
`sticky-card.js`	Defines `KTLayoutStickyCard` class to handle the Sticky Main Card behavior and provide a basic API methods.
`stretched-card.js`	Defines `KTLayoutStretchedCard` class to handle the Stretched Main Card behavior and provide a basic API methods.

The Base Components Javascript are mandatory and they must be included in the main bundle javascript file [keen]/theme/[demo]/assets/js/scripts.bundle.js in order Keen to perform properly.

The Extended Components Javascript are optional to use and if they enabled they will be included in the main bundle javascript file [keen]/theme/[demo]/assets/js/scripts.bundle.js and initialized globally in all pages.

File	Description
`scrolltop.js`	Defines `KTLayoutScrolltop` class to handle Scroll To Page Top Button functionality. Scroll the content and refer to the footer.
`chat.js`	Defines `KTLayoutChat` class to handle the Chat Popup behavior.
`demo-panel.js`	Defines `KTLayoutDemoPanel` class to handle the Demo Selection Offcanvas Panel(refer to the right center toolbar).
`examples.js`	Defines `KTLayoutExamples` class to handle the source code preview functionaly accross the demo pages.
`quick-actions.js`	Defines `KTLayoutQuickActions` class to handle the Topbar Quick Actions offcanvas panel.
`quick-cart.js`	Defines `KTLayoutQuickCartPanel` class to handle the Topbar Quick Cart offcanvas panel.
`quick-notifications.js`	Defines `KTLayoutQuickNotifications` class to handle the Topbar Quick Notifications offcanvas panel.
`quick-panel.js`	Defines `KTLayoutQuickPanel` class to handle the Topbar Quick Panel offcanvas panel.
`quick-search.js`	Defines `KTLayoutQuickSearch` class to handle the Topbar Quick Search offcanvas panel.
`quick-user.js`	Defines `KTLayoutQuickUser` class to handle the Topbar Quick User offcanvas panel.
`search.js`	Defines `KTLayoutSearch`, `KTLayoutSearchInline` and `KTLayoutSearchOffcanvas` classes to handle the Ajax Search Results For Topbar Quick Search Dropdown and Inline Panels.

Vendors folder contains 3rd-party plugins global configuration and iinitializion code.

Pages folder contains custom Javascript files used to initialize all the theme demo features and examples. This Javascript code should be used as a reference. In your product create your own javascript files according to your requirements.

Keen compiles Layout,Components and Vendor Javascript files into the main Javascript bundle file that is included in all pages and initialized globally: [keen]/theme/[demo]/dist/assets/js/scripts.bundle.js.
Pages Javascript files are compiled separately into JS folder and used in pages on demand: [keen]/theme/[demo]/dist/assets/js/pages/

Javascript

Layout

Base

Extended

Vendors

Pages

Compilation