Add hotspot to display extra content for articles

Victor Costa
1 parent d56bc4d4
Showing 3 changed files with 29 additions and 2 deletions Show diff stats
src/app/article/article-default-view.component.ts
src/app/article/article.html
src/app/hotspot/article-content-hotspot.component.ts
@@ -3,6 +3,7 @@ import {ArticleBlogComponent} from &quot;./types/blog/blog.component&quot;;
 import {CommentsComponent} from "./comment/comments.component";
 import {MacroDirective} from "./macro/macro.directive";
 import {ArticleToolbarHotspotComponent} from "../hotspot/article-toolbar-hotspot.component";
+import {ArticleContentHotspotComponent} from "../hotspot/article-content-hotspot.component";
 /**
  * @ngdoc controller
@@ -33,7 +34,8 @@ export class ArticleDefaultViewComponent {
     selector: 'noosfero-article',
     template: 'not-used',
     directives: [ArticleDefaultViewComponent, ArticleBlogComponent,
-        CommentsComponent, MacroDirective, ArticleToolbarHotspotComponent]
+        CommentsComponent, MacroDirective, ArticleToolbarHotspotComponent,
+        ArticleContentHotspotComponent]
 })
 @Inject("$element", "$scope", "$injector", "$compile")
 export class ArticleViewComponent {
@@ -20,7 +20,7 @@
       </span>
     </div>
   </div>
-
+  <noosfero-hotspot-article-content [article]="ctrl.article"></noosfero-hotspot-article-content>
   <div class="page-body">
     <div bind-html-compile="ctrl.article.body"></div>
   </div>
@@ -0,0 +1,25 @@
+import {Component, Input, Inject} from "ng-forward";
+import * as plugins from "../../plugins";
+import {dasherize} from "ng-forward/cjs/util/helpers";
+import {PluginHotspot} from "./plugin-hotspot";
+
+@Component({
+    selector: "noosfero-hotspot-article-content",
+    template: "<span></span>"
+})
+@Inject("$element", "$scope", "$compile")
+export class ArticleContentHotspotComponent extends PluginHotspot {
+
+    @Input() article: noosfero.Article;
+
+    constructor(
+        private $element: any,
+        private $scope: ng.IScope,
+        private $compile: ng.ICompileService) {
+        super("article_extra_content");
+    }
+
+    addHotspot(directiveName: string) {
+        this.$element.append(this.$compile('<' + directiveName + ' [article]="ctrl.article"></' + directiveName + '>')(this.$scope));
+    }
+}
	@@ -20,7 +20,7 @@		@@ -20,7 +20,7 @@
20	</span>	20	</span>
21	</div>	21	</div>
22	</div>	22	</div>
23	-	23	+ <noosfero-hotspot-article-content [article]="ctrl.article"></noosfero-hotspot-article-content>
24	<div class="page-body">	24	<div class="page-body">
25	<div bind-html-compile="ctrl.article.body"></div>	25	<div bind-html-compile="ctrl.article.body"></div>
26	</div>	26	</div>
@@ -0,0 +1,25 @@		@@ -0,0 +1,25 @@
	1	+import {Component, Input, Inject} from "ng-forward";
	2	+import * as plugins from "../../plugins";
	3	+import {dasherize} from "ng-forward/cjs/util/helpers";
	4	+import {PluginHotspot} from "./plugin-hotspot";
	5	+
	6	+@Component({
	7	+ selector: "noosfero-hotspot-article-content",
	8	+ template: "<span></span>"
	9	+})
	10	+@Inject("$element", "$scope", "$compile")
	11	+export class ArticleContentHotspotComponent extends PluginHotspot {
	12	+
	13	+ @Input() article: noosfero.Article;
	14	+
	15	+ constructor(
	16	+ private $element: any,
	17	+ private $scope: ng.IScope,
	18	+ private $compile: ng.ICompileService) {
	19	+ super("article_extra_content");
	20	+ }
	21	+
	22	+ addHotspot(directiveName: string) {
	23	+ this.$element.append(this.$compile('<' + directiveName + ' [article]="ctrl.article"></' + directiveName + '>')(this.$scope));
	24	+ }
	25	+}