I am attempting to have the Drupal Notifications display in a closeable pop-up div. I hate how they push down the content and are stuck on the page until a refresh ... so I figured this would be the best fit.

I am discussing the drupal notices that display after you update content. like below...
* The menu item Home has been updated.
* The Page has been updated.

I'm going to work on it a bit to see if I can get it working. Still hunting for the proper code to add to my page.tpl file around the print "$messages" tag. Below is what I have so far. Keep in mind it doesn't fully work yet as its showing the messages but they are hidden.

<?php if ($messages): ?>
     <div class="thickbox" id="TB_window">
            <?php print $messages; ?>
     </div>
<?php endif; ?>

Im so close I can taste it; its just a matter of the proper little bit of code to have it launch on page load as opposed to clicking an "a href" tag or button.

Comments

Macronomicus’s picture

Macronomicus commented

Got it! Works wonderfully!! Yippy! Now all Drupal messages will appear in a nice transparent pop-up div.

Might want to add this to the docs? In case someone else is interested?

Just place the text below in your page.tpl.php file...

<?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; ?>
a_c_m’s picture

a_c_m commented

This is very cool... but!

If a client goes back to the page using the back browser button it pops up again, fine for standard messages, but when its a "You just added XYZ to your cart" it does confuse them a little. I think i have a cunning plan to get around this, that we somehow have the JS only fire if the page creation time is within say 10 seconds of current time. That way stale messages wont popup - but i'm yet to work out how to do this :)

a_c_m’s picture

a_c_m commented

Ok, ugly, but working solution. Only tracks the last message you saw, could be extended to use an array and so store the last 5.

You also need to enable/use/include the jquery cookie plugin http://plugins.jquery.com/project/cookie

<?php if ($messages): ?>
   <div style='display:none' 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 $hash = md5($messages+time()); //Stale popup fix. ?>
  <script type="text/javascript">
  $(document).ready(function(){
    if($.cookie("drupal_lastmsg") !== "<?php echo $hash ?>"){
      $("#TB_overlay").attr("style", '');
    }
    $.cookie("drupal_lastmsg", "<?php echo $hash ?>", { expires: 1 });
  });
  </script>
<?php endif; ?>

Basically i hide the message till i know it hasn't been seen before.

frjo’s picture

frjo commented
Status: Active » Fixed

Cleaning up old issues.

Macronomicus’s picture

Macronomicus commented

@a_c_m
Thats a cool with the time checker.
A nice improvement for sure.
It's quite usable to have a clean screen when you need it!

Cheers

Status: Fixed » Closed (fixed)

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