The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How can I add avatar in Recent Topics Widget?

Page 1 of 2 1, 2  Next

View previous topic View next topic Go down

Solved How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 25th 2014, 1:23 am

Hi dear all,
How can I add avatar in Recent Topics Widget before the topic title? My forum version is phpbb2.

Best Regards,
Dark-Avenger


Last edited by Dark-Avenger on March 5th 2014, 2:59 am; edited 3 times in total

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 27th 2014, 12:41 am

Bump

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 27th 2014, 2:21 am

Hi!

Add this JavaScript with investment in the index:
Code:

/***
* Avatar in Recent Topics Widget!
* Version: phpbb2
* Only one request per session to read member profile to get avatar!
* Optimization by JScript - 2013/07/04
*/
jQuery(function () {
    var sCSS = '' +
        '<style>' +
        '.ipsUserPhoto {' +
            'background: none repeat scroll 0 0 #FFFFFF;' +
            'border: 1px solid #D5D5D5 !important;' +
            'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
            'padding: 1px;' +
        '}' +
        '.ipsUserPhoto_mini {' +
            'height: 30px;' +
            'width: 30px;' +
        '}' +
        '</style>';
    document.head.insertAdjacentHTML('beforeEnd', sCSS);   
    /* DOM chached for fast execution! */
    //var widgetLeft = jQuery('#left')[0]; // Left widget;
    var widgetRight = jQuery('#right')[0]; // Right widget;
    var oTarget = jQuery(widgetRight).find('.forumline tr td.row1 a[href^="/t"]');
   
    oTarget.each(function () {
        oThis = jQuery(this); /* DOM chached for fast execution! */
        var temp = oThis.next().next().next();
        var UserURL = temp.attr('href');
        var UserTitle = temp.text();
        var def_img = "http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png"; /* In case request profile errors! */
        var UserIMG = 0;//sessionStorage.getItem(UserURL); /* Gets the avatar saved in local storage (Fastest!)*/
        var sHtml = '<a id="user_photo" style="float: left; margin-top: 3px; margin-right: 10px;" class="ipsUserPhoto" href="' + UserURL + '" title="' + UserTitle;
        /* If avatar alread saved, then no request member profile! */
        if(UserIMG) {
            oThis.prepend(sHtml + '"><img class="ipsUserPhoto_mini" src="' + UserIMG + '" alt="" /></a>');
        } else {
            /* if not, then only request per session!!! */
           
            /* Pre-loaded user img... */
            oThis.prepend(sHtml + '" title="' + UserTitle + '"><img class="ipsUserPhoto_mini" src="' + def_img + '" alt="" /></a>');
           
            // user img
            jQuery(this).children('a').load(UserURL + ' #emptyidcc .row1.gensmall img:eq(0)', function() {
                jQuery(this).children('img').attr('class','ipsUserPhoto_mini');
                var profile_img = jQuery(this).children('img').attr('src');
                //Saves the member avatar in local storage
                sessionStorage.setItem(UserURL, profile_img);
            });
        }
        oThis.find('a[href^="/u"]').insertBefore(jQuery(this));
    });
});

Result:


So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 27th 2014, 2:49 am

@JScript wrote:Hi!

Add this JavaScript with investment in the index:
Code:

