MINOR Hiding panel while redrawing via ajax (for repaint/reflow performance), enforcing redraw of tabs before their own onmatch() to avoid layout glitches

This commit is contained in:
Ingo Schommer 2011-12-15 20:37:20 +01:00
parent d732a78852
commit adb5acc8bb
4 changed files with 19 additions and 7 deletions

View File

@ -39,12 +39,15 @@
});
// Force initialization of tabsets to avoid layout glitches
this.find('.ss-tabset').redraw();
this.find('.ss-tabset').redrawTabs();
this._super();
},
redraw: function() {
// Force initialization of tabsets to avoid layout glitches
this.add(this.find('.ss-tabset')).redrawTabs();
this.layout();
},

View File

@ -97,6 +97,9 @@
},
redraw: function() {
// Force initialization of tabsets to avoid layout glitches
this.add(this.find('.ss-tabset')).redrawTabs();
// TODO Manually set container height before resizing - shouldn't be necessary'
this.find('.cms-content-actions').height(this.find('.cms-content-actions .Actions').height());

View File

@ -194,13 +194,15 @@
newContentEl
.removeClass(layoutClasses.join(' '))
.addClass(origLayoutClasses.join(' '))
.attr('style', origStyle);
.attr('style', origStyle)
.css('visibility', 'hidden');
// Replace panel completely (we need to override the "layout" attribute, so can't replace the child instead)
contentEl.replaceWith(newContentEl);
// Unset loading and restore element state (to avoid breaking existing panel visibility, e.g. with preview expanded)
self.redraw();
newContentEl.css('visibility', 'visible');
newContentEl.removeClass('loading');
self.trigger('afterstatechange', {data: data, status: status, xhr: xhr, element: newContentEl});

View File

@ -43,13 +43,17 @@
*/
$('.ss-ui-tabs-nav').entwine({
onmatch: function() {
this.addClass('ui-tabs ui-widget ui-widget-content ui-corner-all ui-tabs-panel ui-corner-bottom');
this.find('ul').addClass('ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all');
this.find('li').addClass('ui-state-default ui-corner-top');
// TODO Figure out selected tab
this.find('li:first').selectIt();
this.redraw();
this._super();
},
redraw: function() {
this.addClass('ui-tabs ui-widget ui-widget-content ui-corner-all ui-tabs-panel ui-corner-bottom');
this.find('ul').addClass('ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all');
this.find('li').addClass('ui-state-default ui-corner-top');
// TODO Figure out selected tab
this.find('li:first').selectIt();
}
});