mirrored from git://git.moodle.org/moodle.git
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
MDL-38923 theme_bootstrapbase: pre-integration fixups
* Fixed the way we added the block class to the dock panel in dock.js * Added a class to the h2 that is used to test dock title width * Fixed RTL alignment issues as best I could at present * Fixed overlap of dock + navbar on small screens * Fixed the docked block width to be constrained to the available space * Fixed hidden actions on docked blocks Conflicts: theme/bootstrapbase/style/moodle.css
- Loading branch information
Sam Hemelryk
committed
May 19, 2014
1 parent
0720ecb
commit e6e58c7
Showing
8 changed files
with
73 additions
and
38 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,57 @@ | ||
/** | ||
* Customise the dock for this theme. | ||
* | ||
* Tasks we do within this function: | ||
* - Add 'block' as a class to the dock panel so that its items are styled the same as they are when being displayed | ||
* in page as blocks. | ||
* - Constrain the width of the docked block to the window width using a responsible max-width. | ||
* - Handle the opening/closing of the Bootstrap collapsible navbar on small screens. | ||
*/ | ||
function customise_dock_for_theme() { | ||
function customise_dock_for_theme(dock) { | ||
// Add the "block" class to docked blocks. | ||
// This prevents having to restyle all docked blocks and simply use standard block styling. | ||
M.core_dock.on('dock:panelgenerated', function(){ | ||
Y.all('.dockeditempanel_content').addClass('block'); | ||
// First we wait until the panel has been generated. | ||
dock.on('dock:panelgenerated', function() { | ||
// Then we wait until the panel it is being shown for the first time. | ||
dock.get('panel').once('dockpanel:beforeshow', function() { | ||
// Finally we add the block class. | ||
Y.all('.dockeditempanel_content').addClass('block'); | ||
}); | ||
dock.get('panel').on('dockpanel:beforeshow', function() { | ||
var content = Y.all('.dockeditempanel_content'); | ||
// Finally set a responsible max width. | ||
content.setStyle('maxWidth', content.get('winWidth') - dock.get('dockNode').get('offsetWidth') - 10); | ||
}); | ||
}); | ||
|
||
// Handle the opening/closing of the bootstrap collapsible navbar on small screens. | ||
// This is a complex little bit of JS because we need to simulate Bootstrap actions in order to measure height changes | ||
// in the dom and apply them as spacing to the dock. | ||
dock.on('dock:initialised', function() { | ||
var navbar = Y.one('header.navbar'), | ||
navbarbtn = Y.one('header.navbar .btn-navbar'), | ||
navcollapse = Y.one('header.navbar .nav-collapse'), | ||
container = Y.one('#dock .dockeditem_container'), | ||
margintop = null, | ||
newmargintop = null, | ||
diff = null; | ||
if (navbar && navbarbtn && container) { | ||
margintop = parseInt(container.getStyle('marginTop').replace(/px$/, ''), 10); | ||
diff = margintop - parseInt(navbar.get('offsetHeight'), 10); | ||
navbarbtn.ancestor().on('click', function() { | ||
// We need to fake the collapsible region being active, this JS *ALWAYS* executes before the bootstrap JS. | ||
navcollapse.toggleClass('active'); | ||
if (!this.hasClass('active')) { | ||
newmargintop = (parseInt(navbar.get('offsetHeight'), 10) + diff); | ||
container.setStyle('marginTop', newmargintop + 'px'); | ||
} else { | ||
container.setStyle('marginTop', margintop + 'px'); | ||
} | ||
// Undo the simulation. | ||
navcollapse.toggleClass('active'); | ||
// Tell the dock things have changed so that it automatically resizes things. | ||
dock.fire('dock:itemschanged'); | ||
}, navbarbtn); | ||
} | ||
}); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.