| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770 |
- /**
- * DevExtreme (ui/widget/ui.widget.js)
- * Version: 19.1.16
- * Build date: Tue Oct 18 2022
- *
- * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
- * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
- */
- "use strict";
- var $ = require("../../core/renderer");
- var eventsEngine = require("../../events/core/events_engine");
- var errors = require("./ui.errors");
- var Action = require("../../core/action");
- var extend = require("../../core/utils/extend").extend;
- var inArray = require("../../core/utils/array").inArray;
- var each = require("../../core/utils/iterator").each;
- var commonUtils = require("../../core/utils/common");
- var typeUtils = require("../../core/utils/type");
- var domUtils = require("../../core/utils/dom");
- var domAdapter = require("../../core/dom_adapter");
- var devices = require("../../core/devices");
- var DOMComponent = require("../../core/dom_component");
- var Template = require("./template");
- var TemplateBase = require("./ui.template_base");
- var FunctionTemplate = require("./function_template");
- var EmptyTemplate = require("./empty_template");
- var ChildDefaultTemplate = require("./child_default_template");
- var KeyboardProcessor = require("./ui.keyboard_processor");
- var selectors = require("./selectors");
- var eventUtils = require("../../events/utils");
- var hoverEvents = require("../../events/hover");
- var feedbackEvents = require("../../events/core/emitter.feedback");
- var clickEvent = require("../../events/click");
- var inflector = require("../../core/utils/inflector");
- var UI_FEEDBACK = "UIFeedback";
- var WIDGET_CLASS = "dx-widget";
- var ACTIVE_STATE_CLASS = "dx-state-active";
- var DISABLED_STATE_CLASS = "dx-state-disabled";
- var INVISIBLE_STATE_CLASS = "dx-state-invisible";
- var HOVER_STATE_CLASS = "dx-state-hover";
- var FOCUSED_STATE_CLASS = "dx-state-focused";
- var FEEDBACK_SHOW_TIMEOUT = 30;
- var FEEDBACK_HIDE_TIMEOUT = 400;
- var FOCUS_NAMESPACE = "Focus";
- var ANONYMOUS_TEMPLATE_NAME = "template";
- var TEXT_NODE = 3;
- var TEMPLATE_SELECTOR = "[data-options*='dxTemplate']";
- var TEMPLATE_WRAPPER_CLASS = "dx-template-wrapper";
- var DX_POLYMORPH_WIDGET_TEMPLATE = new FunctionTemplate(function(options) {
- var widgetName = options.model.widget;
- if (widgetName) {
- var widgetElement = $("<div>");
- var widgetOptions = options.model.options || {};
- if ("button" === widgetName || "tabs" === widgetName || "dropDownMenu" === widgetName) {
- var deprecatedName = widgetName;
- widgetName = inflector.camelize("dx-" + widgetName);
- errors.log("W0001", "dxToolbar - 'widget' item field", deprecatedName, "16.1", "Use: '" + widgetName + "' instead")
- }
- if (options.parent) {
- options.parent._createComponent(widgetElement, widgetName, widgetOptions)
- } else {
- widgetElement[widgetName](widgetOptions)
- }
- return widgetElement
- }
- return $()
- });
- var Widget = DOMComponent.inherit({
- _supportedKeys: function() {
- return {}
- },
- _getDefaultOptions: function() {
- return extend(this.callBase(), {
- disabled: false,
- visible: true,
- hint: void 0,
- activeStateEnabled: false,
- onContentReady: null,
- hoverStateEnabled: false,
- focusStateEnabled: false,
- tabIndex: 0,
- accessKey: null,
- onFocusIn: null,
- onFocusOut: null,
- integrationOptions: {
- watchMethod: function(fn, callback, options) {
- options = options || {};
- if (!options.skipImmediate) {
- callback(fn())
- }
- return commonUtils.noop
- },
- templates: {
- "dx-polymorph-widget": DX_POLYMORPH_WIDGET_TEMPLATE
- },
- createTemplate: function(element) {
- return new Template(element)
- }
- },
- _keyboardProcessor: void 0
- })
- },
- _feedbackShowTimeout: FEEDBACK_SHOW_TIMEOUT,
- _feedbackHideTimeout: FEEDBACK_HIDE_TIMEOUT,
- _init: function() {
- this.callBase();
- this._tempTemplates = [];
- this._defaultTemplates = {};
- this._initTemplates();
- this._initContentReadyAction()
- },
- _initTemplates: function() {
- this._extractTemplates();
- this._extractAnonymousTemplate()
- },
- _clearInnerOptionCache: function(optionContainer) {
- this[optionContainer + "Cache"] = {}
- },
- _cacheInnerOptions: function(optionContainer, optionValue) {
- var cacheName = optionContainer + "Cache";
- this[cacheName] = extend(this[cacheName], optionValue)
- },
- _getOptionsFromContainer: function(_ref) {
- var name = _ref.name,
- fullName = _ref.fullName,
- value = _ref.value;
- var options = {};
- if (name === fullName) {
- options = value
- } else {
- var option = fullName.split(".").pop();
- options[option] = value
- }
- return options
- },
- _innerOptionChanged: function(innerWidget, args) {
- var options = this._getOptionsFromContainer(args);
- innerWidget && innerWidget.option(options);
- this._cacheInnerOptions(args.name, options)
- },
- _getInnerOptionsCache: function(optionContainer) {
- return this[optionContainer + "Cache"]
- },
- _initInnerOptionCache: function(optionContainer) {
- this._clearInnerOptionCache(optionContainer);
- this._cacheInnerOptions(optionContainer, this.option(optionContainer))
- },
- _bindInnerWidgetOptions: function(innerWidget, optionsContainer) {
- this._options[optionsContainer] = extend({}, innerWidget.option());
- innerWidget.on("optionChanged", function(e) {
- this._options[optionsContainer] = extend({}, e.component.option())
- }.bind(this))
- },
- _extractTemplates: function() {
- var templateElements = this.$element().contents().filter(TEMPLATE_SELECTOR);
- var templatesMap = {};
- templateElements.each(function(_, template) {
- var templateOptions = domUtils.getElementOptions(template).dxTemplate;
- if (!templateOptions) {
- return
- }
- if (!templateOptions.name) {
- throw errors.Error("E0023")
- }
- $(template).addClass(TEMPLATE_WRAPPER_CLASS).detach();
- templatesMap[templateOptions.name] = templatesMap[templateOptions.name] || [];
- templatesMap[templateOptions.name].push(template)
- });
- each(templatesMap, function(templateName, value) {
- var deviceTemplate = this._findTemplateByDevice(value);
- if (deviceTemplate) {
- this._saveTemplate(templateName, deviceTemplate)
- }
- }.bind(this))
- },
- _saveTemplate: function(name, template) {
- var templates = this.option("integrationOptions.templates");
- templates[name] = this._createTemplate(template)
- },
- _findTemplateByDevice: function(templates) {
- var suitableTemplate = commonUtils.findBestMatches(devices.current(), templates, function(template) {
- return domUtils.getElementOptions(template).dxTemplate
- })[0];
- each(templates, function(index, template) {
- if (template !== suitableTemplate) {
- $(template).remove()
- }
- });
- return suitableTemplate
- },
- _extractAnonymousTemplate: function() {
- var templates = this.option("integrationOptions.templates");
- var anonymousTemplateName = this._getAnonymousTemplateName();
- var $anonymousTemplate = this.$element().contents().detach();
- var $notJunkTemplateContent = $anonymousTemplate.filter(function(_, element) {
- var isTextNode = element.nodeType === TEXT_NODE;
- var isEmptyText = $(element).text().trim().length < 1;
- return !(isTextNode && isEmptyText)
- });
- var onlyJunkTemplateContent = $notJunkTemplateContent.length < 1;
- if (!templates[anonymousTemplateName] && !onlyJunkTemplateContent) {
- templates[anonymousTemplateName] = this._createTemplate($anonymousTemplate)
- }
- },
- _getAriaTarget: function() {
- return this._focusTarget()
- },
- _getAnonymousTemplateName: function() {
- return ANONYMOUS_TEMPLATE_NAME
- },
- _getTemplateByOption: function(optionName) {
- return this._getTemplate(this.option(optionName))
- },
- _getTemplate: function(templateSource) {
- if (typeUtils.isFunction(templateSource)) {
- return new FunctionTemplate(function(options) {
- var templateSourceResult = templateSource.apply(this, this._getNormalizedTemplateArgs(options));
- if (!typeUtils.isDefined(templateSourceResult)) {
- return new EmptyTemplate
- }
- var dispose = false;
- var template = this._acquireTemplate(templateSourceResult, function(templateSource) {
- if (templateSource.nodeType || typeUtils.isRenderer(templateSource) && !$(templateSource).is("script")) {
- return new FunctionTemplate(function() {
- return templateSource
- })
- }
- dispose = true;
- return this._createTemplate(templateSource)
- }.bind(this));
- var result = template.render(options);
- dispose && template.dispose && template.dispose();
- return result
- }.bind(this))
- }
- return this._acquireTemplate(templateSource, this._createTemplateIfNeeded.bind(this))
- },
- _acquireTemplate: function(templateSource, createTemplate) {
- if (null == templateSource) {
- return new EmptyTemplate
- }
- if (templateSource instanceof ChildDefaultTemplate) {
- return this._defaultTemplates[templateSource.name]
- }
- if (templateSource instanceof TemplateBase) {
- return templateSource
- }
- if (typeUtils.isFunction(templateSource.render) && !typeUtils.isRenderer(templateSource)) {
- return this._addOneRenderedCall(templateSource)
- }
- if (templateSource.nodeType || typeUtils.isRenderer(templateSource)) {
- return createTemplate($(templateSource))
- }
- if ("string" === typeof templateSource) {
- var nonIntegrationTemplates = this.option("integrationOptions.skipTemplates") || [];
- var integrationTemplate = null;
- if (nonIntegrationTemplates.indexOf(templateSource) === -1) {
- integrationTemplate = this._renderIntegrationTemplate(templateSource)
- }
- return integrationTemplate || this._defaultTemplates[templateSource] || createTemplate(templateSource)
- }
- return this._acquireTemplate(templateSource.toString(), createTemplate)
- },
- _addOneRenderedCall: function(template) {
- var _render = template.render.bind(template);
- return extend({}, template, {
- render: function(options) {
- var templateResult = _render(options);
- options && options.onRendered && options.onRendered();
- return templateResult
- }
- })
- },
- _renderIntegrationTemplate: function(templateSource) {
- var integrationTemplate = this.option("integrationOptions.templates")[templateSource];
- if (integrationTemplate && !(integrationTemplate instanceof TemplateBase)) {
- var isAsyncTemplate = this.option("templatesRenderAsynchronously");
- if (!isAsyncTemplate) {
- return this._addOneRenderedCall(integrationTemplate)
- }
- }
- return integrationTemplate
- },
- _createTemplateIfNeeded: function(templateSource) {
- var templateKey = function(templateSource) {
- return typeUtils.isRenderer(templateSource) && templateSource[0] || templateSource
- };
- var cachedTemplate = this._tempTemplates.filter(function(t) {
- templateSource = templateKey(templateSource);
- return t.source === templateSource
- })[0];
- if (cachedTemplate) {
- return cachedTemplate.template
- }
- var template = this._createTemplate(templateSource);
- this._tempTemplates.push({
- template: template,
- source: templateKey(templateSource)
- });
- return template
- },
- _createTemplate: function(templateSource) {
- templateSource = "string" === typeof templateSource ? domUtils.normalizeTemplateElement(templateSource) : templateSource;
- return this.option("integrationOptions.createTemplate")(templateSource)
- },
- _getNormalizedTemplateArgs: function(options) {
- var args = [];
- if ("model" in options) {
- args.push(options.model)
- }
- if ("index" in options) {
- args.push(options.index)
- }
- args.push(options.container);
- return args
- },
- _cleanTemplates: function() {
- this._tempTemplates.forEach(function(t) {
- t.template.dispose && t.template.dispose()
- });
- this._tempTemplates = []
- },
- _initContentReadyAction: function() {
- this._contentReadyAction = this._createActionByOption("onContentReady", {
- excludeValidators: ["disabled", "readOnly"]
- })
- },
- _initMarkup: function() {
- this.$element().addClass(WIDGET_CLASS);
- this._toggleDisabledState(this.option("disabled"));
- this._toggleVisibility(this.option("visible"));
- this._renderHint();
- if (this._isFocusable()) {
- this._renderFocusTarget()
- }
- this.callBase()
- },
- _render: function() {
- this.callBase();
- this._renderContent();
- this._renderFocusState();
- this._attachFeedbackEvents();
- this._attachHoverEvents()
- },
- _renderHint: function() {
- var hint = this.option("hint");
- this.$element().attr("title", hint ? hint : null)
- },
- _renderContent: function() {
- var _this = this;
- commonUtils.deferRender(function() {
- if (_this._disposed) {
- return
- }
- return _this._renderContentImpl()
- }).done(function() {
- if (_this._disposed) {
- return
- }
- _this._fireContentReadyAction()
- })
- },
- _renderContentImpl: commonUtils.noop,
- _fireContentReadyAction: commonUtils.deferRenderer(function() {
- this._contentReadyAction()
- }),
- _dispose: function() {
- this._cleanTemplates();
- this._contentReadyAction = null;
- this.callBase()
- },
- _resetActiveState: function() {
- this._toggleActiveState(this._eventBindingTarget(), false)
- },
- _clean: function() {
- this._cleanFocusState();
- this._resetActiveState();
- this.callBase();
- this.$element().empty()
- },
- _toggleVisibility: function(visible) {
- this.$element().toggleClass(INVISIBLE_STATE_CLASS, !visible);
- this.setAria("hidden", !visible || void 0)
- },
- _renderFocusState: function() {
- this._attachKeyboardEvents();
- if (!this._isFocusable()) {
- return
- }
- this._renderFocusTarget();
- this._attachFocusEvents();
- this._renderAccessKey()
- },
- _renderAccessKey: function() {
- var focusTarget = this._focusTarget();
- focusTarget.attr("accesskey", this.option("accessKey"));
- var clickNamespace = eventUtils.addNamespace(clickEvent.name, UI_FEEDBACK);
- eventsEngine.off(focusTarget, clickNamespace);
- this.option("accessKey") && eventsEngine.on(focusTarget, clickNamespace, function(e) {
- if (eventUtils.isFakeClickEvent(e)) {
- e.stopImmediatePropagation();
- this.focus()
- }
- }.bind(this))
- },
- _isFocusable: function() {
- return this.option("focusStateEnabled") && !this.option("disabled")
- },
- _eventBindingTarget: function() {
- return this.$element()
- },
- _focusTarget: function() {
- return this._getActiveElement()
- },
- _getActiveElement: function() {
- var activeElement = this._eventBindingTarget();
- if (this._activeStateUnit) {
- activeElement = activeElement.find(this._activeStateUnit).not("." + DISABLED_STATE_CLASS)
- }
- return activeElement
- },
- _renderFocusTarget: function() {
- this._focusTarget().attr("tabIndex", this.option("tabIndex"))
- },
- _keyboardEventBindingTarget: function() {
- return this._eventBindingTarget()
- },
- _detachFocusEvents: function() {
- var $element = this._focusEventTarget();
- var namespace = this.NAME + FOCUS_NAMESPACE;
- var focusEvents = eventUtils.addNamespace("focusin", namespace);
- focusEvents = focusEvents + " " + eventUtils.addNamespace("focusout", namespace);
- if (domAdapter.hasDocumentProperty("onbeforeactivate")) {
- focusEvents = focusEvents + " " + eventUtils.addNamespace("beforeactivate", namespace)
- }
- eventsEngine.off($element, focusEvents)
- },
- _attachFocusEvents: function() {
- var namespace = this.NAME + FOCUS_NAMESPACE;
- var focusInEvent = eventUtils.addNamespace("focusin", namespace);
- var focusOutEvent = eventUtils.addNamespace("focusout", namespace);
- var $focusTarget = this._focusEventTarget();
- eventsEngine.on($focusTarget, focusInEvent, this._focusInHandler.bind(this));
- eventsEngine.on($focusTarget, focusOutEvent, this._focusOutHandler.bind(this));
- if (domAdapter.hasDocumentProperty("onbeforeactivate")) {
- var beforeActivateEvent = eventUtils.addNamespace("beforeactivate", namespace);
- eventsEngine.on(this._focusEventTarget(), beforeActivateEvent, function(e) {
- if (!$(e.target).is(selectors.focusable)) {
- e.preventDefault()
- }
- })
- }
- },
- _refreshFocusEvent: function() {
- this._detachFocusEvents();
- this._attachFocusEvents()
- },
- _focusEventTarget: function() {
- return this._focusTarget()
- },
- _focusInHandler: function(e) {
- if (e.isDefaultPrevented()) {
- return
- }
- var that = this;
- that._createActionByOption("onFocusIn", {
- beforeExecute: function() {
- that._updateFocusState(e, true)
- },
- excludeValidators: ["readOnly"]
- })({
- event: e
- })
- },
- _focusOutHandler: function(e) {
- if (e.isDefaultPrevented()) {
- return
- }
- var that = this;
- that._createActionByOption("onFocusOut", {
- beforeExecute: function() {
- that._updateFocusState(e, false)
- },
- excludeValidators: ["readOnly", "disabled"]
- })({
- event: e
- })
- },
- _updateFocusState: function(e, isFocused) {
- var target = e.target;
- if (inArray(target, this._focusTarget()) !== -1) {
- this._toggleFocusClass(isFocused, $(target))
- }
- },
- _toggleFocusClass: function(isFocused, $element) {
- var $focusTarget = $element && $element.length ? $element : this._focusTarget();
- $focusTarget.toggleClass(FOCUSED_STATE_CLASS, isFocused)
- },
- _hasFocusClass: function(element) {
- var $focusTarget = $(element || this._focusTarget());
- return $focusTarget.hasClass(FOCUSED_STATE_CLASS)
- },
- _isFocused: function() {
- return this._hasFocusClass()
- },
- _attachKeyboardEvents: function() {
- var processor = this.option("_keyboardProcessor");
- if (processor) {
- this._keyboardProcessor = processor.reinitialize(this._keyboardHandler, this)
- } else {
- if (this.option("focusStateEnabled")) {
- this._disposeKeyboardProcessor();
- this._keyboardProcessor = new KeyboardProcessor({
- element: this._keyboardEventBindingTarget(),
- handler: this._keyboardHandler,
- focusTarget: this._focusTarget(),
- context: this
- })
- }
- }
- },
- _keyboardHandler: function(options) {
- var e = options.originalEvent;
- var keyName = options.keyName;
- var keyCode = options.which;
- var keys = this._supportedKeys(e);
- var func = keys[keyName] || keys[keyCode];
- if (void 0 !== func) {
- var handler = func.bind(this);
- return handler(e) || false
- } else {
- return true
- }
- },
- _refreshFocusState: function() {
- this._cleanFocusState();
- this._renderFocusState()
- },
- _cleanFocusState: function() {
- var $element = this._focusTarget();
- this._detachFocusEvents();
- this._toggleFocusClass(false);
- $element.removeAttr("tabIndex");
- this._disposeKeyboardProcessor()
- },
- _disposeKeyboardProcessor: function() {
- if (this._keyboardProcessor) {
- this._keyboardProcessor.dispose();
- delete this._keyboardProcessor
- }
- },
- _attachHoverEvents: function() {
- var that = this;
- var hoverableSelector = that._activeStateUnit;
- var nameStart = eventUtils.addNamespace(hoverEvents.start, UI_FEEDBACK);
- var nameEnd = eventUtils.addNamespace(hoverEvents.end, UI_FEEDBACK);
- eventsEngine.off(that._eventBindingTarget(), nameStart, hoverableSelector);
- eventsEngine.off(that._eventBindingTarget(), nameEnd, hoverableSelector);
- if (that.option("hoverStateEnabled")) {
- var startAction = new Action(function(args) {
- that._hoverStartHandler(args.event);
- that._refreshHoveredElement($(args.element))
- }, {
- excludeValidators: ["readOnly"]
- });
- var $eventBindingTarget = that._eventBindingTarget();
- eventsEngine.on($eventBindingTarget, nameStart, hoverableSelector, function(e) {
- startAction.execute({
- element: $(e.target),
- event: e
- })
- });
- eventsEngine.on($eventBindingTarget, nameEnd, hoverableSelector, function(e) {
- that._hoverEndHandler(e);
- that._forgetHoveredElement()
- })
- } else {
- that._toggleHoverClass(false)
- }
- },
- _hoverStartHandler: commonUtils.noop,
- _hoverEndHandler: commonUtils.noop,
- _attachFeedbackEvents: function() {
- var that = this;
- var feedbackSelector = that._activeStateUnit;
- var activeEventName = eventUtils.addNamespace(feedbackEvents.active, UI_FEEDBACK);
- var inactiveEventName = eventUtils.addNamespace(feedbackEvents.inactive, UI_FEEDBACK);
- var feedbackAction;
- var feedbackActionDisabled;
- eventsEngine.off(that._eventBindingTarget(), activeEventName, feedbackSelector);
- eventsEngine.off(that._eventBindingTarget(), inactiveEventName, feedbackSelector);
- if (that.option("activeStateEnabled")) {
- var feedbackActionHandler = function(args) {
- var $element = $(args.element);
- var value = args.value;
- var dxEvent = args.event;
- that._toggleActiveState($element, value, dxEvent)
- };
- eventsEngine.on(that._eventBindingTarget(), activeEventName, feedbackSelector, {
- timeout: that._feedbackShowTimeout
- }, function(e) {
- feedbackAction = feedbackAction || new Action(feedbackActionHandler);
- feedbackAction.execute({
- element: $(e.currentTarget),
- value: true,
- event: e
- })
- });
- eventsEngine.on(that._eventBindingTarget(), inactiveEventName, feedbackSelector, {
- timeout: that._feedbackHideTimeout
- }, function(e) {
- feedbackActionDisabled = feedbackActionDisabled || new Action(feedbackActionHandler, {
- excludeValidators: ["disabled", "readOnly"]
- });
- feedbackActionDisabled.execute({
- element: $(e.currentTarget),
- value: false,
- event: e
- })
- })
- }
- },
- _toggleActiveState: function($element, value) {
- this._toggleHoverClass(!value);
- $element.toggleClass(ACTIVE_STATE_CLASS, value)
- },
- _refreshHoveredElement: function(hoveredElement) {
- var selector = this._activeStateUnit || this._eventBindingTarget();
- this._forgetHoveredElement();
- this._hoveredElement = hoveredElement.closest(selector);
- this._toggleHoverClass(true)
- },
- _forgetHoveredElement: function() {
- this._toggleHoverClass(false);
- delete this._hoveredElement
- },
- _toggleHoverClass: function(value) {
- if (this._hoveredElement) {
- this._hoveredElement.toggleClass(HOVER_STATE_CLASS, value && this.option("hoverStateEnabled"))
- }
- },
- _toggleDisabledState: function(value) {
- this.$element().toggleClass(DISABLED_STATE_CLASS, Boolean(value));
- this._toggleHoverClass(!value);
- this.setAria("disabled", value || void 0)
- },
- _setWidgetOption: function(widgetName, args) {
- if (!this[widgetName]) {
- return
- }
- if (typeUtils.isPlainObject(args[0])) {
- each(args[0], function(option, value) {
- this._setWidgetOption(widgetName, [option, value])
- }.bind(this));
- return
- }
- var optionName = args[0];
- var value = args[1];
- if (1 === args.length) {
- value = this.option(optionName)
- }
- var widgetOptionMap = this[widgetName + "OptionMap"];
- this[widgetName].option(widgetOptionMap ? widgetOptionMap(optionName) : optionName, value)
- },
- _optionChanged: function(args) {
- switch (args.name) {
- case "disabled":
- this._toggleDisabledState(args.value);
- this._refreshFocusState();
- break;
- case "hint":
- this._renderHint();
- break;
- case "activeStateEnabled":
- this._attachFeedbackEvents();
- break;
- case "hoverStateEnabled":
- this._attachHoverEvents();
- break;
- case "tabIndex":
- case "_keyboardProcessor":
- case "focusStateEnabled":
- this._refreshFocusState();
- break;
- case "onFocusIn":
- case "onFocusOut":
- break;
- case "accessKey":
- this._renderAccessKey();
- break;
- case "visible":
- var visible = args.value;
- this._toggleVisibility(visible);
- if (this._isVisibilityChangeSupported()) {
- this._checkVisibilityChanged(args.value ? "shown" : "hiding")
- }
- break;
- case "onContentReady":
- this._initContentReadyAction();
- break;
- default:
- this.callBase(args)
- }
- },
- _isVisible: function() {
- return this.callBase() && this.option("visible")
- },
- beginUpdate: function() {
- this._ready(false);
- this.callBase()
- },
- endUpdate: function() {
- this.callBase();
- if (this._initialized) {
- this._ready(true)
- }
- },
- _ready: function(value) {
- if (0 === arguments.length) {
- return this._isReady
- }
- this._isReady = value
- },
- setAria: function() {
- var setAttribute = function(option) {
- var attrName = "role" === option.name || "id" === option.name ? option.name : "aria-" + option.name;
- var attrValue = option.value;
- if (typeUtils.isDefined(attrValue)) {
- attrValue = attrValue.toString()
- } else {
- attrValue = null
- }
- option.target.attr(attrName, attrValue)
- };
- if (!typeUtils.isPlainObject(arguments[0])) {
- setAttribute({
- name: arguments[0],
- value: arguments[1],
- target: arguments[2] || this._getAriaTarget()
- })
- } else {
- var $target = arguments[1] || this._getAriaTarget();
- each(arguments[0], function(key, value) {
- setAttribute({
- name: key,
- value: value,
- target: $target
- })
- })
- }
- },
- isReady: function() {
- return this._ready()
- },
- repaint: function() {
- this._refresh()
- },
- focus: function() {
- eventsEngine.trigger(this._focusTarget(), "focus")
- },
- registerKeyHandler: function(key, handler) {
- var currentKeys = this._supportedKeys();
- var addingKeys = {};
- addingKeys[key] = handler;
- this._supportedKeys = function() {
- return extend(currentKeys, addingKeys)
- }
- }
- });
- module.exports = Widget;
|