2016-07-17 11:55:07 -07:00
|
|
|
|
define(['itemShortcuts', 'connectionManager', 'layoutManager', 'browser', 'registerElement'], function (itemShortcuts, connectionManager, layoutManager, browser) {
|
2016-07-16 11:02:39 -07:00
|
|
|
|
|
|
|
|
|
var ItemsContainerProtoType = Object.create(HTMLDivElement.prototype);
|
|
|
|
|
|
2016-07-16 14:28:15 -07:00
|
|
|
|
function parentWithAttribute(elem, name) {
|
|
|
|
|
|
|
|
|
|
while (!elem.getAttribute(name)) {
|
|
|
|
|
elem = elem.parentNode;
|
|
|
|
|
|
2016-07-17 19:55:07 -07:00
|
|
|
|
if (!elem || !elem.getAttribute) {
|
2016-07-16 14:28:15 -07:00
|
|
|
|
return null;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return elem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onClick(e) {
|
|
|
|
|
|
2016-07-17 09:59:14 -07:00
|
|
|
|
var itemsContainer = this;
|
2016-07-17 11:55:07 -07:00
|
|
|
|
var target = e.target;
|
2016-07-17 09:59:14 -07:00
|
|
|
|
|
2016-07-17 11:55:07 -07:00
|
|
|
|
itemShortcuts.onClick.call(this, e);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function disableEvent(e) {
|
|
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onContextMenu(e) {
|
|
|
|
|
|
|
|
|
|
var itemsContainer = this;
|
|
|
|
|
|
|
|
|
|
var target = e.target;
|
|
|
|
|
var card = parentWithAttribute(target, 'data-id');
|
|
|
|
|
if (card) {
|
|
|
|
|
|
|
|
|
|
//var itemSelectionPanel = card.querySelector('.itemSelectionPanel');
|
|
|
|
|
|
|
|
|
|
//if (!itemSelectionPanel) {
|
|
|
|
|
// showContextMenu(card, {});
|
|
|
|
|
//}
|
|
|
|
|
|
2016-07-17 13:08:04 -07:00
|
|
|
|
itemShortcuts.showContextMenu(card, {
|
|
|
|
|
identify: false,
|
|
|
|
|
positionTo: target,
|
|
|
|
|
itemsContainer: itemsContainer
|
2016-07-17 11:55:07 -07:00
|
|
|
|
});
|
2016-07-16 14:28:15 -07:00
|
|
|
|
}
|
2016-07-17 11:55:07 -07:00
|
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getShortcutOptions() {
|
|
|
|
|
return {
|
|
|
|
|
click: false
|
|
|
|
|
};
|
2016-07-16 14:28:15 -07:00
|
|
|
|
}
|
|
|
|
|
|
2016-07-17 19:55:07 -07:00
|
|
|
|
ItemsContainerProtoType.enableHoverMenu = function (enabled) {
|
|
|
|
|
|
|
|
|
|
var current = this.hoverMenu;
|
|
|
|
|
|
|
|
|
|
if (!enabled && current) {
|
|
|
|
|
current.destroy();
|
|
|
|
|
this.hoverMenu = null;
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (current) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var self = this;
|
|
|
|
|
require(['itemHoverMenu'], function (ItemHoverMenu) {
|
|
|
|
|
self.hoverMenu = new ItemHoverMenu(self);
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
2016-07-16 11:02:39 -07:00
|
|
|
|
ItemsContainerProtoType.attachedCallback = function () {
|
2016-07-16 14:28:15 -07:00
|
|
|
|
this.addEventListener('click', onClick);
|
2016-07-17 11:55:07 -07:00
|
|
|
|
|
|
|
|
|
// mobile safari doesn't allow contextmenu override
|
|
|
|
|
if (browser.safari && browser.mobile) {
|
|
|
|
|
this.addEventListener('contextmenu', disableEvent);
|
|
|
|
|
// todo: use tap hold
|
|
|
|
|
} else {
|
|
|
|
|
this.addEventListener('contextmenu', onContextMenu);
|
|
|
|
|
}
|
|
|
|
|
|
2016-07-17 19:55:07 -07:00
|
|
|
|
if (layoutManager.desktop) {
|
|
|
|
|
this.enableHoverMenu(true);
|
|
|
|
|
}
|
|
|
|
|
|
2016-07-17 11:55:07 -07:00
|
|
|
|
itemShortcuts.on(this, getShortcutOptions());
|
2016-07-16 11:02:39 -07:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
ItemsContainerProtoType.detachedCallback = function () {
|
2016-07-16 14:28:15 -07:00
|
|
|
|
this.removeEventListener('click', onClick);
|
2016-07-17 11:55:07 -07:00
|
|
|
|
this.removeEventListener('contextmenu', onContextMenu);
|
|
|
|
|
this.removeEventListener('contextmenu', disableEvent);
|
|
|
|
|
itemShortcuts.off(this, getShortcutOptions());
|
2016-07-16 11:02:39 -07:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
document.registerElement('emby-itemscontainer', {
|
|
|
|
|
prototype: ItemsContainerProtoType,
|
|
|
|
|
extends: 'div'
|
|
|
|
|
});
|
|
|
|
|
});
|