splitbutton.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. ///import core
  2. ///import uicore
  3. ///import ui/stateful.js
  4. (function() {
  5. var utils = baidu.editor.utils,
  6. uiUtils = baidu.editor.ui.uiUtils,
  7. domUtils = baidu.editor.dom.domUtils,
  8. UIBase = baidu.editor.ui.UIBase,
  9. Stateful = baidu.editor.ui.Stateful,
  10. SplitButton = (baidu.editor.ui.SplitButton = function(options) {
  11. this.initOptions(options);
  12. this.initSplitButton();
  13. });
  14. SplitButton.prototype = {
  15. popup: null,
  16. uiName: "splitbutton",
  17. title: "",
  18. initSplitButton: function() {
  19. this.initUIBase();
  20. this.Stateful_init();
  21. var me = this;
  22. if (this.popup != null) {
  23. var popup = this.popup;
  24. this.popup = null;
  25. this.setPopup(popup);
  26. }
  27. },
  28. _UIBase_postRender: UIBase.prototype.postRender,
  29. postRender: function() {
  30. this.Stateful_postRender();
  31. this._UIBase_postRender();
  32. },
  33. setPopup: function(popup) {
  34. if (this.popup === popup) return;
  35. if (this.popup != null) {
  36. this.popup.dispose();
  37. }
  38. popup.addListener("show", utils.bind(this._onPopupShow, this));
  39. popup.addListener("hide", utils.bind(this._onPopupHide, this));
  40. popup.addListener(
  41. "postrender",
  42. utils.bind(function() {
  43. popup
  44. .getDom("body")
  45. .appendChild(
  46. uiUtils.createElementByHtml(
  47. '<div id="' +
  48. this.popup.id +
  49. '_bordereraser" class="edui-bordereraser edui-background" style="width:' +
  50. (uiUtils.getClientRect(this.getDom()).width + 20) +
  51. 'px"></div>'
  52. )
  53. );
  54. popup.getDom().className += " " + this.className;
  55. }, this)
  56. );
  57. this.popup = popup;
  58. },
  59. _onPopupShow: function() {
  60. this.addState("opened");
  61. },
  62. _onPopupHide: function() {
  63. this.removeState("opened");
  64. },
  65. getHtmlTpl: function() {
  66. return (
  67. '<div id="##" class="edui-box %%">' +
  68. "<div " +
  69. (this.title ? 'title="' + this.title + '"' : "") +
  70. ' id="##_state" stateful><div class="%%-body">' +
  71. '<div id="##_button_body" class="edui-box edui-button-body" onclick="$$._onButtonClick(event, this);">' +
  72. '<div class="edui-box edui-icon"></div>' +
  73. "</div>" +
  74. '<div class="edui-box edui-splitborder"></div>' +
  75. '<div class="edui-box edui-arrow" onclick="$$._onArrowClick();"></div>' +
  76. "</div></div></div>"
  77. );
  78. },
  79. showPopup: function() {
  80. // 当popup往上弹出的时候,做特殊处理
  81. var rect = uiUtils.getClientRect(this.getDom());
  82. rect.top -= this.popup.SHADOW_RADIUS;
  83. rect.height += this.popup.SHADOW_RADIUS;
  84. this.popup.showAnchorRect(rect);
  85. },
  86. _onArrowClick: function(event, el) {
  87. if (!this.isDisabled()) {
  88. this.showPopup();
  89. }
  90. },
  91. _onButtonClick: function() {
  92. if (!this.isDisabled()) {
  93. this.fireEvent("buttonclick");
  94. }
  95. }
  96. };
  97. utils.inherits(SplitButton, UIBase);
  98. utils.extend(SplitButton.prototype, Stateful, true);
  99. })();