mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

update components

Browse source
This commit is contained in:
Luke Pulverenti 2016-05-29 14:42:03 -04:00
parent 4d0cb27c9b
commit 21fbbc894a
16 changed files with 175 additions and 88 deletions
Download patch file Download diff file Expand all files Collapse all files

10
dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css vendored
View file

@ -29,10 +29,16 @@
}
.inputLabel {
display: block;
display: inline-block;
transition: all .25s ease-out;
}
.inputLabelFocused {
.inputLabel.blank {
transform-origin: left top;
transform: scale(1.4,1.4) translateY(80%);
}
.inputLabelFocused:not(.blank) {
color: #52B54B;
}

85
dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js vendored
View file

@ -2,60 +2,57 @@
var EmbyInputPrototype = Object.create(HTMLInputElement.prototype);
function getLabel(input) {
var elem = input.previousSibling;
while (elem && elem.tagName != 'LABEL') {
elem = elem.previousSibling;
}
return elem;
}
function onFocus(e) {
var label = getLabel(this);
if (label) {
label.classList.add('inputLabelFocused');
label.classList.remove('inputLabelUnfocused');
}
}
function onBlur(e) {
var label = getLabel(this);
if (label) {
label.classList.add('inputLabelUnfocused');
label.classList.remove('inputLabelFocused');
}
}
EmbyInputPrototype.createdCallback = function () {
if (!this.id) {
this.id = 'input' + new Date().getTime();
}
this.removeEventListener('focus', onFocus);
this.removeEventListener('blur', onBlur);
this.addEventListener('focus', onFocus);
this.addEventListener('blur', onBlur);
};
EmbyInputPrototype.attachedCallback = function () {
if (this.getAttribute('data-embyinput') != 'true') {
this.setAttribute('data-embyinput', 'true');
var parentNode = this.parentNode;
var label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || '';
label.classList.add('inputLabel');
label.classList.add('inputLabelUnfocused');
label.htmlFor = this.id;
parentNode.insertBefore(label, this);
var div = document.createElement('div');
div.classList.add('emby-input-selectionbar');
parentNode.insertBefore(div, this.nextSibling);
if (this.getAttribute('data-embyinput') == 'true') {
return;
}
this.setAttribute('data-embyinput', 'true');
var parentNode = this.parentNode;
var label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || '';
label.classList.add('inputLabel');
label.classList.add('inputLabelUnfocused');
label.htmlFor = this.id;
parentNode.insertBefore(label, this);
var div = document.createElement('div');
div.classList.add('emby-input-selectionbar');
parentNode.insertBefore(div, this.nextSibling);
function onChange() {
if (this.value) {
label.classList.remove('blank');
} else {
label.classList.add('blank');
}
}
this.addEventListener('focus', function () {
onChange.call(this);
label.classList.add('inputLabelFocused');
label.classList.remove('inputLabelUnfocused');
});
this.addEventListener('blur', function () {
label.classList.add('inputLabelUnfocused');
label.classList.remove('inputLabelFocused');
});
this.addEventListener('change', onChange);
this.addEventListener('keypress', onChange);
this.addEventListener('keyup', onChange);
onChange.call(this);
};
document.registerElement('emby-input', {