* Description: This application displays the member avatar in Forumotion toolbar in a fastest way!

In your ACP: Modules -> HTML&JAVASCRIPT -> JavaScript codes management -> [Create a new JavaScript]
Title *: <- Whatever you want
Placement : <- In all the pages
Javascript Code * : <- Select, copy and paste the code below in this field:

Code:


/*
* Application: Toolbar with member avatar
* Description: This application displays the member avatar in Forumotion toolbar in a fastest way!
* Version: 1.08032014-jq1.9.1 - Keb (Horus)
* Made and Optimizations by JScript - 2014/03/08
* Copyright (c) 2014 JScript <jscriptbrasil at live dot com>
* This work is free. You can redistribute it and/or modify it
* under the terms of the WTFPL, Version 2
*/
jQuery(function() {
    JS_faIsRead();

    function JS_faIsRead() {
        if (jQuery('#fa_welcome').length) {
            jQuery('#fa_welcome').prepend(_userdata.avatar).children('img').css( {
                'border-radius' : '3px 3px 3px 3px',
                'height' : '25px',
                'margin-bottom' : '-10px',
                'margin-right' : '5px',
                'position' : 'relative',
                'top' : '-3px',
                'width' : '25px'
            });
        } else {
            setTimeout(JS_faIsRead, 100);
        }
    }
});


Try it!

JS

Nice Work but i have a problem with it it comes up 2 times
https://i.servimg.com/u/f18/12/23/10/57/captur36.png

@APE
Well, I tested now on the console and only appeared once, in my forum is functioning normally, but I need you to install the code in your forum so that I can verify what is going ok?

I did signed up there,

JS

ok it has come back up as one but its moved my bar at the top down a bit

@APE
You can show me the before and after installing the code?

JS

I think the two things you can do two improve this would be :

1. Check the login state before polling for fa_welcome. This way it wont be polling for fa_welcome while the user is logged out.

Example :

Code:

if (_userdata.session_logged_in) JS_faIsRead();

2. If possible, native getElementById() is normally a lot faster for getting elements by their ID. You could also just stick with jQuery, but cache it to a variable so it doesn't have to search for fa_welcome when the condition is triggered. Normally like you do with native after writing that loooong document.getElementById

Example :

Code:

        var welcome = document.getElementById('fa_welcome');
        if (welcome) {
            jQuery(welcome)

This is also another example I wrote :

Code:

$(function() {
  if (_userdata.session_logged_in) {
    var avatar = document.createElement('SPAN'), right; // start up variables
    avatar.innerHTML = _userdata.avatar.replace(/<img (src=".*)/,'<img style="height:25px;width:25px;vertical-align:middle;margin-bottom:1px;" $1'); // add avatar to the container
    avatar.id = 'fa_avatar'; // apply id for user modifications
 
    $(function() { // toolbar should be ready
      right = document.getElementById('fa_right'); // get the right side of the toolbar
      right && right.insertBefore(avatar, right.firstChild); // insert the avatar as the first node
    });
  }
});

I usually like polling for modifications before the document is ready. The toolbar, sceditor.. can normally be accessed on a second doc ready event, mostly because they're launched with one.

@Ange Tuteur
Perfect! Just as assembler is faster than C ++, your code is much faster than mine !!!

However, replacing the second "$ (function () {" to "setTimeout (JS_faIsRead, 100);" is much faster.

Code:


jQuery(function() {
   if (_userdata.session_logged_in) {
      var avatar = document.createElement('SPAN'),
         right; // start up variables
      avatar.innerHTML = _userdata.avatar.replace(/<img (src=".*)/, '<img style="height:25px;width:25px;vertical-align:middle;margin-bottom:1px;" $1'); // add avatar to the container
      avatar.id = 'fa_avatar'; // apply id for user modifications

      function JS_faIsRead() {
         var welcome = document.getElementById('fa_welcome');
         if (welcome) {
            right = document.getElementById('fa_right'); // get the right side of the toolbar
            right && right.insertBefore(avatar, right.firstChild); // insert the avatar as the first node
         } else {
            setTimeout(JS_faIsRead, 100);
         }
      }
      JS_faIsRead();
   }
});


---

So far the best mod: https://help.forumotion.com/t141661-avatar-on-fm-toolbar-in-a-fastest-way#965096

JS

I run this code on my page...

Code:

$(function() {
    setTimeout(function() {
        var av = $('#fa_usermenu img').attr('src');
        $('#fa_welcome').prepend('<img src="' + av + '" class="toolbar_avatar" />');
    });
});

ok my problem is now fixed i just made the avatar smaller in the toolbar and that fixed it
Thank you JS

This will no longer be supported by JScript: https://help.forumotion.com/t151137-in-memory-of-jscript-joao-carlos.