By just placing the text below in the page.tpl.php file this person was able to make Drupal messages appear as modal popups. However this was for thickbox and already use lightbox2. I was hoping if someone can tell me if this is possible with lightbox as well and if this code is easily translated.

<?php if ($messages): ?>
   <div id="TB_overlay" class="TB_overlayBG" onclick="tb_remove()"/>
      <div id="TB_window" style="margin-left: -165px; width: 330px; margin-top: -97px; display: block;">
         <div id="TB_ajaxContent" class="TB_modal" style="width: 300px;">
            <?php print $messages; ?>
            <p style="text-align: center;"><input id="Login" type="submit" onclick="tb_remove()" value="  Ok  "/></p>
         </div>
      </div>
   </div>
<?php endif; ?>

Figured it never hurts to ask. Any thoughts on this?

Kind regards,

Marius

CommentFileSizeAuthor
#22 lightbox2_6x_294361.patch1.37 KBstella

Comments

scottrigby’s picture

This would be very interesting! :) Scott

wuf31’s picture

+1 for this. What an interesting idea.

stella’s picture

Version: 6.x-1.8 » 6.x-1.x-dev
Category: support » feature
Status: Active » Fixed

Implemented in the latest dev release, which won't be available for another 12 hours or so. To get this functionality, you need to install the latest dev release, and then add something like the following to your page.tpl.php:

  <?php if ($show_messages && $messages): ?>
  <div id="lightboxAutoModal" style="display: none;" ><?php print $messages; ?></div>
  <?php endif; ?>

You can control the size of the lightbox window, either via the config form at admin/settings/lightbox2/html_content - this is a global property which will affect the default size of all modal windows, or by adding a rel attribute like:

 <div id="lightboxAutoModal" rel="lightmodal[|height: 50px;]" style="display: none;" ><?php print $messages; ?></div>

Cheers,
Stella

mariusooms’s picture

Wow Stella, that's even better than what I was asking for or expecting. Thanks so much for going the extra mile. Can't wait to give it a spin!

Regards,

Marius

scottrigby’s picture

great! look forward to testing when the next dev release is available...
%^) Scott

mariusooms’s picture

Hi Stella...it works nicely, but almost to nice. In a way for modal messages I'd like them to just appear without the resize animation. Also a set height makes it odd since the message is usually short, but set the height to short and the occasional long messages could get cut off.

So ... would it be possible to have

1) Animation off/on checkbox under HTML Content in admin settings
2) Also have the ability to leave the height field empty so a height is not forced

If not possible by design, would it be possible to manually code this like the example I submitted initially using thickbox? Sorry for being overly requestful ;)

Regards,

Marius

mariusooms’s picture

Status: Fixed » Active

Sorry...changing status to active to be clear :) I always forget these things...

Regards,

Marius

stella’s picture

Status: Active » Fixed

mariusooms: please open a separate feature request. Thanks. I'll try and have a look at it next week.

Cheers,
Stella

Anonymous’s picture

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

scottrigby’s picture

It's been a little while, but only now got around to testing this --- it's great -- thanks Stella :)

TD540’s picture

This is not working for me guys...
Other images load fine in lightbox, but the Drupal messages just won't show up. I can see them in the outputted html though.

stella’s picture

Released in Lightbox2 6.x-1.9 and 5.x-2.9.

Cheers,
Stella

TD540’s picture

Hey Stella,

Is it now possible to make drupal messages pop up in a Lightbox ?

Grts,
Td.

stella’s picture

Yes, see documentation at http://drupal.org/node/316727

TD540’s picture

It's not working :(

By placing the code below in your theme's page.tpl.php file, it's possible to have Drupal messages appear as modal popups.

• Lightbox2 module is activated and works correctly for other stuff (like expanding images) ...
• The div #lightboxAutoModal is showing up in the html. I tried putting it right at the beginning of the <body>, and right before </body> closes. See output here:

<div id="lightboxAutoModal" style="display: none;" >
<div class="messages status"><a href="/admin/settings/site-maintenance">Operating in off-line mode.</a></div>
<div class="messages warning">The theme registry has been rebuilt. <a href="/admin/build/themes/settings/zen">Turn off</a> this feature on production websites.</div>
</div>
stella’s picture

Please ensure you have upgraded to 6.x-1.9 and have run update.php. If it's still not working, please open a new support request.

Cheers,
Stella

TD540’s picture

Definitelly running 1.9.
Maybe it's because I'm running Drupal 6.9-dev? I'll try rolling back to 6.8 and if it's still not working I'll open a support ticket.

Thanks for the help,

T.

TD540’s picture

