I’m working on a new widget which needs a lightbox. As Evo 1.0.1 sort-of comes bundled with colorbox I used that, but discovered the following problem.
If I output the JS/CSS includes from my widget, as follows:
$output .= includeJs('/assets/js/jquery.colorbox-min.js');
$output .= includeCss('/assets/plugins/qm/css/colorbox.css');
Then the lightbox will open but is incorrectly styled - and the wrong size when it opens.
If I hack mm.inc.php and change lines 301-305 to
// Load the jquery library
echo '<!-- Begin ManagerManager output -->';
echo includeJs($js_url, 'html');
echo includeJs('/assets/js/jquery.colorbox-min.js', 'html');
echo includeCss('/assets/plugins/qm/css/colorbox.css', 'html');
Then colorbox opens correctly styled!
I can understand why colorbox could have issues with scripts loaded dynamically (nothing to halt execution until they’re actually loaded), but obviously no other widgets have yet had this problem. I’m assuming it’s not just this JS library that has issues!
The solution? I think to modify mm.inc.php so each widget can inject code/includes in the first ManagerManager output section, where jQuery is included. Even if there were a work-around in this case, I think the ability to inject raw content into the page (rather than JS calls) would be very useful. An example would be a CSS block or some additional markup - like MM does itself.
I would like to know if anyone else has encountered this problem, and if so how they worked around it.
☆ A M B ☆
MODX Staff