mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
First separation commit.
Added LICENSE, README.md, CONTRIBUTORS.md
This commit is contained in:
parent
09513af31b
commit
4678528d00
657 changed files with 422 additions and 0 deletions
118
src/bower_components/emby-webcomponents/emby-select/emby-select.css
vendored
Normal file
118
src/bower_components/emby-webcomponents/emby-select/emby-select.css
vendored
Normal file
|
@ -0,0 +1,118 @@
|
|||
.emby-select {
|
||||
display: block;
|
||||
margin: 0;
|
||||
margin-bottom: 0 !important;
|
||||
font-size: 110%;
|
||||
font-family: inherit;
|
||||
font-weight: inherit;
|
||||
padding: .5em 1.9em .5em .5em;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
outline: 0 !important;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.emby-select[disabled] {
|
||||
background: 0 0 !important;
|
||||
border-color: transparent !important;
|
||||
color: inherit !important;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none
|
||||
}
|
||||
|
||||
.selectContainer-inline>.emby-select {
|
||||
padding: .3em 1.9em .3em .5em;
|
||||
font-size: inherit
|
||||
}
|
||||
|
||||
.selectContainer-inline>.emby-select[disabled] {
|
||||
padding-left: 0;
|
||||
padding-right: 0
|
||||
}
|
||||
|
||||
.emby-select::-moz-focus-inner {
|
||||
border: 0
|
||||
}
|
||||
|
||||
.emby-select-focusscale {
|
||||
-webkit-transition: -webkit-transform 180ms ease-out !important;
|
||||
-o-transition: transform 180ms ease-out !important;
|
||||
transition: transform 180ms ease-out !important;
|
||||
-webkit-transform-origin: center center;
|
||||
transform-origin: center center
|
||||
}
|
||||
|
||||
.emby-select-focusscale:focus {
|
||||
-webkit-transform: scale(1.04);
|
||||
transform: scale(1.04);
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.emby-select+.fieldDescription {
|
||||
margin-top: .25em
|
||||
}
|
||||
|
||||
.selectContainer {
|
||||
margin-bottom: 1.8em;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.selectContainer-inline {
|
||||
display: -webkit-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
margin-bottom: 0;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.selectLabel {
|
||||
display: block;
|
||||
margin-bottom: .25em
|
||||
}
|
||||
|
||||
.selectContainer-inline>.selectLabel {
|
||||
margin-bottom: 0;
|
||||
margin-right: .5em;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
.emby-select-withcolor {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
-webkit-border-radius: .2em;
|
||||
border-radius: .2em
|
||||
}
|
||||
|
||||
.selectArrowContainer {
|
||||
position: absolute;
|
||||
right: .3em;
|
||||
top: .2em;
|
||||
color: inherit;
|
||||
pointer-events: none
|
||||
}
|
||||
|
||||
.selectContainer-inline>.selectArrowContainer {
|
||||
top: initial;
|
||||
bottom: .24em;
|
||||
font-size: 90%
|
||||
}
|
||||
|
||||
.emby-select[disabled]+.selectArrowContainer {
|
||||
display: none
|
||||
}
|
||||
|
||||
.selectArrow {
|
||||
margin-top: .35em;
|
||||
font-size: 1.7em
|
||||
}
|
||||
|
||||
.emby-select-iconbutton {
|
||||
-webkit-align-self: flex-end;
|
||||
align-self: flex-end
|
||||
}
|
75
src/bower_components/emby-webcomponents/emby-select/emby-select.js
vendored
Normal file
75
src/bower_components/emby-webcomponents/emby-select/emby-select.js
vendored
Normal file
|
@ -0,0 +1,75 @@
|
|||
define(["layoutManager", "browser", "actionsheet", "css!./emby-select", "registerElement"], function(layoutManager, browser, actionsheet) {
|
||||
"use strict";
|
||||
|
||||
function enableNativeMenu() {
|
||||
return !(!browser.edgeUwp && !browser.xboxOne) || !(browser.tizen || browser.orsay || browser.web0s) && (!!browser.tv || !layoutManager.tv)
|
||||
}
|
||||
|
||||
function triggerChange(select) {
|
||||
var evt = document.createEvent("HTMLEvents");
|
||||
evt.initEvent("change", !1, !0), select.dispatchEvent(evt)
|
||||
}
|
||||
|
||||
function setValue(select, value) {
|
||||
select.value = value
|
||||
}
|
||||
|
||||
function showActionSheet(select) {
|
||||
var labelElem = getLabel(select),
|
||||
title = labelElem ? labelElem.textContent || labelElem.innerText : null;
|
||||
actionsheet.show({
|
||||
items: select.options,
|
||||
positionTo: select,
|
||||
title: title
|
||||
}).then(function(value) {
|
||||
setValue(select, value), triggerChange(select)
|
||||
})
|
||||
}
|
||||
|
||||
function getLabel(select) {
|
||||
for (var elem = select.previousSibling; elem && "LABEL" !== elem.tagName;) elem = elem.previousSibling;
|
||||
return elem
|
||||
}
|
||||
|
||||
function onFocus(e) {
|
||||
var label = getLabel(this);
|
||||
label && label.classList.add("selectLabelFocused")
|
||||
}
|
||||
|
||||
function onBlur(e) {
|
||||
var label = getLabel(this);
|
||||
label && label.classList.remove("selectLabelFocused")
|
||||
}
|
||||
|
||||
function onMouseDown(e) {
|
||||
e.button || enableNativeMenu() || (e.preventDefault(), showActionSheet(this))
|
||||
}
|
||||
|
||||
function onKeyDown(e) {
|
||||
switch (e.keyCode) {
|
||||
case 13:
|
||||
return void(enableNativeMenu() || (e.preventDefault(), showActionSheet(this)));
|
||||
case 37:
|
||||
case 38:
|
||||
case 39:
|
||||
case 40:
|
||||
return void(layoutManager.tv && e.preventDefault())
|
||||
}
|
||||
}
|
||||
var EmbySelectPrototype = Object.create(HTMLSelectElement.prototype),
|
||||
inputId = 0;
|
||||
EmbySelectPrototype.createdCallback = function() {
|
||||
this.id || (this.id = "embyselect" + inputId, inputId++), browser.firefox || (this.classList.add("emby-select-withcolor"), layoutManager.tv && this.classList.add("emby-select-tv-withcolor")), layoutManager.tv && this.classList.add("emby-select-focusscale"), this.addEventListener("mousedown", onMouseDown), this.addEventListener("keydown", onKeyDown), this.addEventListener("focus", onFocus), this.addEventListener("blur", onBlur)
|
||||
}, EmbySelectPrototype.attachedCallback = function() {
|
||||
if (!this.classList.contains("emby-select")) {
|
||||
this.classList.add("emby-select");
|
||||
var label = this.ownerDocument.createElement("label");
|
||||
label.innerHTML = this.getAttribute("label") || "", label.classList.add("selectLabel"), label.htmlFor = this.id, this.parentNode.insertBefore(label, this), this.classList.contains("emby-select-withcolor") && this.parentNode.insertAdjacentHTML("beforeend", '<div class="selectArrowContainer"><div style="visibility:hidden;">0</div><i class="selectArrow md-icon"></i></div>')
|
||||
}
|
||||
}, EmbySelectPrototype.setLabel = function(text) {
|
||||
this.parentNode.querySelector("label").innerHTML = text
|
||||
}, document.registerElement("emby-select", {
|
||||
prototype: EmbySelectPrototype,
|
||||
extends: "select"
|
||||
})
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue