Merge pull request #3719 from duybkict/refactor-LadderTabView

#3138 #3488 refactor LadderTabView
2025-04-26 05:53:39 -04:00 · 2016-06-08 10:01:37 -07:00 · 2016-06-08 10:01:37 -07:00 · 86699a8510
commit 86699a8510
parent 2f9f062165 23d45ab947
3 changed files with 29 additions and 39 deletions
--- a/app/templates/play/ladder/ladder-tab-view.jade
+++ b/app/templates/play/ladder/ladder-tab-view.jade
@ -1,16 +1,21 @@
+- var league = view.options.league
 .row
-  for team, teamIndex in teams
+  for team, teamIndex in view.teams
    div.column.col-md-6
      div(id="histogram-display-#{team.name}", class="histogram-display", data-team-name=team.name)
      table.table.table-bordered.table-condensed.table-hover.ladder-table(data-team=team.id)
+        - var levelType = view.level.get('type', true)
+        - var topSessions = team.leaderboard.topPlayers.models;
+        - var showJustTop = team.leaderboard.inTopSessions() || me.get('anonymous');
+        - if(!showJustTop && topSessions.length == 20) topSessions = topSessions.slice(0, 10);
        thead
          tr
-            th(colspan=level.get('type', true) == 'hero-ladder' ? 3 : 2)
+            th(colspan=levelType == 'hero-ladder' ? 3 : 2)
            th(colspan=4, style="color: #{team.primaryColor}")
              span= team.displayName
              span.spl(data-i18n="ladder.leaderboard") Leaderboard
          tr
-            th(colspan=level.get('type', true) == 'hero-ladder' ? 3 : 2)
+            th(colspan=levelType == 'hero-ladder' ? 3 : 2)
            th(data-i18n="general.score") Score
            th(data-i18n="general.name").name-col-cell Name
            th(data-i18n="general.when") When
@ -18,23 +23,20 @@
            th.iconic-cell
              .glyphicon.glyphicon-eye-open

-        tbody
-          - var topSessions = team.leaderboard.topPlayers.models;
-          - var showJustTop = team.leaderboard.inTopSessions() || me.get('anonymous');
-          - if(!showJustTop && topSessions.length == 20) topSessions = topSessions.slice(0, 10);
+        tbody          
          for session, rank in topSessions
            - var myRow = session.get('creator') == me.id
            - var sessionStats = league ? (_.find(session.get('leagues') || [], {leagueID: league.id}) || {}).stats || {} : session.attributes;
            tr(class=myRow ? "success" : "", data-player-id=session.get('creator'), data-session-id=session.id)
-              td.code-language-cell(style="background-image: url(/images/common/code_languages/" + session.get('submittedCodeLanguage') + "_icon.png)" title=capitalize(session.get('submittedCodeLanguage')))
-              if level.get('type', true) == 'hero-ladder'
+              td.code-language-cell(style="background-image: url(/images/common/code_languages/" + session.get('submittedCodeLanguage') + "_icon.png)" title=view.capitalize(session.get('submittedCodeLanguage')))
+              if levelType == 'hero-ladder'
                td.hero-portrait-cell(style="background-image: url(/file/db/thang.type/#{(session.get('heroConfig') || {}).thangType || '529ffbf1cf1818f2be000001'}/portrait.png)")
              td.rank-cell= rank + 1
              td.score-cell= Math.round((sessionStats.totalScore || session.get('totalScore') / 2) * 100)
              td(class='name-col-cell' + ((new RegExp('(Simple|Shaman|Brawler|Chieftain|Thoktar) CPU')).test(session.get('creatorName')) ? ' ai' : ''))= session.get('creatorName') || "Anonymous"
              td.age-cell= moment(session.get('submitDate')).fromNow().replace('a few ', '')
              td.fight-cell
-                a(href="/play/level/#{level.get('slug') || level.id}?team=#{team.otherTeam}&opponent=#{session.id}" + (league ? "&league=" + league.id : ""))
+                a(href="/play/level/#{view.level.get('slug') || view.level.id}?team=#{team.otherTeam}&opponent=#{session.id}" + (league ? "&league=" + league.id : ""))
                  span(data-i18n="ladder.fight") Fight!
              td.spectate-cell.iconic-cell
                .glyphicon.glyphicon-eye-open
@ -47,14 +49,14 @@
              - var sessionStats = league ? (_.find(session.get('leagues'), {leagueID: league.id}) || {}).stats || {} : session.attributes;
              tr(class=myRow ? "success" : "", data-player-id=session.get('creator'), data-session-id=session.id)
                td.code-language-cell(style="background-image: url(/images/common/code_languages/" + session.get('submittedCodeLanguage') + "_icon.png)")
-                if level.get('type', true) == 'hero-ladder'
+                if levelType == 'hero-ladder'
                  td.hero-portrait-cell(style="background-image: url(/file/db/thang.type/#{(session.get('heroConfig') || {}).thangType || '529ffbf1cf1818f2be000001'}/portrait.png)")
                td.rank-cell= session.rank
                td.score-cell= Math.round((sessionStats.totalScore || session.get('totalScore') / 2) * 100)
                td(class='name-col-cell' + ((new RegExp('(Simple|Shaman|Brawler|Chieftain|Thoktar) CPU')).test(session.get('creatorName')) ? ' ai' : ''))= session.get('creatorName') || "Anonymous"
                td.age-cell= moment(session.get('submitDate')).fromNow().replace('a few ', '')
                td.fight-cell
-                  a(href="/play/level/#{level.get('slug') || level.id}?team=#{team.otherTeam}&opponent=#{session.id}" + (league ? "&league=" + league.id : ""))
+                  a(href="/play/level/#{view.level.get('slug') || view.level.id}?team=#{team.otherTeam}&opponent=#{session.id}" + (league ? "&league=" + league.id : ""))
                    span(data-i18n="ladder.fight") Fight!
                td.spectate-cell.iconic-cell
                  .glyphicon.glyphicon-eye-open
@ -77,8 +79,8 @@
          if !onGPlus
            button.btn.btn-sm.connect-google-plus(data-i18n="community.gplus") Google+

-      if friends.length
-        for friend in friends
+      if view.friends
+        for friend in view.friends
          p.friend-entry
            img(src=friend.imageSource).img-thumbnail
            span= friend.creatorName + ' (' + friend.name + ')'
@ -87,7 +89,7 @@
            span : 
            span= friend.team
            br
-            a(href="/play/level/#{level.get('slug') || level.id}/?team=#{friend.otherTeam}&opponent=#{friend._id}" + (league ? "&league=" + league.id : ""))
+            a(href="/play/level/#{view.level.get('slug') || view.level.id}/?team=#{friend.otherTeam}&opponent=#{friend._id}" + (league ? "&league=" + league.id : ""))
              span(data-i18n="ladder.fight") Fight!

      else if onFacebook || onGPlus
--- a/app/views/ladder/LadderTabView.coffee
+++ b/app/views/ladder/LadderTabView.coffee
@ -29,11 +29,13 @@ module.exports = class LadderTabView extends CocoView
 #    'auth:logged-in-with-facebook': 'onConnectedWithFacebook'
 #    'auth:logged-in-with-gplus': 'onConnectedWithGPlus'

-  constructor: (options, @level, @sessions) ->
-    super(options)
+  initialize: (options, @level, @sessions) ->
    @teams = teamDataFromLevel @level
-    @leaderboards = {}
+    @leaderboards = []
    @refreshLadder()
+
+    @capitalize = _.string.capitalize
+
    # Trying not loading the FP/G+ stuff for now to see if anyone complains they were using it so we can have just two columns.
    #@socialNetworkRes = @supermodel.addSomethingResource('social_network_apis', 0)
    #@checkFriends()
@ -51,7 +53,8 @@ module.exports = class LadderTabView extends CocoView
    FB.getLoginStatus (response) =>
      return if @destroyed
      @facebookStatus = response.status
