Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-38923

Cannot dock blocks with Bootstrapbase/clean theme

    Details

    • Testing Instructions:
      Hide

      Test one

      1. Log in.
      2. Change to clean theme.
      3. Dock a block and check the dock works Ok.
      4. Remember which blocks you'd docked, refresh the page and check they're still docked.
      5. Dock all of the blocks on the left and check that the left area gets compacted (content area gets the space).
      6. Undock a block from the left and check that the left area is displayed correctly again.
      7. Dock all blocks on the right.
      8. Check that the right area gets compacted.
      9. Undock a block on the right and check that the right area returns to normal.
      10. Dock all blocks.
      11. Check that the content gets the full width of the page.
      12. Refresh the page.
      13. Check that all blocks are still docked.
      14. Undock everything using the "Undock all" button on the dock

      Test two.

      1. Log in as an admin.
      2. Create a new course with one topic and clean as its theme.
      3. Create three page activities, give them the following content: <p style='width:100%;background-color:#FFA800;">Blah</p>
      4. In the first make sure you've blocks on both the left and right.
      5. In the second move all blocks on the right over to the left.
      6. In the third move all blocks on the left over to the right.
      7. Turn off editing
      8. Browse each activity and complete the following checking that the layout doesn't visually jump and is correct. (of course if there are no blocks in the region below just skip that step).
        1. Undock all blocks. Refresh.
        2. Dock the blocks on the left. Refresh.
        3. Dock the blocks on the right. Refresh.
        4. Undock all blocks. Refresh.
        5. Dock all blocks. Refresh.
      9. Change to Hebrew and repeat.
      10. Disable JavaScript and repeat.
      11. Change back to English and repeat.

      You should have tested the the pages in both English and Hebrew both with JS enabled and JS disabled.

      Make a quick test in standard/other themes to make sure the docking works there as it did before

      Show
      Test one Log in. Change to clean theme. Dock a block and check the dock works Ok. Remember which blocks you'd docked, refresh the page and check they're still docked. Dock all of the blocks on the left and check that the left area gets compacted (content area gets the space). Undock a block from the left and check that the left area is displayed correctly again. Dock all blocks on the right. Check that the right area gets compacted. Undock a block on the right and check that the right area returns to normal. Dock all blocks. Check that the content gets the full width of the page. Refresh the page. Check that all blocks are still docked. Undock everything using the "Undock all" button on the dock Test two. Log in as an admin. Create a new course with one topic and clean as its theme. Create three page activities, give them the following content: <p style='width:100%;background-color:#FFA800;">Blah</p> In the first make sure you've blocks on both the left and right. In the second move all blocks on the right over to the left. In the third move all blocks on the left over to the right. Turn off editing Browse each activity and complete the following checking that the layout doesn't visually jump and is correct. (of course if there are no blocks in the region below just skip that step). Undock all blocks. Refresh. Dock the blocks on the left. Refresh. Dock the blocks on the right. Refresh. Undock all blocks. Refresh. Dock all blocks. Refresh. Change to Hebrew and repeat. Disable JavaScript and repeat. Change back to English and repeat. You should have tested the the pages in both English and Hebrew both with JS enabled and JS disabled. Make a quick test in standard/other themes to make sure the docking works there as it did before
    • Affected Branches:
      MOODLE_25_STABLE
    • Fixed Branches:
      MOODLE_27_STABLE
    • Pull 2.6 Branch:
      38923-26
    • Pull 2.6 Diff URL:
    • Pull Master Branch:
      38923-27
    • Pull Master Diff URL:
    • Sprint:
      FRONTEND Sprint 8
    • Story Points (Obsolete):
      13
    • Sprint:
      FRONTEND Sprint 8

      Description

      I suspect this is intentional behaviour. It may have been discussed and there may be reasoning for this.

      I thought I would report this distinction here in case no one had noticed and it was not previously discussed.

        Gliffy Diagrams

        1. bootstrap_docking.png
          40 kB
        2. clean-dock-blocks.png
          48 kB
        3. css_problems.png
          42 kB
        4. narrow_cropped.png
          29 kB
        5. narrow_expanded.png
          22 kB
        6. narrow_overlapping.png
          22 kB
        7. rtl_cropped.png
          17 kB

          Issue Links

            Activity

            Hide
            dougiamas Martin Dougiamas added a comment -

            Yes, this was discussed. Currently it's acceptable to not have it .... the responsive nature of the theme make it slightly less necessary to have docked blocks.

            That said, navigation is slightly more difficult ... I think the best way forward here is a new navigation mechanism that uses the "hamburger icon" menu at the top, and works very similarly to our new HTML5 app.

            However, I'd leave this open for completeness ... it would be ideal if the bootstrap theme could support them as an option at least.

            Show
            dougiamas Martin Dougiamas added a comment - Yes, this was discussed. Currently it's acceptable to not have it .... the responsive nature of the theme make it slightly less necessary to have docked blocks. That said, navigation is slightly more difficult ... I think the best way forward here is a new navigation mechanism that uses the "hamburger icon" menu at the top, and works very similarly to our new HTML5 app. However, I'd leave this open for completeness ... it would be ideal if the bootstrap theme could support them as an option at least.
            Hide
            bawjaws David Scotson added a comment -

            I believe Bas has this working now, at least in other Bootstrap-based themes.

            Show
            bawjaws David Scotson added a comment - I believe Bas has this working now, at least in other Bootstrap-based themes.
            Hide
            dougiamas Martin Dougiamas added a comment -

            Bas, do you have a fix for this?

            Show
            dougiamas Martin Dougiamas added a comment - Bas, do you have a fix for this?
            Hide
            basbrands Bas Brands added a comment - - edited

            This is intentional indeed. We guessed we don't need docking on a responsive theme and there was a rumour about having a "hide all blocks" button in Moodle core. I don't know if that is still true.

            This does not mean the Bootstrap theme cannot be used for docking. But adding it in requires additional JavaScript to make it work. The dock.js in Moodle core requires the traditional theme layout. Bootstrap uses the bootstrap grid to generate the block and content regions which is very different from tradition themes.

            I have done a Bootstrap version with some that hooks into the dock.js which allows this to work. If needed I can provide the details for that.

            Show
            basbrands Bas Brands added a comment - - edited This is intentional indeed. We guessed we don't need docking on a responsive theme and there was a rumour about having a "hide all blocks" button in Moodle core. I don't know if that is still true. This does not mean the Bootstrap theme cannot be used for docking. But adding it in requires additional JavaScript to make it work. The dock.js in Moodle core requires the traditional theme layout. Bootstrap uses the bootstrap grid to generate the block and content regions which is very different from tradition themes. I have done a Bootstrap version with some that hooks into the dock.js which allows this to work. If needed I can provide the details for that.
            Hide
            lazydaisy Mary Evans added a comment -

            I was just working on this, so assigned it to myself, but cannot get the dock working so assigning it back to you Bas.

            Something is very wrong with this theme. Even if you add the necessary block regions as is the norm in Base theme, even then the dock will not work.

            Is the dock.js blocked because of the YUI setting in config.php perhaps? I don't know.

            I find it very odd, as I use one of the original Twitter layouts in my Tiny (bootstrap) version, and the dock works OK in that theme. So why not in this version of Bootstrap?

            Show
            lazydaisy Mary Evans added a comment - I was just working on this, so assigned it to myself, but cannot get the dock working so assigning it back to you Bas. Something is very wrong with this theme. Even if you add the necessary block regions as is the norm in Base theme, even then the dock will not work. Is the dock.js blocked because of the YUI setting in config.php perhaps? I don't know. I find it very odd, as I use one of the original Twitter layouts in my Tiny (bootstrap) version, and the dock works OK in that theme. So why not in this version of Bootstrap?
            Hide
            lazydaisy Mary Evans added a comment -

            Thanks to Richard Oelmann, I now see what was stopping this from working.
            So fixing now.

            Show
            lazydaisy Mary Evans added a comment - Thanks to Richard Oelmann, I now see what was stopping this from working. So fixing now.
            Hide
            basbrands Bas Brands added a comment -

            My fix for this included adding JavaScript that hooks into the core dock.js. The main issues was resizing the block / content regions after a docking area. Bootstrap uses class=spanX for setting content sizes. Even if there is nothing in it. How is your fix going to work Mary?

            Show
            basbrands Bas Brands added a comment - My fix for this included adding JavaScript that hooks into the core dock.js. The main issues was resizing the block / content regions after a docking area. Bootstrap uses class=spanX for setting content sizes. Even if there is nothing in it. How is your fix going to work Mary?
            Hide
            lazydaisy Mary Evans added a comment -

            I'm just testing it now...so will let you know.

            Show
            lazydaisy Mary Evans added a comment - I'm just testing it now...so will let you know.
            Hide
            lazydaisy Mary Evans added a comment - - edited

            I see...I missed that.
            In that can you fix this then because it's needed in Simple theme?

            Show
            lazydaisy Mary Evans added a comment - - edited I see...I missed that. In that can you fix this then because it's needed in Simple theme?
            Hide
            lazydaisy Mary Evans added a comment -

            You will probably have to wait now until Moodle gets updated as there have been a lot of changes to Bootstrap to get Drag and Drop working.

            Show
            lazydaisy Mary Evans added a comment - You will probably have to wait now until Moodle gets updated as there have been a lot of changes to Bootstrap to get Drag and Drop working.
            Hide
            gb2048 Gareth J Barnard added a comment -

            Hi,

            Any progress as came up quite a bit at iMoot for users desires to have it back? Just wondering .

            Cheers,

            Gareth

            Show
            gb2048 Gareth J Barnard added a comment - Hi, Any progress as came up quite a bit at iMoot for users desires to have it back? Just wondering . Cheers, Gareth
            Hide
            majd Majd Edriss added a comment -

            Hi,

            are there any news regarding the docking with Bootstrap theme?

            Thank you,

            Majd

            Show
            majd Majd Edriss added a comment - Hi, are there any news regarding the docking with Bootstrap theme? Thank you, Majd
            Hide
            lazydaisy Mary Evans added a comment -

            Is anyone actually working on this? Indeed can it be fixed?

            Show
            lazydaisy Mary Evans added a comment - Is anyone actually working on this? Indeed can it be fixed?
            Hide
            basbrands Bas Brands added a comment -

            Hi all,

            I have it fixed in a custom theme I have build, the fix uses a YUI script that plugs into the docking JavaScript in Moodle core. I works really well so I will test it on the core theme too and submit it to the tracker.

            Show
            basbrands Bas Brands added a comment - Hi all, I have it fixed in a custom theme I have build, the fix uses a YUI script that plugs into the docking JavaScript in Moodle core. I works really well so I will test it on the core theme too and submit it to the tracker.
            Hide
            dougiamas Martin Dougiamas added a comment -

            Awesome, thanks Bas!

            Show
            dougiamas Martin Dougiamas added a comment - Awesome, thanks Bas!
            Hide
            majd Majd Edriss added a comment -

            Thank you Bas.

            Show
            majd Majd Edriss added a comment - Thank you Bas.
            Hide
            drex Mark Drechsler added a comment -

            Thanks Bas

            Is this going to become part of core soon? Very keen to use Bootstrap, but don't want to be creating custom stuff if we don't need to.

            Thanks,

            Mark.

            Show
            drex Mark Drechsler added a comment - Thanks Bas Is this going to become part of core soon? Very keen to use Bootstrap, but don't want to be creating custom stuff if we don't need to. Thanks, Mark.
            Hide
            dmonllao David Monllaó added a comment -

            Hi Bas,

            While working on MDL-40741 I've found a couple of failures due to the lack of blocks docking, good to hear that this feature will be available in the core theme

            Show
            dmonllao David Monllaó added a comment - Hi Bas, While working on MDL-40741 I've found a couple of failures due to the lack of blocks docking, good to hear that this feature will be available in the core theme
            Hide
            basbrands Bas Brands added a comment -

            Hi there,

            I have done a first attempt at adding docking to the bootstrapbase theme. I am still testing it and anybody interested is welcome to test it on http://theming.sonsbeekmedia.nl.

            To enable it I added one javascript file and custom docked block styling.

            Cheers,
            Bas

            Show
            basbrands Bas Brands added a comment - Hi there, I have done a first attempt at adding docking to the bootstrapbase theme. I am still testing it and anybody interested is welcome to test it on http://theming.sonsbeekmedia.nl . To enable it I added one javascript file and custom docked block styling. Cheers, Bas
            Hide
            mspall Michael Spall added a comment -

            Bas,

            In testing on your site, what we notice is that if you dock all the blocks, the content column doesn't expand to fill the space taken up by the block column.

            Show
            mspall Michael Spall added a comment - Bas, In testing on your site, what we notice is that if you dock all the blocks, the content column doesn't expand to fill the space taken up by the block column.
            Hide
            basbrands Bas Brands added a comment -

            Hi Michael,

            Sorry made a JS typo. It should be okay now

            Show
            basbrands Bas Brands added a comment - Hi Michael, Sorry made a JS typo. It should be okay now
            Hide
            dougiamas Martin Dougiamas added a comment -

            I think it looks great! Code?

            Show
            dougiamas Martin Dougiamas added a comment - I think it looks great! Code?
            Hide
            majd Majd Edriss added a comment -

            Great work, thank you Bas

            I notice that if you dock the middle content, for example course overview, the close and undock buttons are not in the same div (see the screenshot).

            Do you think about adding the function "undock all"?

            Show
            majd Majd Edriss added a comment - Great work, thank you Bas I notice that if you dock the middle content, for example course overview, the close and undock buttons are not in the same div (see the screenshot). Do you think about adding the function "undock all"?
            Hide
            basbrands Bas Brands added a comment -

            I will finish the code this week. It needs a bit of cleaning and there is another bug when editting is turned on.

            The docking script is here: https://github.com/bmbrands/theme_cormic/blob/master/javascript/dockmod.js

            and the dock.less file here: https://github.com/bmbrands/theme_cormic/blob/master/less/moodle/dock.less

            The undock all button is not visible yet, so got to fix that too.

            Show
            basbrands Bas Brands added a comment - I will finish the code this week. It needs a bit of cleaning and there is another bug when editting is turned on. The docking script is here: https://github.com/bmbrands/theme_cormic/blob/master/javascript/dockmod.js and the dock.less file here: https://github.com/bmbrands/theme_cormic/blob/master/less/moodle/dock.less The undock all button is not visible yet, so got to fix that too.
            Hide
            lazydaisy Mary Evans added a comment -

            Hi Bas, I am not that good with JavaScript because I have not learned enough about it, but I do understand some of it.

            I see you have made provision for when all blocks are docked either region-pre or region-post, but what happens to the layout if not all the blocks are docked? For example, if some blocks are in a custom block region in say the footer, as in the Essential theme, will you be taking these extra 'block regions' into account, as this is something that is still unresolved in standard Moodle themes?

            Show
            lazydaisy Mary Evans added a comment - Hi Bas, I am not that good with JavaScript because I have not learned enough about it, but I do understand some of it. I see you have made provision for when all blocks are docked either region-pre or region-post, but what happens to the layout if not all the blocks are docked? For example, if some blocks are in a custom block region in say the footer, as in the Essential theme, will you be taking these extra 'block regions' into account, as this is something that is still unresolved in standard Moodle themes?
            Hide
            lazydaisy Mary Evans added a comment - - edited

            Bas I see you are requesting Peer Review, but there is no git branch available to Peer Review. Assuming of course all the code you link to in your comment above is in something like wip-MDL-38923_master ?

            Show
            lazydaisy Mary Evans added a comment - - edited Bas I see you are requesting Peer Review, but there is no git branch available to Peer Review. Assuming of course all the code you link to in your comment above is in something like wip- MDL-38923 _master ?
            Hide
            basbrands Bas Brands added a comment -

            Hi Mary,

            I am still trying to get it all right before I am ready for a pear review. There's a few issues with RTL pages and I need to prevent the left margin jumping on page loads.

            But it is getting there and when I feel confident about my solution I will create the wip branch

            Thanks

            Show
            basbrands Bas Brands added a comment - Hi Mary, I am still trying to get it all right before I am ready for a pear review. There's a few issues with RTL pages and I need to prevent the left margin jumping on page loads. But it is getting there and when I feel confident about my solution I will create the wip branch Thanks
            Hide
            dougiamas Martin Dougiamas added a comment -

            Not much time to freeze for 2.6

            Show
            dougiamas Martin Dougiamas added a comment - Not much time to freeze for 2.6
            Hide
            lazydaisy Mary Evans added a comment -

            Sorry for asking a dumb question Martin but where is the information regarding Moodle 2.6?

            Show
            lazydaisy Mary Evans added a comment - Sorry for asking a dumb question Martin but where is the information regarding Moodle 2.6?
            Hide
            salvetore Michael de Raadt added a comment -

            Hi, Mary.

            If you're after dates, they are written down here... http://docs.moodle.org/dev/Roadmap

            If you're after the general case, that's expressed here... http://docs.moodle.org/dev/Process#Major_release_cycles

            Show
            salvetore Michael de Raadt added a comment - Hi, Mary. If you're after dates, they are written down here... http://docs.moodle.org/dev/Roadmap If you're after the general case, that's expressed here... http://docs.moodle.org/dev/Process#Major_release_cycles
            Hide
            majd Majd Edriss added a comment -

            Hello Bas,

            I tested the cormic theme on moodle 2.5 and it works great. Do you have an idea how to customize the dock function for a theme based on the bootstrap theme for moodle 2.4?
            I added the .less, .js and .css files from the cormic theme to the bootstrap theme and modified the config.php, but the docking is not working. I can dock the blocks, but the left bar does not appear to undock the blocks again.

            I know this theme with the dock was only developed for moodle 2.5 and higher versions, but I am currently working on a responsive theme for moodle 2.4 based on your bootstrap theme. If you have an idea how to fix that problem, I would be thankful for your support.

            Show
            majd Majd Edriss added a comment - Hello Bas, I tested the cormic theme on moodle 2.5 and it works great. Do you have an idea how to customize the dock function for a theme based on the bootstrap theme for moodle 2.4? I added the .less, .js and .css files from the cormic theme to the bootstrap theme and modified the config.php, but the docking is not working. I can dock the blocks, but the left bar does not appear to undock the blocks again. I know this theme with the dock was only developed for moodle 2.5 and higher versions, but I am currently working on a responsive theme for moodle 2.4 based on your bootstrap theme. If you have an idea how to fix that problem, I would be thankful for your support.
            Hide
            lazydaisy Mary Evans added a comment -

            I am sorry to say Majd, but this is not the place to be asking for help from Bas when he has a deadline to stick to. We have a Themes Forum for this type of question. There are lots of developers who contribute to that forum who can answer you there.

            Thank you,
            Mary

            Show
            lazydaisy Mary Evans added a comment - I am sorry to say Majd, but this is not the place to be asking for help from Bas when he has a deadline to stick to. We have a Themes Forum for this type of question. There are lots of developers who contribute to that forum who can answer you there. Thank you, Mary
            Hide
            majd Majd Edriss added a comment -

            My question actually was about docking for the bootstrap theme and this forum treats the docking topic
            Anyway I`m sorry, if I made a mistake with my question.

            Thank you for your hint,
            Majd

            Show
            majd Majd Edriss added a comment - My question actually was about docking for the bootstrap theme and this forum treats the docking topic Anyway I`m sorry, if I made a mistake with my question. Thank you for your hint, Majd
            Hide
            roelmann Richard Oelmann added a comment -

            Hi Majd - I think Mary's point was that this isn't actually the forum treating the docking topic, it's the tracker where the developers (Bas in this case) work on the improvements and bug fixes for Moodle. Mary's link will take you to the forum where people can help with your query more appropriately
            Richard

            Show
            roelmann Richard Oelmann added a comment - Hi Majd - I think Mary's point was that this isn't actually the forum treating the docking topic, it's the tracker where the developers (Bas in this case) work on the improvements and bug fixes for Moodle. Mary's link will take you to the forum where people can help with your query more appropriately Richard
            Hide
            mcwoods Michael Woods added a comment -

            Any developments on this? We'd really like to launch our 2.6 upgrade with a bootstrap-based theme, but we don't want to lose the ability to dock blocks.

            Show
            mcwoods Michael Woods added a comment - Any developments on this? We'd really like to launch our 2.6 upgrade with a bootstrap-based theme, but we don't want to lose the ability to dock blocks.
            Hide
            dougiamas Martin Dougiamas added a comment -

            Well, unfortunately code freeze has arrived and we still don't have the code so it's going to miss 2.6 ...

            Show
            dougiamas Martin Dougiamas added a comment - Well, unfortunately code freeze has arrived and we still don't have the code so it's going to miss 2.6 ...
            Hide
            basbrands Bas Brands added a comment -

            I am sorry I did not finish this before the code freeze I have been overbooked since I started working as a freelancer 3 months ago. but that's a not good excuse, so I will try and finish the code soon.

            Show
            basbrands Bas Brands added a comment - I am sorry I did not finish this before the code freeze I have been overbooked since I started working as a freelancer 3 months ago. but that's a not good excuse, so I will try and finish the code soon.
            Hide
            dougiamas Martin Dougiamas added a comment -

            As it's pretty much working why not just make it available so we can finish it?

            Show
            dougiamas Martin Dougiamas added a comment - As it's pretty much working why not just make it available so we can finish it?
            Hide
            basbrands Bas Brands added a comment -

            Okay It's available on: https://github.com/bmbrands/moodle/tree/wip-MDL-32923
            There is only one problem: the new YUI code for docking seems to have a bug. On line
            763 of moodle-core-dock-debug.js

            Y.all(SELECTOR.blockregion).each(function(){

            should be:

            Y.all(SELECTOR.blockregion).each(function(region){

            With that single change my docking code works. I guess I need to make an new tracker issue for that.

            Show
            basbrands Bas Brands added a comment - Okay It's available on: https://github.com/bmbrands/moodle/tree/wip-MDL-32923 There is only one problem: the new YUI code for docking seems to have a bug. On line 763 of moodle-core-dock-debug.js Y.all(SELECTOR.blockregion).each(function(){ should be: Y.all(SELECTOR.blockregion).each(function(region){ With that single change my docking code works. I guess I need to make an new tracker issue for that.
            Hide
            lazydaisy Mary Evans added a comment -

            Bas, you have the wrong branch number in this patch, MDL-32923 was fixed in May 2012 for something completely different!

            Can you change your patch to wip-MDL-38923 please?

            I'll test it after you make these changes. Also please make sure it is on the most recent Moodle master branch?

            Thanks

            Show
            lazydaisy Mary Evans added a comment - Bas, you have the wrong branch number in this patch, MDL-32923 was fixed in May 2012 for something completely different! Can you change your patch to wip- MDL-38923 please? I'll test it after you make these changes. Also please make sure it is on the most recent Moodle master branch? Thanks
            Hide
            dougiamas Martin Dougiamas added a comment -

            The name might be wrong but the code looks like it's for this.

            Show
            dougiamas Martin Dougiamas added a comment - The name might be wrong but the code looks like it's for this.
            Hide
            basbrands Bas Brands added a comment -

            Sorry about that, here's a branch with the correct name:
            https://github.com/bmbrands/moodle/tree/wip-MDL-38923

            Cheers

            Show
            basbrands Bas Brands added a comment - Sorry about that, here's a branch with the correct name: https://github.com/bmbrands/moodle/tree/wip-MDL-38923 Cheers
            Hide
            lazydaisy Mary Evans added a comment -

            @Bas Thanks I have edited the links to this new branch at the top of this page where we usually add all the Pull Branch Diffs when submitting for reviews be they 'Peer' or 'Integration'. The Moodle Integrators are quite strict about this, so it's good practice for you as we all learn by our mistakes.

            @Martin, the code may be correct but if the branch name isn't then it cannot be integrated until it's changed. I don't see why this should be any different than what everyone else has to do when it comes to following the rules of the Moodle Integration Review game.

            Show
            lazydaisy Mary Evans added a comment - @Bas Thanks I have edited the links to this new branch at the top of this page where we usually add all the Pull Branch Diffs when submitting for reviews be they 'Peer' or 'Integration'. The Moodle Integrators are quite strict about this, so it's good practice for you as we all learn by our mistakes. @Martin, the code may be correct but if the branch name isn't then it cannot be integrated until it's changed. I don't see why this should be any different than what everyone else has to do when it comes to following the rules of the Moodle Integration Review game.
            Hide
            lazydaisy Mary Evans added a comment - - edited

            @Bas,
            This is not working in Clean theme since all the changes only relate to theme/bootstrapbase. Unfortunately $THEME->enable_dock = true cannot be inherited since parent themes are, by default, non-docking (see theme/base/config.php and theme/canvas/config.php), so you need to add that bit of code to theme/clean/config.php.

            Show
            lazydaisy Mary Evans added a comment - - edited @Bas, This is not working in Clean theme since all the changes only relate to theme/bootstrapbase. Unfortunately $THEME->enable_dock = true cannot be inherited since parent themes are, by default, non-docking (see theme/base/config.php and theme/canvas/config.php), so you need to add that bit of code to theme/clean/config.php.
            Hide
            basbrands Bas Brands added a comment -

            Mary Evans, I just did.

            Show
            basbrands Bas Brands added a comment - Mary Evans , I just did.
            Hide
            lazydaisy Mary Evans added a comment - - edited

            @Bas,
            Having just tested the dock in Clean theme, it appears to be working as designed so passing on condition that you tidy up the dock.less file to reduce the number of empty lines between blocks of markup, fix theme/bootstrapbase/config.php as described below.

             
            @line 7, 8 and 114 can all go as one line is ample.
             
            @line 75 box-shadow is indented 1 pixel too many.
             
             
            In theme/bootstrapbase/config.php
             
            needs a space adding after the , before 'dockmod' like so...
             
            $THEME->javascripts_footer = array(
                'moodlebootstrap', 'dockmod'
            );
             
            also you need to disable docking in theme/bootstrapbase/config.php
             
            $THEME->enable_dock = false; 
            
            

            Sorry if this is sounding a bit picky but is da rulz! unless Martin wants to change them?

            Other than that it works great!

            Thanks

            Mary

            Show
            lazydaisy Mary Evans added a comment - - edited @Bas, Having just tested the dock in Clean theme, it appears to be working as designed so passing on condition that you tidy up the dock.less file to reduce the number of empty lines between blocks of markup, fix theme/bootstrapbase/config.php as described below.   @line 7, 8 and 114 can all go as one line is ample.   @line 75 box-shadow is indented 1 pixel too many.     In theme/bootstrapbase/config.php   needs a space adding after the , before 'dockmod' like so...   $THEME->javascripts_footer = array( 'moodlebootstrap', 'dockmod' );   also you need to disable docking in theme/bootstrapbase/config.php   $THEME->enable_dock = false; Sorry if this is sounding a bit picky but is da rulz! unless Martin wants to change them? Other than that it works great! Thanks Mary
            Hide
            basbrands Bas Brands added a comment -

            Okay thanks for checking.

            I have changed it and guess it should follow the coding guidelines now.

            Please note this change required a core JavaScript change:

            On line 763 of moodle-core-dock-debug.js

            Y.all(SELECTOR.blockregion).each(function(){

            should be:

            Y.all(SELECTOR.blockregion).each(function(region){

            I am guessing the omitted (region) is a bug but I am not sure. I wonder why the region var was removed.

            Show
            basbrands Bas Brands added a comment - Okay thanks for checking. I have changed it and guess it should follow the coding guidelines now. Please note this change required a core JavaScript change: On line 763 of moodle-core-dock-debug.js Y.all(SELECTOR.blockregion).each(function(){ should be: Y.all(SELECTOR.blockregion).each(function(region){ I am guessing the omitted (region) is a bug but I am not sure. I wonder why the region var was removed.
            Hide
            lazydaisy Mary Evans added a comment -

            It must be a bug, the only way to find out when and where it was changed is back track it. It was probably changed with the simplification of themes. Sam Hemelryk would be the best person to ask.

            Anyway, the fact that change is in your commit for this patch makes the dock work, so all being well it should be accepted.

            I'll set it for Integration Review and lets see how it goes

            Show
            lazydaisy Mary Evans added a comment - It must be a bug, the only way to find out when and where it was changed is back track it. It was probably changed with the simplification of themes. Sam Hemelryk would be the best person to ask. Anyway, the fact that change is in your commit for this patch makes the dock work, so all being well it should be accepted. I'll set it for Integration Review and lets see how it goes
            Hide
            stronk7 Eloy Lafuente (stronk7) added a comment -

            The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week.

            TIA and ciao

            Show
            stronk7 Eloy Lafuente (stronk7) added a comment - The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week. TIA and ciao
            Hide
            damyon Damyon Wiese added a comment -

            Sorry Baz,

            This has arrived too late and IMO it needs more work.

            I attached a screenshot showing various problems with this patch visually and there are also things that need fixing in the javascript.

            Some comments from looking at the css/javascript:
            a) Needs more comments
            b) Js functions not documented properly
            c) Redeclaring Js variables (e.g. mainwrapper)
            d) Comments missing punctuation at the end of the line
            e) Randomly assigned z-indexes (we are trying to kill all these in core)

            Show
            damyon Damyon Wiese added a comment - Sorry Baz, This has arrived too late and IMO it needs more work. I attached a screenshot showing various problems with this patch visually and there are also things that need fixing in the javascript. Some comments from looking at the css/javascript: a) Needs more comments b) Js functions not documented properly c) Redeclaring Js variables (e.g. mainwrapper) d) Comments missing punctuation at the end of the line e) Randomly assigned z-indexes (we are trying to kill all these in core)
            Hide
            cibot CiBoT added a comment -

            Moving this reopened issue out from current integration. Please, re-submit it for integration once ready.

            Show
            cibot CiBoT added a comment - Moving this reopened issue out from current integration. Please, re-submit it for integration once ready.
            Hide
            lazydaisy Mary Evans added a comment -

            @Jason, where is var mainwrapper redeclared? The only places I can see are in conditional statment ie. for RTL mode where the dock changes side.

            As for comments missing punctuation, well I can find hundreds in Moodle core that have been added by what I would consider professional developers, I don't see them getting pulled up for this sort of thing?

            Docking need z-indexes so not sure why you consider to do away with them, or have I miss read what you said?

            Show
            lazydaisy Mary Evans added a comment - @Jason, where is var mainwrapper redeclared? The only places I can see are in conditional statment ie. for RTL mode where the dock changes side. As for comments missing punctuation, well I can find hundreds in Moodle core that have been added by what I would consider professional developers, I don't see them getting pulled up for this sort of thing? Docking need z-indexes so not sure why you consider to do away with them, or have I miss read what you said?
            Hide
            gharbor Grant Harbor added a comment -

            Is there a plan to have Bootstrap Docking working for Moodle 2.7 core? I'm just trying to plan for my theme design.

            Show
            gharbor Grant Harbor added a comment - Is there a plan to have Bootstrap Docking working for Moodle 2.7 core? I'm just trying to plan for my theme design.
            Hide
            salvetore Michael de Raadt added a comment -

            We are planning do to a lot more work on the Bootstrap themes between now and 2.7, and this issue is high up on the list. No guarantees, but I would like to say yes.

            Show
            salvetore Michael de Raadt added a comment - We are planning do to a lot more work on the Bootstrap themes between now and 2.7, and this issue is high up on the list. No guarantees, but I would like to say yes.
            Hide
            rezeau Joseph Rézeau added a comment -

            Should not the lack of the docking facility in the Bootstrap based themes be considered a serious regression?

            Show
            rezeau Joseph Rézeau added a comment - Should not the lack of the docking facility in the Bootstrap based themes be considered a serious regression ?
            Hide
            vaughany Paul Vaughan added a comment -

            We would LOVE to see a dock-enabled Bootstrap theme in Moodle. It would keep it in line with most of our other web products, make it more accessible to mobile users, the usual gamut of positives which come from such technologies.

            Also, what Joseph Rézeau said.

            Show
            vaughany Paul Vaughan added a comment - We would LOVE to see a dock-enabled Bootstrap theme in Moodle. It would keep it in line with most of our other web products, make it more accessible to mobile users, the usual gamut of positives which come from such technologies. Also, what Joseph Rézeau said.
            Hide
            gb2048 Gareth J Barnard added a comment -

            Pragmatically, does docking work from a UX point of view on mobile devices?

            Show
            gb2048 Gareth J Barnard added a comment - Pragmatically, does docking work from a UX point of view on mobile devices?
            Hide
            mcwoods Michael Woods added a comment -

            Pragmatically, docking doesn't make much sense on small mobile devices, but plenty of our staff still use laptops and/or large screens and would appreciate every opportunity to gain screen real-estate where possible.

            Show
            mcwoods Michael Woods added a comment - Pragmatically, docking doesn't make much sense on small mobile devices, but plenty of our staff still use laptops and/or large screens and would appreciate every opportunity to gain screen real-estate where possible.
            Hide
            gharbor Grant Harbor added a comment -

            Yeah, there are a lot of screens in Moodle, like the Grade book page which need the screen real estate to view the content properly and the admin and navigation block take up a third of the screen. Grading assignments are another example.

            Good to hear it's coming back..

            Show
            gharbor Grant Harbor added a comment - Yeah, there are a lot of screens in Moodle, like the Grade book page which need the screen real estate to view the content properly and the admin and navigation block take up a third of the screen. Grading assignments are another example. Good to hear it's coming back..
            Hide
            roelmann Richard Oelmann added a comment -

            @Gareth, Its not just about mobile devices though - the bootstrap themes are touted as fully responsive and able to be used on all devices and that includes full size laptop/desktop screens where the dock is widely used.
            For me, this has always been a blocker in using bootstrap based themes - I know others may not see it the same way, but I agree completely with Joseph - this was/is a major regression

            Show
            roelmann Richard Oelmann added a comment - @Gareth, Its not just about mobile devices though - the bootstrap themes are touted as fully responsive and able to be used on all devices and that includes full size laptop/desktop screens where the dock is widely used. For me, this has always been a blocker in using bootstrap based themes - I know others may not see it the same way, but I agree completely with Joseph - this was/is a major regression
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Hi Bas,

            I saw this had being added to our sprint and thought I may try to lend you a hand.
            I've cleaned up a few things and tried to address concerns raised by Damyon.
            I created a branch that builds ontop of the work you've already put in.
            Would you mind having a look at it and seeing if it is something you are happy with?

            Diff: http://icodedthat.com/38923-27
            Repo: git://github.com/samhemelryk/moodle.git
            Branch: 38923-27

            Many thanks
            Sam

            Show
            samhemelryk Sam Hemelryk added a comment - Hi Bas, I saw this had being added to our sprint and thought I may try to lend you a hand. I've cleaned up a few things and tried to address concerns raised by Damyon. I created a branch that builds ontop of the work you've already put in. Would you mind having a look at it and seeing if it is something you are happy with? Diff: http://icodedthat.com/38923-27 Repo: git://github.com/samhemelryk/moodle.git Branch: 38923-27 Many thanks Sam
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Hi Bas Brands do you think you'd have time to have a look at this again?

            Show
            samhemelryk Sam Hemelryk added a comment - Hi Bas Brands do you think you'd have time to have a look at this again?
            Hide
            basbrands Bas Brands added a comment -

            Hi Sam,

            Sure I missed your message you send on the 8th. I will have a look and try it

            Regards,
            Bas

            Show
            basbrands Bas Brands added a comment - Hi Sam, Sure I missed your message you send on the 8th. I will have a look and try it Regards, Bas
            Hide
            basbrands Bas Brands added a comment -

            Hi Sam,

            I looked at it and yes I am very happy you cleaned it up and work on both the core docking js, the less files and the dock.js.

            It would really nice to have this in core.

            Thanks a lot!

            Show
            basbrands Bas Brands added a comment - Hi Sam, I looked at it and yes I am very happy you cleaned it up and work on both the core docking js, the less files and the dock.js. It would really nice to have this in core. Thanks a lot!
            Hide
            jmacedo Jose Maria Acedo added a comment -

            In moodle 2.6 don't work

            Show
            jmacedo Jose Maria Acedo added a comment - In moodle 2.6 don't work
            Hide
            lazydaisy Mary Evans added a comment -

            @Jose,
            Which code did you test?
            I assume you were testing Sam's latest fix?

            Show
            lazydaisy Mary Evans added a comment - @Jose, Which code did you test? I assume you were testing Sam's latest fix?
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Thanks Bas, I'm putting this up for integration review now.

            As this is an improvement it is destined for master only (2.7).
            However I suspect that this may be popular so I purpose that once integrated we open a new issue to see it backported and get those who would like to see this backported to vote on the new issue.
            The patch I've purposed here I've only tested on master, I've not tried to backport it yet. No doubt it would need to be closely tested when backported.

            Cheers
            Sam

            Show
            samhemelryk Sam Hemelryk added a comment - Thanks Bas, I'm putting this up for integration review now. As this is an improvement it is destined for master only (2.7). However I suspect that this may be popular so I purpose that once integrated we open a new issue to see it backported and get those who would like to see this backported to vote on the new issue. The patch I've purposed here I've only tested on master, I've not tried to backport it yet. No doubt it would need to be closely tested when backported. Cheers Sam
            Hide
            derekcx Derek Chirnside added a comment -

            I'm not convinced of your logic that this is an 'improvement' Sam. I'd say Theme+docability is expected, and this is a 'regression'. Will be interesting to see the voting.

            -Derek

            Show
            derekcx Derek Chirnside added a comment - I'm not convinced of your logic that this is an 'improvement' Sam. I'd say Theme+docability is expected, and this is a 'regression'. Will be interesting to see the voting. -Derek
            Hide
            gb2048 Gareth J Barnard added a comment -

            Cheer up Derek Chirnside - at least its moving in a forward direction!

            Show
            gb2048 Gareth J Barnard added a comment - Cheer up Derek Chirnside - at least its moving in a forward direction!
            Hide
            dougiamas Martin Dougiamas added a comment - - edited

            +1 for a backport to 2.6 at least. As it's fixing a bug, it's popular, and there are no database changes then I don't think we need separate votes. The backport should be on this bug in a separate branch.

            The only question mark I have is for theme compatibility in the 2.6.x series. Are themes developed for 2.6.1 without docks going to have trouble on 2.6.2 with docks? And vice versa?

            Show
            dougiamas Martin Dougiamas added a comment - - edited +1 for a backport to 2.6 at least. As it's fixing a bug, it's popular, and there are no database changes then I don't think we need separate votes. The backport should be on this bug in a separate branch. The only question mark I have is for theme compatibility in the 2.6.x series. Are themes developed for 2.6.1 without docks going to have trouble on 2.6.2 with docks? And vice versa?
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Alrighty, I think we can backport 2.6 with pretty good confidence.
            The dock should function as it does now in 2.6, the new dock will look like it does in clean, themes/sites will likely want to customise the look a little, it should be pretty easy there is a tutorial on it.
            For those who really don't want it it can be easily disabled in the config.php file of the theme they are using.
            I'll produce a 2.6 branch in the next day or two.

            Show
            samhemelryk Sam Hemelryk added a comment - Alrighty, I think we can backport 2.6 with pretty good confidence. The dock should function as it does now in 2.6, the new dock will look like it does in clean, themes/sites will likely want to customise the look a little, it should be pretty easy there is a tutorial on it. For those who really don't want it it can be easily disabled in the config.php file of the theme they are using. I'll produce a 2.6 branch in the next day or two.
            Hide
            dougiamas Martin Dougiamas added a comment -

            Thanks Sam

            Show
            dougiamas Martin Dougiamas added a comment - Thanks Sam
            Hide
            nebgor Aparup Banerjee added a comment -

            https://github.com/nebgor/moodle/compare/de46f0fd70...moodle.org-2.6-theme_bootstrapbase-hack-docking_backport_MDL-38923
            back ported into 2.6.1 and had an issue with theme with post-side only so above shows patch.

            Show
            nebgor Aparup Banerjee added a comment - https://github.com/nebgor/moodle/compare/de46f0fd70...moodle.org-2.6-theme_bootstrapbase-hack-docking_backport_MDL-38923 back ported into 2.6.1 and had an issue with theme with post-side only so above shows patch.
            Hide
            lazydaisy Mary Evans added a comment -

            @Aparup, you mentioned problem with dock when side-post-only theme. My concerns are for those themes that have custom block regions, like the Essential theme where you have footer-right, footer-left, and footer-middle. Will these blocks regions be dockable too?

            Show
            lazydaisy Mary Evans added a comment - @Aparup, you mentioned problem with dock when side-post-only theme. My concerns are for those themes that have custom block regions, like the Essential theme where you have footer-right, footer-left, and footer-middle. Will these blocks regions be dockable too?
            Hide
            samhemelryk Sam Hemelryk added a comment -

            I was speaking with Apu yesterday about the issue he saw.
            At the moment the solution for docks relies on the JS in theme/bootstrapbase/javascript/dock.js which makes assumptions about the block regions being used by the theme.
            Going with the current approach if you were to use a different set of block regions (as Apu has with the theme he is working on) then you'd be required to override that JS and add your own code to switch around the bootstrap column classes.
            Thinking about it a better solution would probably be to utilise CSS and override the bootstrap column layout, like we've done already in situations where a block region is present but empty (I think we have a mixin for it actually).
            I'll have a look at producing a solution for that now.

            Show
            samhemelryk Sam Hemelryk added a comment - I was speaking with Apu yesterday about the issue he saw. At the moment the solution for docks relies on the JS in theme/bootstrapbase/javascript/dock.js which makes assumptions about the block regions being used by the theme. Going with the current approach if you were to use a different set of block regions (as Apu has with the theme he is working on) then you'd be required to override that JS and add your own code to switch around the bootstrap column classes. Thinking about it a better solution would probably be to utilise CSS and override the bootstrap column layout, like we've done already in situations where a block region is present but empty (I think we have a mixin for it actually). I'll have a look at producing a solution for that now.
            Hide
            gb2048 Gareth J Barnard added a comment -

            I've been following this for some time now and the whole columnsX.php layout thing. I think the solution comes from utilising what we already have in terms of set data.

            If the layout files were simplified and still had the empty block region CSS but used in a simpler form. As an example, the current development of the contributed Bootstrap theme solves this through this https://github.com/bmbrands/theme_bootstrap/commit/7c2d6dd6b36097290d63865acd07137b0b0497d6 and this https://github.com/bmbrands/theme_bootstrap/blob/master/lib.php#L27 - in essence the same functionality but only one layout file https://github.com/bmbrands/theme_bootstrap/blob/master/layout/default.php#L24. Then if the contents of the 'regions' array in '$THEME->layouts' were injected as parameters to the JS, then perhaps there could be a more flexible solution.

            It also begs the question that for the sake of simplicity, the restriction of using 'side-pre' for two column layouts and 'side-pre' and 'side-post' for three column layouts however they are implemented is mandatory (like reserved words) in a theme? So as long as you have these then you can still add more block regions if you want.

            Sometimes too much flexibility can be a nightmare and life is too short to deal with it.

            Show
            gb2048 Gareth J Barnard added a comment - I've been following this for some time now and the whole columnsX.php layout thing. I think the solution comes from utilising what we already have in terms of set data. If the layout files were simplified and still had the empty block region CSS but used in a simpler form. As an example, the current development of the contributed Bootstrap theme solves this through this https://github.com/bmbrands/theme_bootstrap/commit/7c2d6dd6b36097290d63865acd07137b0b0497d6 and this https://github.com/bmbrands/theme_bootstrap/blob/master/lib.php#L27 - in essence the same functionality but only one layout file https://github.com/bmbrands/theme_bootstrap/blob/master/layout/default.php#L24 . Then if the contents of the 'regions' array in '$THEME->layouts' were injected as parameters to the JS, then perhaps there could be a more flexible solution. It also begs the question that for the sake of simplicity, the restriction of using 'side-pre' for two column layouts and 'side-pre' and 'side-post' for three column layouts however they are implemented is mandatory (like reserved words) in a theme? So as long as you have these then you can still add more block regions if you want. Sometimes too much flexibility can be a nightmare and life is too short to deal with it.
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Alrighty I've got a CSS solution all sorted for this.

            Core adds an additional CSS class to the body for each region that is completely docked. Then we style based upon that in the same way we do when the block region is empty, really it is just sharing logic there.
            Now the nice part about this is that we no longer need 90% of the JS that was being purposed here, all shifting of widths is handled in CSS rather than handling part in JS and part in CSS.

            Gareth does that sound a little better to you? The splitting of single layout to the multiple layouts was really to do away with as much PHP code as possible, I'm not sure we'd look again this soon to combining them again, however the logic in theme_bootstrap looks nice.
            Apu, when you come online ping me as I'll get you to test this on your theme and perhaps give this a peer-review.

            Cheers
            Sam

            Show
            samhemelryk Sam Hemelryk added a comment - Alrighty I've got a CSS solution all sorted for this. Core adds an additional CSS class to the body for each region that is completely docked. Then we style based upon that in the same way we do when the block region is empty, really it is just sharing logic there. Now the nice part about this is that we no longer need 90% of the JS that was being purposed here, all shifting of widths is handled in CSS rather than handling part in JS and part in CSS. Gareth does that sound a little better to you? The splitting of single layout to the multiple layouts was really to do away with as much PHP code as possible, I'm not sure we'd look again this soon to combining them again, however the logic in theme_bootstrap looks nice. Apu, when you come online ping me as I'll get you to test this on your theme and perhaps give this a peer-review. Cheers Sam
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Updated with the same 26 branch - integrator note that the cherry-pick is clean other than recess and shifter conflicts.

            Show
            samhemelryk Sam Hemelryk added a comment - Updated with the same 26 branch - integrator note that the cherry-pick is clean other than recess and shifter conflicts.
            Hide
            gb2048 Gareth J Barnard added a comment - - edited

            Hi Sam Hemelryk,

            Firstly, thank you. I think moving the concept of the span classes from the JS to the LESS is much better. It is easier for contrib developers to compile the LESS with 'recesss' than 'lib/yui/src/dock/js/dock.js' with 'shifter' somehow. This means that custom grids are still achievable.

            A question. I see that 'Clean' will inherit 'docks.js' from 'bootstrapbase' and has docking enabled even though 'bootstrapbase' does not, but what calls the function 'customise_dock_for_theme()'?

            I am perhaps still not convinced by the span nesting etc. But that is another argument. And this patch is consistent with existing implementation, which is a good thing.

            I've looked at the code, but with all things will sleep on it and see if anything comes to mind. I've found in Software Engineering that many eyes spot mistakes but many hands in the same module make messy code, so better for one to program the functionality for a given problem. Extreme programming Kent Beck style, even though I'm more a fan of Martin Fowler.

            Cheers,

            Gareth

            Show
            gb2048 Gareth J Barnard added a comment - - edited Hi Sam Hemelryk , Firstly, thank you. I think moving the concept of the span classes from the JS to the LESS is much better. It is easier for contrib developers to compile the LESS with 'recesss' than 'lib/yui/src/dock/js/dock.js' with 'shifter' somehow. This means that custom grids are still achievable. A question. I see that 'Clean' will inherit 'docks.js' from 'bootstrapbase' and has docking enabled even though 'bootstrapbase' does not, but what calls the function 'customise_dock_for_theme()'? I am perhaps still not convinced by the span nesting etc. But that is another argument. And this patch is consistent with existing implementation, which is a good thing. I've looked at the code, but with all things will sleep on it and see if anything comes to mind. I've found in Software Engineering that many eyes spot mistakes but many hands in the same module make messy code, so better for one to program the functionality for a given problem. Extreme programming Kent Beck style, even though I'm more a fan of Martin Fowler. Cheers, Gareth
            Hide
            gb2048 Gareth J Barnard added a comment - - edited

            I think dock.less should use all colour variables from variables.less such as '@grayLighter' instead of hard coding HEX values, then if you want to change all the places that use that colour then you only have to change variables.less. Use the LESS 'darken()' function if needed.

            Show
            gb2048 Gareth J Barnard added a comment - - edited I think dock.less should use all colour variables from variables.less such as '@grayLighter' instead of hard coding HEX values, then if you want to change all the places that use that colour then you only have to change variables.less. Use the LESS 'darken()' function if needed.
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Thanks for looking it over Gareth.

            Good thinking with the variables it most certainly be using what is available. I've pushed up amended branches now.
            The function customise_dock_for_theme gets called by the dock immediately before it initialises itself. It allows the theme to make any changes to the dock that it wants to make. The dock is written in such a way that you can make customisations from simple variables (like dock position and orientation) right through to replacing entire methods within dock... at your own risk of course.
            The tutorial on creating a horizontal dock http://docs.moodle.org/dev/Making_a_horizontal_dock relies on this function.

            Let me know what other things you spot in your dreams

            Show
            samhemelryk Sam Hemelryk added a comment - Thanks for looking it over Gareth. Good thinking with the variables it most certainly be using what is available. I've pushed up amended branches now. The function customise_dock_for_theme gets called by the dock immediately before it initialises itself. It allows the theme to make any changes to the dock that it wants to make. The dock is written in such a way that you can make customisations from simple variables (like dock position and orientation) right through to replacing entire methods within dock... at your own risk of course. The tutorial on creating a horizontal dock http://docs.moodle.org/dev/Making_a_horizontal_dock relies on this function. Let me know what other things you spot in your dreams
            Hide
            samhemelryk Sam Hemelryk added a comment -

            I've added the ui_change label and dev_docs_required as really I should explain somewhere how to handle compacting regions for themes with custom block regions.

            Show
            samhemelryk Sam Hemelryk added a comment - I've added the ui_change label and dev_docs_required as really I should explain somewhere how to handle compacting regions for themes with custom block regions.
            Hide
            nebgor Aparup Banerjee added a comment - - edited

            tested fine on master (on my side-post only theme), i like the LESS solution tons more! power to designers!

            i did notice that on RTL, 'page' needs a bit more padding (clean) - https://github.com/samhemelryk/moodle/compare/27...38923-27#diff-c268578ae51634b3f929bed35fa7c16fR135 - (edit: maybe the LTR too)

            Show
            nebgor Aparup Banerjee added a comment - - edited tested fine on master (on my side-post only theme), i like the LESS solution tons more! power to designers! i did notice that on RTL, 'page' needs a bit more padding (clean) - https://github.com/samhemelryk/moodle/compare/27...38923-27#diff-c268578ae51634b3f929bed35fa7c16fR135 - (edit: maybe the LTR too)
            Hide
            nebgor Aparup Banerjee added a comment -

            dock not scrolling with many blocks docked it seems.

            Show
            nebgor Aparup Banerjee added a comment - dock not scrolling with many blocks docked it seems.
            Hide
            nebgor Aparup Banerjee added a comment - - edited

            rtl padding should be

            body.has_dock.dir-rtl {
                #page {
                    padding-left: 0;
                    padding-right: (@dockWidth + (@dockTitleMargin * 2)) + 10px;
                }
            }
            

            edit: disregard +10px offset (is custom)

            Show
            nebgor Aparup Banerjee added a comment - - edited rtl padding should be body.has_dock.dir-rtl { #page { padding-left: 0; padding-right: (@dockWidth + (@dockTitleMargin * 2)) + 10px; } } edit: disregard +10px offset (is custom)
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Thanks Apu - I've fixed up the RTL padding on #page and have made a small change to the way in which the dock calculates available space for tabs to allow for space at the top of the dock before the first tab (required by bootstrap to not clash with the fixed top menu).

            Show
            samhemelryk Sam Hemelryk added a comment - Thanks Apu - I've fixed up the RTL padding on #page and have made a small change to the way in which the dock calculates available space for tabs to allow for space at the top of the dock before the first tab (required by bootstrap to not clash with the fixed top menu).
            Hide
            nebgor Aparup Banerjee added a comment -

            also just noticed the RTL undock all icon is dock_to_block instead of block_to_dock (and i hope i typed that right!)

            Show
            nebgor Aparup Banerjee added a comment - also just noticed the RTL undock all icon is dock_to_block instead of block_to_dock (and i hope i typed that right!)
            Hide
            marina Marina Glancy added a comment -

            Hi Bas and Sam,
            this looks like a very desirable change by society but... we can't include it in 2.6 any more.
            At the same time I can see that lib/yui/build/moodle-core-dock/moodle-core-dock.js has some bug fix that should be backported (and maybe even to 2.5 if it is present there as well).

            So my review and testing comments:

            0. it would be really helpful to set an issue status and write more details in description.

            1. code review: why bootstrapbase theme DOES NOT enable docking but includes dock javascript and less files?
            2. CSS problems in expanded docked block (block that is shown when hovering the block name):
            • Edit settings cog is too small
            • Gaps between sections in administration block are too big
            1. In RTL the block title looks cropped
            2. Narrow screen & docking
            • docked blocks overlap custom menu and login info
            • if screen is too narrow, I can't undock the block (the undock button is outside of the screen and there is no horisontal scrollbar)
            • If I manage to undock the block on narrow screen, it (sometimes) is displayed really weird

            Thanks

            Show
            marina Marina Glancy added a comment - Hi Bas and Sam, this looks like a very desirable change by society but... we can't include it in 2.6 any more. At the same time I can see that lib/yui/build/moodle-core-dock/moodle-core-dock.js has some bug fix that should be backported (and maybe even to 2.5 if it is present there as well). So my review and testing comments: 0. it would be really helpful to set an issue status and write more details in description. code review: why bootstrapbase theme DOES NOT enable docking but includes dock javascript and less files? CSS problems in expanded docked block (block that is shown when hovering the block name): Edit settings cog is too small Gaps between sections in administration block are too big In RTL the block title looks cropped Narrow screen & docking docked blocks overlap custom menu and login info if screen is too narrow, I can't undock the block (the undock button is outside of the screen and there is no horisontal scrollbar) If I manage to undock the block on narrow screen, it (sometimes) is displayed really weird Thanks
            Hide
            marina Marina Glancy added a comment -

            I have just noticed that problem with small edit block cog is also present in standard on master

            Show
            marina Marina Glancy added a comment - I have just noticed that problem with small edit block cog is also present in standard on master
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Hi Marina,

            Thanks for looking it over. I'll have a good look over things tomorrow and see if I can't make magic happen before you arrive in the morning.
            A couple of points/questions to help the two of us along this journey.

            • I agree with 2.6, however Martin has made the call to backport it to that point, as I see it really we have to try and get it back there.
            • The reason dock js + css is included in bootstrapbase and only enabled in clean is to easily facilitate those creating themes based upon bootstrapbase to enable the dock and have it at least function correctly, ready to be styled. The same approach has been taken with base/standard since the docks inception.
            • I'll split the dock changes into a separate commit and backport as necessary. The dock was altered in 2.6 so I will confirm the requirement to backport.
            • Can you please tell me, what browser + Moodle version you used when taking the screen shots? There are bugs with the blocks on a small screen when using Moodle 2.5 + clean, and the RTL issue I suspect is a browser bug (I can easily confirm if this is the case tomorrow) that affects other areas in Moodle.

            Have a great night and catch you tomorrow!

            Cheers
            Sam

            Show
            samhemelryk Sam Hemelryk added a comment - Hi Marina, Thanks for looking it over. I'll have a good look over things tomorrow and see if I can't make magic happen before you arrive in the morning. A couple of points/questions to help the two of us along this journey. I agree with 2.6, however Martin has made the call to backport it to that point, as I see it really we have to try and get it back there. The reason dock js + css is included in bootstrapbase and only enabled in clean is to easily facilitate those creating themes based upon bootstrapbase to enable the dock and have it at least function correctly, ready to be styled. The same approach has been taken with base/standard since the docks inception. I'll split the dock changes into a separate commit and backport as necessary. The dock was altered in 2.6 so I will confirm the requirement to backport. Can you please tell me, what browser + Moodle version you used when taking the screen shots? There are bugs with the blocks on a small screen when using Moodle 2.5 + clean, and the RTL issue I suspect is a browser bug (I can easily confirm if this is the case tomorrow) that affects other areas in Moodle. Have a great night and catch you tomorrow! Cheers Sam
            Hide
            lazydaisy Mary Evans added a comment - - edited

            I have just set this up to test it out only to find that this is older than my Moodle27 branch...bah humbug!

            ERROR!!! The code you are using is OLDER than the version that made these databases!

            I presume I will have to rebase...easier said than done...I don't think I really want to go there!

            Show
            lazydaisy Mary Evans added a comment - - edited I have just set this up to test it out only to find that this is older than my Moodle27 branch...bah humbug! ERROR!!! The code you are using is OLDER than the version that made these databases! I presume I will have to rebase...easier said than done...I don't think I really want to go there!
            Hide
            lazydaisy Mary Evans added a comment -

            OK...got it working...eventually.

            I think all is missing is some more CSS...

            #dockeditempanel .dockeditempanel_bd {
                overflow:auto;
                max-width: 200px;
            }
            #dockeditempanel .dockeditempanel_content,
            #dockeditempanel {
               width: 200px;
            }

            as there is a setting in Bootstrapbase/less/moodle/dock.less that overrides all of the above with this...

            @dockPanelWidth: (768px / 2);

            Show
            lazydaisy Mary Evans added a comment - OK...got it working...eventually. I think all is missing is some more CSS... #dockeditempanel .dockeditempanel_bd { overflow:auto; max-width: 200px; } #dockeditempanel .dockeditempanel_content, #dockeditempanel { width: 200px; } as there is a setting in Bootstrapbase/less/moodle/dock.less that overrides all of the above with this... @dockPanelWidth: (768px / 2);
            Hide
            samhemelryk Sam Hemelryk added a comment -

            So properly addressing Marina's points this morning:

            1. This is by design. The same thing happens with base/standard. Bootstrapbase contains everything needed for the dock to work, this ensures that should someone create a theme based upon base (in core this is clean) and wish to use the dock all they have to do is enable the dock in their config and it should function correctly. From there they simply need to customise its look+feel.
            2 a. MDL-43410 was meant to have fixed this - obviously it has been broken again (as you noted affects other themes too) I'll open a new issue to fix this again.
            2 b. Fixed by modifying how we add the block class in theme/bootstrapbase/javascript/dock.js
            3 (1). Fixed block title alignment when in RTL mode as best I could (it is an imperfect guess system we have in core)
            4 (2a). This is a really tricky situation because bootstrap is using jQuery and not YUI, however I've come up with a fix that will I believe work for 99% of situations.
            5 (2b). Fixed the docked block width to be constrained to the available space.
            6. This looks like a 2.5 branch - can you confirm which branch you used for testing?

            You mentioned 2.5 Marina - after thinking about it I think the best approach would be to create a new issue to backport dock fixes from this issue to 2.5 after its being integrated.
            With the separate issue I can write test instructions to test them explicitly for that branch.

            Cheers
            Sam

            Show
            samhemelryk Sam Hemelryk added a comment - So properly addressing Marina's points this morning: 1. This is by design. The same thing happens with base/standard. Bootstrapbase contains everything needed for the dock to work, this ensures that should someone create a theme based upon base (in core this is clean) and wish to use the dock all they have to do is enable the dock in their config and it should function correctly. From there they simply need to customise its look+feel. 2 a. MDL-43410 was meant to have fixed this - obviously it has been broken again (as you noted affects other themes too) I'll open a new issue to fix this again. 2 b. Fixed by modifying how we add the block class in theme/bootstrapbase/javascript/dock.js 3 (1). Fixed block title alignment when in RTL mode as best I could (it is an imperfect guess system we have in core) 4 (2a). This is a really tricky situation because bootstrap is using jQuery and not YUI, however I've come up with a fix that will I believe work for 99% of situations. 5 (2b). Fixed the docked block width to be constrained to the available space. 6. This looks like a 2.5 branch - can you confirm which branch you used for testing? You mentioned 2.5 Marina - after thinking about it I think the best approach would be to create a new issue to backport dock fixes from this issue to 2.5 after its being integrated. With the separate issue I can write test instructions to test them explicitly for that branch. Cheers Sam
            Hide
            lazydaisy Mary Evans added a comment -

            @Sam Hemelryk

            I don't see any @media query's to reduce the @dockPanelWidth which is currently fixed at (768px/2). This makes the overall width of the docking panel too wide for small device types?

            Show
            lazydaisy Mary Evans added a comment - @ Sam Hemelryk I don't see any @media query's to reduce the @dockPanelWidth which is currently fixed at (768px/2). This makes the overall width of the docking panel too wide for small device types?
            Hide
            samhemelryk Sam Hemelryk added a comment -

            Hi Mary, thats correct, instead of solving with media queries I've solved it in JS.
            Theres a small snippet of JS that sets a dynamic max-width on the dialogue used to display the block. When a docked block is shown the max width gets set to the screen width - dock width.

            Show
            samhemelryk Sam Hemelryk added a comment - Hi Mary, thats correct, instead of solving with media queries I've solved it in JS. Theres a small snippet of JS that sets a dynamic max-width on the dialogue used to display the block. When a docked block is shown the max width gets set to the screen width - dock width.
            Hide
            lazydaisy Mary Evans added a comment -

            Is fixing that in JS not asking for trouble?

            Show
            lazydaisy Mary Evans added a comment - Is fixing that in JS not asking for trouble?
            Hide
            samhemelryk Sam Hemelryk added a comment -

            That would be a pretty fair assumption Mary, unfortunately it is probably the best way to handle it with the present design of the Bootstrap base theme + the dock.
            As the dock is fixed position and is of limited width, everything that is displayed as part of it has to be positioned explicitly or facilitated in its design to never fail.
            In the case of standard this issue is avoided by using a fixed with for blocks that is reasonably small, and my applying a min-width on the body tag.
            For bootstrapbase there is no min-width on the page and block width is dealt with responsibly which is great, but not great for the dock.
            I've used JS here as that falls in line with the other approach, we work within the bounds of the JS positioning and apply specific metrics to the dialogue.
            Really its not great, I'd like to avoid JS there, but I think the only way to do that would be to change the nesting of the dock which would fall well outside the limits of this issue and would certainly be a master only change.

            Show
            samhemelryk Sam Hemelryk added a comment - That would be a pretty fair assumption Mary, unfortunately it is probably the best way to handle it with the present design of the Bootstrap base theme + the dock. As the dock is fixed position and is of limited width, everything that is displayed as part of it has to be positioned explicitly or facilitated in its design to never fail. In the case of standard this issue is avoided by using a fixed with for blocks that is reasonably small, and my applying a min-width on the body tag. For bootstrapbase there is no min-width on the page and block width is dealt with responsibly which is great, but not great for the dock. I've used JS here as that falls in line with the other approach, we work within the bounds of the JS positioning and apply specific metrics to the dialogue. Really its not great, I'd like to avoid JS there, but I think the only way to do that would be to change the nesting of the dock which would fall well outside the limits of this issue and would certainly be a master only change.
            Hide
            nebgor Aparup Banerjee added a comment - - edited

            fyi:
            on moodle.org (for admins), i came across an issue where the js was changing the span (adding iirc) to a full width hero. in this specific case the frontpage with hero was intended by design to not show the dock - so it was hidden via css purposely. Now the situation here is that i can't disable the js for the frontpage as easily (so i fashioned the less with specificity to override the additional css classes that the js had enacted on it).

            i propose a revolution: 'More power to Less'. :-p

            edit: its probably better to make the js not run on frontpage eh on hindsight, but the flexibility was that admins could unhide the dock if desired :-D

            Show
            nebgor Aparup Banerjee added a comment - - edited fyi: on moodle.org (for admins), i came across an issue where the js was changing the span (adding iirc) to a full width hero. in this specific case the frontpage with hero was intended by design to not show the dock - so it was hidden via css purposely. Now the situation here is that i can't disable the js for the frontpage as easily (so i fashioned the less with specificity to override the additional css classes that the js had enacted on it). i propose a revolution: 'More power to Less'. :-p edit: its probably better to make the js not run on frontpage eh on hindsight, but the flexibility was that admins could unhide the dock if desired :-D
            Hide
            marina Marina Glancy added a comment - - edited

            Also linking to MDL-42756 because here it is the same problem with action menu in docked blocks (cog size, not working after refresh).
            And MDL-43994 about the docked blocks moving

            Show
            marina Marina Glancy added a comment - - edited Also linking to MDL-42756 because here it is the same problem with action menu in docked blocks (cog size, not working after refresh). And MDL-43994 about the docked blocks moving
            Hide
            marina Marina Glancy added a comment -

            Thanks Bas, Sam, integrated in master only.

            Backport issue for 2.6 created MDL-43995, pelase submit a 2.6 branch there when this issue is tested.

            Show
            marina Marina Glancy added a comment - Thanks Bas, Sam, integrated in master only. Backport issue for 2.6 created MDL-43995 , pelase submit a 2.6 branch there when this issue is tested.
            Hide
            rajeshtaneja Rajesh Taneja added a comment -

            Awesome works Bas and Sam,

            I was able to dock blocks and restore them without any problem. All seems to work fine.

            There were two issues which I observed and has been reported already:

            1. Action menu don't work on refresh in docked block and in chrome it appears smaller then normal.
            2. move icon is not changed to D-N-D move icon after un-docking the block. It seems this won;t be an issue after MDL-43994.

            Passing...

            Show
            rajeshtaneja Rajesh Taneja added a comment - Awesome works Bas and Sam, I was able to dock blocks and restore them without any problem. All seems to work fine. There were two issues which I observed and has been reported already: Action menu don't work on refresh in docked block and in chrome it appears smaller then normal. move icon is not changed to D-N-D move icon after un-docking the block. It seems this won;t be an issue after MDL-43994 . Passing...
            Hide
            samhemelryk Sam Hemelryk added a comment -

            This weeks weekly release is now available and includes your code.
            A big pat on the back to you again for once more being a cog in the Moodle machine.

            Best wishes, the Moodle integration team.

            Show
            samhemelryk Sam Hemelryk added a comment - This weeks weekly release is now available and includes your code. A big pat on the back to you again for once more being a cog in the Moodle machine. Best wishes, the Moodle integration team.
            Hide
            msohail99 Sohail Aslam added a comment -

            Hi,

            Not sure is this the right place to ask this question as this issue has already been closed.

            Is this being back ported to 2.5?

            Show
            msohail99 Sohail Aslam added a comment - Hi, Not sure is this the right place to ask this question as this issue has already been closed. Is this being back ported to 2.5?
            Hide
            salvetore Michael de Raadt added a comment -

            MDL-43995 is the place to discuss that, and I see you have commented there also.

            Show
            salvetore Michael de Raadt added a comment - MDL-43995 is the place to discuss that, and I see you have commented there also.
            Hide
            gharbor Grant Harbor added a comment -

            I just downloaded the latest release of Moodle 2.6.1+ for (Moodle package for Windows) to test the clean theme with docking, but can't seem to get it working?

            I firstly just tried to make sure that docking was enabled in the Admin settings and then I've added $THEME->enable_dock = true; to the cofig.php file in the clean theme and still can't get it to work?

            Is there something I am missing? Was this a part of the 2.6.1+ release?

            Thanks for your help

            Show
            gharbor Grant Harbor added a comment - I just downloaded the latest release of Moodle 2.6.1+ for (Moodle package for Windows) to test the clean theme with docking, but can't seem to get it working? I firstly just tried to make sure that docking was enabled in the Admin settings and then I've added $THEME->enable_dock = true; to the cofig.php file in the clean theme and still can't get it to work? Is there something I am missing? Was this a part of the 2.6.1+ release? Thanks for your help
            Hide
            marycooch Mary Cooch added a comment - - edited

            No Grant - currently you cannot dock Clean theme in 2.6 Here is the tracker issue to backport this fix MDL-43995

            Show
            marycooch Mary Cooch added a comment - - edited No Grant - currently you cannot dock Clean theme in 2.6 Here is the tracker issue to backport this fix MDL-43995
            Hide
            nebgor Aparup Banerjee added a comment -

            was anything done to handle the issue with many docked blocks buttons not being scrollable on the dock?

            Show
            nebgor Aparup Banerjee added a comment - was anything done to handle the issue with many docked blocks buttons not being scrollable on the dock?
            Hide
            marina Marina Glancy added a comment -

            what is the issue number for it Apu?

            Show
            marina Marina Glancy added a comment - what is the issue number for it Apu?
            Hide
            nebgor Aparup Banerjee added a comment -

            This is :-D see comment

            Show
            nebgor Aparup Banerjee added a comment - This is :-D see comment
            Hide
            nebgor Aparup Banerjee added a comment -

            ok nevermind - i understand now the way chosen is not to scroll the dock tabs but to resize the tabs and squeeze them up.

            Show
            nebgor Aparup Banerjee added a comment - ok nevermind - i understand now the way chosen is not to scroll the dock tabs but to resize the tabs and squeeze them up.
            Hide
            gb2048 Gareth J Barnard added a comment -

            Hi,

            There is a regression with this issue that I've noticed on MDL-44074 (which I can fix there as in the same area and testing the same thing). To replicate:

            1. On the front page.
            2. Move all blocks to side-pre.
            3. Observe that < 768px the layout is broken even with no docked blocks.

            Comments on MDL-44074.

            Gareth

            Show
            gb2048 Gareth J Barnard added a comment - Hi, There is a regression with this issue that I've noticed on MDL-44074 (which I can fix there as in the same area and testing the same thing). To replicate: On the front page. Move all blocks to side-pre. Observe that < 768px the layout is broken even with no docked blocks. Comments on MDL-44074 . Gareth
            Hide
            lazydaisy Mary Evans added a comment - - edited

            I'm working on this now MDL-44280

            Show
            lazydaisy Mary Evans added a comment - - edited I'm working on this now MDL-44280

              People

              • Votes:
                44 Vote for this issue
                Watchers:
                53 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  12/May/14

                  Agile