C_CollapseButton.js 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. define( function() {
  2. "use strict";
  3. function C_CollapseButton()
  4. {
  5. };
  6. C_CollapseButton.prototype.initialize = function( oControlHost, fnDoneInitializing )
  7. {
  8. var o = oControlHost.configuration;
  9. this.m_sBlockName = o ? o["Block name"] : "Block1";
  10. this.m_bCollapsed = Boolean( o && o.Collapsed );
  11. if ( o )
  12. {
  13. this.m_sWidth = o.Width;
  14. this.m_sHeight = o.Height;
  15. }
  16. fnDoneInitializing();
  17. };
  18. C_CollapseButton.prototype.draw = function( oControlHost )
  19. {
  20. var elContainer = oControlHost.container;
  21. elContainer.innerHTML =
  22. '<style>' +
  23. '.myCollapseButton { background-color:#EAEAEA; color:#B1B6BA; font-size:24px; padding:0px 6px 0px 6px; border:1px solid #B1B6BA; }' +
  24. '.myCollapseButton:hover { background-color:#6793CB; color:#EAEAEA; border:1px solid #EAEAEA; }' +
  25. '</style>' +
  26. '<button class="myCollapseButton"></button>';
  27. this.m_btn = elContainer.lastChild;
  28. this.m_btn.onclick = this.onClick.bind( this, oControlHost );
  29. this.updateButton( oControlHost );
  30. };
  31. C_CollapseButton.prototype.onClick = function( oControlHost )
  32. {
  33. var oControl = oControlHost.page.getControlByName( this.m_sBlockName );
  34. if ( this.m_sWidth )
  35. {
  36. oControl.setWidth( this.m_bCollapsed ? this.m_sWidth : "0px", true );
  37. }
  38. if ( this.m_sHeight )
  39. {
  40. oControl.setHeight( this.m_bCollapsed ? this.m_sHeight : "0px", true );
  41. }
  42. this.m_bCollapsed = !this.m_bCollapsed;
  43. this.updateButton( oControlHost );
  44. };
  45. C_CollapseButton.prototype.updateButton = function( oControlHost )
  46. {
  47. this.m_btn.innerHTML = this.m_bCollapsed ? '&#9654;' : '&#9664;';
  48. this.m_btn.title = this.m_bCollapsed ? 'Show' : 'Hide';
  49. };
  50. return C_CollapseButton;
  51. });