jquery and clean theme

jquery and clean theme

by Paul P. -
Number of replies: 11

Hi,

I apologize in advance for cross-posting, but I think that this question is better asked here than in the developer's forum where it was originally posted.  Unfortunately I don't have the ability to remove my original post from there.

I am developing a custom block which is to use jquery.  I followed the steps in http://docs.moodle.org/dev/jQuery, which is essentially to include the following function in block_blockname.php:

function get_required_javascript() {
  parent::get_required_javascript();

  $this->page->requires->jquery();
  $this->page->requires->jquery_plugin('ui');
  $this->page->requires->jquery_plugin('ui-css');
}

It seems to load fine when using any of the older themes (I tested it with every theme in the standard installation and the issue happens only with Clean).  With those themes, Firebug shows that it loads up jquery-1.9.1.js, jquery-ui.js, and jquery-ui.css.

Howevery, when I change the theme to "Clean" (the new bootstrap-based theme), I get the following error:

Can not add jQuery plugins after starting page output!

Followed by a bunch of other line and file-specific errors.  This happens if I load the block in the frontpage or a course page.

Any ideas?  Is this a clean theme bug or am I doing something wrong?

I haven't tested it, but I wonder if it affects all bootstrap themes.

Thanks in advance,

Paul

Average of ratings: -
In reply to Paul P.

Re: jquery and clean theme

by Mary Evans -

Hi,

It would be helpful if you could also add the Error stack trace as that gives a better picture for the developers here to be able to offer advice.

Cheers

Mary

Average of ratings: -
In reply to Mary Evans

Re: jquery and clean theme

by Paul P. -

Hi Mary,

Thanks for your quick response.  Here is the error and full stack trace:

Can not add jQuery plugins after starting page output!

  • line 397 of /lib/outputrequirementslib.php: call to debugging()
  • line 11 of /blocks/myblock/block_myblock.php: call to page_requirements_manager->jquery_plugin()
  • line 293 of /blocks/moodleblock.class.php: call to block_myblock->get_required_javascript()
  • line 238 of /blocks/moodleblock.class.php: call to block_base->formatted_contents()
  • line 951 of /lib/blocklib.php: call to block_base->get_content_for_output()
  • line 1003 of /lib/blocklib.php: call to block_manager->create_block_contents()
  • line 353 of /lib/blocklib.php: call to block_manager->ensure_content_created()
  • line 3071 of /lib/outputrenderers.php: call to block_manager->region_has_content()
  • line 3107 of /lib/outputrenderers.php: call to core_renderer->body_css_classes()
  • line 49 of /theme/clean/layout/columns3.php: call to core_renderer->body_attributes()
  • line 850 of /lib/outputrenderers.php: call to include()
  • line 780 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
  • line 101 of /index.php: call to core_renderer->header()

This error is reapated three times - I assume it is due to the fact that javascript is called three times in my block:

    public function get_required_javascript() {
        parent::get_required_javascript();
 
        $this->page->requires->jquery();
        $this->page->requires->jquery_plugin('ui');
        $this->page->requires->jquery_plugin('ui-css');
        $this->page->requires->js('/blocks/myblock/myscript.js');
    }

What is interesting is that immediately after the error, some HTML gets displayed as well:

id="page-site-index" class="format-site course path-site gecko dir-ltr lang-en yui-skin-sam yui3-skin-sam localhost--8888--moodle pagelayout-frontpage course-1 context-2 has-region-side-pre used-region-side-pre has-region-side-post used-region-side-post layout-option-nonavbar">

This appears right after the (three) errors.

Let me know if there is any other information that may be helpful.

If you want to try to test it in a test server, take any block (like the html block) and put the get_required_javascript function above in it (without the last call to myscript.js, of course).  It throws the same error.

Thanks again!

Paul

Average of ratings: -
In reply to Paul P.

Re: jquery and clean theme

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Paul,

