Clan details view solution

Click on a level progression cell to observe the level session in a new
tab.

app/styles/clans/clan-details.sass

@@ -51,7 +51,7 @@
   .level-progression-cell
     background-color: lightblue
     border: 1px solid gray
-    // cursor: pointer
+    cursor: pointer
     padding: 4px
 
     .level-popup-container

app/templates/clans/clan-details.jade

@@ -103,11 +103,14 @@ block content
                 a(href="/user/#{member.id}")= member.get('name') || 'Anoner'
               if memberLevelProgression && memberLevelProgression[member.id]
                 each levelInfo in memberLevelProgression[member.id]
-                  td.level-progression-cell
+                  td.level-progression-cell(data-level-info=levelInfo)
                     .level-popup-container
-                      div Level: #{levelInfo.level}
-                      div Playtime: #{levelInfo.playtime}
-                      div Last played: #{levelInfo.changed}
+                      h3 #{levelInfo.level}
+                      p
+                        div Playtime: #{levelInfo.playtime}s
+                        div Last played: #{levelInfo.changed}
+                      if isOwner || me.isAdmin()
+                        strong Click to view solution.
                 td.level-progression-cell-name(colspan="#{memberMaxLevelCount - memberLevelProgression[member.id].length + 1}")= memberLevelProgression[member.id][memberLevelProgression[member.id].length - 1].level
               else
                 td(colspan="#{memberMaxLevelCount + 1}")

app/views/clans/ClanDetailsView.coffee

@@ -23,6 +23,7 @@ module.exports = class ClanDetailsView extends RootView
     'click .edit-name-save-btn': 'onEditNameSave'
     'click .join-clan-btn': 'onJoinClan'
     'click .leave-clan-btn': 'onLeaveClan'
+    'click .level-progression-cell': 'onClickLevel'
     'click .remove-member-btn': 'onRemoveMember'
     'mouseenter .level-progression-cell': 'onMouseEnterPoint'
     'mouseleave .level-progression-cell': 'onMouseLeavePoint'
@@ -131,8 +132,10 @@ module.exports = class ClanDetailsView extends RootView
         @memberLevelProgression[user] ?= []
         levelInfo =
           level: levelSession.get('levelName')
+          levelID: levelSession.get('levelID')
           changed: new Date(levelSession.get('changed')).toLocaleString()
           playtime: levelSession.get('playtime')
+          sessionID: levelSession.id
         @memberLevelProgression[user].push levelInfo
     @memberMaxLevelCount = 0
     @memberLanguageMap = {}
@@ -161,6 +164,12 @@ module.exports = class ClanDetailsView extends RootView
   onMouseLeavePoint: (e) ->
     $(e.target).find('.level-popup-container').hide()
 
+  onClickLevel: (e) ->
+    levelInfo = $(e.target).data 'level-info'
+    return unless levelInfo?.levelID? and levelInfo?.sessionID?
+    url = "/play/level/#{levelInfo.levelID}?session=#{levelInfo.sessionID}&observing=true"
+    window.open url, '_blank'
+
   onDeleteClan: (e) ->
     return @openModalView(new AuthModal()) if me.isAnonymous()
     return unless window.confirm("Delete Clan?")

server/clans/clan_handler.coffee

@@ -126,7 +126,7 @@ ClanHandler = class ClanHandler extends Handler
       return @sendNotFoundError(res) unless clan
       memberIDs = _.map clan.get('members') ? [], (memberID) -> memberID.toHexString?() or memberID
       memberIDs = memberIDs.slice 0, memberLimit
-      LevelSession.find {creator: {$in: memberIDs}}, 'changed codeLanguage creator creatorName levelName playtime state submittedCodeLanguage', (err, documents) =>
+      LevelSession.find {creator: {$in: memberIDs}}, 'changed codeLanguage creator creatorName levelID levelName playtime state submittedCodeLanguage', (err, documents) =>
         return @sendDatabaseError(res, err) if err?
         cleandocs = (LevelSessionHandler.formatEntity(req, doc) for doc in documents)
         @sendSuccess(res, cleandocs)