apps/workbench/app/assets/javascripts/tab_panes.js

   1 // Load tab panes on demand. See app/views/application/_content.html.erb
   2
   3 // Fire when a tab is selected/clicked.
   4 $(document).on('shown.bs.tab', '[data-toggle="tab"]', function(e) {
   5     $(this).trigger('arv:pane:reload');
   6 });
   7
   8 // Fire when the content in a pane becomes stale/dirty. If the pane is
   9 // 'active', reload it right away. Otherwise, just replace the current content
  10 // with a spinner for now, don't load the new content unless/until the pane
  11 // becomes active.
  12 $(document).on('arv:pane:reload', function(e) {
  13     // Unload a single pane. Reload it if it's active.
  14     $(e.target).removeClass('loaded');
  15     var $pane = $($(e.target).attr('href'));
  16     if ($pane.hasClass('active')) {
  17         var content_url = $(e.target).attr('data-pane-content-url');
  18         $.ajax(content_url, {dataType: 'html', type: 'GET', context: $pane}).
  19             done(function(data, status, jqxhr) {
  20                 // Preserve collapsed state
  21                 var collapsable = {};
  22                 $(".collapse", $pane).each(function(i, c) {
  23                     collapsable[c.id] = $(c).hasClass('in');
  24                 });
  25                 var tmp = $(data);
  26                 $(".collapse", tmp).each(function(i, c) {
  27                     if (collapsable[c.id]) {
  28                         $(c).addClass('in');
  29                     } else {
  30                         $(c).removeClass('in');
  31                     }
  32                 });
  33                 $pane.html(tmp);
  34                 $(e.target).addClass('loaded');
  35                 $pane.trigger('arv:pane:loaded');
  36             }).fail(function(jqxhr, status, error) {
  37                 var errhtml;
  38                 if (jqxhr.getResponseHeader('Content-Type').match(/\btext\/html\b/)) {
  39                     var $response = $(jqxhr.responseText);
  40                     var $wrapper = $('div#page-wrapper', $response);
  41                     if ($wrapper.length) {
  42                         errhtml = $wrapper.html();
  43                     } else {
  44                         errhtml = jqxhr.responseText;
  45                     }
  46                 } else {
  47                     errhtml = ("An error occurred: " +
  48                                (jqxhr.responseText || status)).
  49                         replace(/&/g, '&amp;').
  50                         replace(/</g, '&lt;').
  51                         replace(/>/g, '&gt;');
  52                 }
  53                 $pane.html('<div><p>' +
  54                         '<a href="#" class="btn btn-primary tab_reload">' +
  55                         '<i class="fa fa-fw fa-refresh"></i> ' +
  56                         'Reload tab</a></p><iframe></iframe></div>');
  57                 $('.tab_reload', $pane).click(function() {
  58                     $pane.html('<div class="spinner spinner-32px spinner-h-center"></div>');
  59                     $(e.target).trigger('arv:pane:reload');
  60                 });
  61                 // We want to render the error in an iframe, in order to
  62                 // avoid conflicts with the main page's element ids, etc.
  63                 // In order to do that dynamically, we have to set a
  64                 // timeout on the iframe window to load our HTML *after*
  65                 // the default source (e.g., about:blank) has loaded.
  66                 var iframe = $('iframe', e.target)[0];
  67                 iframe.contentWindow.setTimeout(function() {
  68                     $('body', iframe.contentDocument).html(errhtml);
  69                     iframe.height = iframe.contentDocument.body.scrollHeight + "px";
  70                 }, 1);
  71                 $(e.target).addClass('loaded');
  72             });
  73     } else {
  74         // When the user selects e.target tab, show a spinner instead of
  75         // old content while loading.
  76         $pane.html('<div class="spinner spinner-32px spinner-h-center"></div>');
  77     }
  78 });
  79
  80 // Mark all panes as stale/dirty. Refresh the active pane.
  81 $(document).on('arv-log-event arv:pane:reload:all', function() {
  82     $('.pane-anchor.loaded').trigger('arv:pane:reload');
  83 });
  84
  85 // If there is a 'tab counts url' in the nav-tabs element then use it to get some javascript that will update them
  86 $(document).on('ready count-change', function() {
  87     var tabCountsUrl = $('ul.nav-tabs').data('tab-counts-url');
  88     if( tabCountsUrl && tabCountsUrl.length ) {
  89         $.get( tabCountsUrl );
  90     }
  91 });