mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
ENHANCEMENT Using jQuery UI and "concrete" tabs for Security/login with multiple authentication methods (e.g. CMS-login and OpenID)
git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/sapphire/trunk@92484 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
parent
2a74a8b14f
commit
7856df5f37
@ -54,10 +54,13 @@ class TabSet extends CompositeField {
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/jquery-ui.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.core.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.tabs.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/javascript/TabSet.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/plugins/fitheighttoparent/jquery.fitheighttoparent.js');
|
||||
|
||||
Requirements::css(THIRDPARTY_DIR . '/jquery/themes/smoothness/ui.all.css');
|
||||
Requirements::css(THIRDPARTY_DIR . '/jquery/themes/smoothness/ui.tabs.css');
|
||||
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/javascript/TabSet.js');
|
||||
|
||||
return $this->renderWith("TabSetFieldHolder");
|
||||
}
|
||||
|
||||
|
@ -13,51 +13,6 @@ jQuery(document).ready(function () {
|
||||
// Initialize tabset
|
||||
jQuery('.ss-tabset').tabs();
|
||||
|
||||
/**
|
||||
* Adjust height of nested tabset panels contained
|
||||
* in jQuery.layout panels to allow scrolling.
|
||||
*/
|
||||
var ss_tabset_fixHeight = function(e) {
|
||||
console.debug(jQuery('.ss-tabset .tab'));
|
||||
jQuery('.ss-tabset .tab').each(function() {
|
||||
console.debug(this);
|
||||
var $tabPane = jQuery(this);
|
||||
var $layoutPane = $tabPane.parents('.ui-layout-pane:first');
|
||||
|
||||
// don't apply resizing if tabset is not contained in a layout pane
|
||||
if(!$layoutPane) return;
|
||||
|
||||
// substract heights of unrelated tab elements
|
||||
var $tabSets = $tabPane.parents('.ss-tabset');
|
||||
var $tabBars = $tabSets.children('.ui-tabs-nav');
|
||||
var tabPaneHeight = $layoutPane.height();
|
||||
console.log('total', tabPaneHeight);
|
||||
// each tabset has certain padding and borders
|
||||
$tabSets.each(function() {
|
||||
console.log('tabset',jQuery(this).outerHeight(true) - jQuery(this).innerHeight());
|
||||
tabPaneHeight -= jQuery(this).outerHeight(true) - jQuery(this).innerHeight();
|
||||
});
|
||||
// get all "parent" tab navigation bars to substract their heights
|
||||
// from the total panel height
|
||||
$tabBars.each(function() {
|
||||
console.log('tabbar', jQuery(this).outerHeight(true));
|
||||
// substract height of every tab bar from the total panel height
|
||||
tabPaneHeight -= jQuery(this).outerHeight(true);
|
||||
});
|
||||
// Remove any margins from the tab pane
|
||||
console.log('tabpane', $tabPane.outerHeight(true) - $tabPane.innerHeight());
|
||||
tabPaneHeight -= $tabPane.outerHeight(true) - $tabPane.innerHeight();
|
||||
console.log('final', tabPaneHeight);
|
||||
$tabPane.height(tabPaneHeight);
|
||||
|
||||
// if tab has no nested tabs, set overflow to auto
|
||||
if(!$tabPane.find('.tab').length) {
|
||||
$tabPane.css('overflow', 'auto');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ss_tabset_fixHeight();
|
||||
|
||||
jQuery(window).bind('resize', ss_tabset_fixHeight);
|
||||
// if tab has no nested tabs, set overflow to auto
|
||||
jQuery('.ss-tabset .tab').not(':has(.tab)').css('overflow', 'auto');
|
||||
});
|
Loading…
Reference in New Issue
Block a user