Topic: Recent topic with popup

[rocknroller]

..::Recent Topic with avatar and popup preview::..

Verson 1.2

Code: [Select]

/**
 * Recent Topic with avatar and popup preview
 * Version 1.2
 * @author logooff.net
 */
 
//SETUP

$number_of_posts =10; // here you can change number of posts
$default_avatar = 'http://www.pohrani.com/f/45/mu/1bzggGqq/noavatar.png'; // enter URL of default avatar you want. Like this 'http://www.url.com/image.jpg'

//SETUP END
global $contex, $txt, $settings;
$array = ssi_recentTopics($number_of_posts, null, null, 'array');
echo '
<table class="side_class_row">';
foreach ($array as $post)
{
global $memberContext;
      loadMemberData($post['poster']['id']);
      loadMemberContext($post['poster']['id']);
echo '
  <tr>
<td class="side_class_replies">', $post['replies'], '</td>
            <td  class="side_class_new">';
                if (!empty($post['new']) )
                    echo'';
                else
                    echo'
                    <img src="' . $settings['lang_images_url'] . '/new.gif" class="new_posts" alt="new" />';
             echo'
            </td>
            <td></td>
    <td><div class="triangle-isosceles" id="a', $post['topic'], '" style="display: none">', $post['preview'], '</div>
                    <a href="'. $post['href']. '" target="_self" onmouseover="document.getElementById(\'a', $post['topic'], '\').style.display = \'block\'" onmouseout="document.getElementById(\'a', $post['topic'], '\').style.display = \'none\'">', $post['short_subject'], '</a>
             </td>
<td>';
            if (!empty($memberContext[$post['poster']['id']]['avatar']['href'])){
echo '<img src="' . $memberContext[$post['poster']['id']]['avatar']['href'] . '" width="30" height="30" alt="', $post['poster']['name'], '" />';
                    }           
            else {
echo '<img src="' . $default_avatar .'" alt="default_avatar" width="30" height="30" />';
                }
        echo'
            </td>
            <td></td>
    </tr>
        <tr>
            <td colspan="6"><p class="side_class_poster"><span class="floatleft">', $txt['replies'], '</span> ', $post['poster']['link'], ' </p><hr class="side_hr" /></td>
        </tr>';
}
echo '
    </table>
<style type="text/css">
.side_class_poster
{
     font-size:10px;
     margin: 0;
     padding: 0;
     text-align: right;
}
table.side_class_row hr
     margin: 0;
     padding: 0;
}
.side_class_row
{
     padding:4px;
     width: 100%;
}
td.side_class_replies
{
     text-align:center;
     width:3%;
}
td.side_class_new
{
     text-align:center;
     width:3%;
}
.triangle-isosceles {
    position: fixed;
    top: 300px;
    left: 400px;
    padding:15px;
    margin:1em 0 3em;
    color:#fff;
    max-width: 400px;
    border: 1px solid #222222;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-box-shadow: 3px 3px 39px 2px #222222;
    -webkit-box-shadow: 3px 3px 39px 2px #222222;
    box-shadow: 3px 3px 39px 2px #222222;
    background: -moz-linear-gradient(top, rgba(41,137,216,0.9) 0%, rgba(30,87,153,0.9) 94%, rgba(30,87,153,0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(41,137,216,0.9)), color-stop(94%,rgba(30,87,153,0.9)), color-stop(100%,rgba(30,87,153,0.9)));
    background: -webkit-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: -o-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: -ms-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    }
</style>';
Enjoy!


29.08.2011
Version 1.2

• Added Setupable avatar

16.07.2011

• Added avatar (thanx to blue)
• Fixed XHTML validation
• Added setup for number of posts

[Blue]

Here, try this:

Code: [Select]

<?php

$array = ssi_recentTopics(10, null, null, 'array');
global $contex, $txt, $settings;
echo '
<table class="side_class_row">
        <thead>
            <tr>
                <td>', $txt['replies'], '</td>
                <td></td>
                <td></td>
<td></td>
                <td></td>
            </tr>
        <thead>';
