- Add syntax hi-lighting to teacher solutions / resources.

app/styles/teachers/markdown-resource-view.sass

@@ -107,3 +107,12 @@
           margin: 0 0 0 0px
           padding: 0 60px 0 50px
           border-left: 5px solid #eee
+
+  .ace_content
+    background-color: #f5f5f5
+    .ace_marker-layer
+      .ace_bracket
+        display: none
+    .ace_cursor-layer
+      .ace_cursor
+        display: none

app/styles/teachers/teacher-course-solution-view.sass

@@ -29,3 +29,12 @@
 
   .page-break-before
     page-break-before: always
+
+  .ace_content
+    background-color: #f5f5f5
+    .ace_marker-layer
+      .ace_bracket
+        display: none
+    .ace_cursor-layer
+      .ace_cursor
+        display: none

app/templates/teachers/teacher-course-solution-view.jade

@@ -28,7 +28,8 @@ block content
               i(data-i18n="common.coming_soon")
           h4.text-center(data-i18n="common.default_code")
           if level.get('begin')
-            pre!= level.get('begin')
+            pre
+              code!= level.get('begin')
           else
             .text-center
               i(data-i18n="common.coming_soon")
@@ -44,7 +45,8 @@ block content
             span= level.get('name')
             span.spl(data-i18n="common.solution")
           if level.get('solution')
-            pre!= level.get('solution')
+            pre
+              code!= level.get('solution')
           else
             .text-center
               i(data-i18n="common.coming_soon")

app/views/teachers/MarkdownResourceView.coffee

@@ -1,4 +1,5 @@
 RootView = require 'views/core/RootView'
+utils = require 'core/utils'
 
 module.exports = class MarkdownResourceView extends RootView
   id: 'markdown-resource-view'
@@ -16,3 +17,21 @@ module.exports = class MarkdownResourceView extends RootView
             '<a class="pull-right btn btn-md btn-navy back-to-top" href="#logo-img">Back to top</a></h5'
 
       @render()
+      
+
+  afterRender: ->
+    super()
+    @$el.find('pre>code').each ->
+      els = $(@)
+      c = els.parent()
+      lang = els.attr('class')
+      if lang
+        lang = lang.replace(/^lang-/,'')
+      else
+        lang = 'python'
+
+      aceEditor = utils.initializeACE c[0], lang
+      aceEditor.setShowInvisibles false
+      aceEditor.setBehavioursEnabled false
+      aceEditor.setAnimatedScroll false
+      aceEditor.$blockScrolling = Infinity

app/views/teachers/TeacherCourseSolutionView.coffee

@@ -2,7 +2,7 @@ RootView = require 'views/core/RootView'
 CocoCollection = require 'collections/CocoCollection'
 Course = require 'models/Course'
 Level = require 'models/Level'
-
+utils = require 'core/utils'
 module.exports = class TeacherCourseSolutionView extends RootView
   id: 'teacher-course-solution-view'
   template: require 'templates/teachers/teacher-course-solution-view'
@@ -45,3 +45,15 @@ module.exports = class TeacherCourseSolutionView extends RootView
         solution = programmableMethod.solutions?.find (x) => x.language is @language
         level.set 'solution',  _.template(solution?.source)(programmableMethod.context)
     @render?()
+
+  afterRender: ->
+    super()
+    lang = @language
+    @$el.find('pre>code').each ->
+      els = $(@)
+      c = els.parent()
+      aceEditor = utils.initializeACE c[0], lang
+      aceEditor.setShowInvisibles false
+      aceEditor.setBehavioursEnabled false
+      aceEditor.setAnimatedScroll false
+      aceEditor.$blockScrolling = Infinity