gd-sprest-js
Version:
SharePoint 2013/Online js components.
69 lines (68 loc) • 3.3 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var common_1 = require("./common");
var _1 = require(".");
/**
* Command Button
*/
exports.CommandButton = function (props) {
// Method to get the fabric component
var get = function () { return _button; };
// Set the command button html
props.el.innerHTML = _1.Templates.CommandButton(props);
// Create the command button
var _button = new _1.fabric.CommandButton(props.el.querySelector(".ms-CommandButton"));
// Parse the menu button
var btn = _button._container.querySelector(".ms-CommandButton-button");
if (btn) {
var _html_1 = null;
// Set the click event
btn.addEventListener("click", function (ev) {
// Prevent postback
ev ? ev.preventDefault() : null;
// Ensure the fabric class name exists
if (_button._modalHostView && _button._modalHostView._contextualHost && _button._modalHostView._contextualHost.classList.contains("fabric") == false) {
// Add the class name
_button._modalHostView._contextualHost.classList.add("fabric");
// Set the inner html manually, to remove any events associated with this menu
// The core framework doesn't work well w/ sub-menus.
_html_1 = _html_1 || _button._modalHostView._contextualHost.innerHTML;
_button._modalHostView._contextualHost.innerHTML = _html_1;
}
// See if the menu is hidden
if (_button._contextualMenu && _button._contextualMenu.classList.contains("is-hidden")) {
// Remove the class
_button._contextualMenu.classList.remove("is-hidden");
}
// Ensure the contextual host exists
if (_button._modalHostView && _button._modalHostView._contextualHost) {
// Get the window and menu positions
var windowPos = document.body.getBoundingClientRect();
var menuPos = _button._modalHostView._contextualHost.getBoundingClientRect();
// See if the menu is being rendered below the screen
if (windowPos.height < menuPos.bottom) {
// Scroll the menu into view
_button._modalHostView._contextualHost.scrollIntoView(true);
}
// See if the menu is being rendered past the screen
var diff = menuPos.right - windowPos.right;
if (diff > 0) {
// Update the left position
_button._modalHostView._contextualHost.style.left = (menuPos.left - diff) + "px";
}
// Set the click events
common_1.setClickEvents(_button._modalHostView._contextualHost.querySelector(".ms-ContextualMenu"), props.menu.items, function (ev, item) {
// Close the menu
_button._modalHostView.disposeModal();
});
}
// Else, See if a click event exists
else if (props.onClick) {
// Execute the click event
props.onClick(btn);
}
});
}
// Return the command button
return { get: get };
};