Private clans UI

Add private checkbox for clan creation.
Add info popover for private clans.
Subscribe prompt for create/join if necessary.
Don’t list private clans in public list.

app/schemas/models/clan.schema.coffee

@@ -7,7 +7,7 @@ _.extend ClanSchema.properties,
   description: {type: 'string'}
   members: c.array {title: 'Members'}, c.objectId()
   ownerID: c.objectId()
-  type: {type: 'string', 'enum': ['public']}
+  type: {type: 'string', 'enum': ['public', 'private']}
 
 c.extendBasicProperties ClanSchema, 'Clan'
 

app/styles/clans/clans.sass

@@ -6,3 +6,6 @@
 
   .create-clan-description
     width: 50%
+
+  .popover
+    max-width: 100%

app/templates/clans/clan-details.jade

@@ -3,7 +3,9 @@ extends /templates/base
 block content
 
   if clan
-    h1= clan.get('name')
+    h1 #{clan.get('name')}
+      if clan.get('type') === 'private'
+         small (private)
     if clan.get('description')
       .clan-description
         each line in clan.get('description').split('\n')

app/templates/clans/clans.jade

@@ -6,6 +6,12 @@ block content
     input.create-clan-name(type='text' placeholder='New clan name')
   p
     textarea.create-clan-description(rows=2, placeholder='New clan description')
+  p
+    input(type='checkbox').private-clan-checkbox
+    span.spl Private
+    span.spl (
+    a.private-more-info more info
+    span )
   p
     button.btn.btn-success.create-clan-btn Create New Clan
 

app/views/clans/ClanDetailsView.coffee

@@ -1,15 +1,16 @@
-app = require 'core/application'
-AuthModal = require 'views/core/AuthModal'
 RootView = require 'views/core/RootView'
 template = require 'templates/clans/clan-details'
+app = require 'core/application'
+AuthModal = require 'views/core/AuthModal'
 CocoCollection = require 'collections/CocoCollection'
 Clan = require 'models/Clan'
 EarnedAchievement = require 'models/EarnedAchievement'
 LevelSession = require 'models/LevelSession'
+SubscribeModal = require 'views/core/SubscribeModal'
 ThangType = require 'models/ThangType'
 User = require 'models/User'
 
-# TODO: Message for clan not found
+# TODO: Add message for clan not found
 # TODO: join/leave mostly duped from clans view
 
 module.exports = class ClanDetailsView extends RootView
@@ -135,6 +136,8 @@ module.exports = class ClanDetailsView extends RootView
 
   onJoinClan: (e) ->
     return @openModalView(new AuthModal()) if me.isAnonymous()
+    return unless @clan.loaded
+    return @openModalView new SubscribeModal() if @clan.get('type') is 'private' and not me.isPremium()
     options =
       url: "/db/clan/#{@clanID}/join"
       method: 'PUT'

app/views/clans/ClansView.coffee

@@ -4,6 +4,7 @@ RootView = require 'views/core/RootView'
 template = require 'templates/clans/clans'
 CocoCollection = require 'collections/CocoCollection'
 Clan = require 'models/Clan'
+SubscribeModal = require 'views/core/SubscribeModal'
 
 # TODO: Waiting for async messages
 # TODO: Invalid clan name message
@@ -28,11 +29,15 @@ module.exports = class MainAdminView extends RootView
   getRenderData: ->
     context = super()
     context.idNameMap = @idNameMap
-    context.publicClans = @publicClans.models
+    context.publicClans = _.filter(@publicClans.models, (clan) -> clan.get('type') is 'public')
     context.myClans = @myClans.models
     context.myClanIDs = me.get('clans') ? []
     context
 
+  afterRender: ->
+    super()
+    @setupPrivateInfoPopover()
+
   initData: ->
     @idNameMap = {}
 
@@ -54,20 +59,44 @@ module.exports = class MainAdminView extends RootView
     @listenTo me, 'sync', => @render?()
 
   refreshNames: (clans) ->
+    clanIDs = _.filter(clans, (clan) -> clan.get('type') is 'public')
+    clanIDs = _.map(clans, (clan) -> clan.get('ownerID'))
     options =
       url: '/db/user/-/names'
       method: 'POST'
-      data: {ids: _.map(clans, (clan) -> clan.get('ownerID'))}
+      data: {ids: clanIDs}
       success: (models, response, options) =>
         @idNameMap[userID] = models[userID].name for userID of models
         @render?()
     @supermodel.addRequestResource('user_names', options, 0).load()
 
+  setupPrivateInfoPopover: ->
+    popoverTitle = 'Private Clans'
+    popoverContent = "<p>Additional features:"
+    popoverContent += "<ul>"
+    popoverContent += "<li>Detailed progress reporting"
+    popoverContent += "<li>Not visible in Public Clans list below"
+    popoverContent += "<li>Only students with the invite link will be able to join"
+    popoverContent += "</ul>"
+    popoverContent += "<p><img src='/images/loading_image.png'></p>"
+    popoverContent += "<p>*A CodeCombat subscription is required to create or join private Clans.</p>"
+    @$el.find('.private-more-info').popover(
+      animation: true
+      html: true
+      placement: 'right'
+      trigger: 'hover'
+      title: popoverTitle
+      content: popoverContent
+      container: @$el
+    )
+
   onClickCreateClan: (e) ->
     return @openModalView(new AuthModal()) if me.isAnonymous()
+    clanType = if $('.private-clan-checkbox').prop('checked') then 'private' else 'public'
+    return @openModalView new SubscribeModal() if clanType is 'private' and not me.isPremium()
     if name = $('.create-clan-name').val()
       clan = new Clan()
-      clan.set 'type', 'public'
+      clan.set 'type', clanType
       clan.set 'name', name
       clan.set 'description', description if description = $('.create-clan-description').val()
       clan.save {},