diff --git a/src/components/actionSheet/actionSheet.js b/src/components/actionSheet/actionSheet.js
index 0d9f65a31a..95857035e5 100644
--- a/src/components/actionSheet/actionSheet.js
+++ b/src/components/actionSheet/actionSheet.js
@@ -11,362 +11,357 @@ import 'listViewStyle';
function getOffsets(elems) {
- var doc = document;
- var results = [];
+ var doc = document;
+ var results = [];
- if (!doc) {
- return results;
- }
+ if (!doc) {
+ return results;
+ }
- var box;
- var elem;
+ var box;
+ var elem;
- for (var i = 0, length = elems.length; i < length; i++) {
+ for (var i = 0, length = elems.length; i < length; i++) {
- elem = elems[i];
- // Support: BlackBerry 5, iOS 3 (original iPhone)
- // If we don't have gBCR, just use 0,0 rather than error
- if (elem.getBoundingClientRect) {
- box = elem.getBoundingClientRect();
- } else {
- box = { top: 0, left: 0 };
- }
+ elem = elems[i];
+ // Support: BlackBerry 5, iOS 3 (original iPhone)
+ // If we don't have gBCR, just use 0,0 rather than error
+ if (elem.getBoundingClientRect) {
+ box = elem.getBoundingClientRect();
+ } else {
+ box = { top: 0, left: 0 };
+ }
- results[i] = {
- top: box.top,
- left: box.left,
- width: box.width,
- height: box.height
- };
- }
+ results[i] = {
+ top: box.top,
+ left: box.left,
+ width: box.width,
+ height: box.height
+ };
+ }
- return results;
+ return results;
}
function getPosition(options, dlg) {
- var windowSize = dom.getWindowSize();
- var windowHeight = windowSize.innerHeight;
- var windowWidth = windowSize.innerWidth;
+ var windowSize = dom.getWindowSize();
+ var windowHeight = windowSize.innerHeight;
+ var windowWidth = windowSize.innerWidth;
- var pos = getOffsets([options.positionTo])[0];
+ var pos = getOffsets([options.positionTo])[0];
- if (options.positionY !== 'top') {
- pos.top += (pos.height || 0) / 2;
- }
+ if (options.positionY !== 'top') {
+ pos.top += (pos.height || 0) / 2;
+ }
- pos.left += (pos.width || 0) / 2;
+ pos.left += (pos.width || 0) / 2;
- var height = dlg.offsetHeight || 300;
- var width = dlg.offsetWidth || 160;
+ var height = dlg.offsetHeight || 300;
+ var width = dlg.offsetWidth || 160;
- // Account for popup size
- pos.top -= height / 2;
- pos.left -= width / 2;
+ // Account for popup size
+ pos.top -= height / 2;
+ pos.left -= width / 2;
- // Avoid showing too close to the bottom
- var overflowX = pos.left + width - windowWidth;
- var overflowY = pos.top + height - windowHeight;
+ // Avoid showing too close to the bottom
+ var overflowX = pos.left + width - windowWidth;
+ var overflowY = pos.top + height - windowHeight;
- if (overflowX > 0) {
- pos.left -= (overflowX + 20);
- }
- if (overflowY > 0) {
- pos.top -= (overflowY + 20);
- }
+ if (overflowX > 0) {
+ pos.left -= (overflowX + 20);
+ }
+ if (overflowY > 0) {
+ pos.top -= (overflowY + 20);
+ }
- pos.top += (options.offsetTop || 0);
- pos.left += (options.offsetLeft || 0);
+ pos.top += (options.offsetTop || 0);
+ pos.left += (options.offsetLeft || 0);
- // Do some boundary checking
- pos.top = Math.max(pos.top, 10);
- pos.left = Math.max(pos.left, 10);
+ // Do some boundary checking
+ pos.top = Math.max(pos.top, 10);
+ pos.left = Math.max(pos.left, 10);
- return pos;
+ return pos;
}
function centerFocus(elem, horiz, on) {
- require(['scrollHelper'], function (scrollHelper) {
- var fn = on ? 'on' : 'off';
- scrollHelper.centerFocus[fn](elem, horiz);
- });
+ require(['scrollHelper'], function (scrollHelper) {
+ var fn = on ? 'on' : 'off';
+ scrollHelper.centerFocus[fn](elem, horiz);
+ });
}
export function show(options) {
- // items
- // positionTo
- // showCancel
- // title
- var dialogOptions = {
- removeOnClose: true,
- enableHistory: options.enableHistory,
- scrollY: false
- };
-
- var backButton = false;
- var isFullscreen;
-
- if (layoutManager.tv) {
- dialogOptions.size = 'fullscreen';
- isFullscreen = true;
- backButton = true;
- dialogOptions.autoFocus = true;
- } else {
-
- dialogOptions.modal = false;
- dialogOptions.entryAnimation = options.entryAnimation;
- dialogOptions.exitAnimation = options.exitAnimation;
- dialogOptions.entryAnimationDuration = options.entryAnimationDuration || 140;
- dialogOptions.exitAnimationDuration = options.exitAnimationDuration || 100;
- dialogOptions.autoFocus = false;
- }
-
- var dlg = dialogHelper.createDialog(dialogOptions);
-
- if (isFullscreen) {
- dlg.classList.add('actionsheet-fullscreen');
- } else {
- dlg.classList.add('actionsheet-not-fullscreen');
- }
-
- dlg.classList.add('actionSheet');
-
- if (options.dialogClass) {
- dlg.classList.add(options.dialogClass);
- }
-
- var html = '';
-
- var scrollClassName = layoutManager.tv ? 'scrollY smoothScrollY hiddenScrollY' : 'scrollY';
- var style = '';
+ // items
+ // positionTo
+ // showCancel
+ // title
+ var dialogOptions = {
+ removeOnClose: true,
+ enableHistory: options.enableHistory,
+ scrollY: false
+ };
+
+ var backButton = false;
+ var isFullscreen;
+
+ if (layoutManager.tv) {
+ dialogOptions.size = 'fullscreen';
+ isFullscreen = true;
+ backButton = true;
+ dialogOptions.autoFocus = true;
+ } else {
+
+ dialogOptions.modal = false;
+ dialogOptions.entryAnimation = options.entryAnimation;
+ dialogOptions.exitAnimation = options.exitAnimation;
+ dialogOptions.entryAnimationDuration = options.entryAnimationDuration || 140;
+ dialogOptions.exitAnimationDuration = options.exitAnimationDuration || 100;
+ dialogOptions.autoFocus = false;
+ }
+
+ var dlg = dialogHelper.createDialog(dialogOptions);
+
+ if (isFullscreen) {
+ dlg.classList.add('actionsheet-fullscreen');
+ } else {
+ dlg.classList.add('actionsheet-not-fullscreen');
+ }
+
+ dlg.classList.add('actionSheet');
+
+ if (options.dialogClass) {
+ dlg.classList.add(options.dialogClass);
+ }
+
+ var html = '';
+
+ var scrollClassName = layoutManager.tv ? 'scrollY smoothScrollY hiddenScrollY' : 'scrollY';
+ var style = '';
- // Admittedly a hack but right now the scrollbar is being factored into the width which is causing truncation
- if (options.items.length > 20) {
- var minWidth = dom.getWindowSize().innerWidth >= 300 ? 240 : 200;
- style += "min-width:" + minWidth + "px;";
- }
-
- var i;
- var length;
- var option;
- var renderIcon = false;
- var icons = [];
- var itemIcon;
- for (i = 0, length = options.items.length; i < length; i++) {
-
- option = options.items[i];
-
- itemIcon = option.icon || (option.selected ? 'check' : null);
-
- if (itemIcon) {
- renderIcon = true;
- }
- icons.push(itemIcon || '');
- }
-
- if (layoutManager.tv) {
- html += '';
- }
-
- // If any items have an icon, give them all an icon just to make sure they're all lined up evenly
- var center = options.title && (!renderIcon /*|| itemsWithIcons.length != options.items.length*/);
-
- if (center || layoutManager.tv) {
- html += '
';
- } else {
- html += '
';
- }
-
- if (options.title) {
-
- html += '
';
- html += options.title;
- html += '
';
- }
- if (options.text) {
- html += '
';
- html += options.text;
- html += '
';
- }
-
- var scrollerClassName = 'actionSheetScroller';
- if (layoutManager.tv) {
- scrollerClassName += ' actionSheetScroller-tv focuscontainer-x focuscontainer-y';
- }
- html += '
';
-
- var menuItemClass = 'listItem listItem-button actionSheetMenuItem';
-
- if (options.border || options.shaded) {
- menuItemClass += ' listItem-border';
- }
+ // Admittedly a hack but right now the scrollbar is being factored into the width which is causing truncation
+ if (options.items.length > 20) {
+ var minWidth = dom.getWindowSize().innerWidth >= 300 ? 240 : 200;
+ style += "min-width:" + minWidth + "px;";
+ }
+
+ var i;
+ var length;
+ var option;
+ var renderIcon = false;
+ var icons = [];
+ var itemIcon;
+ for (i = 0, length = options.items.length; i < length; i++) {
+
+ option = options.items[i];
+
+ itemIcon = option.icon || (option.selected ? 'check' : null);
+
+ if (itemIcon) {
+ renderIcon = true;
+ }
+ icons.push(itemIcon || '');
+ }
+
+ if (layoutManager.tv) {
+ html += '';
+ }
+
+ // If any items have an icon, give them all an icon just to make sure they're all lined up evenly
+ var center = options.title && (!renderIcon /*|| itemsWithIcons.length != options.items.length*/);
+
+ if (center || layoutManager.tv) {
+ html += '
';
+ } else {
+ html += '
';
+ }
+
+ if (options.title) {
+
+ html += '
';
+ html += options.title;
+ html += '
';
+ }
+ if (options.text) {
+ html += '
';
+ html += options.text;
+ html += '
';
+ }
+
+ var scrollerClassName = 'actionSheetScroller';
+ if (layoutManager.tv) {
+ scrollerClassName += ' actionSheetScroller-tv focuscontainer-x focuscontainer-y';
+ }
+ html += '
';
+
+ var menuItemClass = 'listItem listItem-button actionSheetMenuItem';
+
+ if (options.border || options.shaded) {
+ menuItemClass += ' listItem-border';
+ }
- if (options.menuItemClass) {
- menuItemClass += ' ' + options.menuItemClass;
- }
+ if (options.menuItemClass) {
+ menuItemClass += ' ' + options.menuItemClass;
+ }
- if (layoutManager.tv) {
- menuItemClass += ' listItem-focusscale';
- }
+ if (layoutManager.tv) {
+ menuItemClass += ' listItem-focusscale';
+ }
- if (layoutManager.mobile) {
- menuItemClass += ' actionsheet-xlargeFont';
- }
+ if (layoutManager.mobile) {
+ menuItemClass += ' actionsheet-xlargeFont';
+ }
- for (i = 0, length = options.items.length; i < length; i++) {
+ for (i = 0, length = options.items.length; i < length; i++) {
- option = options.items[i];
+ option = options.items[i];
- if (option.divider) {
+ if (option.divider) {
- html += '';
- continue;
- }
+ html += '';
+ continue;
+ }
- var autoFocus = option.selected && layoutManager.tv ? ' autoFocus' : '';
+ var autoFocus = option.selected && layoutManager.tv ? ' autoFocus' : '';
- // Check for null in case int 0 was passed in
- var optionId = option.id == null || option.id === '' ? option.value : option.id;
- html += '';
+ // Check for null in case int 0 was passed in
+ var optionId = option.id == null || option.id === '' ? option.value : option.id;
+ html += '';
- itemIcon = icons[i];
+ itemIcon = icons[i];
- if (itemIcon) {
+ if (itemIcon) {
- html += '' + itemIcon + '';
- } else if (renderIcon && !center) {
- html += 'check';
- }
+ html += '' + itemIcon + '';
+ } else if (renderIcon && !center) {
+ html += 'check';
+ }
- html += '
';
+ html += '
';
- html += '
';
- html += (option.name || option.textContent || option.innerText);
- html += '
';
+ html += '
';
+ html += (option.name || option.textContent || option.innerText);
+ html += '
';
- if (option.secondaryText) {
- html += '
';
- html += option.secondaryText;
- html += '
';
- }
+ if (option.secondaryText) {
+ html += '
';
+ html += option.secondaryText;
+ html += '
';
+ }
- html += '
';
+ html += '
';
- if (option.asideText) {
- html += '
';
- html += option.asideText;
- html += '
';
- }
+ if (option.asideText) {
+ html += '
';
+ html += option.asideText;
+ html += '
';
+ }
- html += '';
- }
+ html += '';
+ }
- if (options.showCancel) {
- html += '
';
- html += '';
- html += '
';
- }
- html += '
';
+ if (options.showCancel) {
+ html += '
';
+ html += '';
+ html += '
';
+ }
+ html += '
';
- dlg.innerHTML = html;
+ dlg.innerHTML = html;
- if (layoutManager.tv) {
- centerFocus(dlg.querySelector('.actionSheetScroller'), false, true);
- }
+ if (layoutManager.tv) {
+ centerFocus(dlg.querySelector('.actionSheetScroller'), false, true);
+ }
- var btnCloseActionSheet = dlg.querySelector('.btnCloseActionSheet');
- if (btnCloseActionSheet) {
- dlg.querySelector('.btnCloseActionSheet').addEventListener('click', function () {
- dialogHelper.close(dlg);
- });
- }
+ var btnCloseActionSheet = dlg.querySelector('.btnCloseActionSheet');
+ if (btnCloseActionSheet) {
+ dlg.querySelector('.btnCloseActionSheet').addEventListener('click', function () {
+ dialogHelper.close(dlg);
+ });
+ }
- // Seeing an issue in some non-chrome browsers where this is requiring a double click
- //var eventName = browser.firefox ? 'mousedown' : 'click';
- var selectedId;
+ // Seeing an issue in some non-chrome browsers where this is requiring a double click
+ //var eventName = browser.firefox ? 'mousedown' : 'click';
+ var selectedId;
- var timeout;
- if (options.timeout) {
- timeout = setTimeout(function () {
- dialogHelper.close(dlg);
- }, options.timeout);
- }
+ var timeout;
+ if (options.timeout) {
+ timeout = setTimeout(function () {
+ dialogHelper.close(dlg);
+ }, options.timeout);
+ }
- return new Promise(function (resolve, reject) {
+ return new Promise(function (resolve, reject) {
- var isResolved;
+ var isResolved;
- dlg.addEventListener('click', function (e) {
+ dlg.addEventListener('click', function (e) {
- var actionSheetMenuItem = dom.parentWithClass(e.target, 'actionSheetMenuItem');
+ var actionSheetMenuItem = dom.parentWithClass(e.target, 'actionSheetMenuItem');
- if (actionSheetMenuItem) {
- selectedId = actionSheetMenuItem.getAttribute('data-id');
+ if (actionSheetMenuItem) {
+ selectedId = actionSheetMenuItem.getAttribute('data-id');
- if (options.resolveOnClick) {
+ if (options.resolveOnClick) {
- if (options.resolveOnClick.indexOf) {
+ if (options.resolveOnClick.indexOf) {
- if (options.resolveOnClick.indexOf(selectedId) !== -1) {
+ if (options.resolveOnClick.indexOf(selectedId) !== -1) {
- resolve(selectedId);
- isResolved = true;
- }
+ resolve(selectedId);
+ isResolved = true;
+ }
- } else {
- resolve(selectedId);
- isResolved = true;
- }
- }
+ } else {
+ resolve(selectedId);
+ isResolved = true;
+ }
+ }
- dialogHelper.close(dlg);
- }
+ dialogHelper.close(dlg);
+ }
- });
+ });
- dlg.addEventListener('close', function () {
+ dlg.addEventListener('close', function () {
- if (layoutManager.tv) {
- centerFocus(dlg.querySelector('.actionSheetScroller'), false, false);
- }
+ if (layoutManager.tv) {
+ centerFocus(dlg.querySelector('.actionSheetScroller'), false, false);
+ }
- if (timeout) {
- clearTimeout(timeout);
- timeout = null;
- }
+ if (timeout) {
+ clearTimeout(timeout);
+ timeout = null;
+ }
- if (!isResolved) {
- if (selectedId != null) {
- if (options.callback) {
- options.callback(selectedId);
- }
+ if (!isResolved) {
+ if (selectedId != null) {
+ if (options.callback) {
+ options.callback(selectedId);
+ }
- resolve(selectedId);
- } else {
- reject();
- }
- }
- });
+ resolve(selectedId);
+ } else {
+ reject();
+ }
+ }
+ });
- dialogHelper.open(dlg);
+ dialogHelper.open(dlg);
- var pos = options.positionTo && dialogOptions.size !== 'fullscreen' ? getPosition(options, dlg) : null;
+ var pos = options.positionTo && dialogOptions.size !== 'fullscreen' ? getPosition(options, dlg) : null;
- if (pos) {
- dlg.style.position = 'fixed';
- dlg.style.margin = 0;
- dlg.style.left = pos.left + 'px';
- dlg.style.top = pos.top + 'px';
- }
- });
+ if (pos) {
+ dlg.style.position = 'fixed';
+ dlg.style.margin = 0;
+ dlg.style.left = pos.left + 'px';
+ dlg.style.top = pos.top + 'px';
+ }
+ });
}
export default {
- show: show
+ show: show
};
-
-// return {
-// show: show
-// };
-// });