webpack-bootstrap-ui-kit/src/js_old/_components/_ui.header-footer.js

73 lines
1.5 KiB
JavaScript

"use strict";
import $ from "jquery";
import Events from "../_events";
const HeaderUI = (($) => {
const D = document;
const W = window;
const $Body = $("html,body");
const NAME = "HeaderUI";
const CLASSNAME = `js${NAME}`;
class HeaderUI {
static init() {
const ui = this;
ui.dispose();
console.log(`${NAME}: init`);
const $header = $(`#Header,.js${NAME}`);
const updateHeader = () => {
const h = $header.height();
const s = $Body.scrollTop();
if (s + 50 > h) {
$Body.addClass("shrink");
} else {
$Body.removeClass("shrink");
}
};
updateHeader();
const updateFooter = (i, el) => {
const $el = $(el);
const footerHeight = $el.height();
$el.css("height", footerHeight);
$el.css("margin-top", -footerHeight);
$el.siblings(".wrapper").css("padding-bottom", footerHeight);
};
$(".footer,.jsFooterUI").css("height", "auto");
setTimeout(() => {
$(".footer,.jsFooterUI").each(updateFooter);
}, 500);
}
static dispose() {
console.log(`${NAME}: dispose`);
$Body.removeClass("shrink");
$(`#Header,.js${NAME},.footer,.jsFooterUI,.wrapper`).attr("css", "");
}
}
$(W).on(`${Events.AJAX} ${Events.LOADED}`, () => {
HeaderUI.init();
});
// align event content
$(W).on(`${Events.RESIZE}`, () => {
setTimeout(() => {
HeaderUI.init();
}, 200);
});
W.HeaderUI = new HeaderUI();
return HeaderUI;
})($);
export default HeaderUI;