autofloat.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. ///import core
  2. ///commands 悬浮工具栏
  3. ///commandsName AutoFloat,autoFloatEnabled
  4. ///commandsTitle 悬浮工具栏
  5. /**
  6. * modified by chengchao01
  7. * 注意: 引入此功能后,在IE6下会将body的背景图片覆盖掉!
  8. */
  9. UE.plugins['autofloat'] = function() {
  10. var me = this,
  11. lang = me.getLang();
  12. me.setOpt({
  13. topOffset:0
  14. });
  15. var optsAutoFloatEnabled = me.options.autoFloatEnabled !== false,
  16. topOffset = me.options.topOffset;
  17. //如果不固定toolbar的位置,则直接退出
  18. if(!optsAutoFloatEnabled){
  19. return;
  20. }
  21. var uiUtils = UE.ui.uiUtils,
  22. LteIE6 = browser.ie && browser.version <= 6,
  23. quirks = browser.quirks;
  24. function checkHasUI(){
  25. if(!UE.ui){
  26. alert(lang.autofloatMsg);
  27. return 0;
  28. }
  29. return 1;
  30. }
  31. function fixIE6FixedPos(){
  32. var docStyle = document.body.style;
  33. docStyle.backgroundImage = 'url("about:blank")';
  34. docStyle.backgroundAttachment = 'fixed';
  35. }
  36. var bakCssText,
  37. placeHolder = document.createElement('div'),
  38. toolbarBox,orgTop,
  39. getPosition,
  40. flag =true; //ie7模式下需要偏移
  41. function setFloating(){
  42. var toobarBoxPos = domUtils.getXY(toolbarBox),
  43. origalFloat = domUtils.getComputedStyle(toolbarBox,'position'),
  44. origalLeft = domUtils.getComputedStyle(toolbarBox,'left');
  45. toolbarBox.style.width = toolbarBox.offsetWidth + 'px';
  46. toolbarBox.style.zIndex = me.options.zIndex * 1 + 1;
  47. toolbarBox.parentNode.insertBefore(placeHolder, toolbarBox);
  48. if (LteIE6 || (quirks && browser.ie)) {
  49. if(toolbarBox.style.position != 'absolute'){
  50. toolbarBox.style.position = 'absolute';
  51. }
  52. toolbarBox.style.top = (document.body.scrollTop||document.documentElement.scrollTop) - orgTop + topOffset + 'px';
  53. } else {
  54. if (browser.ie7Compat && flag) {
  55. flag = false;
  56. toolbarBox.style.left = domUtils.getXY(toolbarBox).x - document.documentElement.getBoundingClientRect().left+2 + 'px';
  57. }
  58. if(toolbarBox.style.position != 'fixed'){
  59. toolbarBox.style.position = 'fixed';
  60. toolbarBox.style.top = topOffset +"px";
  61. ((origalFloat == 'absolute' || origalFloat == 'relative') && parseFloat(origalLeft)) && (toolbarBox.style.left = toobarBoxPos.x + 'px');
  62. }
  63. }
  64. }
  65. function unsetFloating(){
  66. flag = true;
  67. if(placeHolder.parentNode){
  68. placeHolder.parentNode.removeChild(placeHolder);
  69. }
  70. toolbarBox.style.cssText = bakCssText;
  71. }
  72. function updateFloating(){
  73. var rect3 = getPosition(me.container);
  74. var offset=me.options.toolbarTopOffset||0;
  75. if (rect3.top < 0 && rect3.bottom - toolbarBox.offsetHeight > offset) {
  76. setFloating();
  77. }else{
  78. unsetFloating();
  79. }
  80. }
  81. var defer_updateFloating = utils.defer(function(){
  82. updateFloating();
  83. },browser.ie ? 200 : 100,true);
  84. me.addListener('destroy',function(){
  85. domUtils.un(window, ['scroll','resize'], updateFloating);
  86. me.removeListener('keydown', defer_updateFloating);
  87. });
  88. me.addListener('ready', function(){
  89. if(checkHasUI(me)){
  90. //加载了ui组件,但在new时,没有加载ui,导致编辑器实例上没有ui类,所以这里做判断
  91. if(!me.ui){
  92. return;
  93. }
  94. getPosition = uiUtils.getClientRect;
  95. toolbarBox = me.ui.getDom('toolbarbox');
  96. orgTop = getPosition(toolbarBox).top;
  97. bakCssText = toolbarBox.style.cssText;
  98. placeHolder.style.height = toolbarBox.offsetHeight + 'px';
  99. if(LteIE6){
  100. fixIE6FixedPos();
  101. }
  102. domUtils.on(window, ['scroll','resize'], updateFloating);
  103. me.addListener('keydown', defer_updateFloating);
  104. me.addListener('beforefullscreenchange', function (t, enabled){
  105. if (enabled) {
  106. unsetFloating();
  107. }
  108. });
  109. me.addListener('fullscreenchanged', function (t, enabled){
  110. if (!enabled) {
  111. updateFloating();
  112. }
  113. });
  114. me.addListener('sourcemodechanged', function (t, enabled){
  115. setTimeout(function (){
  116. updateFloating();
  117. },0);
  118. });
  119. me.addListener("clearDoc",function(){
  120. setTimeout(function(){
  121. updateFloating();
  122. },0);
  123. })
  124. }
  125. });
  126. };