Technical Details

Forum version : #Invision
Position : Founder
Concerned browser(s) : Google Chrome
Screenshot of problem : https://i.servimg.com/u/f61/19/04/52/50/screen10.png
Who the problem concerns : Yourself
Forum link : http://fairytail-endless-rp.forumotion.com/

Description of problem

Spoiler:

I'm trying to get the code for the member/guild census that @Ange Tuteur. helped me with a while back on my previous account. Yes, I know it says banned but that isn't actually the case. I had asked @SLGray to ban that one since I made this one after losing my login info for the other one.

Anyways, I have the code put in the way it should be.

Code:

<style type="text/css">#faCensus { color:#888D90; font-size:13px; font-family:"Trebuchet MS", Arial, Vedana, Sans-serif; background:#B0DDFF; border:1px solid #444; border-radius:3px; padding:3px; width:240px; }
#censusMainTitle { font-size:16px; font-weight:bold; text-align:center; margin-bottom:6px; }
.censusRow { background:#222; border-radius:3px; padding:3px; margin:3px 0; }
.censusTitle { font-size:12px; display:inline-block; margin-right:4px; }
.censusValue { background:#666666; border-radius:3px 0 0 3px; display:inline-block; position:relative; height:15px; vertical-align:middle; }
.censusCount { background:#555; text-align:center; border-radius:0 3px 3px 0; display:inline-block; position:absolute; width:16px; right:-16px; }</style>
<div id="censusNode">
</div>
  <script type="text/javascript">//<![CDATA[
(function() {
  window._faCensus = {
    title : 'Group census', // main title
  
    // syntax : 'GROUP_NAME' : 'GROUP_ID'
    groups : {
      'Fairy Tail' : 3,
      'Heaven's Reach' : 4,
      'Twilight Dragon' : 5,
      'Red Lizard' : 6,
      'Chaos Head' : 7,
      'Orochi's Fin' : 8,
      'Guildless' : 10,
      'Mage' : 9
    },
 
    // get group member count from AJAX or storage
    getCount : function(id, callback) {
      var count = 0, pages, storage = window.localStorage;
 
      if (storage && storage['group_count_' + id] && storage['group_count_' + id + '_exp'] > +new Date - 1*60*60*1000) callback(storage['group_count_' + id]);
      else jQuery.get('/g' + id + '-?change_version=prosilver', function(d) {
        count = jQuery('.forumbg-table a[href^="/u"]', d).length;
        pages = jQuery('.pagination span a:not(.pag-img):last', d);
 
 
        if (pages[0]) {
          pages = +jQuery(pages).text();
          count = count * pages;
        }
 
        if (storage) {
          storage['group_count_' + id] = count;
          storage['group_count_' + id + '_exp'] = +new Date;
        }
 
        callback(count);
      });
    }
  };
 
  var census = document.createElement('DIV'),
      node = document.getElementById('censusNode'),
      i,
      row;
  census.id = 'faCensus';
  census.innerHTML = '<div id="censusMainTitle">' + _faCensus.title + '</div>';
 
  // set content
  for (i in _faCensus.groups) {
    row = document.createElement('DIV');
    row.innerHTML = 'loading...';
    row.className = 'censusRow';
 
    _faCensus.getCount(_faCensus.groups[i], function(count) {
      row.innerHTML = '<span class="censusTitle">' + i + '</span><span id="census_' + i.replace(/\s/g, '_') + '" class="censusValue" style="width:' + (count * 3) + 'px;"><span class="censusCount">' + count + '</span></span>';
    });
 
    census.appendChild(row); // add the row to the census
  }
 
  censusNode.appendChild(census); // append the census to the drop point
})();
// par ange tuteur
//]]></script>

as well as the portion that goes in the CSS Stylesheet

Code:

#census_Fairy_Tail { background-color:#FF6F00 }
#census_Heaven_s_Reach { background-color:#A6B2E0 }
#census_Twilight_Dragon { background-color:#000099 }
#census_Red_Lizard { background-color:#FF0000 }
#census_Chaos_Head { background-color:#858585 }
#census_Orochi_s_Fin { background-color:#2FBD00 }
#census_Guildless { background-color:#C700D1 }
#census_Mage { background-color:#95DEF0 }

I can't figure out why it isn't working. If anyone knows how to fix this, that'd be great.

bump

Code:

        #census_Heaven_s_Reach { background-color:#A6B2E0 }
        #census_Orochi_s_Fin { background-color:#2FBD00 }

I am not sure that _ is equal to an '.

I believe it should be this:

Code:

Heaven\'s_Ranch

Also this way in the JavaScript.

Code:

'Heaven\'s Ranch'

That fixed it! Thank you, Gray!

You're welcome.

Problem solved & topic archived. Please read our forum rules:  ESF General Rules