First separation commit.
Added LICENSE, README.md, CONTRIBUTORS.md
This commit is contained in:
Erwin de Haan
parent
09513af31b
commit
4678528d00
657 changed files with 422 additions and 0 deletions
127
src/bower_components/emby-webcomponents/alphapicker/alphapicker.js
vendored
Normal file
127
src/bower_components/emby-webcomponents/alphapicker/alphapicker.js
vendored
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
define(["focusManager", "layoutManager", "dom", "css!./style.css", "paper-icon-button-light", "material-icons"], function(focusManager, layoutManager, dom) {
|
||||
"use strict";
|
||||
|
||||
function focus() {
|
||||
var scope = this,
|
||||
selected = scope.querySelector("." + selectedButtonClass);
|
||||
selected ? focusManager.focus(selected) : focusManager.autoFocus(scope, !0)
|
||||
}
|
||||
|
||||
function getAlphaPickerButtonClassName(vertical) {
|
||||
var alphaPickerButtonClassName = "alphaPickerButton";
|
||||
return layoutManager.tv && (alphaPickerButtonClassName += " alphaPickerButton-tv"), vertical && (alphaPickerButtonClassName += " alphaPickerButton-vertical"), alphaPickerButtonClassName
|
||||
}
|
||||
|
||||
function getLetterButton(l, vertical) {
|
||||
return '<button data-value="' + l + '" class="' + getAlphaPickerButtonClassName(vertical) + '">' + l + "</button>"
|
||||
}
|
||||
|
||||
function mapLetters(letters, vertical) {
|
||||
return letters.map(function(l) {
|
||||
return getLetterButton(l, vertical)
|
||||
})
|
||||
}
|
||||
|
||||
function render(element, options) {
|
||||
element.classList.add("alphaPicker"), layoutManager.tv && element.classList.add("alphaPicker-tv");
|
||||
var vertical = element.classList.contains("alphaPicker-vertical");
|
||||
vertical || element.classList.add("focuscontainer-x");
|
||||
var letters, html = "",
|
||||
alphaPickerButtonClassName = getAlphaPickerButtonClassName(vertical),
|
||||
rowClassName = "alphaPickerRow";
|
||||
vertical && (rowClassName += " alphaPickerRow-vertical"), html += '<div class="' + rowClassName + '">', "keyboard" === options.mode ? html += '<button data-value=" " is="paper-icon-button-light" class="' + alphaPickerButtonClassName + '"><i class="md-icon alphaPickerButtonIcon"></i></button>' : (letters = ["#"], html += mapLetters(letters, vertical).join("")), letters = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"], html += mapLetters(letters, vertical).join(""), "keyboard" === options.mode ? (html += '<button data-value="backspace" is="paper-icon-button-light" class="' + alphaPickerButtonClassName + '"><i class="md-icon alphaPickerButtonIcon"></i></button>', html += "</div>", letters = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], html += '<div class="' + rowClassName + '">', html += "<br/>", html += mapLetters(letters, vertical).join(""), html += "</div>") : html += "</div>", element.innerHTML = html, element.classList.add("focusable"), element.focus = focus
|
||||
}
|
||||
|
||||
function AlphaPicker(options) {
|
||||
function onItemFocusTimeout() {
|
||||
itemFocusTimeout = null, self.value(itemFocusValue)
|
||||
}
|
||||
|
||||
function onAlphaFocusTimeout() {
|
||||
if (alphaFocusTimeout = null, document.activeElement === alphaFocusedElement) {
|
||||
var value = alphaFocusedElement.getAttribute("data-value");
|
||||
self.value(value, !0)
|
||||
}
|
||||
}
|
||||
|
||||
function onAlphaPickerInKeyboardModeClick(e) {
|
||||
var alphaPickerButton = dom.parentWithClass(e.target, "alphaPickerButton");
|
||||
if (alphaPickerButton) {
|
||||
var value = alphaPickerButton.getAttribute("data-value");
|
||||
element.dispatchEvent(new CustomEvent("alphavalueclicked", {
|
||||
cancelable: !1,
|
||||
detail: {
|
||||
value: value
|
||||
}
|
||||
}))
|
||||
}
|
||||
}
|
||||
|
||||
function onAlphaPickerClick(e) {
|
||||
var alphaPickerButton = dom.parentWithClass(e.target, "alphaPickerButton");
|
||||
if (alphaPickerButton) {
|
||||
var value = alphaPickerButton.getAttribute("data-value");
|
||||
(this._currentValue || "").toUpperCase() === value.toUpperCase() ? self.value(null, !0) : self.value(value, !0)
|
||||
}
|
||||
}
|
||||
|
||||
function onAlphaPickerFocusIn(e) {
|
||||
alphaFocusTimeout && (clearTimeout(alphaFocusTimeout), alphaFocusTimeout = null);
|
||||
var alphaPickerButton = dom.parentWithClass(e.target, "alphaPickerButton");
|
||||
alphaPickerButton && (alphaFocusedElement = alphaPickerButton, alphaFocusTimeout = setTimeout(onAlphaFocusTimeout, 600))
|
||||
}
|
||||
|
||||
function onItemsFocusIn(e) {
|
||||
var item = dom.parentWithClass(e.target, itemClass);
|
||||
if (item) {
|
||||
var prefix = item.getAttribute("data-prefix");
|
||||
prefix && prefix.length && (itemFocusValue = prefix[0], itemFocusTimeout && clearTimeout(itemFocusTimeout), itemFocusTimeout = setTimeout(onItemFocusTimeout, 100))
|
||||
}
|
||||
}
|
||||
var self = this;
|
||||
this.options = options;
|
||||
var itemFocusValue, itemFocusTimeout, alphaFocusedElement, alphaFocusTimeout, element = options.element,
|
||||
itemsContainer = options.itemsContainer,
|
||||
itemClass = options.itemClass;
|
||||
self.enabled = function(enabled) {
|
||||
enabled ? (itemsContainer && itemsContainer.addEventListener("focus", onItemsFocusIn, !0), "keyboard" === options.mode && element.addEventListener("click", onAlphaPickerInKeyboardModeClick), "click" !== options.valueChangeEvent ? element.addEventListener("focus", onAlphaPickerFocusIn, !0) : element.addEventListener("click", onAlphaPickerClick.bind(this))) : (itemsContainer && itemsContainer.removeEventListener("focus", onItemsFocusIn, !0), element.removeEventListener("click", onAlphaPickerInKeyboardModeClick), element.removeEventListener("focus", onAlphaPickerFocusIn, !0), element.removeEventListener("click", onAlphaPickerClick.bind(this)))
|
||||
}, render(element, options), this.enabled(!0), this.visible(!0)
|
||||
}
|
||||
var selectedButtonClass = "alphaPickerButton-selected";
|
||||
return AlphaPicker.prototype.value = function(value, applyValue) {
|
||||
var btn, selected, element = this.options.element;
|
||||
if (void 0 !== value)
|
||||
if (null != value) {
|
||||
if (value = value.toUpperCase(), this._currentValue = value, "keyboard" !== this.options.mode) {
|
||||
selected = element.querySelector("." + selectedButtonClass);
|
||||
try {
|
||||
btn = element.querySelector(".alphaPickerButton[data-value='" + value + "']")
|
||||
} catch (err) {
|
||||
console.log("Error in querySelector: " + err)
|
||||
}
|
||||
btn && btn !== selected && btn.classList.add(selectedButtonClass), selected && selected !== btn && selected.classList.remove(selectedButtonClass)
|
||||
}
|
||||
} else this._currentValue = value, (selected = element.querySelector("." + selectedButtonClass)) && selected.classList.remove(selectedButtonClass);
|
||||
return applyValue && element.dispatchEvent(new CustomEvent("alphavaluechanged", {
|
||||
cancelable: !1,
|
||||
detail: {
|
||||
value: value
|
||||
}
|
||||
})), this._currentValue
|
||||
}, AlphaPicker.prototype.on = function(name, fn) {
|
||||
this.options.element.addEventListener(name, fn)
|
||||
}, AlphaPicker.prototype.off = function(name, fn) {
|
||||
this.options.element.removeEventListener(name, fn)
|
||||
}, AlphaPicker.prototype.visible = function(visible) {
|
||||
this.options.element.style.visibility = visible ? "visible" : "hidden"
|
||||
}, AlphaPicker.prototype.values = function() {
|
||||
for (var element = this.options.element, elems = element.querySelectorAll(".alphaPickerButton"), values = [], i = 0, length = elems.length; i < length; i++) values.push(elems[i].getAttribute("data-value"));
|
||||
return values
|
||||
}, AlphaPicker.prototype.focus = function() {
|
||||
var element = this.options.element;
|
||||
focusManager.autoFocus(element, !0)
|
||||
}, AlphaPicker.prototype.destroy = function() {
|
||||
var element = this.options.element;
|
||||
this.enabled(!1), element.classList.remove("focuscontainer-x"), this.options = null
|
||||
}, AlphaPicker
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue