stateful.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. (function (){
  2. var browser = baidu.editor.browser,
  3. domUtils = baidu.editor.dom.domUtils,
  4. uiUtils = baidu.editor.ui.uiUtils;
  5. var TPL_STATEFUL = 'onmousedown="$$.Stateful_onMouseDown(event, this);"' +
  6. ' onmouseup="$$.Stateful_onMouseUp(event, this);"' +
  7. ( browser.ie ? (
  8. ' onmouseenter="$$.Stateful_onMouseEnter(event, this);"' +
  9. ' onmouseleave="$$.Stateful_onMouseLeave(event, this);"' )
  10. : (
  11. ' onmouseover="$$.Stateful_onMouseOver(event, this);"' +
  12. ' onmouseout="$$.Stateful_onMouseOut(event, this);"' ));
  13. baidu.editor.ui.Stateful = {
  14. alwalysHoverable: false,
  15. target:null,//目标元素和this指向dom不一样
  16. Stateful_init: function (){
  17. this._Stateful_dGetHtmlTpl = this.getHtmlTpl;
  18. this.getHtmlTpl = this.Stateful_getHtmlTpl;
  19. },
  20. Stateful_getHtmlTpl: function (){
  21. var tpl = this._Stateful_dGetHtmlTpl();
  22. // 使用function避免$转义
  23. return tpl.replace(/stateful/g, function (){ return TPL_STATEFUL; });
  24. },
  25. Stateful_onMouseEnter: function (evt, el){
  26. this.target=el;
  27. if (!this.isDisabled() || this.alwalysHoverable) {
  28. this.addState('hover');
  29. this.fireEvent('over');
  30. }
  31. },
  32. Stateful_onMouseLeave: function (evt, el){
  33. if (!this.isDisabled() || this.alwalysHoverable) {
  34. this.removeState('hover');
  35. this.removeState('active');
  36. this.fireEvent('out');
  37. }
  38. },
  39. Stateful_onMouseOver: function (evt, el){
  40. var rel = evt.relatedTarget;
  41. if (!uiUtils.contains(el, rel) && el !== rel) {
  42. this.Stateful_onMouseEnter(evt, el);
  43. }
  44. },
  45. Stateful_onMouseOut: function (evt, el){
  46. var rel = evt.relatedTarget;
  47. if (!uiUtils.contains(el, rel) && el !== rel) {
  48. this.Stateful_onMouseLeave(evt, el);
  49. }
  50. },
  51. Stateful_onMouseDown: function (evt, el){
  52. if (!this.isDisabled()) {
  53. this.addState('active');
  54. }
  55. },
  56. Stateful_onMouseUp: function (evt, el){
  57. if (!this.isDisabled()) {
  58. this.removeState('active');
  59. }
  60. },
  61. Stateful_postRender: function (){
  62. if (this.disabled && !this.hasState('disabled')) {
  63. this.addState('disabled');
  64. }
  65. },
  66. hasState: function (state){
  67. return domUtils.hasClass(this.getStateDom(), 'edui-state-' + state);
  68. },
  69. addState: function (state){
  70. if (!this.hasState(state)) {
  71. this.getStateDom().className += ' edui-state-' + state;
  72. }
  73. },
  74. removeState: function (state){
  75. if (this.hasState(state)) {
  76. domUtils.removeClasses(this.getStateDom(), ['edui-state-' + state]);
  77. }
  78. },
  79. getStateDom: function (){
  80. return this.getDom('state');
  81. },
  82. isChecked: function (){
  83. return this.hasState('checked');
  84. },
  85. setChecked: function (checked){
  86. if (!this.isDisabled() && checked) {
  87. this.addState('checked');
  88. } else {
  89. this.removeState('checked');
  90. }
  91. },
  92. isDisabled: function (){
  93. return this.hasState('disabled');
  94. },
  95. setDisabled: function (disabled){
  96. if (disabled) {
  97. this.removeState('hover');
  98. this.removeState('checked');
  99. this.removeState('active');
  100. this.addState('disabled');
  101. } else {
  102. this.removeState('disabled');
  103. }
  104. }
  105. };
  106. })();