Really odd!  The original tracker that implemented the functionality was MDL-15727 and you appear to have followed http://docs.moodle.org/dev/jQuery#jQuery_UI_in_add-on_block.  Might be worth contacting Petr Skoda for help.

I'll have a further look as was involved with the 'columns3.php' layout in Clean.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: jquery and clean theme

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

This is interesting, looking at the layout files it looks like only 'Clean' calls 'body_attributes()' in '/lib/outputrenderers.php' and other older themes use '$PAGE->bodyclasses' instead.  So, could be a core bug.

Average of ratings: -
In reply to Gareth J Barnard

Re: jquery and clean theme

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Ok, after digging around I've discovered that MDL-40089 added the call to 'body_attributes()' which was after test '4' had been conducted on MDL-15727, 'body_attributes()' was added in MDL-39838.  I don't think there is an issue for this, so will raise one.

Average of ratings: -
In reply to Gareth J Barnard

Re: jquery and clean theme

by Paul P. -

 

Thanks for you help on this Gareth. If there is anything else I can do to help out,  please let me know.

I assume you will create a tracker for this?  Otherwise I can do it.

 

Average of ratings: -
In reply to Paul P.

Re: jquery and clean theme

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Thanks Paul, I've raised MDL-41516 with lots of detail.  There is a workaround I suspect should work given the logic of the situation as 'body_classes()' is only asking a question with 'region_has_content' and does not actually need the content.

Average of ratings: -
In reply to Gareth J Barnard

Re: jquery and clean theme

by Paul P. -

Hi Gareth,

Thanks for raising the tracker issue.  I'd love to test the workaround, but I am a bit unclear as how to apply it.  It's obviously not just a matter of replacing every instance of $OUTPUT->body_attributes with $PAGE->bodyclasses in the five layout files (which is what I just tried smile ).

Can you possibly provide me with the details of the workaround?  I'd be happy to test it and post my results.

Thanks again,

Paul

Average of ratings: -
In reply to Paul P.

Re: jquery and clean theme

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Paul,

That's the logic of the workaround'ish that I thought would work when comparing the layout files of the 'Clean' theme with others.  I did not actually test it.  Possibly needs more like the 'id' as well.  I'll update the tracker.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: jquery and clean theme

by Paul P. -

FYI - I replaced all instances of 

<body <?php echo $OUTPUT->body_attributes(); ?>>

with

<body id="<?php p($PAGE->bodyid) ?>" class="<?php p($PAGE->bodyclasses ?>">

in all the layout files (columns1,2,3, embedded and secure) in both "Clean" and "Bootstrapbase" and the error still persists:

Can not add jQuery plugins after starting page output!
    •    line 397 of /lib/outputrequirementslib.php: call to debugging()
    •    line 341 of /lib/outputrequirementslib.php: call to page_requirements_manager->jquery_plugin()
    •    line 9 of /blocks/myblock/block_myblock.php: call to page_requirements_manager->jquery()
    •    line 293 of /blocks/moodleblock.class.php: call to block_myblock->get_required_javascript()
    •    line 238 of /blocks/moodleblock.class.php: call to block_base->formatted_contents()
    •    line 951 of /lib/blocklib.php: call to block_base->get_content_for_output()
    •    line 1003 of /lib/blocklib.php: call to block_manager->create_block_contents()
    •    line 315 of /lib/blocklib.php: call to block_manager->ensure_content_created()
    •    line 1235 of /lib/outputrenderers.php: call to block_manager->get_content_for_region()
    •    line 3056 of /lib/outputrenderers.php: call to core_renderer->blocks_for_region()
    •    line 99 of /theme/clean/layout/columns3.php: call to core_renderer->blocks()
    •    line 850 of /lib/outputrenderers.php: call to include()
    •    line 780 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
    •    line 101 of /index.php: call to core_renderer->header()
Sorry sad

Average of ratings: -