/***
* Avatar in Recent Topics Widget!
* Version: phpbb2
* Only one request per session to read member profile to get avatar!
* Optimization by JScript - 2013/07/04
*/
jQuery(function () {
    var sCSS = '' +
        '<style>' +
        '.ipsUserPhoto {' +
            'background: none repeat scroll 0 0 #FFFFFF;' +
            'border: 1px solid #D5D5D5 !important;' +
            'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
            'padding: 1px;' +
        '}' +
        '.ipsUserPhoto_mini {' +
            'height: 30px;' +
            'width: 30px;' +
        '}' +
        '</style>';
    document.head.insertAdjacentHTML('beforeEnd', sCSS);   
    /* DOM chached for fast execution! */
    //var widgetLeft = jQuery('#left')[0]; // Left widget;
    var widgetRight = jQuery('#right')[0]; // Right widget;
    var oTarget = jQuery(widgetRight).find('.forumline tr td.row1 a[href^="/t"]');
   
    oTarget.each(function () {
        oThis = jQuery(this); /* DOM chached for fast execution! */
        var temp = oThis.next().next().next();
        var UserURL = temp.attr('href');
        var UserTitle = temp.text();
        var def_img = "http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png"; /* In case request profile errors! */
        var UserIMG = 0;//sessionStorage.getItem(UserURL); /* Gets the avatar saved in local storage (Fastest!)*/
        var sHtml = '<a id="user_photo" style="float: left; margin-top: 3px; margin-right: 10px;" class="ipsUserPhoto" href="' + UserURL + '" title="' + UserTitle;
        /* If avatar alread saved, then no request member profile! */
        if(UserIMG) {
            oThis.prepend(sHtml + '"><img class="ipsUserPhoto_mini" src="' + UserIMG + '" alt="" /></a>');
        } else {
            /* if not, then only request per session!!! */
           
            /* Pre-loaded user img... */
            oThis.prepend(sHtml + '" title="' + UserTitle + '"><img class="ipsUserPhoto_mini" src="' + def_img + '" alt="" /></a>');
           
            // user img
            jQuery(this).children('a').load(UserURL + ' #emptyidcc .row1.gensmall img:eq(0)', function() {
                jQuery(this).children('img').attr('class','ipsUserPhoto_mini');
                var profile_img = jQuery(this).children('img').attr('src');
                //Saves the member avatar in local storage
                sessionStorage.setItem(UserURL, profile_img);
            });
        }
        oThis.find('a[href^="/u"]').insertBefore(jQuery(this));
    });
});

Result:


So long,

JS
Hi,
Is there a more light javascript? This script crashes my forum and I am getting the message The request limit has exceeded. Furthermore this script displays only the default avatar in recent topics widget.

Best Regards,
Dark-Avenger

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 27th 2014, 3:00 am

Dark-Avenger wrote:Is there a more light javascript?
The answer is no!

Dark-Avenger wrote:I am getting the message The request limit has exceeded
This is because you may have many codes who request the profile of the members or make others requests at the same time and with that the protection comes into action!

Dark-Avenger wrote:Furthermore this script displays only the default avatar in recent topics widget.
When the Request Limit kicks in, then none avatar will be requested in the member profile.

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 27th 2014, 3:07 am

I faced the same problem with a javascript which its display the avatar on the board index in the Latest Post Box. Before few days I was found a better javascript in French Forumotion which is never crashes the forum. It uses a better technique for this issue but I cant transform it for the recent topics widget. The other javascirpt probably it reads the mini avatars of the forum.

Best Regards,
Dark-Avenger

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 27th 2014, 3:17 am

If there is another solution I don't know, but if you can post the code you mentioned, we can adapt it in my code!

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 27th 2014, 3:18 am

@JScript wrote:If there is another solution I don't know, but if you can post the code you mentioned, we can adapt it in my code!

So long,

JS
Yes of course here it is
Code:

$(function(){
        if(!window.localStorage) return;
        // Avatar par défaut
        var default_avatar= 'http://illiweb.com/fa/invision/pp-blank-thumb.png';
        // Temps de cache, ici 24 h * 60 m * 60 s * 1000 ms donc un jour
        var caching_time= 24*60*60*1000;
        // Temps de cache d'une erreur, ici 60 s * 1000 ms donc une minute
        var caching_error= 60*1000;
        var set_avatar= function(id) {
        $('.mini_ava.member'+id).html('<img src="'+get_avatar(id)+'" />');
        };
        var get_avatar= function(id) {
        if(localStorage.getItem('t_ava'+id) < +new Date - caching_time || (localStorage.getItem('d_ava'+id)==default_avatar && localStorage.getItem('t_ava'+id) < +new Date - caching_error))
        {
        localStorage.setItem('d_ava'+id, default_avatar);
        $.get('/u'+id, function (d){
        localStorage.setItem('t_ava'+id,+new Date);
        localStorage.setItem('d_ava'+id, $('#profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img',d).first().attr('src')||default_avatar);
        set_avatar(id);
        });
        }
        return localStorage.getItem('d_ava'+id);
        };
        var to_replace= {};
        $('dd.lastpost strong a.gensmall, .ipbtable tr td:last-child span strong a.gensmall, .table td.tcr strong a.gensmall, .forumline .row3.over strong a.gensmall').each(function(){
        to_replace[$(this).attr('href').substr(2)]= 1;
        $(this).closest('td,dd').prepend('<div class="mini_ava member'+$(this).attr('href').substr(2)+'"></div>');
        });
        for(i in to_replace)
        {
        set_avatar(i);
        };
        });

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 27th 2014, 3:26 am

