field_group.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. (function($) {
  2. /**
  3. * Drupal FieldGroup object.
  4. */
  5. Drupal.FieldGroup = Drupal.FieldGroup || {};
  6. Drupal.FieldGroup.Effects = Drupal.FieldGroup.Effects || {};
  7. Drupal.FieldGroup.groupWithfocus = null;
  8. Drupal.FieldGroup.setGroupWithfocus = function(element) {
  9. element.css({display: 'block'});
  10. Drupal.FieldGroup.groupWithfocus = element;
  11. }
  12. /**
  13. * Implements Drupal.FieldGroup.processHook().
  14. */
  15. Drupal.FieldGroup.Effects.processFieldset = {
  16. execute: function (context, settings, type) {
  17. if (type == 'form') {
  18. // Add required fields mark to any fieldsets containing required fields
  19. $('fieldset.fieldset', context).once('fieldgroup-effects', function(i) {
  20. if ($(this).is('.required-fields') && $(this).find('.form-required').length > 0) {
  21. $('legend span.fieldset-legend', $(this)).eq(0).append(' ').append($('.form-required').eq(0).clone());
  22. }
  23. if ($('.error', $(this)).length) {
  24. $('legend span.fieldset-legend', $(this)).eq(0).addClass('error');
  25. Drupal.FieldGroup.setGroupWithfocus($(this));
  26. }
  27. });
  28. }
  29. }
  30. }
  31. /**
  32. * Implements Drupal.FieldGroup.processHook().
  33. */
  34. Drupal.FieldGroup.Effects.processAccordion = {
  35. execute: function (context, settings, type) {
  36. $('div.field-group-accordion-wrapper', context).once('fieldgroup-effects', function () {
  37. var wrapper = $(this);
  38. wrapper.accordion({
  39. autoHeight: false,
  40. active: '.field-group-accordion-active',
  41. collapsible: true,
  42. changestart: function(event, ui) {
  43. if ($(this).hasClass('effect-none')) {
  44. ui.options.animated = false;
  45. }
  46. else {
  47. ui.options.animated = 'slide';
  48. }
  49. }
  50. });
  51. if (type == 'form') {
  52. // Add required fields mark to any element containing required fields
  53. wrapper.find('div.accordion-item').each(function(i){
  54. if ($(this).is('.required-fields') && $(this).find('.form-required').length > 0) {
  55. $('h3.ui-accordion-header').eq(i).append(' ').append($('.form-required').eq(0).clone());
  56. }
  57. if ($('.error', $(this)).length) {
  58. $('h3.ui-accordion-header').eq(i).addClass('error');
  59. var activeOne = $(this).parent().accordion("activate" , i);
  60. $('.ui-accordion-content-active', activeOne).css({height: 'auto', width: 'auto', display: 'block'});
  61. }
  62. });
  63. }
  64. });
  65. }
  66. }
  67. /**
  68. * Implements Drupal.FieldGroup.processHook().
  69. */
  70. Drupal.FieldGroup.Effects.processHtabs = {
  71. execute: function (context, settings, type) {
  72. if (type == 'form') {
  73. // Add required fields mark to any element containing required fields
  74. $('fieldset.horizontal-tabs-pane', context).once('fieldgroup-effects', function(i) {
  75. if ($(this).is('.required-fields') && $(this).find('.form-required').length > 0) {
  76. $(this).data('horizontalTab').link.find('strong:first').after($('.form-required').eq(0).clone()).after(' ');
  77. }
  78. if ($('.error', $(this)).length) {
  79. $(this).data('horizontalTab').link.parent().addClass('error');
  80. Drupal.FieldGroup.setGroupWithfocus($(this));
  81. $(this).data('horizontalTab').focus();
  82. }
  83. });
  84. }
  85. }
  86. }
  87. /**
  88. * Implements Drupal.FieldGroup.processHook().
  89. */
  90. Drupal.FieldGroup.Effects.processTabs = {
  91. execute: function (context, settings, type) {
  92. if (type == 'form') {
  93. // Add required fields mark to any fieldsets containing required fields
  94. $('fieldset.vertical-tabs-pane', context).once('fieldgroup-effects', function(i) {
  95. if ($(this).is('.required-fields') && $(this).find('.form-required').length > 0) {
  96. $(this).data('verticalTab').link.find('strong:first').after($('.form-required').eq(0).clone()).after(' ');
  97. }
  98. if ($('.error', $(this)).length) {
  99. $(this).data('verticalTab').link.parent().addClass('error');
  100. Drupal.FieldGroup.setGroupWithfocus($(this));
  101. $(this).data('verticalTab').focus();
  102. }
  103. });
  104. }
  105. }
  106. }
  107. /**
  108. * Implements Drupal.FieldGroup.processHook().
  109. *
  110. * TODO clean this up meaning check if this is really
  111. * necessary.
  112. */
  113. Drupal.FieldGroup.Effects.processDiv = {
  114. execute: function (context, settings, type) {
  115. $('div.collapsible', context).once('fieldgroup-effects', function() {
  116. var $wrapper = $(this);
  117. // Turn the legend into a clickable link, but retain span.field-group-format-toggler
  118. // for CSS positioning.
  119. var $toggler = $('span.field-group-format-toggler:first', $wrapper);
  120. var $link = $('<a class="field-group-format-title" href="#"></a>');
  121. $link.prepend($toggler.contents());
  122. // Add required field markers if needed
  123. if ($(this).is('.required-fields') && $(this).find('.form-required').length > 0) {
  124. $link.append(' ').append($('.form-required').eq(0).clone());
  125. }
  126. $link.appendTo($toggler);
  127. // .wrapInner() does not retain bound events.
  128. $link.click(function () {
  129. var wrapper = $wrapper.get(0);
  130. // Don't animate multiple times.
  131. if (!wrapper.animating) {
  132. wrapper.animating = true;
  133. var speed = $wrapper.hasClass('speed-fast') ? 300 : 1000;
  134. if ($wrapper.hasClass('effect-none') && $wrapper.hasClass('speed-none')) {
  135. $('> .field-group-format-wrapper', wrapper).toggle();
  136. }
  137. else if ($wrapper.hasClass('effect-blind')) {
  138. $('> .field-group-format-wrapper', wrapper).toggle('blind', {}, speed);
  139. }
  140. else {
  141. $('> .field-group-format-wrapper', wrapper).toggle(speed);
  142. }
  143. wrapper.animating = false;
  144. }
  145. $wrapper.toggleClass('collapsed');
  146. return false;
  147. });
  148. });
  149. }
  150. };
  151. /**
  152. * Behaviors.
  153. */
  154. Drupal.behaviors.fieldGroup = {
  155. attach: function (context, settings) {
  156. if (settings.field_group == undefined) {
  157. return;
  158. }
  159. // Execute all of them.
  160. $.each(Drupal.FieldGroup.Effects, function (func) {
  161. // We check for a wrapper function in Drupal.field_group as
  162. // alternative for dynamic string function calls.
  163. var type = func.toLowerCase().replace("process", "");
  164. if (settings.field_group[type] != undefined && $.isFunction(this.execute)) {
  165. this.execute(context, settings, settings.field_group[type]);
  166. }
  167. });
  168. // Fixes css for fieldgroups under vertical tabs.
  169. $('.fieldset-wrapper .fieldset > legend').css({display: 'block'});
  170. $('.vertical-tabs fieldset.fieldset').addClass('default-fallback');
  171. }
  172. };
  173. })(jQuery);