2019-01-10 15:39:37 +03:00
|
|
|
define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby-button'], function (connectionManager, serverNotifications, events, globalize, EmbyButtonPrototype) {
|
|
|
|
'use strict';
|
2018-10-23 01:05:09 +03:00
|
|
|
|
|
|
|
function addNotificationEvent(instance, name, handler) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
var localHandler = handler.bind(instance);
|
2019-01-10 15:39:37 +03:00
|
|
|
events.on(serverNotifications, name, localHandler);
|
|
|
|
instance[name] = localHandler;
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function removeNotificationEvent(instance, name) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
var handler = instance[name];
|
2019-01-10 15:39:37 +03:00
|
|
|
if (handler) {
|
|
|
|
events.off(serverNotifications, name, handler);
|
|
|
|
instance[name] = null;
|
|
|
|
}
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function showPicker(button, apiClient, itemId, likes, isFavorite) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
return apiClient.updateFavoriteStatus(apiClient.getCurrentUserId(), itemId, !isFavorite);
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function onClick(e) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
var button = this;
|
|
|
|
var id = button.getAttribute('data-id');
|
|
|
|
var serverId = button.getAttribute('data-serverid');
|
|
|
|
var apiClient = connectionManager.getApiClient(serverId);
|
|
|
|
|
|
|
|
var likes = this.getAttribute('data-likes');
|
|
|
|
var isFavorite = this.getAttribute('data-isfavorite') === 'true';
|
|
|
|
if (likes === 'true') {
|
|
|
|
likes = true;
|
|
|
|
}
|
|
|
|
else if (likes === 'false') {
|
|
|
|
likes = false;
|
|
|
|
} else {
|
|
|
|
likes = null;
|
|
|
|
}
|
|
|
|
|
|
|
|
showPicker(button, apiClient, id, likes, isFavorite).then(function (userData) {
|
|
|
|
|
|
|
|
setState(button, userData.Likes, userData.IsFavorite);
|
|
|
|
});
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function onUserDataChanged(e, apiClient, userData) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
var button = this;
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
if (userData.ItemId === button.getAttribute('data-id')) {
|
|
|
|
|
|
|
|
setState(button, userData.Likes, userData.IsFavorite);
|
|
|
|
}
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function setState(button, likes, isFavorite, updateAttribute) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
var icon = button.querySelector('i');
|
|
|
|
|
|
|
|
if (isFavorite) {
|
|
|
|
|
|
|
|
if (icon) {
|
|
|
|
icon.innerHTML = '';
|
|
|
|
icon.classList.add('ratingbutton-icon-withrating');
|
|
|
|
}
|
|
|
|
|
|
|
|
button.classList.add('ratingbutton-withrating');
|
|
|
|
|
|
|
|
} else if (likes) {
|
|
|
|
|
|
|
|
if (icon) {
|
|
|
|
icon.innerHTML = '';
|
|
|
|
icon.classList.remove('ratingbutton-icon-withrating');
|
|
|
|
//icon.innerHTML = '';
|
|
|
|
}
|
|
|
|
button.classList.remove('ratingbutton-withrating');
|
|
|
|
|
|
|
|
} else if (likes === false) {
|
|
|
|
|
|
|
|
if (icon) {
|
|
|
|
icon.innerHTML = '';
|
|
|
|
icon.classList.remove('ratingbutton-icon-withrating');
|
|
|
|
//icon.innerHTML = '';
|
|
|
|
}
|
|
|
|
button.classList.remove('ratingbutton-withrating');
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
if (icon) {
|
|
|
|
icon.innerHTML = '';
|
|
|
|
icon.classList.remove('ratingbutton-icon-withrating');
|
|
|
|
//icon.innerHTML = '';
|
|
|
|
}
|
|
|
|
button.classList.remove('ratingbutton-withrating');
|
|
|
|
}
|
|
|
|
|
|
|
|
if (updateAttribute !== false) {
|
|
|
|
button.setAttribute('data-isfavorite', isFavorite);
|
|
|
|
|
|
|
|
button.setAttribute('data-likes', (likes === null ? '' : likes));
|
|
|
|
}
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function setTitle(button) {
|
2019-02-03 02:41:16 +09:00
|
|
|
button.title = globalize.translate('Favorite');
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
var text = button.querySelector('.button-text');
|
|
|
|
if (text) {
|
|
|
|
text.innerHTML = button.title;
|
|
|
|
}
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function clearEvents(button) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
button.removeEventListener('click', onClick);
|
|
|
|
removeNotificationEvent(button, 'UserDataChanged');
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
function bindEvents(button) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
clearEvents(button);
|
|
|
|
|
|
|
|
button.addEventListener('click', onClick);
|
|
|
|
addNotificationEvent(button, 'UserDataChanged', onUserDataChanged);
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
2019-01-10 15:39:37 +03:00
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
var EmbyRatingButtonPrototype = Object.create(EmbyButtonPrototype);
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
EmbyRatingButtonPrototype.createdCallback = function () {
|
|
|
|
|
|
|
|
// base method
|
|
|
|
if (EmbyButtonPrototype.createdCallback) {
|
|
|
|
EmbyButtonPrototype.createdCallback.call(this);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
EmbyRatingButtonPrototype.attachedCallback = function () {
|
|
|
|
|
|
|
|
// base method
|
|
|
|
if (EmbyButtonPrototype.attachedCallback) {
|
|
|
|
EmbyButtonPrototype.attachedCallback.call(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
var itemId = this.getAttribute('data-id');
|
|
|
|
var serverId = this.getAttribute('data-serverid');
|
2018-10-23 01:05:09 +03:00
|
|
|
if (itemId && serverId) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
var likes = this.getAttribute('data-likes');
|
|
|
|
var isFavorite = this.getAttribute('data-isfavorite') === 'true';
|
|
|
|
if (likes === 'true') {
|
|
|
|
likes = true;
|
|
|
|
}
|
|
|
|
else if (likes === 'false') {
|
|
|
|
likes = false;
|
|
|
|
} else {
|
|
|
|
likes = null;
|
|
|
|
}
|
|
|
|
|
|
|
|
setState(this, likes, isFavorite, false);
|
|
|
|
bindEvents(this);
|
2018-10-23 01:05:09 +03:00
|
|
|
}
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
setTitle(this);
|
|
|
|
};
|
|
|
|
|
|
|
|
EmbyRatingButtonPrototype.detachedCallback = function () {
|
|
|
|
|
|
|
|
// base method
|
|
|
|
if (EmbyButtonPrototype.detachedCallback) {
|
|
|
|
EmbyButtonPrototype.detachedCallback.call(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
clearEvents(this);
|
|
|
|
};
|
|
|
|
|
|
|
|
EmbyRatingButtonPrototype.setItem = function (item) {
|
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
if (item) {
|
2019-01-10 15:39:37 +03:00
|
|
|
|
|
|
|
this.setAttribute('data-id', item.Id);
|
|
|
|
this.setAttribute('data-serverid', item.ServerId);
|
|
|
|
|
2018-10-23 01:05:09 +03:00
|
|
|
var userData = item.UserData || {};
|
2019-01-10 15:39:37 +03:00
|
|
|
setState(this, userData.Likes, userData.IsFavorite);
|
|
|
|
bindEvents(this);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.removeAttribute('data-id');
|
|
|
|
this.removeAttribute('data-serverid');
|
|
|
|
this.removeAttribute('data-likes');
|
|
|
|
this.removeAttribute('data-isfavorite');
|
|
|
|
clearEvents(this);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
document.registerElement('emby-ratingbutton', {
|
2018-10-23 01:05:09 +03:00
|
|
|
prototype: EmbyRatingButtonPrototype,
|
2019-01-10 15:39:37 +03:00
|
|
|
extends: 'button'
|
|
|
|
});
|
2018-10-23 01:05:09 +03:00
|
|
|
});
|