Fixed gRoles, history timestamp + ES6 syntax

README.md

Get any plug.dj user's profile, no matter the level.

How to use

Simply put this code in a new bookmark's url (name it how you want) :
It will even auto update !

javascript:(function(){$.getScript('https://gist.githack.com/WiBla/2cca99fe97decf633ee21cfd0ed56cf4/raw/magic.js');})();

Click the bookmark when browsing someone's else profile and input the user's ID. It should display this user's profile instead ;)

Boring stuff

       DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
               Version 2, December 2004

Copyright (C) 2004 Sam Hocevar [email protected]

Everyone is permitted to copy and distribute verbatim or modified copies of this license document, and changing it is allowed as long as the name is changed.

       DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE

TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

0. You just DO WHAT THE FUCK YOU WANT TO.

magic.js

$.ajax({
  url: 'https://plug.dj/_/profile/'+parseInt(prompt('user ID:')),
  success: function(data) {
    data = data.data[0];
    var history = '',
    isAdmin = data.user.gRole === 5000;
    isBA    = data.user.gRole === 3000;
    isSub   = data.user.sub   === 1;

    data.history.forEach(function(entry, i, a) {
      history += `<div class="row">
        <img src="${entry.media.image}"/>
        <div class="meta">
          <span class="author">${entry.media.author} - ${entry.media.title}</span>
          <a href="${entry.room.slug}" target="_self"><span class="name">${entry.room.name}</span></a>
          <span class="timestamp" style="display: inline;">${new Date(entry.timestamp).toLocaleString()}</span>
        </div>
        <div class="score">
          <div class="item positive">
            <i class="icon icon-history-positive"></i><span>${entry.score.positive}</span>
          </div>
          <div class="item grabs">
            <i class="icon icon-history-grabs"></i><span>${entry.score.grabs}</span>
          </div>
          <div class="item negative">
            <i class="icon icon-history-negative"></i><span>${entry.score.negative}</span>
          </div>
          <div class="item listeners">
            <i class="icon icon-history-listeners"></i><span>${entry.score.listeners}</span>
          </div>
        </div>
      </div>`;
    });

    $('.content').remove();
    $('body').append(
      $(`<div class="content">
        <div class="profile">
          <i class="icon icon-site-logo"></i>
          <button>Listen Together!</button>
          <div class="anim"><img src="${data.avatar_path}"></div>
          <div class="meta ${(isAdmin ? "is-admin" : isBA ? "is-ambassador" : "")}">
            <div class="left">
              <div class="username">${data.user.username}</div>

              ${(isAdmin || isBA || isSub ?
                `<div class="info">
                  ${(isAdmin || isBA ?
                    `<div class="role">
                      <i class="icon icon-chat-${(isAdmin ? 'admin' : isBA ? 'ambassador' : '')}"></i>
                      <span>${(isAdmin ? 'Admin' : isBA ? 'Brand Ambassador' : '')}</span>
                    </div>`
                  :'')}

                  ${(isSub ?
                    `<div class="sub">
                      <i class="icon icon-chat-subscriber"></i>
                      <span>Subscriber</span>
                    </div>`
                  :'')}
                </div>`
              :'')}

              <div class="blurb">
                <div class="arrow-up"></div>
                <div class="box">${data.user.blurb}</div>
              </div>
              <div class="joined">Joined ${data.join_date.month}/${data.join_date.day}/${data.join_date.year}</div>
            </div>

            <div class="level">
              <span class="label">Level</span>
              <span class="value">${data.user.level}</span>
            </div>
          </div>
        </div>
        <div class="media">
          <div class="header">
            <span>Recently Played</span>
          </div>

          <div class="media-list history">
            ${history}
          </div>
        </div>
      </div>`)
    );
  },
  error: function(err) {
    console.error('Could not load user profile', err);
  }
});