The same feature that I did in my code with sessionStorage function is used, see in the image below:


In sum: There are several ways to avoid the Request Limit on your forum, which apparently has many codes that make requests, one would be by delaying some codes!

Try this:
Spoiler:

Code:

/***
* Avatar in Recent Topics Widget!
* Version: phpbb2
* Only one request per session to read member profile to get avatar!
* Optimization by JScript - 2013/07/04
*/
$(window).load(function() {
    var sCSS = '' +
        '<style>' +
        '.ipsUserPhoto {' +
            'background: none repeat scroll 0 0 #FFFFFF;' +
            'border: 1px solid #D5D5D5 !important;' +
            'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
            'padding: 1px;' +
        '}' +
        '.ipsUserPhoto_mini {' +
            'height: 30px;' +
            'width: 30px;' +
        '}' +
        '</style>';
    document.head.insertAdjacentHTML('beforeEnd', sCSS);    
    /* DOM chached for fast execution! */
 //var widgetLeft = jQuery('#left')[0]; // Left widget;
 var widgetRight = jQuery('#right')[0]; // Right widget;
    var oTarget = jQuery(widgetRight).find('.forumline tr td.row1 a[href^="/t"]');
    
    setTimeout(function() {
 oTarget.each(function () {
        oThis = jQuery(this); /* DOM chached for fast execution! */
        var temp = oThis.next().next().next();
 var UserURL = temp.attr('href');
        var UserTitle = temp.text();
        var def_img = "http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png"; /* In case request profile errors! */
        var UserIMG = 0;//sessionStorage.getItem(UserURL); /* Gets the avatar saved in local storage (Fastest!)*/
        var sHtml = '<a id="user_photo" style="float: left; margin-top: 3px; margin-right: 10px;" class="ipsUserPhoto" href="' + UserURL + '" title="' + UserTitle;
        /* If avatar alread saved, then no request member profile! */
        if(UserIMG) {
            oThis.prepend(sHtml + '"><img class="ipsUserPhoto_mini" src="' + UserIMG + '" alt="" /></a>');
        } else {
            /* if not, then only request per session!!! */
            
            /* Pre-loaded user img... */
            oThis.prepend(sHtml + '" title="' + UserTitle + '"><img class="ipsUserPhoto_mini" src="' + def_img + '" alt="" /></a>');
            
            // user img
            jQuery(this).children('a').load(UserURL + ' #emptyidcc .row1.gensmall img:eq(0)', function() {
                jQuery(this).children('img').attr('class','ipsUserPhoto_mini');
                var profile_img = jQuery(this).children('img').attr('src');
                //Saves the member avatar in local storage
                sessionStorage.setItem(UserURL, profile_img);
            });
        }
 oThis.find('a[href^="/u"]').insertBefore(jQuery(this));
 });
    }, 5000);
});

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 27th 2014, 12:06 pm