Nope, still not working :(

pounard’s picture

Not working for me neither. Is there a specific configuration option that we have to set/unset to get this working?

pounard’s picture

I think 6.x-1.9 code is wrong, you forgot a line when editing the lightbox.js file, which cause the #lightboxAutoModal not to work.
To see this, we have to compare both 5.x-2.9 and 6.x-1.9 versions.

What's missing in 6.x-1.9 version

Just look this grep output:

pounard@guinevere (lightboxtest) [16:32:15] % grep -C 3 -iR "#lightboxAutoModal" lightbox2-v6/js/
lightbox2-v6/js/lightbox.js-
lightbox2-v6/js/lightbox.js-    if ($(imageLink).attr('id') == 'lightboxAutoModal') {
lightbox2-v6/js/lightbox.js-      rel_style = rel_parts["style"];
lightbox2-v6/js/lightbox.js:      Lightbox.imageArray.push(['#lightboxAutoModal > *', title, alt, rel_style, 1]);
lightbox2-v6/js/lightbox.js-    }
lightbox2-v6/js/lightbox.js-    else {
lightbox2-v6/js/lightbox.js-      // Handle lightbox images with no grouping.
--
lightbox2-v6/js/lightbox.js-Drupal.behaviors.initLightbox = function (context) {
lightbox2-v6/js/lightbox.js-  $('body:not(.lightbox-processed)', context).addClass('lightbox-processed').each(function() {
lightbox2-v6/js/lightbox.js-    Lightbox.initialize();
lightbox2-v6/js/lightbox.js:    $('#lightboxAutoModal').triggerHandler('click');
lightbox2-v6/js/lightbox.js-    return false; // Break the each loop.
lightbox2-v6/js/lightbox.js-  });
lightbox2-v6/js/lightbox.js-
pounard@guinevere (lightboxtest) [16:32:38] %

I'm no expert of JavaScript/jQuery, but I think that in initLightbox() method you are trying to fire the 'click' handler on elements on which it does not exists. You don't seem to set the 'click' event for div#lightboxAutoModal, you only work on 'a' and 'area' with rel parameter in other init functions.

The difference with 5.x-2.9 version

Then, I did this:

pounard@guinevere (lightboxtest) [16:32:38] % grep -C 3 -iR "#lightboxAutoModal" lightbox2-v5/js/
lightbox2-v5/js/lightbox.js-        return false;
lightbox2-v5/js/lightbox.js-      });
lightbox2-v5/js/lightbox.js-    }
lightbox2-v5/js/lightbox.js:    $("a[@rel^='lightmodal'], area[@rel^='lightmodal'], #lightboxAutoModal").click(function() {
lightbox2-v5/js/lightbox.js-      $('#lightbox').unbind('click');
lightbox2-v5/js/lightbox.js-      Lightbox.start(this, false, false, false, true);
lightbox2-v5/js/lightbox.js-      return false;
--
lightbox2-v5/js/lightbox.js-
lightbox2-v5/js/lightbox.js-    if ($(imageLink).attr('id') == 'lightboxAutoModal') {
lightbox2-v5/js/lightbox.js-      rel_style = rel_parts["style"];
lightbox2-v5/js/lightbox.js:      Lightbox.imageArray.push(['#lightboxAutoModal > *', title, alt, rel_style, 1]);
lightbox2-v5/js/lightbox.js-    }
lightbox2-v5/js/lightbox.js-    else {
lightbox2-v5/js/lightbox.js-      // Handle lightbox images with no grouping.
--
lightbox2-v5/js/lightbox.js-if (Drupal.jsEnabled) {
lightbox2-v5/js/lightbox.js-  $(document).ready(function(){
lightbox2-v5/js/lightbox.js-    Lightbox.initialize();
lightbox2-v5/js/lightbox.js:    $('#lightboxAutoModal').triggerHandler('click');
lightbox2-v5/js/lightbox.js-  });
lightbox2-v5/js/lightbox.js-}
pounard@guinevere (lightboxtest) [16:35:10] %

See the difference? In 5.x-2.9 version you correctly set the 'click' trigger on *all* #lightboxAutoModal elements. This should work.

Light patch which does better work with me

In 6.x-1.9 version, I did this:

--- lightbox.js.orig	2009-01-05 15:21:52.000000000 +0100
+++ lightbox.js	2009-01-09 16:38:10.000000000 +0100
@@ -241,7 +241,7 @@
         return false;
       });
     }
-    $("a[@rel^='lightmodal']:not(.lightbox-processed), area[@rel^='lightmodal']:not(.lightbox-processed)").addClass('lightbox-processed').click(function(e) {
+    $("a[@rel^='lightmodal']:not(.lightbox-processed), area[@rel^='lightmodal']:not(.lightbox-processed), #lightboxAutoModal:not(.lightbox-processed)").addClass('lightbox-processed').click(function(e) {
       $('#lightbox').unbind('click');
       Lightbox.start(this, false, false, false, true);
       if (e.preventDefault) { e.preventDefault(); }

(to apply CC in some file, then do patch -p0 < my_file in lightbox2/js dir).

Which does not seems to works neither, BUT! at least, I have the lightbox-processed class set on my div#lightboxAutoModal, which wasn't there before.

pounard’s picture

Status: Closed (fixed) » Active

Forgot to re-open the bug.

stella’s picture

StatusFileSize
new1.37 KB

This has been fixed and will be included in the next dev release, available later today - or you can try the attached patch.

Cheers,
Stella

pounard’s picture

Thanks.

stella’s picture

Status: Active » Fixed

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

gbernier’s picture

Hey Stella,

Tried this example with the latest Dev release from March 8, 2010, the Modal window now opens but it's appearing blank for me. I can see the messages in the view source but nothing in the modal window.

drupert55’s picture

subscribing

elly’s picture

Hi there - I experienced the same thing as #26. The lightboxAutoModal div displayed all white for me with the dev release, however, the patched version of the current release works fine.

harry slaughter’s picture

this functionality seems to be broken again. see related ticket: http://drupal.org/node/783474

Anonymous’s picture

Category: feature » bug
Status: Closed (fixed) » Active

Yep, this is still a bug in D6.17 and Lightbox latest dev.

stella’s picture

Status: Active » Fixed

The instructions at http://drupal.org/node/316727 work for me in Garland theme, but it's possibly a duplicate of #325427: lightbox auto-load with lightmodal : #modalContainer is not displayed

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.