not really known
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

86 lines
2.5 KiB

  1. /**
  2. An enhanced popup with built-in scrim and z-index handling. To avoid
  3. obscuring popup contents, scrims require the dialog to be floating;
  4. otherwise, they won't render. Modal popups get a transparent scrim by
  5. default, unless the modal popup isn't floating. To get a translucent scrim
  6. when modal, specify _scrim: true, scrimWhenModal: false_.
  7. */
  8. enyo.kind({
  9. name: "onyx.Popup",
  10. kind: "Popup",
  11. classes: "onyx-popup",
  12. published: {
  13. /**
  14. Determines whether a scrim will appear when the dialog is modal.
  15. Note that modal scrims are transparent, so you won't see them.
  16. */
  17. scrimWhenModal: true,
  18. //* Determines whether or not to display a scrim. Only displays scrims
  19. //* when floating.
  20. scrim: false,
  21. /**
  22. Optional class name to apply to the scrim. Be aware that the scrim
  23. is a singleton and you will be modifying the scrim instance used for
  24. other popups.
  25. */
  26. scrimClassName: ""
  27. },
  28. //* @protected
  29. statics: { count: 0 },
  30. defaultZ: 120,
  31. showingChanged: function() {
  32. if(this.showing) {
  33. onyx.Popup.count++;
  34. this.applyZIndex();
  35. }
  36. else {
  37. if(onyx.Popup.count > 0) {
  38. onyx.Popup.count--;
  39. }
  40. }
  41. this.showHideScrim(this.showing);
  42. this.inherited(arguments);
  43. },
  44. showHideScrim: function(inShow) {
  45. if (this.floating && (this.scrim || (this.modal && this.scrimWhenModal))) {
  46. var scrim = this.getScrim();
  47. if (inShow) {
  48. // move scrim to just under the popup to obscure rest of screen
  49. var i = this.getScrimZIndex();
  50. this._scrimZ = i;
  51. scrim.showAtZIndex(i);
  52. } else {
  53. scrim.hideAtZIndex(this._scrimZ);
  54. }
  55. enyo.call(scrim, "addRemoveClass", [this.scrimClassName, scrim.showing]);
  56. }
  57. },
  58. getScrimZIndex: function() {
  59. // Position scrim directly below popup
  60. return this.findZIndex()-1;
  61. },
  62. getScrim: function() {
  63. // show a transparent scrim for modal popups if scrimWhenModal is true
  64. // if scrim is true, then show a regular scrim.
  65. if (this.modal && this.scrimWhenModal && !this.scrim) {
  66. return onyx.scrimTransparent.make();
  67. }
  68. return onyx.scrim.make();
  69. },
  70. applyZIndex: function() {
  71. // Adjust the zIndex so that popups will properly stack on each other.
  72. this._zIndex = onyx.Popup.count * 2 + this.findZIndex() + 1;
  73. // leave room for scrim
  74. this.applyStyle("z-index", this._zIndex);
  75. },
  76. findZIndex: function() {
  77. // a default z value
  78. var z = this.defaultZ;
  79. if (this._zIndex) {
  80. z = this._zIndex;
  81. } else if (this.hasNode()) {
  82. // Re-use existing zIndex if it has one
  83. z = Number(enyo.dom.getComputedStyleValue(this.node, "z-index")) || z;
  84. }
  85. return (this._zIndex = z);
  86. }
  87. });