function createPanel() {
// Create panel
$panel = $(panelTemplate())
.draggable({
handle: '.drag_handle',
containment: 'body',
stop: function(ev, ui) {
if (ui.offset.top < 0) {
ui.position.top -= ui.offset.top;
ui.helper.css('top', ui.position.top);
}
if (ui.offset.left < 0) {
ui.position.left -= ui.offset.left;
ui.helper.css('left', ui.position.left);
}
}
});
$panel.find('.close-button').click(function() {
$panel.hide();
});
$panel.find('.refresh-button').click(function() {
if (this.classList.contains('disable')) return;
loadViewerList();
});
var container = $('.chat-room');
$panel.css({
width: container.width(),
height: container.height() - 115
});
container.append($panel);
// Setup resizing
var resizable = new Resizable($panel[0], {
handles: 's, se, e',
threshold: 10,
draggable: false
});
resizable.on('resize', function() {
if (viewList === undefined) return;
$('#bvl-panel .viewer-list').height($('#bvl-panel').height() - 85);
renderViewerList();
});
// Setup filter handler
$('#bvl-panel .filter').keyup(renderViewerList);
// Load viewers
loadViewerList();
}
createPanel() {
// Create panel (Use Twitch jQuery to get Draggable)
const $panel = jQuery(bvlTemplates.panel)
.draggable({
handle: '.drag_handle',
containment: '.app-body',
stop: (ev, ui) => {
if (ui.offset.top < 0) {
ui.helper.css('top', 0);
}
if (ui.offset.left < 0) {
ui.helper.css('left', 0);
}
}
});
$panel.find('.close-button').click(() => $panel.hide());
const self = this;
$panel.find('.refresh-button').click(function() {
if (this.classList.contains('disable')) return;
self.loadViewerList();
});
const $container = $('.ember-chat');
$panel.css({
width: $container.width(),
height: $container.height() - 115
});
$container.prepend($panel);
// Setup resizing
const resizable = new Resizable($panel[0], {
handles: 's, se, e',
threshold: 10,
draggable: false
});
resizable.on('resize', () => {
if (viewList === undefined) return;
$('#bvl-panel .viewer-list').height($('#bvl-panel').height() - 105);
this.renderViewerList();
});
// Setup filter handler
$('#bvl-panel .filter').keyup(this.renderViewerList);
// Load viewers
this.loadViewerList();
}