Home

Panels show/hide panes js

May 23, 2008 - 12:06pm — sdboyer
  1. /** Toggle pane show/hide button **/
  2. Drupal.Panels.bindClickToggleHidden = function (o) {
  3.   $('input.pane-toggle-hidden').unbind('click');
  4.   $('input.pane-toggle-hidden').click(function() {
  5.     var id = $(this)[0].id.replace('edit-button-', '').replace('-show-hide', '');
  6.     var op = $(this)[0].title.replace(' this pane', '');
  7.     $.ajax({
  8.       type: "POST",
  9.       url: Drupal.settings.panelsAjaxURL + "/toggle-hidden/" + $('#panel-did').val() + '/' + id + '/' + op,
  10.       data: '',
  11.       global: true,
  12.       success: Drupal.Panels.Subform.bindAjaxResponse,
  13.       error: function() { alert("An error occurred while attempting to toggle the pane's hidden status.")},
  14.       dataType: 'json'
  15.     });
  16.     return false;
  17.   });
  18. }
  19.  
  20. // it's just the extra else if I added, but i included the whole thing for completeness
  21.  
  22. Drupal.Panels.Subform.bindAjaxResponse = function(data) {
  23.   // On success, append the returned HTML to the panel's element.
  24.   if (data.type == 'display') {
  25.     // append the output
  26.     $('#modalContent span.modal-title').html(data.title);
  27.     $('#modalContent div.modal-content').html(data.output);
  28.    
  29.     // TODO this is the code that we want to see go away
  30.     var url = data.url;
  31.     if (!url) {
  32.       url = Drupal.settings.panelsAjaxURL + '/submit-form/' +  $('#panel-did').val();
  33.     }
  34.  
  35.     // Bind forms to ajax submit.
  36.     $('div.panels-modal-content form').unbind('submit'); // be safe here.
  37.     $('div.panels-modal-content form').submit(function() {
  38.       $(this).ajaxSubmit({
  39.         url: url,
  40.         data: '',
  41.         method: 'post',
  42.         after: Drupal.Panels.Subform.bindAjaxResponse,
  43.         dataType: 'json'
  44.       });
  45.       return false;
  46.      
  47.     });
  48.  
  49.     // Bind links to ajax links.
  50.     $('a.panels-modal-add-config').click(Drupal.Panels.Subform.bindClickAddLink);
  51.  
  52.     if ($('#override-title-checkbox').size()) {
  53.       Drupal.Panels.Checkboxes.bindCheckbox('#override-title-checkbox', ['#override-title-textfield']);
  54.     }
  55.  
  56.     if ($('#use-pager-checkbox').size()) {
  57.       Drupal.Panels.Checkboxes.bindCheckbox('#use-pager-checkbox', ['#use-pager-textfield']);
  58.     }
  59.  
  60.     // hack: allow collapsible textareas to work
  61.     Drupal.Panels.Subform.bindCollapsible();
  62.  
  63.     Drupal.Panels.Subform.bindAutocomplete();
  64.   }
  65.   else if (data.type == 'add') {
  66.     // Give it all the goodies that our existing panes have.  
  67.     $('#panel-pane-' + data.region).append(data.output);
  68.    
  69.     Drupal.Panels.attachPane('#panel-pane-' + data.id);
  70.     Drupal.Panels.changed($('#panel-pane-' + data.id));
  71.     // dismiss the dialog
  72.     $('#panels-modal').unmodalContent();
  73.   }
  74.   else if (data.type == 'replace') {
  75.     $('#panel-pane-' + data.id + ' .panel-pane-collapsible')
  76.       .html(data.output)
  77.       .each(Drupal.Panels.bindPortlet);
  78.     Drupal.Panels.changed($('#panel-pane-' + data.id));
  79.  
  80.     // dismiss the dialog
  81.     $('#panels-modal').unmodalContent();
  82.   }
  83.   else if (data.type == 'toggle-hidden') {
  84.     if (data.op == '1') {
  85.       var verb = 'Hide';
  86.     }
  87.     else {
  88.       var verb = 'Show';
  89.     }
  90.     $('#panel-pane-' + data.id).toggleClass('hidden-pane');
  91.     $('#panel-pane-' + data.id + ' input.pane-hidden').attr({
  92.       title: verb + " this pane",
  93.       alt: verb + " this pane",
  94.       src: "icon-" + data.output + "pane.png"
  95.     });
  96.     Drupal.Panels.changed($('#panel-pane-' + data.id));
  97.   }
  98.   else {
  99.     // just dismiss the dialog.
  100.     $('#panels-modal').unmodalContent();
  101.   }
  102. }