Simple Machines Community Forum

Customizing SMF => Graphics and Templates => Topic started by: AlenNS on February 12, 2009, 05:04:01 AM

Title: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on February 12, 2009, 05:04:01 AM
Quote from: AlenNS on February 01, 2009, 09:11:08 PM
I would like to have my images attached like it is on second picture. Is it possible to do?
Thanks in advance! :)

Picture 1 ( now ):

(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi42.tinypic.com%2F2005kk1.jpg&hash=64eac5272f66d72a97c226ff10b26fc56356739c)

Picture 2:

(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi39.tinypic.com%2F2hmplxh.jpg&hash=f520cd8f5ed4797760ca297a057d8920f960162a)
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: Gary on February 12, 2009, 05:09:10 AM
Take a look at the Display.template.php file of my Around the World in 80 Settings theme, I gave you the option of allowing attachments to be displayed like that.
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on February 12, 2009, 05:18:23 AM
Ok. I'll do that. :)
Thanks for fast answer. :)
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on February 12, 2009, 05:22:01 AM
But I'm using SMF 2.0 and your theme is for 1.x.
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: Gary on February 12, 2009, 08:19:34 AM
The code is still pretty much the same for attachments. Use it to help you edit the attachments code in your version of Display.template.php
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on February 13, 2009, 11:35:07 PM
I've messed up my Display.template.php with that part of code that controls attachments.
I have a backup.

Problem is with table and div tags...
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: Gary on February 14, 2009, 02:48:54 PM
Alright attach your Display.template.php and I'll tell you what changes you need to make.
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on March 03, 2009, 11:35:10 AM
Quote from: Gazmanafc on February 14, 2009, 02:48:54 PM
Alright attach your Display.template.php and I'll tell you what changes you need to make.
Can you help me with this please?
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: Gary on March 12, 2009, 08:01:48 PM
Use this snippet:

// Assuming there are attachments...
if (!empty($message['attachment']))
{
echo '
<hr width="100%" size="1" class="hrcolor" />
<div style="overflow: auto; width: 100%;">';
$last_approved_state = 1;
foreach ($message['attachment'] as $attachment)
{
// Show a special box for unapproved attachments...
if ($attachment['is_approved'] != $last_approved_state)
{
$last_approved_state = 0;
echo '
<fieldset>
          <legend>', $txt['attach_awaiting_approve'], '&nbsp;[<a href="', $scripturl, '?action=attachapprove;sa=all;mid=', $message['id'], ';sesc=', $context['session_id'], '">', $txt['approve_all'], '</a>]</legend>';
}

                      echo'
                      <div style="float: left; overflow: auto; margin-right: 5px; margin-bottom: 5px; padding: 1px;">';
                     
                      if ($attachment['is_image'])
                      {
                         // We has thumbnail
                         if ($attachment['thumbnail']['has_thumb'])
                         {
                            echo'
                            <a href="', $attachment['href'], ';image" id="link_', $attachment['id'], '" onclick="', $attachment['thumbnail']['javascript'], '"><img src="', $attachment['thumbnail']['href'], '" alt="" id="thumb_', $attachment['id'], '" border="0" /></a>';
                         }
                         // We dont has thumbnail
                         else
                         {
                            echo'
                            <img src="' . $attachment['href'] . ';image" alt="" width="' . $attachment['width'] . '" height="' . $attachment['height'] . '" border="0" />';
                         }
                     
                      // Only Images will need a br
                      echo'
                      <br />';
                      }
                     
                      echo'
                      <a href="' . $attachment['href'] . '"><img src="' . $settings['images_url'] . '/fileicons/' . $attachment['iconfile'] . '.gif" style="vertical-align: middle" alt="*" border="0" /> <strong>' . $attachment['name'] . '</strong></a><br />
                      <strong>' , $txt['filesize'] , ':</strong> ', $attachment['size'] , '<br />';
                     
                     if ($attachment['is_image'])
                     {
                        echo'
                        <strong>' , $txt['dimensions'] , ':</strong> ' . $attachment['real_width'] . 'x' . $attachment['real_height'] . '<br />
                        <strong>' , $txt['snake'], ':</strong>';
                     }
                     else
                     {
                        echo'
                        <strong>' , $txt['eater'] , ':</strong>';
                     }
                     
                     echo'
                     ' , $attachment['downloads'] , ' ' , $txt['attach_times'] , '';
                                                 
                     if (!$attachment['is_approved'])
                     {
                       echo '
                       <br />[<a href="', $scripturl, '?action=attachapprove;sa=approve;aid=', $attachment['id'], ';sesc=', $context['session_id'], '">', $txt['approve'], '</a>]&nbsp;|&nbsp;[<a href="', $scripturl, '?action=attachapprove;sa=reject;aid=', $attachment['id'], ';sesc=', $context['session_id'], '">', $txt['delete'], '</a>]';
                     }
                     echo'

                     </div>';

}

// If we had unapproved attachments clean up.
if ($last_approved_state == 0)
echo '
</fieldset>';

echo '
</div>';
}



