| Current Path : /var/www/homesaver/www/bitrix/js/ui/accessrights/src/item/ |
| Current File : /var/www/homesaver/www/bitrix/js/ui/accessrights/src/item/title.js |
import {Dom, Event, Text, Tag} from "main.core";
import {PopupWindowManager} from "main.popup";
import {EventEmitter} from "main.core.events";
import ColumnItemOptions from '../columnitem';
import Base from "./base";
export default class Title extends Base
{
static TYPE = 'title';
constructor(options: ColumnItemOptions)
{
super(options);
this.rightId = options.id;
this.group = options.group;
this.groupHead = options.groupHead;
this.isExpanded = false;
this.node = null;
this.toggleIndicator = null;
}
render(): HTMLElement
{
const node = Tag.render`
<div
class='ui-access-rights-column-item-text ui-access-rights-column-item-title'
data-id='${this.getId()}'
>
${Text.encode(this.text)}
</div>
`;
if (this.groupHead)
{
this.toggleIndicator = Tag.render`
<span class="ui-access-rights-column-item-text-toggle-indicator ui-icon-set --chevron-down"></span>
`;
Dom.prepend(this.toggleIndicator, node);
}
if (this.group)
{
Dom.addClass(node, '--group-children');
}
Event.bind(node, 'mouseenter', this.adjustPopupHelper.bind(this));
Event.bind(node, 'mouseleave', () => {
if (this.popupHelper)
{
this.popupHelper.close();
}
});
Event.bind(node, 'click', this.onGroupToggle.bind(this));
this.node = node;
return node;
}
onGroupToggle(): void
{
EventEmitter.emit('BX.UI.AccessRights.ColumnItem:toggleGroup', {
id: this.rightId,
});
if (!this.node || !this.groupHead)
{
return;
}
if (this.grid.igGroupsExpanded(this.rightId))
{
Dom.removeClass(this.toggleIndicator, '--chevron-down');
Dom.addClass(this.toggleIndicator, '--chevron-up');
}
else
{
Dom.addClass(this.toggleIndicator, '--chevron-down');
Dom.removeClass(this.toggleIndicator, '--chevron-up');
}
}
adjustPopupHelper(): void
{
const set = this.parentContainer.cloneNode(true);
Dom.style(set, 'position', 'absolute');
Dom.style(set, 'display', 'inline');
Dom.style(set, 'visibility', 'hidden');
Dom.style(set, 'height', '0');
Dom.append(set, document.body);
setTimeout(() => {
Dom.remove(set);
});
if (set.offsetWidth > this.parentContainer.offsetWidth)
{
Dom.style(set, 'visibility', 'visible');
this.getPopupHelper().show();
}
}
getPopupHelper(): Popup
{
if (!this.popupHelper)
{
this.popupHelper = PopupWindowManager.create(
null,
this.parentContainer,
{
autoHide: true,
darkMode: true,
content: this.text,
maxWidth: this.parentContainer.offsetWidth,
offsetTop: -9,
offsetLeft: 5,
animation: 'fading-slide'
}
);
}
return this.popupHelper;
}
}