: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
self.bodyClasses = new ClassList(function () {
if (self.state.get('rendered')) {
self.getEl('body').className = this.toString();
self.bodyClasses.prefix = self.classPrefix;
self.classes.add('container');
self.bodyClasses.add('container-body');
if (settings.containerCls) {
self.classes.add(settings.containerCls);
self._layout = global$4.create((settings.layout || '') + 'layout');
if (self.settings.items) {
self.add(self.settings.items);
find: function (selector) {
selector = selectorCache[selector] = selectorCache[selector] || new Selector(selector);
return selector.find(this);
self.items().add(self.create(items)).parent(self);
focus: function (keyboard) {
var focusCtrl, keyboardNav, items;
keyboardNav = self.keyboardNav || self.parents().eq(-1)[0].keyboardNav;
keyboardNav.focusFirst(self);
items.add(self.statusbar.items());
items.each(function (ctrl) {
if (ctrl.settings.autofocus) {
focusCtrl = focusCtrl || ctrl;
replace: function (oldItem, newItem) {
var items = this.items();
if (items[i] === oldItem) {
ctrlElm = newItem.getEl();
ctrlElm.parentNode.removeChild(ctrlElm);
ctrlElm = oldItem.getEl();
ctrlElm.parentNode.removeChild(ctrlElm);
create: function (items) {
if (!global$2.isArray(items)) {
global$2.each(items, function (item) {
if (!(item instanceof Control$1)) {
if (typeof item === 'string') {
settings = global$2.extend({}, self.settings.defaults, item);
item.type = settings.type = settings.type || item.type || self.settings.defaultType || (settings.defaults ? settings.defaults.type : null);
item = global$4.create(settings);
self.items().each(function (ctrl, index) {
if (!ctrl.state.get('rendered')) {
containerElm = self.getEl('body');
if (containerElm.hasChildNodes() && index <= containerElm.childNodes.length - 1) {
global$9(containerElm.childNodes[index]).before(ctrl.renderHtml());
global$9(containerElm).append(ctrl.renderHtml());
self._layout.applyClasses(self.items().filter(':visible'));
append: function (items) {
return this.add(items).renderNew();
prepend: function (items) {
self.items().set(self.create(items).concat(self.items().toArray()));
insert: function (items, index, before) {
var curItems, beforeItems, afterItems;
items = self.create(items);
if (!before && index < curItems.length - 1) {
if (index >= 0 && index < curItems.length) {
beforeItems = curItems.slice(0, index).toArray();
afterItems = curItems.slice(index).toArray();
curItems.set(beforeItems.concat(items, afterItems));
fromJSON: function (data) {
self.find('#' + name).value(data[name]);
var self = this, data = {};
self.find('*').each(function (ctrl) {
var name = ctrl.name(), value = ctrl.value();
if (name && typeof value !== 'undefined') {
renderHtml: function () {
var self = this, layout = self._layout, role = this.settings.role;
return '<div id="' + self._id + '" class="' + self.classes + '"' + (role ? ' role="' + this.settings.role + '"' : '') + '>' + '<div id="' + self._id + '-body" class="' + self.bodyClasses + '">' + (self.settings.html || '') + layout.renderHtml(self) + '</div>' + '</div>';
postRender: function () {
self.items().exec('postRender');
self._layout.postRender(self);
self.state.set('rendered', true);
if (self.settings.style) {
self.$el.css(self.settings.style);
if (self.settings.border) {
'border-top-width': box.top,
'border-right-width': box.right,
'border-bottom-width': box.bottom,
'border-left-width': box.left
self.keyboardNav = KeyboardNavigation({ root: self });
initLayoutRect: function () {
var self = this, layoutRect = self._super();
self._layout.recalc(self);
var rect = self._layoutRect;
var lastRect = self._lastRect;
if (!lastRect || lastRect.w !== rect.w || lastRect.h !== rect.h) {
self._layout.recalc(self);
rect = self.layoutRect();
ReflowQueue.remove(this);
Control$1.repaintControls = [];
Control$1.repaintControls.map = {};
i = Control$1.repaintControls.length;
Control$1.repaintControls[i].repaint();
if (this.settings.layout !== 'flow' && this.settings.layout !== 'stack') {
Control$1.repaintControls = [];
function getDocumentSize(doc) {
var documentElement, body, scrollWidth, clientWidth;
var offsetWidth, scrollHeight, clientHeight, offsetHeight;
documentElement = doc.documentElement;
scrollWidth = max(documentElement.scrollWidth, body.scrollWidth);
clientWidth = max(documentElement.clientWidth, body.clientWidth);
offsetWidth = max(documentElement.offsetWidth, body.offsetWidth);
scrollHeight = max(documentElement.scrollHeight, body.scrollHeight);
clientHeight = max(documentElement.clientHeight, body.clientHeight);
offsetHeight = max(documentElement.offsetHeight, body.offsetHeight);
width: scrollWidth < offsetWidth ? clientWidth : scrollWidth,
height: scrollHeight < offsetHeight ? clientHeight : scrollHeight
function updateWithTouchData(e) {
keys = 'screenX screenY pageX pageY clientX clientY'.split(' ');
for (i = 0; i < keys.length; i++) {
e[keys[i]] = e.changedTouches[0][keys[i]];
function DragHelper (id, settings) {
var doc = settings.document || domGlobals.document;
var start, stop, drag, startX, startY;
settings = settings || {};
var handleElement = doc.getElementById(settings.handle || id);
var docSize = getDocumentSize(doc);
handleElm = handleElement;
if (domGlobals.window.getComputedStyle) {
cursor = domGlobals.window.getComputedStyle(handleElm, null).getPropertyValue('cursor');
cursor = handleElm.runtimeStyle.cursor;
$eventOverlay = global$9('<div></div>').css({
global$9(doc).on('mousemove touchmove', drag).on('mouseup touchend', stop);
if (e.button !== downButton) {
e.deltaX = e.screenX - startX;
e.deltaY = e.screenY - startY;
global$9(doc).off('mousemove touchmove', drag).off('mouseup touchend', stop);
this.destroy = function () {
global$9(handleElement).off();
global$9(handleElement).on('mousedown touchstart', start);
self.on('repaint', self.renderScroll);
renderScroll: function () {
var self = this, margin = 2;
function repaintScroll() {
var hasScrollH, hasScrollV, bodyElm;
function repaintAxis(axisName, posName, sizeName, contentSizeName, hasScroll, ax) {
var containerElm, scrollBarElm, scrollThumbElm;
var containerSize, scrollSize, ratio, rect;
var posNameLower, sizeNameLower;
scrollBarElm = self.getEl('scroll' + axisName);
posNameLower = posName.toLowerCase();
sizeNameLower = sizeName.toLowerCase();
global$9(self.getEl('absend')).css(posNameLower, self.layoutRect()[contentSizeName] - 1);
global$9(scrollBarElm).css('display', 'none');
global$9(scrollBarElm).css('display', 'block');
containerElm = self.getEl('body');
scrollThumbElm = self.getEl('scroll' + axisName + 't');
containerSize = containerElm['client' + sizeName] - margin * 2;
containerSize -= hasScrollH && hasScrollV ? scrollBarElm['client' + ax] : 0;
scrollSize = containerElm['scroll' + sizeName];
ratio = containerSize / scrollSize;
rect[posNameLower] = containerElm['offset' + posName] + margin;
rect[sizeNameLower] = containerSize;
global$9(scrollBarElm).css(rect);
rect[posNameLower] = containerElm['scroll' + posName] * ratio;
rect[sizeNameLower] = containerSize * ratio;
global$9(scrollThumbElm).css(rect);
bodyElm = self.getEl('body');
hasScrollH = bodyElm.scrollWidth > bodyElm.clientWidth;
hasScrollV = bodyElm.scrollHeight > bodyElm.clientHeight;
repaintAxis('h', 'Left', 'Width', 'contentW', hasScrollH, 'Height');
repaintAxis('v', 'Top', 'Height', 'contentH', hasScrollV, 'Width');
function addScrollAxis(axisName, posName, sizeName, deltaPosName, ax) {
var axisId = self._id + '-scroll' + axisName, prefix = self.classPrefix;
global$9(self.getEl()).append('<div id="' + axisId + '" class="' + prefix + 'scrollbar ' + prefix + 'scrollbar-' + axisName + '">' + '<div id="' + axisId + 't" class="' + prefix + 'scrollbar-thumb"></div>' + '</div>');
self.draghelper = new DragHelper(axisId + 't', {
scrollStart = self.getEl('body')['scroll' + posName];
global$9('#' + axisId).addClass(prefix + 'active');
var ratio, hasScrollH, hasScrollV, containerSize;
var layoutRect = self.layoutRect();
hasScrollH = layoutRect.contentW > layoutRect.innerW;
hasScrollV = layoutRect.contentH > layoutRect.innerH;
containerSize = self.getEl('body')['client' + sizeName] - margin * 2;
containerSize -= hasScrollH && hasScrollV ? self.getEl('scroll' + axisName)['client' + ax] : 0;
ratio = containerSize / self.getEl('body')['scroll' + sizeName];
self.getEl('body')['scroll' + posName] = scrollStart + e['delta' + deltaPosName] / ratio;
global$9('#' + axisId).removeClass(prefix + 'active');
self.classes.add('scroll');
addScrollAxis('v', 'Top', 'Height', 'Y', 'Width');
addScrollAxis('h', 'Left', 'Width', 'X', 'Height');
if (self.settings.autoScroll) {
self.on('wheel', function (e) {
var bodyEl = self.getEl('body');
bodyEl.scrollLeft += (e.deltaX || 0) * 10;
bodyEl.scrollTop += e.deltaY * 10;
global$9(self.getEl('body')).on('scroll', repaintScroll);
var Panel = Container.extend({
renderHtml: function () {
var layout = self._layout;
var innerHtml = self.settings.html;
if (typeof innerHtml === 'undefined') {
innerHtml = '<div id="' + self._id + '-body" class="' + self.bodyClasses + '">' + layout.renderHtml(self) + '</div>';
if (typeof innerHtml === 'function') {
innerHtml = innerHtml.call(self);
return '<div id="' + self._id + '" class="' + self.classes + '" hidefocus="1" tabindex="-1" role="group">' + (self._preBodyHtml || '') + innerHtml + '</div>';
resizeToContent: function () {
this._layoutRect.autoResize = true;
resizeTo: function (w, h) {
var rect = funcs.getWindowSize();
w = w <= 1 ? w * rect.w : w;
h = h <= 1 ? h * rect.h : h;
this._layoutRect.autoResize = false;
resizeBy: function (dw, dh) {
var self = this, rect = self.layoutRect();
return self.resizeTo(rect.w + dw, rect.h + dh);
var documentClickHandler, documentScrollHandler, windowResizeHandler;
function isChildOf(ctrl, parent) {
function skipOrHidePanels(e) {
var i = visiblePanels.length;
var panel = visiblePanels[i], clickCtrl = panel.getParentCtrl(e.target);
if (panel.settings.autohide) {
if (isChildOf(clickCtrl, panel) || panel.parent() === clickCtrl) {
e = panel.fire('autohide', { target: e.target });
if (!e.isDefaultPrevented()) {
function bindDocumentClickHandler() {
if (!documentClickHandler) {
documentClickHandler = function (e) {
global$9(domGlobals.document).on('click touchstart', documentClickHandler);