Merge branch '43995-26' of git://github.com/samhemelryk/moodle into MOODLE_26_STABLE

This commit is contained in:
Damyon Wiese
2014-05-19 11:53:34 +08:00
14 changed files with 278 additions and 50 deletions
+3
View File
@@ -3276,6 +3276,9 @@ EOD;
} else {
$additionalclasses[] = 'empty-region-'.$region;
}
if ($this->page->blocks->region_completely_docked($region, $this)) {
$additionalclasses[] = 'docked-region-'.$region;
}
}
foreach ($this->page->layout_options as $option => $value) {
if ($value) {
+10 -6
View File
@@ -193,7 +193,7 @@ M.core.dock.fixTitleOrientation = function(title, text) {
}
// We need to fix a font-size - sorry theme designers.
test = Y.Node.create('<h2><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
test = Y.Node.create('<h2 class="transform-test-heading"><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
BODY.insert(test, 0);
width = test.one('span').get('offsetWidth') * 1.2;
height = test.one('span').get('offsetHeight');
@@ -204,12 +204,10 @@ M.core.dock.fixTitleOrientation = function(title, text) {
// Move the title into position
title.setStyles({
'margin' : '0',
'padding' : '0',
'position' : 'relative',
'fontSize' : fontsize,
'width' : width,
'top' : width/2
'top' : (width - height)/2
});
// Positioning is different when in RTL mode.
@@ -760,16 +758,18 @@ DOCK.prototype = {
showregions = false,
i;
// First look for understood regions.
Y.all(SELECTOR.blockregion).each(function(){
Y.all(SELECTOR.blockregion).each(function(region){
var regionname = region.getData('blockregion');
if (region.all('.block').size() > 0) {
populatedblockregions++;
BODY.addClass('used-region-'+regionname);
BODY.removeClass('empty-region-'+regionname);
BODY.removeClass('docked-region-'+regionname);
} else if (region.all('.block_dock_placeholder').size() > 0) {
// There are no blocks in the region but there are placeholders.
// All blocks in this region have been docked.
BODY.addClass('empty-region-'+regionname);
BODY.addClass('docked-region-'+regionname);
BODY.removeClass('used-region-'+regionname);
}
});
@@ -1395,7 +1395,11 @@ TABHEIGHTMANAGER.prototype = {
var dock = this.get('dock'),
node = dock.get('dockNode'),
items = dock.dockeditems,
possibleheight = node.get('offsetHeight') - node.one('.controls').get('offsetHeight') - (dock.get('bufferPanel')*3) - (items.length*2),
containermargin = parseInt(node.one('.dockeditem_container').getStyle('marginTop').replace('/[^0-9]+$/', ''), 10),
dockheight = node.get('offsetHeight') - containermargin,
controlheight = node.one('.controls').get('offsetHeight'),
buffer = (dock.get('bufferPanel') * 3),
possibleheight = dockheight - controlheight - buffer - (items.length*2),
totalheight = 0,
id, dockedtitle;
if (items.length > 0) {
File diff suppressed because one or more lines are too long
+10 -6
View File
@@ -192,7 +192,7 @@ M.core.dock.fixTitleOrientation = function(title, text) {
}
// We need to fix a font-size - sorry theme designers.
test = Y.Node.create('<h2><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
test = Y.Node.create('<h2 class="transform-test-heading"><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
BODY.insert(test, 0);
width = test.one('span').get('offsetWidth') * 1.2;
height = test.one('span').get('offsetHeight');
@@ -203,12 +203,10 @@ M.core.dock.fixTitleOrientation = function(title, text) {
// Move the title into position
title.setStyles({
'margin' : '0',
'padding' : '0',
'position' : 'relative',
'fontSize' : fontsize,
'width' : width,
'top' : width/2
'top' : (width - height)/2
});
// Positioning is different when in RTL mode.
@@ -753,16 +751,18 @@ DOCK.prototype = {
showregions = false,
i;
// First look for understood regions.
Y.all(SELECTOR.blockregion).each(function(){
Y.all(SELECTOR.blockregion).each(function(region){
var regionname = region.getData('blockregion');
if (region.all('.block').size() > 0) {
populatedblockregions++;
BODY.addClass('used-region-'+regionname);
BODY.removeClass('empty-region-'+regionname);
BODY.removeClass('docked-region-'+regionname);
} else if (region.all('.block_dock_placeholder').size() > 0) {
// There are no blocks in the region but there are placeholders.
// All blocks in this region have been docked.
BODY.addClass('empty-region-'+regionname);
BODY.addClass('docked-region-'+regionname);
BODY.removeClass('used-region-'+regionname);
}
});
@@ -1384,7 +1384,11 @@ TABHEIGHTMANAGER.prototype = {
var dock = this.get('dock'),
node = dock.get('dockNode'),
items = dock.dockeditems,
possibleheight = node.get('offsetHeight') - node.one('.controls').get('offsetHeight') - (dock.get('bufferPanel')*3) - (items.length*2),
containermargin = parseInt(node.one('.dockeditem_container').getStyle('marginTop').replace('/[^0-9]+$/', ''), 10),
dockheight = node.get('offsetHeight') - containermargin,
controlheight = node.one('.controls').get('offsetHeight'),
buffer = (dock.get('bufferPanel') * 3),
possibleheight = dockheight - controlheight - buffer - (items.length*2),
totalheight = 0,
id, dockedtitle;
if (items.length > 0) {
+5 -5
View File
@@ -191,7 +191,7 @@ M.core.dock.fixTitleOrientation = function(title, text) {
}
// We need to fix a font-size - sorry theme designers.
test = Y.Node.create('<h2><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
test = Y.Node.create('<h2 class="transform-test-heading"><span class="transform-test-node" style="font-size:'+fontsize+';">'+text+'</span></h2>');
BODY.insert(test, 0);
width = test.one('span').get('offsetWidth') * 1.2;
height = test.one('span').get('offsetHeight');
@@ -202,12 +202,10 @@ M.core.dock.fixTitleOrientation = function(title, text) {
// Move the title into position
title.setStyles({
'margin' : '0',
'padding' : '0',
'position' : 'relative',
'fontSize' : fontsize,
'width' : width,
'top' : width/2
'top' : (width - height)/2
});
// Positioning is different when in RTL mode.
@@ -758,16 +756,18 @@ DOCK.prototype = {
showregions = false,
i;
// First look for understood regions.
Y.all(SELECTOR.blockregion).each(function(){
Y.all(SELECTOR.blockregion).each(function(region){
var regionname = region.getData('blockregion');
if (region.all('.block').size() > 0) {
populatedblockregions++;
BODY.addClass('used-region-'+regionname);
BODY.removeClass('empty-region-'+regionname);
BODY.removeClass('docked-region-'+regionname);
} else if (region.all('.block_dock_placeholder').size() > 0) {
// There are no blocks in the region but there are placeholders.
// All blocks in this region have been docked.
BODY.addClass('empty-region-'+regionname);
BODY.addClass('docked-region-'+regionname);
BODY.removeClass('used-region-'+regionname);
}
});
+5 -1
View File
@@ -37,7 +37,11 @@ TABHEIGHTMANAGER.prototype = {
var dock = this.get('dock'),
node = dock.get('dockNode'),
items = dock.dockeditems,
possibleheight = node.get('offsetHeight') - node.one('.controls').get('offsetHeight') - (dock.get('bufferPanel')*3) - (items.length*2),
containermargin = parseInt(node.one('.dockeditem_container').getStyle('marginTop').replace('/[^0-9]+$/', ''), 10),
dockheight = node.get('offsetHeight') - containermargin,
controlheight = node.one('.controls').get('offsetHeight'),
buffer = (dock.get('bufferPanel') * 3),
possibleheight = dockheight - controlheight - buffer - (items.length*2),
totalheight = 0,
id, dockedtitle;
if (items.length > 0) {
+2 -2
View File
@@ -35,7 +35,7 @@ $THEME->name = 'bootstrapbase';
$THEME->parents = array();
$THEME->sheets = array('moodle');
$THEME->supportscssoptimisation = false;
$THEME->enable_dock = false;
$THEME->editor_sheets = array('editor');
$THEME->rendererfactory = 'theme_overridden_renderer_factory';
@@ -154,7 +154,7 @@ $THEME->layouts = array(
$THEME->javascripts = array(
);
$THEME->javascripts_footer = array(
'moodlebootstrap',
'moodlebootstrap', 'dock'
);
if (core_useragent::is_ie() && !core_useragent::check_ie_version('9.0')) {
+57
View File
@@ -0,0 +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(dock) {
// Add the "block" class to docked blocks.
// This prevents having to restyle all docked blocks and simply use standard block styling.
// 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);
}
});
}
+1
View File
@@ -56,6 +56,7 @@ body {
@import "moodle/tables";
@import "moodle/buttons";
@import "moodle/grade";
@import "moodle/dock";
// Anything below this line is considered expendable,
// so it doesn't matter if it doesn't show up in ie < 9
+24 -20
View File
@@ -9,38 +9,42 @@
display:none;
}
.empty-region-side-pre #block-region-side-pre,
.empty-region-side-post #block-region-side-post {
.empty-region-side-pre #block-region-side-pre, // Pre region is empty.
.empty-region-side-post #block-region-side-post, // Post region is empty.
.jsenabled.docked-region-side-post #block-region-side-post, // All post blocks are docked.
.jsenabled.docked-region-side-pre #block-region-side-pre { // All pre blocks are docked.
display:none;
}
.empty-region-side-post #region-bs-main-and-pre.span9,
.empty-region-side-pre #region-bs-main-and-post.span9,
.empty-region-side-post #region-bs-main-and-post.span9 #region-main.span8 {
/** LTR with no post area.
RTL with no pre area.
RTL with no post area. **/
.empty-region-side-post #region-bs-main-and-pre.span9, // LTR with no post area.
.empty-region-side-pre #region-bs-main-and-post.span9, // RTL with no pre area.
.empty-region-side-post #region-bs-main-and-post.span9 #region-main.span8, // RTL with no post area.
.jsenabled.docked-region-side-post #region-bs-main-and-pre.span9, // LTR with all post blocks docked.
.jsenabled.docked-region-side-post #region-bs-main-and-post.span9 #region-main.span8,
.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 { // RTL with all pre blocks docked.
width: 100%;
}
.empty-region-side-pre #region-bs-main-and-pre.span9 #region-main {
/** LTR with no pre area. **/
.empty-region-side-pre #region-bs-main-and-pre.span9 #region-main, // LTR with no pre area.
.jsenabled.docked-region-side-pre #region-bs-main-and-pre.span9 #region-main { // LTR with all pre blocks docked.
float:none;
width:100%;
}
// grid.less implied.
.empty-region-side-post.used-region-side-pre #region-main.span8 {
/** increase the span size by 1 **/
.fluid-span(9);
}
.empty-region-side-post.used-region-side-pre #block-region-side-pre.span4 {
/** decrease the span size by 1 **/
.fluid-span(3);
.empty-region-side-post.used-region-side-pre, // Post region is empty and pre region is in use.
.jsenabled.docked-region-side-post.used-region-side-pre { // All post blocks docked and pre region is in use.
#region-main.span8 {
/** Increase the span size by 1 **/
.fluid-span(9);
}
#block-region-side-pre.span4 {
/** Decrease the span size by 1 **/
.fluid-span(3);
}
}
.empty-region-side-pre #region-bs-main-and-post.span9 #region-main.span8 {
/** RTL with no pre area. **/
.empty-region-side-pre #region-bs-main-and-post.span9 #region-main.span8, // RTL with no pre area.
.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 #region-main.span8 { // RTL with all pre blocks docked.
float: right;
}
+148
View File
@@ -0,0 +1,148 @@
@dockWidth: 36px;
@dockTitleMargin: 3px;
@dockPanelWidth: (768px / 2);
@dockTitleFontSize: 11px;
/**
* This styles the H2 node the dock creates to test the width before making its title rotation.
* We need to apply these EXACT styles to the #dock .dockedtitle h2 to be sure things are spaced correctly.
*/
.transform-test-heading {
font-family: @sansFontFamily;
font-size: @dockTitleFontSize;
line-height: @dockWidth;
text-align: center;
font-weight: bold;
margin: 0;
padding: 0;
}
body.has_dock {
#page {
padding-left: (@dockWidth + (@dockTitleMargin * 3));
}
div#dock {
display: inline;
}
}
#dock {
width: (@dockWidth + (@dockTitleMargin * 2));
position: fixed;
top: 0;
left: 0;
height: 100%;
background-color: transparent;
border-right: 0 none;
.nothingdocked {
visibility: hidden;
display: none;
}
.dockeditem_container {
margin-top: 68px;
}
.dockeditem .firstdockitem {
margin-top: 1em;
}
.dockedtitle {
.btn;
display: block;
width: @dockWidth;
margin: @dockTitleMargin;
padding:0;
cursor: pointer;
h2 {
.transform-test-heading;
}
.filterrotate {
margin-left: 8px;
}
}
.controls {
position: absolute;
bottom: 1em;
text-align: center;
width: 100%;
img {
cursor: pointer;
}
}
}
#dockeditempanel {
z-index: 12000; /** Required to place the dock panel above the fixed pos navbar */
&.dockitempanel_hidden {
display: none;
}
min-width: 200px;
position: relative;
left: 100%;
padding-left: 5px;
.dockeditempanel_content {
background-color: @wellBackground;
width: @dockPanelWidth;
border: 1px solid darken(@grayLighter, 10%);
.box-shadow(2px 4px 4px 2px @grayLighter);
.border-radius(4px);
}
.dockeditempanel_bd {
overflow: auto; /** Required to make the content scrollable when it flows over the fixed area of the screen */
> * {
margin: 1em;
}
.block_navigation .block_tree li {
overflow: visible;
}
}
.dockeditempanel_hd {
border-bottom: 1px solid @white;
padding: 0.5em 1em;
h2 {
.nav-header;
font-size: 1.1em;
padding:0;
margin: 0;
}
.commands {
display: block;
text-align: right;
> a,
> span {
margin-left: 3px;
cursor: pointer;
}
img,
input {
vertical-align: middle;
margin-right: 1px;
}
.hidepanemicon img {
cursor: pointer;
}
}
}
}
.dir-rtl {
&.has_dock #page {
padding-left: 0;
padding-right: (@dockWidth + (@dockTitleMargin * 3));
}
#dock {
left: auto;
right: 0%;
.dockedtitle {
h2 {
line-height: @dockWidth - @dockTitleFontSize;
}
}
}
#dockeditempanel {
right: 100%;
.dockeditempanel_hd {
.commands {
text-align: left;
}
}
}
}
@@ -162,7 +162,8 @@
.fluid-span (@columns) {
.fluid-span-full(@columns, @fluidGridColumnWidth1200, @fluidGridGutterWidth1200);
}
.empty-region-side-post.used-region-side-pre { // Post region is empty and pre region is in use.
.empty-region-side-post.used-region-side-pre, // Post region is empty and pre region is in use.
.jsenabled.docked-region-side-post.used-region-side-pre { // All post blocks docked and pre region is in use.
#region-main.span8 {
/** increase the span size by 1 **/
.fluid-span(9);
@@ -199,7 +200,8 @@
.fluid-span (@columns) {
.fluid-span-full(@columns, @fluidGridColumnWidth768, @fluidGridGutterWidth768);
}
.empty-region-side-post.used-region-side-pre { // Post region is empty and pre region is in use.
.empty-region-side-post.used-region-side-pre, // Post region is empty and pre region is in use.
.jsenabled.docked-region-side-post.used-region-side-pre { // All post blocks docked and pre region is in use.
#region-main.span8 {
/** increase the span size by 1 **/
.fluid-span(9);
@@ -503,7 +505,8 @@
// cases when we have content in the side-pre blockregion but not in the
// side-post blockregion as there are more specific selectors in
// core.less which take precedence which break responsiveness.
.empty-region-side-post.used-region-side-pre { // Post region is empty and pre region is in use.
.empty-region-side-post.used-region-side-pre, // Post region is empty and pre region is in use.
.jsenabled.docked-region-side-post.used-region-side-pre { // All post blocks docked and pre region is in use.
#block-region-side-pre.span4,
#region-main.span8 {
.fluid-span(12);
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -41,7 +41,7 @@ $THEME->parents = array('bootstrapbase');
$THEME->sheets = array('custom');
$THEME->supportscssoptimisation = false;
$THEME->yuicssmodules = array();
$THEME->enable_dock = true;
$THEME->editor_sheets = array();
$THEME->rendererfactory = 'theme_overridden_renderer_factory';