Its working but it shows again the message about the limits. :(Can we change the area in script which retrieves the avatars? Can we retrieve the avatars from userlist/memberlist?

Best Regards,
Dark-Avenger

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 28th 2014, 1:00 am

Hello, if you post the address of your forum, I can analyze the scripts and try to avoid the protection, I assure you that the help will be much faster!

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 28th 2014, 1:08 am

@JScript wrote:Hello, if you post the address of your forum, I can analyze the scripts and try to avoid the protection, I assure you that the help will be much faster!

So long,

JS
Hi,
Yes of course here it is
Spoiler:
Code:
http://linux-team.forumgreek.com/

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on February 28th 2014, 1:53 am

Ok!

Your forum has 4 scripts that make requests at the same time, this is expected limit, which is why the Request Limit appears frequently!

What you need to do is run them in sequence and only if they are visible on the screen!
See the code below, it is the basis of what I use on my forum, with this I can make multiple requests and the protection does not appear:
Code:

<!--
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript
 * View more in: http://punbb.forumeiros.com/forum
 -->
<div class="module main">
 <div class="main-head"><h3>****Your Widget Title****</h3></div>
 <div id="****mod_your_widget_id****" class="main-content _sbcollapsable" style="margin: 0px; height: 213px; max-height: 213px; overflow: auto;">
        <!-- #region widget_row -->
        <ul id="****ul_your_list_id****" class="ipsList_withminiphoto" style="margin: 0px !important;">
        <!-- content -->
 </ul>
       <!-- #endregion widget_row -->
 </div>
</div>
<script type="text/javascript">
//<![CDATA[
/***
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript at www.punbb.forumeiros.com
 */
 
/* Fire event for 'scroll' to show the widget... */
if (location.pathname == '/') {
    jQuery(window).on('scroll.****reput****', showWidget(document.getElementById("****mod_your_widget_id****")));
}
/* Function to check if an element is visible in view port */
function isInViewPort(elem) {
 var rect = elem.getBoundingClientRect();

 return (
 rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
 rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */ );
}
/* Start function to show the widget... */
function showWidget(elem) {
 return function() {
        /* Chech if the widget is visible in view port! */
 if (isInViewPort(elem)) {
            /* If visible, stop event!!! */
 jQuery(window).off('scroll.****reput****');

            /* DOM chached for fast execution! */
 var oHtml = sessionStorage.getItem('****mod_your_widget_id****'); /*Gets the html saved in local storage (Fastest!)*/

 /* If html alread saved, then no requests! */
 if (oHtml !== null) {
 jQuery('#****ul_your_list_id****').html(oHtml);
 } else { /* if not, then only request per session!!! */
                var sHtml = '';
                
                // Put here your code!!!
                
                jQuery('#****ul_your_list_id****').append(sHtml);
                sessionStorage.setItem('****mod_your_widget_id****', sHtml);                    
 }
 }
 }
}
//]]>
</script>
All of the code added where has the phrase // Put your code here! is only executed if and only if the element is visible on screen.

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on February 28th 2014, 2:26 am

@JScript wrote:Ok!

Your forum has 4 scripts that make requests at the same time, this is expected limit, which is why the Request Limit appears frequently!

What you need to do is run them in sequence and only if they are visible on the screen!
See the code below, it is the basis of what I use on my forum, with this I can make multiple requests and the protection does not appear:
Code:

<!--
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript
 * View more in: http://punbb.forumeiros.com/forum
 -->
<div class="module main">
 <div class="main-head"><h3>****Your Widget Title****</h3></div>
 <div id="****mod_your_widget_id****" class="main-content _sbcollapsable" style="margin: 0px; height: 213px; max-height: 213px; overflow: auto;">
        <!-- #region widget_row -->
        <ul id="****ul_your_list_id****" class="ipsList_withminiphoto" style="margin: 0px !important;">
        <!-- content -->
 </ul>
       <!-- #endregion widget_row -->
 </div>
</div>
<script type="text/javascript">
//<![CDATA[
/***
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript at www.punbb.forumeiros.com
 */
 
/* Fire event for 'scroll' to show the widget... */
if (location.pathname == '/') {
    jQuery(window).on('scroll.****reput****', showWidget(document.getElementById("****mod_your_widget_id****")));
}
/* Function to check if an element is visible in view port */
function isInViewPort(elem) {
 var rect = elem.getBoundingClientRect();

 return (
 rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
 rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */ );
}
/* Start function to show the widget... */
function showWidget(elem) {
 return function() {
        /* Chech if the widget is visible in view port! */
 if (isInViewPort(elem)) {
            /* If visible, stop event!!! */
 jQuery(window).off('scroll.****reput****');

            /* DOM chached for fast execution! */
 var oHtml = sessionStorage.getItem('****mod_your_widget_id****'); /*Gets the html saved in local storage (Fastest!)*/

 /* If html alread saved, then no requests! */
 if (oHtml !== null) {
 jQuery('#****ul_your_list_id****').html(oHtml);
 } else { /* if not, then only request per session!!! */
                var sHtml = '';
                
                // Put here your code!!!
                
                jQuery('#****ul_your_list_id****').append(sHtml);
                sessionStorage.setItem('****mod_your_widget_id****', sHtml);                    
 }
 }
 }
}
//]]>
</script>
All of the code added where has the phrase // Put your code here! is only executed if and only if the element is visible on screen.

So long,

JS
I have 5 JS to show the avatar in different places of my forum which are:

1 JS to show the avatar in the forumotion toolbar (Ticked In All Pages)
1 JS to show the avatar in the board index of the forum at the Latest Post (Ticked on HomePage)
1 JS to show the avatar in the quick-reply (Ticked In the topics)
1 JS to show the avatar on mouse over profile (Ticked In the HomePage)
and 1 JS to show the avatar on the recent topics widget (Ticked In All Pages)

Is there a way to resolve my problem without delete none of them? Temporary I have disabled the JS of Avatar in Recent Topics to work in my forum. Is it possible to combine avatar in the forumotion toolbar, avatar in the board index and avatar on the recent topics widget in just one script with one call to the database to decrease the calls?

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on March 2nd 2014, 10:20 pm

Bump

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 2nd 2014, 10:29 pm

I'll repeat what I said above:
What you need to do is run them in sequence and only if they are visible on the screen!
See the code below, it is the basis of what I use on my forum, with this I can make multiple requests and the protection does not appear:
Code:

<!--
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript
 * View more in: http://punbb.forumeiros.com/forum
 -->
<div class="module main">
 <div class="main-head"><h3>****Your Widget Title****</h3></div>
 <div id="****mod_your_widget_id****" class="main-content _sbcollapsable" style="margin: 0px; height: 213px; max-height: 213px; overflow: auto;">
        <!-- #region widget_row -->
        <ul id="****ul_your_list_id****" class="ipsList_withminiphoto" style="margin: 0px !important;">
        <!-- content -->
 </ul>
      <!-- #endregion widget_row -->
 </div>
</div>
<script type="text/javascript">
//<![CDATA[
/***
 * Widget ****Your Widget Title****
 * Only show the widget if is visible in browser window (view port)!!!
 * Made and Optimizations by JScript at www.punbb.forumeiros.com
 */
 
/* Fire event for 'scroll' to show the widget... */
if (location.pathname == '/') {
    jQuery(window).on('scroll.****reput****', showWidget(document.getElementById("****mod_your_widget_id****")));
}
/* Function to check if an element is visible in view port */
function isInViewPort(elem) {
 var rect = elem.getBoundingClientRect();

 return (
 rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
 rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */ );
}
/* Start function to show the widget... */
function showWidget(elem) {
 return function() {
        /* Chech if the widget is visible in view port! */
 if (isInViewPort(elem)) {
            /* If visible, stop event!!! */
 jQuery(window).off('scroll.****reput****');

            /* DOM chached for fast execution! */
 var oHtml = sessionStorage.getItem('****mod_your_widget_id****'); /*Gets the html saved in local storage (Fastest!)*/

 /* If html alread saved, then no requests! */
 if (oHtml !== null) {
 jQuery('#****ul_your_list_id****').html(oHtml);
 } else { /* if not, then only request per session!!! */
                var sHtml = '';
               
                // Put here your code!!!
               
                jQuery('#****ul_your_list_id****').append(sHtml);
                sessionStorage.setItem('****mod_your_widget_id****', sHtml);                   
 }
 }
 }
}
//]]>
</script>
All of the code added where has the phrase // Put your code here! is only executed if and only if the element is visible on screen.
So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on March 2nd 2014, 10:36 pm

Where can I put this code(meaning in which template)? I think it is a very heavy script due the overload on sql database, is there a shortest and lighter way or a better javascript?

Best Regards,
Dark-Avenger

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 2nd 2014, 11:14 pm

I've realized that you do not understood, post a code that make requests so I can adapt in to the code I posted.

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on March 2nd 2014, 11:47 pm

@JScript wrote:I've realized that you do not understood, post a code that make requests so I can adapt in to the code I posted.

JS
I am thinking this code

Code:

/***
    * Avatar in Recent Topics Widget!
    * Version: phpbb2
    * Only one request per session to read member profile to get avatar!
    * Optimization by JScript - 2013/07/04
    */
    $(window).load(function() {
        var sCSS = '' +
            '<style>' +
            '.ipsUserPhoto {' +
                'background: none repeat scroll 0 0 #FFFFFF;' +
                'border: 1px solid #0000CD !important;' +
                'border-radius: 4px;' +
                'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
                'padding: 1px;' +
            '}' +
            '.ipsUserPhoto_mini {' +
                'height: 30px;' +
                'width: 30px;' +
            '}' +
            '</style>';
        document.head.insertAdjacentHTML('beforeEnd', sCSS);   
        /* DOM chached for fast execution! */
     //var widgetLeft = jQuery('#left')[0]; // Left widget;
     var widgetRight = jQuery('#right')[0]; // Right widget;
        var oTarget = jQuery(widgetRight).find('.forumline tr td.row1 a[href^="/t"]');
       
        setTimeout(function() {
     oTarget.each(function () {
            oThis = jQuery(this); /* DOM chached for fast execution! */
            var temp = oThis.next().next().next();
     var UserURL = temp.attr('href');
            var UserTitle = temp.text();
            var def_img = "http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png"; /* In case request profile errors! */
            var UserIMG = 0;//sessionStorage.getItem(UserURL); /* Gets the avatar saved in local storage (Fastest!)*/
            var sHtml = '<a id="user_photo" style="float: left; margin-top: 3px; margin-right: 10px;" class="ipsUserPhoto" href="' + UserURL + '" title="' + UserTitle;
            /* If avatar alread saved, then no request member profile! */
            if(UserIMG) {
                oThis.prepend(sHtml + '"><img class="ipsUserPhoto_mini" src="' + UserIMG + '" alt="" /></a>');
            } else {
                /* if not, then only request per session!!! */
               
                /* Pre-loaded user img... */
                oThis.prepend(sHtml + '" title="' + UserTitle + '"><img class="ipsUserPhoto_mini" src="' + def_img + '" alt="" /></a>');
               
                // user img
                jQuery(this).children('a').load(UserURL + ' #emptyidcc .row1.gensmall img:eq(0)', function() {
                    jQuery(this).children('img').attr('class','ipsUserPhoto_mini');
                    var profile_img = jQuery(this).children('img').attr('src');
                    //Saves the member avatar in local storage
                    sessionStorage.setItem(UserURL, profile_img);
                });
            }
     oThis.find('a[href^="/u"]').insertBefore(jQuery(this));
     });
        }, 5000);
    });
retrieves the avatar from user profile which is larger than the avatar in the members list. I am studying the code if can I change it to retrieve the avatar from memberslist because is smaller to reduce the space in local storage and the bandwidth size.

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on March 4th 2014, 11:43 pm

Bump

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 5th 2014, 12:03 am

Dark-Avenger wrote:Bump
Before taking a "bump" in this topic, you have seen and tested this other: http://help.forumotion.com/t130893-how-can-i-add-some-infos-about-last-post-in-the-board-index#879514 ?

The code for this topic I will still do ok?

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Luffy on March 5th 2014, 12:09 am

Did you try making the recent topics widget with less topics so it won't have to load many avatars at once?






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 5th 2014, 12:14 am

@Marios94

Read this: http://help.forumotion.com/t130972-how-can-i-add-avatar-in-recent-topics-widget#878709

Thus it may become carefree, just that I have not had time to adapt!

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Luffy on March 5th 2014, 12:20 am

@JScript:
What i mean is to go to the widget and reduce the number of the topics displayed from the widget. Nothing else using codes.






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 5th 2014, 12:31 am

@Marios94
I understood friend, but the forum of him already has many requests being made, just one more to fire the Request Limit.

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Luffy on March 5th 2014, 12:46 am

The request limit appears because of the "weight" of the javascripts that need to load all together. Maybe a smaller and more "light" javascript would help it. And one question. Why is there a css added in the javascript and not a simple command where you could modify it as you wish in css?






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Ange Tuteur on March 5th 2014, 12:50 am

Hi,

I noticed this tuto on Italian support, perhaps you could give it a try :
http://aiuto.forumattivo.com/t16991-avatar-nel-widget-ultimi-argomenti

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Luffy on March 5th 2014, 12:57 am

To me it doesn't work Ange. :/






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by JScript on March 5th 2014, 1:01 am

@Ange Tuteur
Does the same effect as my code, just it does not work...

Marios94 wrote:Why is there a css added in the javascript and not a simple command where you could modify it as you wish in css?
For when adding the code, is just one step and ease for "noobies"!


You can rest assured, I will adapt my code to prevent it from firing the Request Limit on his forum.

So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: How can I add avatar in Recent Topics Widget?

Post by Van-Helsing on March 5th 2014, 1:05 am

@Ange Tuteur wrote:Hi,

I noticed this tuto on Italian support, perhaps you could give it a try :
http://aiuto.forumattivo.com/t16991-avatar-nel-widget-ultimi-argomenti
Hi Ange,
Its seems to working perfectly I have place the codes of this tutorial and I want to display the avatar before the topic title. Could you help me please?

Best Regards,
Dark-Avenger

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Page 1 of 2 1, 2  Next

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum