From b7f916116dd1d06ece4a2fe24ca126a4bf4b2d97 Mon Sep 17 00:00:00 2001
From: Matt Lott <mattlott@live.com>
Date: Thu, 28 Jul 2016 12:00:52 -0700
Subject: [PATCH] Add game UI programming language label

---
 app/locale/en.coffee                          |  1 +
 .../play/level/tome/spell-top-bar-view.sass   | 19 +++++++++++++++++--
 .../play/level/tome/spell-top-bar-view.jade   | 10 ++++++++++
 .../play/level/tome/SpellTopBarView.coffee    |  1 -
 4 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/app/locale/en.coffee b/app/locale/en.coffee
index 46d02551c..1ad7715b5 100644
--- a/app/locale/en.coffee
+++ b/app/locale/en.coffee
@@ -437,6 +437,7 @@
     done: "Done"
     next_level: "Next Level"
     next_game: "Next game"
+    programming_language: "Programming language"
     show_menu: "Show game menu"
     home: "Home"  # Not used any more, will be removed soon.
     level: "Level"  # Like "Level: Dungeons of Kithgard"
diff --git a/app/styles/play/level/tome/spell-top-bar-view.sass b/app/styles/play/level/tome/spell-top-bar-view.sass
index 39207901d..9d00710c6 100644
--- a/app/styles/play/level/tome/spell-top-bar-view.sass
+++ b/app/styles/play/level/tome/spell-top-bar-view.sass
@@ -2,7 +2,8 @@
 @import "app/styles/bootstrap/variables"
 
 #spell-top-bar-view
-  $height: 87px
+  $control-yellow-highlight: rgb(243, 211, 59)
+  $height: 107px
   $paddingTop: 10px
   $paddingBottom: 25px
   $childSize: $height - $paddingTop - $paddingBottom
@@ -50,10 +51,24 @@
     float: left
     margin-top: 5px
 
+  .programming-language-container
+    position: absolute
+    padding-top: $paddingTop
+    right: 20px
+    font-family: "Open Sans Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif
+    .programming-language-label
+      color: $control-yellow-highlight
+      font-size: 12px
+      font-weight: bold
+      text-transform: uppercase
+    .programming-language
+      color: white
+      font-size: 16px
+
   .spell-tool-buttons
     position: absolute
     right: 0px
-    top: 0px
+    top: 30px
 
   .reload-code
     float: right
diff --git a/app/templates/play/level/tome/spell-top-bar-view.jade b/app/templates/play/level/tome/spell-top-bar-view.jade
index 2af252e1e..6540236a9 100644
--- a/app/templates/play/level/tome/spell-top-bar-view.jade
+++ b/app/templates/play/level/tome/spell-top-bar-view.jade
@@ -35,3 +35,13 @@
         span(data-i18n='sharing.webpage')
 
   .clearfix
+
+.programming-language-container
+  span.programming-language-label(data-i18n='play_level.programming_language')
+  span.programming-language-label.spr :
+  if view.spell.language === 'html' || view.spell.language === 'javascript'
+    span.programming-language JavaScript
+  else if view.spell.language === 'python'
+    span.programming-language Python
+  else
+    span.programming-language= view.spell.language
diff --git a/app/views/play/level/tome/SpellTopBarView.coffee b/app/views/play/level/tome/SpellTopBarView.coffee
index 7c8051f86..a3cddf06e 100644
--- a/app/views/play/level/tome/SpellTopBarView.coffee
+++ b/app/views/play/level/tome/SpellTopBarView.coffee
@@ -39,7 +39,6 @@ module.exports = class SpellTopBarView extends CocoView
 
   afterRender: ->
     super()
-    @$el.addClass 'spell-tab'
     @attachTransitionEventListener()
 
   onDisableControls: (e) -> @toggleControls e, false