-      @loadFacebookFriends() if @facebookStatus is 'connected'
+      @onFacebook = view.facebookStatus is 'connected'
+      @loadFacebookFriends() if @onFacebook
      @fbStatusRes.markLoaded()

    if application.gplusHandler.loggedIn is undefined
@ -102,6 +105,7 @@ module.exports = class LadderTabView extends CocoView
      friend.otherTeam = if friend.team is 'humans' then 'ogres' else 'humans'
      friend.imageSource = "http://graph.facebook.com/#{friend.facebookID}/picture"
    @facebookFriendSessions = result
+    @friends = @consolidateFriends()
    @render() # because the ladder tab renders before waiting for fb to finish

  # GOOGLE PLUS
@ -115,6 +119,7 @@ module.exports = class LadderTabView extends CocoView

  gplusSessionStateLoaded: ->
    if application.gplusHandler.loggedIn
+      @onGPlus = true
      #@addSomethingToLoad('gplus_friends')
      @gpFriendRes = @supermodel.addSomethingResource('gplus_friends', 0)
      @gpFriendRes.load()
@ -145,6 +150,7 @@ module.exports = class LadderTabView extends CocoView
      friend.otherTeam = if friend.team is 'humans' then 'ogres' else 'humans'
      friend.imageSource = friendsMap[friend.gplusID].image.url
    @gplusFriendSessions = result
+    @friends = @consolidateFriends()
    @render() # because the ladder tab renders before waiting for gplus to finish

  # LADDER LOADING
@ -161,6 +167,7 @@ module.exports = class LadderTabView extends CocoView
        oldLeaderboard.destroy()
      teamSession = _.find @sessions.models, (session) -> session.get('team') is team.id
      @leaderboards[team.id] = new LeaderboardData(@level, team.id, teamSession, @ladderLimit, @options.league)
+      team.leaderboard = @leaderboards[team.id]
      @leaderboardRes = @supermodel.addModelResource(@leaderboards[team.id], 'leaderboard', {cache: false}, 3)
      @leaderboardRes.load()

@ -179,22 +186,6 @@ module.exports = class LadderTabView extends CocoView
      ).then =>
        @generateHistogram(histogramWrapper, histogramData, team.name.toLowerCase()) unless @destroyed

-  getRenderData: ->
-    ctx = super()
-    ctx.level = @level
-    ctx.link = "/play/level/#{@level.get('name')}"
-    ctx.teams = @teams
-    team.leaderboard = @leaderboards[team.id] for team in @teams
-    ctx.levelID = @levelID
-    ctx.friends = @consolidateFriends()
-    ctx.onFacebook = @facebookStatus is 'connected'
-    ctx.onGPlus = application.gplusHandler.loggedIn
-    ctx.capitalize = _.string.capitalize
-    ctx.league = @options.league
-    ctx._ = _
-    ctx.moment = moment
-    ctx
-
  generateHistogram: (histogramElement, histogramData, teamName) ->
    #renders twice, hack fix
    if $('#' + histogramElement.attr('id')).has('svg').length then return
--- a/app/views/ladder/LadderView.coffee
+++ b/app/views/ladder/LadderView.coffee
@ -43,6 +43,7 @@ module.exports = class LadderView extends RootView
    @level = @supermodel.loadModel(new Level(_id: @levelID)).model
    @level.once 'sync', =>
      @levelDescription = marked(@level.get('description')) if @level.get('description')
+      @teams = teamDataFromLevel @level
    @sessions = @supermodel.loadCollection(new LevelSessionsCollection(@levelID), 'your_sessions', {cache: false}).model
    @winners = require('./tournament_results')[@levelID]

@ -70,10 +71,6 @@ module.exports = class LadderView extends RootView
    @course = @supermodel.loadModel(course).model
    @listenToOnce @course, 'sync', @render

-  onLoaded: ->
-    @teams = teamDataFromLevel @level
-    super()
-
  afterRender: ->
    super()
    return unless @supermodel.finished()