Create blog directive

Victor Costa
1 parent 9ed8efe9
Showing 5 changed files with 25 additions and 9 deletions Show diff stats
src/app/components/noosfero-articles/article/article.directive.js
src/app/components/noosfero-articles/blog/blog.directive.js
src/app/components/noosfero-articles/blog/blog.html
src/app/content-viewer/content-viewer.controller.js
src/app/content-viewer/page.html
@@ -6,23 +6,30 @@
     .directive('noosferoArticle', noosferoArticle);
   /** @ngInject */
-  function noosferoArticle() {
+  function noosferoArticle($injector, $compile) {
     var directive = {
       restrict: 'E',
       templateUrl: 'app/components/noosfero-articles/article/article.html',
       scope: {
           article: '=',
-          owner: '='
+          profile: '='
       },
       controller: ArticleController,
       controllerAs: 'vm',
-      bindToController: true
+      bindToController: true,
+      link: function(scope, element) {
+        var specificDirective = 'noosfero'+scope.vm.article.type;
+        if($injector.has(specificDirective+'Directive')) {
+          var directiveName = specificDirective.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+          element.replaceWith($compile('<'+directiveName+' article="vm.article" profile="vm.profile"></'+directiveName+'>')(scope));          
+        }
+      }
     };
     return directive;
     /** @ngInject */
-    function ArticleController() {
+    function ArticleController($injector, $compile, $scope) {
       var vm = this;
     }
   }
@@ -12,7 +12,7 @@
       templateUrl: 'app/components/noosfero-articles/blog/blog.html',
       scope: {
           article: '=',
-          owner: '='
+          profile: '='
       },
       controller: BlogController,
       controllerAs: 'vm',
-{{vm.article.title}}
+<div class="page-header">
+  <h3 ng-bind="vm.article.title"></h3>
+</div>
-<pre>{{vm.article}}</pre>
+<div>
+  <div ng-repeat="child in vm.article.children">
+    <a ng-href="/{{vm.profile.identifier}}/{{child.path}}"><h4 ng-bind="child.title"></h4></a>
+    <div ng-bind-html="child.body | limitTo: 500"></div>
+  </div>
+</div>
@@ -10,10 +10,12 @@
   function ContentViewerController(noosfero, $log, $stateParams, $scope) {
     var vm = this;
     vm.article = null;
+    vm.profile = null;
     activate();
     function activate() {
-      noosfero.communities.one($scope.vm.owner.id).one('articles').get({path: $stateParams.page}).then(function(articles) {
+      vm.profile = $scope.vm.owner;
+      noosfero.communities.one(vm.profile.id).one('articles').get({path: $stateParams.page}).then(function(articles) {
         vm.article = articles.article;
       });
     }
-<noosfero-article article="vm.article"></noosfero-article>
+<noosfero-article ng-if="vm.article" article="vm.article" profile="vm.profile"></noosfero-article>
	@@ -12,7 +12,7 @@		@@ -12,7 +12,7 @@
12	templateUrl: 'app/components/noosfero-articles/blog/blog.html',	12	templateUrl: 'app/components/noosfero-articles/blog/blog.html',
13	scope: {	13	scope: {
14	article: '=',	14	article: '=',
15	- owner: '='	15	+ profile: '='
16	},	16	},
17	controller: BlogController,	17	controller: BlogController,
18	controllerAs: 'vm',	18	controllerAs: 'vm',
1	-{{vm.article.title}}	1	+<div class="page-header">
		2	+ <h3 ng-bind="vm.article.title"></h3>
		3	+</div>
2		4
3	-<pre>{{vm.article}}</pre>	5	+<div>
		6	+ <div ng-repeat="child in vm.article.children">
		7	+ <a ng-href="/{{vm.profile.identifier}}/{{child.path}}"><h4 ng-bind="child.title"></h4></a>
		8	+ <div ng-bind-html="child.body \| limitTo: 500"></div>
		9	+ </div>
		10	+</div>