hover profile box

Code:


function get_hover_stats() {
   var holder = document.body.firstChild; //temp div holding the loaded elems.
   var f = holder.getElementsByTagName('fieldset');
   var ret = {length:0}; //object to store all the elems we need.
   for(var i=0,l=f.length;i<l;i++){
      var ftitle = f[i].firstChild.innerHTML;
      if(ftitle == 'Topics' || ftitle == 'Posts') {
         ret[ftitle] = f[i];
         ret.length++;
      }
      if(ret.length == 2) break; //if we have the topics and posts, no need to continue looping.
   }
   ret['avatar'] = document.getElementById('profile-advanced-right').firstChild.firstChild; //add avatar.
   return ret;
}

function cached_hover_profile(user_id,elem) {
  //first check if he already have a hover box for this profile. If so, display it, nothing else needs done.
  if(elem.lastChild.className == 'hover_profile') {
        elem.lastChild.style.display = '';
        return true;
  }
  //if we don't, then we can check the cache. Aka, they have hovered over this user before, but not this exact profile.
  else if(hover_profile_cache[user_id]) {
      var html = hover_profile_cache[user_id]; //the inner html was stored. create the new box and display it.
      var box = document.createElement('div');
      box.className = 'hover_profile';
      box.innerHTML = html;
      elem.appendChild(box);
      return true;
  }
  else { //nope, we've got nothing so return false so it begins to load the info.
        return false;
    }
}

function show_hover_info(user_id,elem) {
    $('.hover_profile').hide();
    if(cached_hover_profile(user_id,elem)) return;  //check cache, will return true if successful, so we don't need to do anything else.
   var temp = document.createElement('div');
   document.body.insertBefore(temp,document.body.firstChild);
   $(temp).load('/'+user_id+'stats #main-content',function() { //load the things we need in our temp div.
      var info = get_hover_stats(); //will return object of elems we want.
      document.body.removeChild(temp); //remove temp. and begin to create our new box.
      var x = document.createElement('div');
      x.className = 'hover_profile';
      x.appendChild(info['avatar']);
      x.appendChild(info['Topics']);
      x.appendChild(info['Posts']);
      x.innerHTML+='<span class="hover_box_close" onclick="this.parentNode.style.display=\'none\';">Close</span>';
      elem.appendChild(x);
      hover_profile_cache[user_id] = x.innerHTML; //store the innerHTML in the cache.
   });
}

$(function(){
   var pathname = window.location.pathname.substr(1);
   
   //if topic.
   if(/^t\d+/.test(pathname)) {
      var pp = $('.postprofile dt').mouseover(function(){
          var parent = this.parentNode.parentNode;
         var user_id = parent.getElementsByTagName('a')[0].href.replace(/.*(u\d+)/,'$1');
         show_hover_info(user_id,parent);
      });      
   }
});

hover_profile_cache = {};


Admin wrote:testing https://testlg.forumotion.co.uk/f1-your-first-forum

swre

Image url:
https://2img.net/u/1515/42/07/94/avatars/1-24.jpg

Local post: [post]https://testlg.forumotion.co.uk/t19-hover-profile-box#268[/post]
Post elsewhere: [post]https://testlg.forumotion.co.uk/t24-new-slider#264[/post]

Tip test: [tip]Hi there![/tip]
[tip="Tip"]Hi there[/tip]