define(function (require, exporst, module) {

  const Plugin = require('../Plugin');
  const getUserClasses = require('../util/getUserClasses');
  const Events = require('plug/core/Events');
  const UserRowView = require('plug/views/rooms/users/RoomUserRowView');
  const WaitListRowView = require('plug/views/rooms/users/WaitListRowView');
  const userRolloverView = require('plug/views/users/userRolloverView');
  const { after } = require('meld');

  const r = API.ROLE;
  const { roleClasses } = getUserClasses;

  const UserClasses = Plugin.extend({
    name: 'User Classes',
    description: 'Adds some CSS classes for roles and IDs to various places.',

    enable() {
      this.listenTo(Events, 'chat:beforereceive', this.onChat);

      let plugin = this;
      // common advice for user lists
      let rowAdvice = function () {
        // `this` is the row view
        let id = this.model.get('id');
        if (id) {
          this.$el.addClass(getUserClasses(id).join(' '));
        }
      };
      this.rowClasses = after(UserRowView.prototype, 'draw', rowAdvice);
      this.waitListClasses = after(WaitListRowView.prototype, 'render', rowAdvice);
      this.rolloverClasses = after(userRolloverView, 'showSimple', function () {
        // `this` is the rollover view
        let id = this.user.get('id');
        if (id) {
          this.$el.addClass(getUserClasses(id).join(' '));
        }
      });
    },
    disable() {
      this.rowClasses.remove();
      this.waitListClasses.remove();
      this.rolloverClasses.remove();
    },

    onChat(msg) {
      let classes = msg.classes ? [ msg.classes ] : [];
      if (msg.uid) {
        classes.push(...getUserClasses(msg.uid));
        // additional plugCubed chat-only classes
        // PlugCubed's classes start with `from-` instead of `role-` so we can't
        // just use getUserClasses()
        classes.push(`fromID-${msg.uid}`);

        let user = API.getUser(msg.uid);
        if (msg.uid === API.getUser().id) {
          classes.push('from-you');
        }
        if (user) {
          if (user.gRole === r.HOST) {
            classes.push('from-admin');
          }
          else if (user.gRole >= r.BOUNCER) {
            classes.push('from-ambassador');
          }
          if (user.friend) {
            classes.push('from-friend');
          }
          // normal user & staff roles
          classes.push(`from-${roleClasses[user.role]}`);
        }
      }

      if (msg.sub) {
        classes.push('from-subscriber');
      }

      msg.classes = classes.join(' ');
    }
  });

  module.exports = UserClasses;

});

@@ -180,24 +180,139 @@
 e/Events');%0A
+  const currentUser = require('plug/models/currentUser');%0A  const UserView = require('plug/views/users/UserView');%0A
   const User
@@ -364,32 +364,32 @@
 mUserRowView');%0A
-
   const WaitList
@@ -558,16 +558,59 @@
 'meld');
+%0A  const %7B defer %7D = require('underscore');
 %0A%0A  cons
@@ -1572,16 +1572,357 @@
     %7D);%0A
+      this.userViewClasses = after(UserView.prototype, 'render', function () %7B%0A        // %60this%60 is the user view%0A        this.$el.addClass(getUserClasses(API.getUser().id));%0A      %7D);%0A      this.setUserViewClass();%0A      // guest change, mostly%0A      this.listenTo(currentUser, 'change:id change:role change:gRole', this.setUserViewClass);%0A
     %7D,%0A 
@@ -2038,24 +2038,61 @@
 s.remove();%0A
+      this.userViewClasses.remove();%0A
     %7D,%0A%0A    
@@ -3054,24 +3054,24 @@
 );%0A      %7D%0A%0A
-
       msg.cl
@@ -3093,24 +3093,233 @@
 .join(' ');%0A
+    %7D,%0A%0A    setUserViewClass() %7B%0A      defer(() =%3E %7B%0A        $('#user-view')%0A          .removeClass()%0A          .addClass('app-left')%0A          .addClass(getUserClasses(API.getUser().id).join(' '));%0A      %7D);%0A
     %7D%0A  %7D);%0A

add user classes to UserView, closes #24