1
0
Fork 0
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:
Erwin de Haan 2019-01-09 12:36:54 +01:00
parent 09513af31b
commit 4678528d00
657 changed files with 422 additions and 0 deletions

View file

@ -0,0 +1,161 @@
.emby-checkbox-label {
position: relative;
z-index: 1;
vertical-align: middle;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
margin: 0;
padding: 0 0 0 2.4em;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
height: 2.35em;
cursor: pointer
}
.checkboxContainer,
.checkboxListContainer {
margin-bottom: 1.8em
}
.checkboxFieldDescription {
padding-left: 2.4em
}
.checkboxContainer {
display: -webkit-box;
display: -webkit-flex;
display: flex
}
.checkboxContainer-withDescription {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
flex-direction: column
}
.emby-checkbox {
position: absolute;
width: 1px;
height: 1px;
margin: 0;
padding: 0;
opacity: 0;
-ms-appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
border: none
}
.checkboxOutline {
position: absolute;
top: 3px;
left: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 1.83em;
height: 1.83em;
margin: 0;
overflow: hidden;
border: 2px solid currentcolor;
-webkit-border-radius: .14em;
border-radius: .14em;
z-index: 2;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center
}
.emby-checkbox-focushelper {
position: absolute;
top: -.915em;
left: -.915em;
width: 3.66em;
height: 3.66em;
display: inline-block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 3px 0 0;
-webkit-border-radius: 50%;
border-radius: 50%;
background-color: transparent
}
.checkboxIcon {
font-size: 1.6em;
color: #fff
}
.checkboxIcon-checked {
display: none
}
.emby-checkbox:checked+span+span+.checkboxOutline>.checkboxIcon-checked {
display: -webkit-box !important;
display: -webkit-flex !important;
display: flex !important
}
.emby-checkbox:checked+span+span+.checkboxOutline>.checkboxIcon-unchecked {
display: none !important
}
.emby-checkbox:checked[disabled]+span+span+.checkboxOutline>.checkboxIcon {
background-color: rgba(0, 0, 0, .26)
}
.checkboxLabel {
position: relative;
margin: 0
}
.checkboxList>.emby-checkbox-label {
display: -webkit-box;
display: -webkit-flex;
display: flex;
margin: .5em 0
}
.checkboxList-verticalwrap {
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap
}
.checkboxList-verticalwrap>.emby-checkbox-label {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: inline-flex;
margin: .3em 0;
width: 12em
}
.checkboxList-paperList {
padding: 1em !important
}
.checkboxListLabel {
margin-bottom: .25em
}
@-webkit-keyframes repaintChrome {
from,
to {
padding: 0
}
}

View file

@ -0,0 +1,55 @@
define(["browser", "dom", "css!./emby-checkbox", "registerElement"], function(browser, dom) {
"use strict";
function onKeyDown(e) {
if (13 === e.keyCode) return e.preventDefault(), this.checked = !this.checked, this.dispatchEvent(new CustomEvent("change", {
bubbles: !0
})), !1
}
function forceRefresh(loading) {
var elem = this.parentNode;
elem.style.webkitAnimationName = "repaintChrome", elem.style.webkitAnimationDelay = !0 === loading ? "500ms" : "", elem.style.webkitAnimationDuration = "10ms", elem.style.webkitAnimationIterationCount = "1", setTimeout(function() {
elem.style.webkitAnimationName = ""
}, !0 === loading ? 520 : 20)
}
var EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype),
enableRefreshHack = !!(browser.tizen || browser.orsay || browser.operaTv || browser.web0s);
EmbyCheckboxPrototype.attachedCallback = function() {
if ("true" !== this.getAttribute("data-embycheckbox")) {
this.setAttribute("data-embycheckbox", "true"), this.classList.add("emby-checkbox");
var labelElement = this.parentNode;
labelElement.classList.add("emby-checkbox-label");
var labelTextElement = labelElement.querySelector("span"),
outlineClass = "checkboxOutline",
customClass = this.getAttribute("data-outlineclass");
customClass && (outlineClass += " " + customClass);
var checkedIcon = this.getAttribute("data-checkedicon") || "",
uncheckedIcon = this.getAttribute("data-uncheckedicon") || "",
checkHtml = '<i class="md-icon checkboxIcon checkboxIcon-checked">' + checkedIcon + "</i>",
uncheckedHtml = '<i class="md-icon checkboxIcon checkboxIcon-unchecked">' + uncheckedIcon + "</i>";
labelElement.insertAdjacentHTML("beforeend", '<span class="emby-checkbox-focushelper"></span><span class="' + outlineClass + '">' + checkHtml + uncheckedHtml + "</span>"), labelTextElement.classList.add("checkboxLabel"), this.addEventListener("keydown", onKeyDown), enableRefreshHack && (forceRefresh.call(this, !0), dom.addEventListener(this, "click", forceRefresh, {
passive: !0
}), dom.addEventListener(this, "blur", forceRefresh, {
passive: !0
}), dom.addEventListener(this, "focus", forceRefresh, {
passive: !0
}), dom.addEventListener(this, "change", forceRefresh, {
passive: !0
}))
}
}, EmbyCheckboxPrototype.detachedCallback = function() {
this.removeEventListener("keydown", onKeyDown), dom.removeEventListener(this, "click", forceRefresh, {
passive: !0
}), dom.removeEventListener(this, "blur", forceRefresh, {
passive: !0
}), dom.removeEventListener(this, "focus", forceRefresh, {
passive: !0
}), dom.removeEventListener(this, "change", forceRefresh, {
passive: !0
})
}, document.registerElement("emby-checkbox", {
prototype: EmbyCheckboxPrototype,
extends: "input"
})
});