compile directive instead of using template

www/md_base/src/app/common/directives/panel/panel.directive.coffee

@@ -8,6 +8,7 @@ class Panel extends Directive
             controllerAs: 'panel'
             bindToController: true
             scope:
+                name: '='
                 title: '='
                 isCollapsed: '='
                 template: '='
@@ -17,9 +18,17 @@ class Panel extends Directive
 
 class _Panel extends Controller
 
-    constructor: (@$element, @$scope) ->
+    constructor: (@$element, @$scope, $compile) ->
+        # The following watch statement is necessary as the collapse function
+        # is done by toggleClass in this controller instead of binding in template.
         @$scope.$watch 'panel.isCollapsed', (=> @updateCollapse())
 
+        if @name
+            tag = @name.replace /_/g, '-'
+            content = @$element.children().eq(0).children().eq(1)
+            content.html("<#{tag}></#{tag}>")
+            $compile(content.contents())(@$scope)
+
     toggleCollapse: ->
         @isCollapsed = !@isCollapsed
         return

www/md_base/src/app/common/directives/panel/panel.spec.coffee

@@ -65,3 +65,14 @@ describe 'panel', ->
 
         expect(title.hasClass('locked')).toBe(true)
         expect(titlebar.children().length).toBe(1)
+
+
+    it 'should compile content directive correctly', ->
+        $httpBackend.expectGETSVGIcons()
+        $rootScope.test_name = 'underline_should_be_replaced'
+        panel = $compile('<panel name="test_name">')($rootScope)
+        $httpBackend.flush()
+
+        content = panel.children().eq(0).children().eq(1)
+        subdirective = content.children()[0]
+        expect(subdirective.tagName.toLowerCase()).toBe('underline-should-be-replaced')

www/md_base/src/app/common/directives/panel/panel.tpl.jade

@@ -5,5 +5,4 @@ div.inner-container
       md-button(ng-click="panel.toggleCollapse()")
         md-icon(md-svg-icon="expand-panel", ng-show="panel.isCollapsed")
         md-icon(md-svg-icon="collapse-panel", ng-show="!panel.isCollapsed")
-  div.content(ng-include="panel.template")
-
+  div.content

www/md_base/src/app/home/home.route.coffee

@@ -34,16 +34,13 @@ class State extends Config
                     name: 'overview'
                     title: 'overview'
                     collapsed: false
-                    template: 'views/overview_panel.html'
                 ,
                     name: 'current_builds'
                     title: 'current builds'
                     collapsed: true
-                    template: 'views/current_builds_panel.html'
                 ,
                     name: 'recent_builds'
                     title: 'recent builds'
                     collapsed: true
-                    template: 'views/recent_builds_panel.html'
                 ]
             ]

www/md_base/src/app/home/home.tpl.jade

@@ -4,8 +4,8 @@ div.project-info(layout="row")
 div.dashboard(ng-sortable="home.sortable_settings")
   panel(
     ng-repeat="panel in home.panels",
+    name="panel.name",
     title="panel.title",
     is-collapsed="panel.collapsed",
     locked="home.settings.lock_panels.value",
-    template="panel.template",
     )

www/md_base/src/app/home/panels/current_builds/current_builds.directive.coffee

@@ -0,0 +1,8 @@
+class CurrentBuilds extends Directive
+
+    constructor: ->
+        return {
+            restrict: 'E'
+            templateUrl: 'views/current_builds_panel.html'
+        }
+

www/md_base/src/app/home/panels/overview/overview.directive.coffee

@@ -0,0 +1,8 @@
+class Overview extends Directive
+
+    constructor: ->
+        return {
+            restrict: 'E'
+            templateUrl: 'views/overview_panel.html'
+        }
+

www/md_base/src/app/home/panels/recent_builds/recent_builds.directive.coffee

@@ -0,0 +1,8 @@
+class RecentBuilds extends Directive
+
+    constructor: ->
+        return {
+            restrict: 'E'
+            templateUrl: 'views/recent_builds_panel.html'
+        }
+