Add new heroes to year sub sale page

app/locale/en.coffee

@@ -402,7 +402,7 @@
   subscribe:
     comparison_blurb: "Sharpen your skills with a CodeCombat subscription!"
     feature1: "100+ basic levels across 4 worlds"
-    feature2: "10 powerful <strong>new heroes</strong> with unique skills!"
+    feature2: "9 powerful <strong>new heroes</strong> with unique skills!" # {changed}
     feature3: "70+ bonus levels"
     feature4: "<strong>3500 bonus gems</strong> every month!"
     feature5: "Video tutorials"
@@ -446,6 +446,7 @@
     sale_feature_here: "Here's what you'll get:"
     sale_feature4: "<strong>42,000 bonus gems</strong> awarded immediately!"
     sale_continue: "Ready to continue adventuring?"
+    sale_new_heroes: "New heroes!"
     sale_title: "Back to School Sale"
     sale_view_button: "Buy 1 year subscription for"
     stripe_description: "Monthly Subscription"
@@ -614,7 +615,7 @@
     sub_includes_2: "70+ practice levels"
     sub_includes_3: "Video tutorials"
     sub_includes_4: "Premium email support"
-    sub_includes_5: "10 new heroes with unique skills to master"
+    sub_includes_5: "9 new heroes with unique skills to master" # {changed }
     sub_includes_6: "3500 bonus gems every month"
     sub_includes_7: "Private Clans"
     monitor_progress_title: "How do I monitor student progress?"

app/styles/account/subscription-sale-view.sass

@@ -1,6 +1,6 @@
 #subscription-sale-view
   .above-blurb
-    margin-left: 18%
+    margin: 0 16% 0 16%
   .center
     text-align: center
   .feature-description

app/templates/account/subscription-sale-view.jade

@@ -40,6 +40,19 @@ block content
       br
       p.center
         button.btn.btn-success#pay-button #{payButtonText}
+      table.above-blurb(cellpadding="8")
+        tr
+          td(colspan=2)
+            h2.center(data-i18n="subscribe.sale_new_heroes")
+        each hero in heroes
+          if hero.get('extendedName') !== 'Captain Anya Weston' && hero.get('extendedName') !== 'Sir Tharin Thunderfist'
+            tr
+              td
+                img(src="http://codecombat.com#{hero.getPortraitURL()}")
+              td
+                p.sale-blurb #{hero.name}
+                p #{hero.class}
+                p #{hero.description}
       br
       if state === 'declined'
         #declined-alert.alert.alert-danger.alert-dismissible

app/views/account/SubscriptionSaleView.coffee

@@ -1,8 +1,10 @@
-app = require 'core/application'
 RootView = require 'views/core/RootView'
 template = require 'templates/account/subscription-sale-view'
+app = require 'core/application'
 AuthModal = require 'views/core/AuthModal'
+CocoCollection = require 'collections/CocoCollection'
 stripeHandler = require 'core/services/stripe'
+ThangType = require 'models/ThangType'
 utils = require 'core/utils'
 
 module.exports = class SubscriptionSaleView extends RootView
@@ -21,14 +23,31 @@ module.exports = class SubscriptionSaleView extends RootView
     @description = $.i18n.t('subscribe.stripe_description_year_sale')
     displayAmount = (@yearSaleAmount / 100).toFixed(2)
     @payButtonText = "#{$.i18n.t('subscribe.sale_view_button')} $#{displayAmount}"
+    @heroes = new CocoCollection([], {model: ThangType})
+    @heroes.url = '/db/thang.type?view=heroes'
+    @heroes.setProjection ['original','name','heroClass','description', 'gems','extendedName','i18n']
+    @heroes.comparator = 'gems'
+    @listenToOnce @heroes, 'sync', @onHeroesLoaded
+    @supermodel.loadCollection(@heroes, 'heroes')
 
   getRenderData: ->
     c = super()
+    c.heroes = @heroes.models
     c.payButtonText = @payButtonText
     c.state = @state
     c.stateMessage = @stateMessage
     c
 
+  onHeroesLoaded: ->
+    @formatHero hero for hero in @heroes.models
+    console.log @heroes.models
+
+  formatHero: (hero) ->
+    hero.name = utils.i18n hero.attributes, 'extendedName'
+    hero.name ?= utils.i18n hero.attributes, 'name'
+    hero.description = utils.i18n hero.attributes, 'description'
+    hero.class = hero.get('heroClass') or 'Warrior'
+
   onPayButton: ->
     return @openModalView new AuthModal() if me.isAnonymous()
     @state = undefined