dashlet.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. // jQuery UI style "widget" for editing an iTop "dashlet"
  2. $(function()
  3. {
  4. // the widget definition, where "itop" is the namespace,
  5. // "dashlet" the widget name
  6. $.widget( "itop.dashlet",
  7. {
  8. // default options
  9. options:
  10. {
  11. dashlet_id: '',
  12. dashlet_class: ''
  13. },
  14. // the constructor
  15. _create: function()
  16. {
  17. var me = this;
  18. this.element
  19. .addClass('itop-dashlet')
  20. .bind('click.itop-dashlet', function(event) { me._on_click(event); } );
  21. this._update();
  22. },
  23. // to call when the contents are changed
  24. _update: function()
  25. {
  26. var me = this;
  27. this.closeBox = $('<div class="close-box"/>');
  28. this.closeBox
  29. .click(function() { me._remove_dashlet(); })
  30. .prependTo(this.element);
  31. if (this.element.hasClass('dashlet-selected'))
  32. {
  33. this.closeBox.show();
  34. }
  35. else
  36. {
  37. this.closeBox.hide();
  38. }
  39. },
  40. // called when created, and later when changing options
  41. _refresh: function()
  42. {
  43. },
  44. // events bound via _bind are removed automatically
  45. // revert other modifications here
  46. _destroy: function()
  47. {
  48. this.element
  49. .removeClass('itop-dashlet')
  50. .unbind('click.itop-dashlet');
  51. this.closeBox.remove();
  52. },
  53. // _setOptions is called with a hash of all options that are changing
  54. _setOptions: function()
  55. {
  56. // in 1.9 would use _superApply
  57. this._superApply(arguments);
  58. this._update();
  59. },
  60. // _setOption is called for each individual option that is changing
  61. _setOption: function( key, value )
  62. {
  63. // in 1.9 would use _super
  64. this._superApply(arguments);
  65. },
  66. select: function()
  67. {
  68. this.element.addClass('dashlet-selected');
  69. this.closeBox.fadeIn(500);
  70. $('#event_bus').trigger('dashlet-selected', {'dashlet_id': this.options.dashlet_id, 'dashlet_class': this.options.dashlet_class});
  71. },
  72. deselect: function()
  73. {
  74. this.element.removeClass('dashlet-selected');
  75. this.closeBox.hide();
  76. },
  77. deselect_all: function()
  78. {
  79. $(':itop-dashlet').each(function(){
  80. var sId = $(this).attr('id');
  81. var oWidget = $(this).data('itopDashlet');
  82. if (oWidget)
  83. {
  84. oWidget.deselect();
  85. }
  86. });
  87. },
  88. _on_click: function(event)
  89. {
  90. this.deselect_all();
  91. this.select();
  92. },
  93. get_params: function()
  94. {
  95. var oParams = {};
  96. var oProperties = $('#dashlet_properties_'+this.options.dashlet_id);
  97. oProperties.find(':itop-property_field').each(function(){
  98. var oWidget = $(this).data('itopProperty_field');
  99. if (oWidget)
  100. {
  101. var oVal = oWidget._get_committed_value();
  102. oParams[oVal.name] = oVal.value;
  103. }
  104. });
  105. oParams.dashlet_id = this.options.dashlet_id;
  106. oParams.dashlet_class = this.options.dashlet_class;
  107. return oParams;
  108. },
  109. get_drag_icon: function()
  110. {
  111. var oDragItem = $('#dashlet_'+this.options.dashlet_class).clone();
  112. oDragItem.css({zIndex: 999});
  113. oDragItem.appendTo('body');
  114. return oDragItem;
  115. },
  116. _remove_dashlet: function()
  117. {
  118. var iDashletId = this.options.dashlet_id;
  119. var sDashletClass = this.options.dashlet_class;
  120. var oContainer = this.element.parent();
  121. $('#dashlet_properties_'+iDashletId).remove();
  122. this.element.remove();
  123. $('#event_bus').trigger('dashlet-removed', {'dashlet_id': iDashletId, 'dashlet_class': sDashletClass, 'container': oContainer});
  124. }
  125. });
  126. });