Began refactor of stats page

2025-12-18 07:07:35 +01:00 · 2015-07-18 15:24:32 -05:00
parent c784b97586
commit b716d882b6
3 changed files with 70 additions and 78 deletions
--- a/website/public/js/controllers/groupsCtrl.js
+++ b/website/public/js/controllers/groupsCtrl.js
@@ -159,22 +159,26 @@ habitrpg.controller("GroupsCtrl", ['$scope', '$rootScope', 'Shared', 'Groups', '
    };
  }])

-  .controller("MemberModalCtrl", ['$scope', '$rootScope', 'Members', 'Shared', '$http', 'Notification', 'Groups', 'Chat', '$controller',
-    function($scope, $rootScope, Members, Shared, $http, Notification, Groups, Chat, $controller) {
+  .controller("MemberModalCtrl", ['$scope', '$rootScope', 'Members', 'Shared', '$http', 'Notification', 'Groups', 'Chat', '$controller', 'Stats',
+    function($scope, $rootScope, Members, Shared, $http, Notification, Groups, Chat, $controller, Stats) {

      $controller('RootCtrl', {$scope: $scope});

      $scope.timestamp = function(timestamp){
        return moment(timestamp).format($rootScope.User.user.preferences.dateFormat.toUpperCase());
      }
+
+      $scope.statCalc = Stats;
+
      // We watch Members.selectedMember because it's asynchronously set, so would be a hassle to handle updates here
      $scope.$watch( function() { return Members.selectedMember; }, function (member) {
-        if(member)
+        if(member) {
          member.petCount = Shared.countPets($rootScope.countExists(member.items.pets), member.items.pets);
          member.mountCount = Shared.countMounts($rootScope.countExists(member.items.mounts), member.items.mounts);
          $scope.profile = member;
-        $scope.e = member.items.gear.equipped;
+        }
      });
+
      $scope.sendPrivateMessage = function(uuid, message){
        // Don't do anything if the user somehow gets here without a message.
        if (!message) return;
@@ -184,27 +188,31 @@ habitrpg.controller("GroupsCtrl", ['$scope', '$rootScope', 'Shared', 'Groups', '
          $rootScope.User.sync();
          $scope.$close();
        });
-      }
+      };
+
      $scope.gift = {
        type: 'gems',
        gems: {amount:0, fromBalance:true},
        subscription: {key:''},
        message:''
      };
+
      $scope.sendGift = function(uuid, gift){
        $http.post('/api/v2/members/'+uuid+'/gift', gift).success(function(){
          Notification.text('Gift sent!')
          $rootScope.User.sync();
          $scope.$close();
        })
-      }
+      };
+
      $scope.reportAbuse = function(reporter, message, groupId) {
        message.flags[reporter._id] = true;
        Chat.utils.flagChatMessage({gid: groupId, messageId: message.id}, undefined, function(data){
          Notification.text(window.env.t('abuseReported'));
          $scope.$close();
        });
-      }
+      };
+
      $scope.clearFlagCount = function(message, groupId) {
        Chat.utils.clearFlagCount({gid: groupId, messageId: message.id}, undefined, function(data){
          message.flagCount = 0;
--- a/website/public/js/controllers/userCtrl.js
+++ b/website/public/js/controllers/userCtrl.js
@@ -1,10 +1,13 @@
 "use strict";

-habitrpg.controller("UserCtrl", ['$rootScope', '$scope', '$location', 'User', '$http', '$state', 'Guide', 'Shared',
-  function($rootScope, $scope, $location, User, $http, $state, Guide, Shared) {
+habitrpg.controller("UserCtrl", ['$rootScope', '$scope', '$location', 'User', '$http', '$state', 'Guide', 'Shared', 'Content', 'Stats',
+  function($rootScope, $scope, $location, User, $http, $state, Guide, Shared, Content, Stats) {
    $scope.profile = User.user;
    $scope.profile.petCount = Shared.countPets($rootScope.countExists($scope.profile.items.pets), $scope.profile.items.pets);
    $scope.profile.mountCount = Shared.countMounts($rootScope.countExists($scope.profile.items.mounts), $scope.profile.items.mounts);
+
+    $scope.statCalc = Stats;
+
    $scope.hideUserAvatar = function() {
      $(".userAvatar").hide();
    };
--- a/website/views/shared/profiles/stats.jade
+++ b/website/views/shared/profiles/stats.jade
@@ -1,90 +1,71 @@
+mixin basicRow(label, value)
+  tr&attributes(attributes)
+    td
+      strong=env.t(label)
+      | : #{value}
+
+mixin statList(calculatedStat, popover, text, useOneTimeBinding)
+  - var binding = useOneTimeBinding ? "::" : ""
+  li(ng-if=binding + '#{calculatedStat} > 0')
+    span.hint(popover-title=env.t('#{popover}'), popover-trigger='mouseenter',
+      popover-placement='top', popover=env.t('#{popover}Text'))
+      =env.t(text)
+    =': {{' + binding + calculatedStat + '}}'
+
 h4(class=mobile?'item item-divider':'')=env.t('stats')
 table.table.table-striped
-  tr
-    td
-      strong=env.t('health')
-      | : {{Math.ceil(profile.stats.hp)}} / {{::Shared.maxHealth}}
-  tr(ng-if='profile.stats.lvl >= 10 && !profile.preferences.disableClasses')
-    td
-      strong=env.t('mana')
-      | : {{Math.floor(profile.stats.mp)}} / {{profile._statsComputed.maxMP}}
-  tr
-    td
-      strong=env.t('gold')
-      | : {{Math.floor(profile.stats.gp)}}
-  tr
-    td
-      strong=env.t('level')
-      | : {{profile.stats.lvl}}
-  tr
-    td
-      strong=env.t('experience')
-      | : {{Math.floor(profile.stats.exp)}} / {{Shared.tnl(profile.stats.lvl)}}
+  +basicRow('health', '{{::statCalc.hpDisplay(profile.stats.hp)}}')
+  +basicRow('mana', '{{statCalc.mpDisplay(profile)}}')(ng-if='profile.stats.lvl >= 10 && !profile.preferences.disableClasses')
+  +basicRow('gold', '{{::statCalc.goldDisplay(profile.stats.gp)}}')
+  +basicRow('level', '{{::profile.stats.lvl}}')
+  +basicRow('experience', '{{::statCalc.expDisplay(profile)}}')

 unless mobile
-  h4.stats-equipment(class=mobile?'item item-divider':'',ng-show='user.flags.itemsEnabled')=env.t('equipment')
+  h4.stats-equipment(class=mobile?'item item-divider':'',
+    ng-show='user.flags.itemsEnabled')=env.t('equipment')
  table.table.table-striped(ng-show='user.flags.itemsEnabled')
-    tr(ng-repeat='(k,v) in profile.items.gear.equipped', ng-init='piece=Content.gear.flat[v]', ng-show='piece')
+    tr(ng-repeat='(itemType,gear) in profile.items.gear.equipped',
+      ng-init='piece=Content.gear.flat[gear]', ng-show='piece')
      td
        strong {{piece.text()}}:&nbsp;
        span(ng-repeat='stat in ["str","con","per","int"]', ng-show='piece[stat]') {{piece[stat]}} {{stat.toUpperCase()}}&nbsp;

 h4(class=mobile?'item item-divider':'')=env.t('attributes')
+
 table.table.table-striped
-  each v,k in { str: {title:"strength",popover:'strengthText'},int: {title:"intelligence",popover:'intText'},con: {title:"constitution",popover:'conText'},per: {title:"perception",popover:'perText'} }
+  each statInfo, stat in { str: {title:"strength",popover:'strengthText'},int: {title:"intelligence",popover:'intText'},con: {title:"constitution",popover:'conText'},per: {title:"perception",popover:'perText'} }
    tr
      td
-        span.hint(popover-title=env.t(v.title), popover-placement='right', popover=env.t(v.popover), popover-trigger='mouseenter', style='margin-right:3px')
-          strong=env.t(v.title)
-        span
-          strong : {{profile._statsComputed.#{k}}}
-      td
-        ul.list-unstyled(ng-init='g=Content.gear.flat;e=profile.items.gear.equipped')
-          li(ng-show='profile.stats.lvl > 1')
-            span.hint(popover-title=env.t('levelBonus'), popover-trigger='mouseenter', popover-placement='top', popover=env.t('levelBonusText'))=env.t('level')
-            |: {{Math.ceil((Math.min(profile.stats.lvl - 1, 100)) / 2)}}&nbsp;
-          li(ng-show='g[e.weapon].#{k} + g[e.armor].#{k} + g[e.head].#{k} + g[e.shield].#{k} > 0')
-            span.hint(popover-title=env.t('equipment'), popover-trigger='mouseenter', popover-placement='top', popover=env.t('equipmentBonusText'))=env.t('equipment')
-            |: {{g[e.weapon].#{k} + g[e.armor].#{k} + g[e.head].#{k} + g[e.shield].#{k} || 0}}&nbsp;
-          li(ng-show='profile._statsComputed.#{k} - profile.stats.buffs.#{k} - Math.ceil((Math.min(profile.stats.lvl - 1, 100)) / 2) - g[e.weapon].#{k} - g[e.armor].#{k} - g[e.head].#{k} - g[e.shield].#{k} - profile.stats.#{k} > 0')
-            span.hint(popover-title=env.t('classBonus'), popover-trigger='mouseenter', popover-placement='top', popover=env.t('classBonusText'))=env.t('classEquipBonus')
-            |: {{profile._statsComputed.#{k} - profile.stats.buffs.#{k} - Math.ceil((Math.min(profile.stats.lvl - 1,100)) / 2) - g[e.weapon].#{k} - g[e.armor].#{k} - g[e.head].#{k} - g[e.shield].#{k} - profile.stats.#{k}}}&nbsp;
-          li(ng-show='profile.stats.#{k} > 0')
-            span.hint(popover-title=env.t('allocatedPoints'), popover-trigger='mouseenter', popover-placement='top', popover=env.t('allocatedPointsText'))=env.t('allocated')
-            |: {{profile.stats.#{k} || 0}}&nbsp;
-          li(ng-show='profile.stats.buffs.#{k} > 0')
-            span.hint(popover-title=env.t('buffs'), popover-trigger='mouseenter', popover-placement='top', popover=env.t('buffsText'))=env.t('buffs')
-            |: {{profile.stats.buffs.#{k} || 0}}&nbsp;
+        span.hint(popover-title=env.t(statInfo.title), popover-placement='right',
+          popover=env.t(statInfo.popover), popover-trigger='mouseenter')
+          strong=env.t(statInfo.title)
+        strong : {{profile._statsComputed.#{stat}}}
+
+      td: ul.list-unstyled
+        +statList('statCalc.levelBonus(profile.stats.lvl)', 'levelBonus', 'level', true)
+        +statList('statCalc.equipmentStatBonus("' + stat + '", profile.items.gear.equipped)', 'equipmentBonus', 'equipment', true)
+        +statList('statCalc.classBonus(profile, "' + stat + '")', 'classBonus', 'classEquipBonus')
+        +statList('profile.stats.' + stat, 'allocatedPoints', 'allocated')
+        +statList('profile.stats.buffs.' + stat, 'buffs', 'buffs', true)
+
  tr(ng-if='profile.stats.buffs.stealth')
-    td
-      span.hint(popover-title=env.t('stealth'), popover-trigger='mouseenter', popover-placement='right', popover=env.t('stealthNewDay'))
-        strong
+    td(colspan='2')
+      strong.hint(popover-title=env.t('stealth'), popover-trigger='mouseenter',
+        popover-placement='right', popover=env.t('stealthNewDay'))
        =env.t('stealth')
      strong : {{profile.stats.buffs.stealth}}&nbsp;
-    td
  tr(ng-if='profile.stats.buffs.streaks')
-    td
-      strong.hint(popover-title=env.t('streaksFrozen'), popover-trigger='mouseenter', popover-placement='right', popover=env.t('streaksFrozenText'))=env.t('streaksFrozen')
-    td
+    td(colspan='2')
+      strong.hint(popover-title=env.t('streaksFrozen'), popover-trigger='mouseenter',
+        popover-placement='right', popover=env.t('streaksFrozenText'))
+        =env.t('streaksFrozen')

 h4(class=mobile?'item item-divider':'',ng-if='user.flags.dropsEnabled')=env.t('pets')
 table.table.table-striped(ng-if='user.flags.dropsEnabled')
-  tr
-    td
-      strong=env.t('petsFound')
-      | : {{_.size(profile.items.pets)}}
-  tr
-    td
-      strong=env.t('beastMasterProgress')
-      | : {{profile.petCount}}/90
+  +basicRow('petsFound','{{_.size(profile.items.pets)}}')
+  +basicRow('beastMasterProgress','{{profile.petCount}}/90')

 h4(class=mobile?'item item-divider':'', ng-if='user.flags.dropsEnabled')=env.t('mounts')
 table.table.table-striped(ng-if='user.flags.dropsEnabled')
-  tr
-    td
-      strong=env.t('mountsTamed')
-      | : {{_.size(profile.items.mounts)}}
-  tr
-    td
-      strong=env.t('mountMasterProgress')
-      | : {{profile.mountCount}}/90
+  +basicRow('mountsTamed','{{_.size(profile.items.mounts)}}')
+  +basicRow('mountMasterProgress','{{profile.mountCount}}/90')