And add this into your themes Modifications.language.php after translating of course.

// Attachment management with crazy ass string names. :P
$txt['filesize'] = 'Filesize';
$txt['dimensions'] = 'Image Dimensions';
$txt['snake'] = 'Viewed';
$txt['eater'] = 'Downloaded';


Do make a backup of course.

And sorry it took so long. I got busy elsewhere.
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on March 12, 2009, 09:55:06 PM
OK. I'll try it now. Thanks for your time and effort. :)))
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on March 12, 2009, 10:19:50 PM
Ok. One problem. :)

I had jQLightbox installed and had to uninstall now.

Now, when I try to open any picture bigger then 700x700 pixels, it opens in new window and immediately closes and shows window for saving picture or open with ACDSee.

What should I do?
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: AlenNS on March 12, 2009, 10:23:36 PM
Solved! :))
I've installed again jQLightbox and it works great!!!
Thanks once more!!! :))
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: izar on March 13, 2009, 08:41:41 AM
Great Post! Thanks. I will try it
Title: Re: Picture attachment align - Using highslide image viewer mod
Post by: qtime on May 10, 2009, 05:31:45 PM
Excellent!!!

to get a better line out in internet explorer:
change
                      <div style="float: left; overflow: auto; margin-right: 5px; margin-bottom: 5px; padding: 1px;">';

to

                      <div style="float: left; overflow: 50px; margin-right: 5px; margin-bottom: 5px; padding: 1px;">';



to use it on smf 118, with highslide I used this code:

      // Assuming there are attachments...
      if (!empty($message['attachment']))
      {
         echo '
                           <hr width="100%" size="1" class="hrcolor" />
                           <div style="overflow: auto; width: 100%;">';
         $last_approved_state = 1;
         foreach ($message['attachment'] as $attachment)
         {
            // Show a special box for unapproved attachments...
            if ($attachment['is_approved'] != $last_approved_state)
            {
               $last_approved_state = 0;
               echo '
               <fieldset>
                         <legend>', $txt['attach_awaiting_approve'], '&nbsp;[<a href="', $scripturl, '?action=attachapprove;sa=all;mid=', $message['id'], ';sesc=', $context['session_id'], '">', $txt['approve_all'], '</a>]</legend>';
            }

                      echo'
                      <div style="float: left; overflow: 50px; margin-right: 5px; margin-bottom: 5px; padding: 1px;">';
                     
                      if ($attachment['is_image'])
                      {
                         // We has thumbnail
                         if ($attachment['thumbnail']['has_thumb'])
                         {
                            echo'
                            <a href="', $attachment['href'], ';image" id="link_', $attachment['id'], '" class="highslide" rel="highslide"><img src="', $attachment['thumbnail']['href'], '" alt="" id="thumb_', $attachment['id'], '" border="0" /></a>';
                         }
                         // We dont has thumbnail
                         else
                         {
                            echo'
                            <img src="' . $attachment['href'] . ';image" alt="" width="' . $attachment['width'] . '" height="' . $attachment['height'] . '" border="0" />';
                         }
                     
                      // Only Images will need a br
                      echo'
                      <br />';
                      }
                     
                      echo'
                      <a href="' . $attachment['href'] . '"><img src="' . $settings['images_url'] . '/fileicons/' . $attachment['iconfile'] . '.gif" style="vertical-align: middle" alt="*" border="0" /> <strong>' . $attachment['name'] . '</strong></a><br />
                      <strong>' , $txt['filesize'] , ':</strong> ', $attachment['size'] , '<br />';
                     
                     if ($attachment['is_image'])
                     {
                        echo'
                        <strong>' , $txt['dimensions'] , ':</strong> ' . $attachment['real_width'] . 'x' . $attachment['real_height'] . '<br />
                        <strong>' , $txt['snake'], ':</strong>';
                     }
                     else
                     {
                        echo'
                        <strong>' , $txt['eater'] , ':</strong>';
                     }
                     
                     echo'
                     ' , $attachment['downloads'] , ' ' , $txt['attach_times'] , '';
                                                 
                     if (!$attachment['is_approved'])
//                     {
//                       echo '
//                       <br />[<a href="', $scripturl, '?action=attachapprove;sa=approve;aid=', $attachment['id'], ';sesc=', $context['session_id'], '">', $txt['approve'], '</a>]&nbsp;|&nbsp;[<a href="', $scripturl, '?action=attachapprove;sa=reject;aid=', $attachment['id'], ';sesc=', $context['session_id'], '">', $txt['delete'], '</a>]';
//                     }
                     echo'

                     </div>';

         }

         // If we had unapproved attachments clean up.
         if ($last_approved_state == 0)
            echo '
                           </fieldset>';

         echo '
                           </div>';
      }

I think it can be better, but it is working great!