foreach ($array as $post)
{

global $memberContext;
      loadMemberData($post['poster']['id']);
      loadMemberContext($post['poster']['id']);


echo '
        <tbody>
  <tr>
<td class="side_class_replies">', $post['replies'], '</td>
            <td  class="side_class_new">';
                if (!empty($post['new']) )
                    echo'';
                else
                    echo'
                    <img src="' . $settings['lang_images_url'] . '/new.gif" class="new_posts" alt="" />';
             echo'
                </td>
                <td></td>
     <td>
                    <div class="triangle-isosceles" id="', $post['topic'], '" style="display: none">', $post['preview'], '</div>
                    <a href="'. $post['href']. '" target="_self" onmouseover="document.getElementById(\'', $post['topic'], '\').style.display = \'block\'" onmouseout="document.getElementById(\'', $post['topic'], '\').style.display = \'none\'">', $post['short_subject'], '</a>
                </td>
<td><img src="' . $memberContext[$post['poster']['id']]['avatar']['href'] . '" width="30px" height="30px" /></td>
                <td class="side_class_poster"><pre> ', $post['poster']['name'], ' </pre> </td>
     </tr>
            <tr>
                <td colspan="5"><hr></td>
            </tr>
        </tbody>';
}
echo '
    </table> 
<style> 
.side_class_poster pre
{
     font-size:10px;
}
.side_class_row
{
     padding:4px;
     width: 100%;
}
td.side_class_replies
{
     text-align:center;
     width:3%;
}
td.side_class_new
{
     text-align:center;
     width:3%;
}
.triangle-isosceles {
    position: fixed;
    top: 300px;
    left: 400px;
    padding:15px;
    margin:1em 0 3em;
    color:#fff;
    max-width: 400px;
    border: 1px solid #222222;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-box-shadow: 3px 3px 39px 2px #222222;
    -webkit-box-shadow: 3px 3px 39px 2px #222222;
    box-shadow: 3px 3px 39px 2px #222222;
    background: -moz-linear-gradient(top, rgba(41,137,216,0.9) 0%, rgba(30,87,153,0.9) 94%, rgba(30,87,153,0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(41,137,216,0.9)), color-stop(94%,rgba(30,87,153,0.9)), color-stop(100%,rgba(30,87,153,0.9)));
    background: -webkit-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: -o-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: -ms-linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    background: linear-gradient(top, rgba(41,137,216,0.9) 0%,rgba(30,87,153,0.9) 94%,rgba(30,87,153,0.9) 100%);
    }
</style>';

?>

[agent47]

Wow this looks so awesome.... I wish someone would implement this for this mod. It'll look so awesome.

[Blue]

I have to re-do that block since that was my first block ever 

Maybe, when I start I'll ask rocknroller if I can use his code.

[rocknroller]

I have to re-do that block since that was my first block ever 

Maybe, when I start I'll ask rocknroller if I can use his code.

tnx friend for avatar, sure you can use it. I'm glad that someone like this code. 

[Blue]

Glad I could help

[agent47]

You guys rule!

[S@ffz]

I have to re-do that block since that was my first block ever 

Maybe, when I start I'll ask rocknroller if I can use his code.

Are you still going too Blue?
 is it possible to reduce the amount of topics displayed?

[rocknroller]

I have to re-do that block since that was my first block ever 

Maybe, when I start I'll ask rocknroller if I can use his code.

Are you still going too Blue?
is it possible to reduce the amount of topics displayed?

Edited first post..

[S@ffz]

Thanks rocknroller

One more Question how can I tidy the contents displayed in the block as they are very space apart and almost looks
bare.   As you can see from the attached image 5 post are displayed and there is a scroll bar at the bottom.   
and I don't know how or where to tidy this block.  Any help would be much appreciated.

[rocknroller]

Thanks rocknroller

One more Question how can I tidy the contents displayed in the block as they are very space apart and almost looks
bare.   As you can see from the attached image 5 post are displayed and there is a scroll bar at the bottom.   
and I don't know how or where to tidy this block.  Any help would be much appreciated.

i was changed code in first post today with newer version, first change the code and is still have problem send me link of your forum, so can check with firebug.

[S@ffz]

Great block guys

thanks 

[FrizzleFried]

Was wondering if there is a way to limit the forums this block looks for... I have a NSFW forum i want it to ignore.