-
+
+
+
diff --git a/src/app/layout/boxes/boxes.component.spec.ts b/src/app/layout/boxes/boxes.component.spec.ts
index 0db1b6e..fd2996e 100644
--- a/src/app/layout/boxes/boxes.component.spec.ts
+++ b/src/app/layout/boxes/boxes.component.spec.ts
@@ -45,12 +45,7 @@ describe("Boxes Component", () => {
state.current = { name: "" };
it("renders boxes into a container", () => {
- expect(helper.find('div.col-md-7').length).toEqual(1);
- expect(helper.find('div.col-md-2-5').length).toEqual(1);
- });
-
- it("check the boxes order", () => {
- expect(helper.component.boxesOrder(properties['boxes'][0])).toEqual(1);
- expect(helper.component.boxesOrder(properties['boxes'][1])).toEqual(0);
+ expect(helper.find('div.col-md-6').length).toEqual(1);
+ expect(helper.find('div.col-md-3').length).toEqual(1);
});
});
diff --git a/src/app/layout/boxes/boxes.component.ts b/src/app/layout/boxes/boxes.component.ts
index 40b45fa..643a735 100644
--- a/src/app/layout/boxes/boxes.component.ts
+++ b/src/app/layout/boxes/boxes.component.ts
@@ -1,16 +1,16 @@
import {Input, Component} from 'ng-forward';
+import {DisplayBoxes} from "./display-boxes.filter";
+import {SetBoxLayout} from "./set-box-layout.filter";
@Component({
selector: "noosfero-boxes",
- templateUrl: "app/layout/boxes/boxes.html"
+ templateUrl: "app/layout/boxes/boxes.html",
+ directives: [DisplayBoxes, SetBoxLayout]
})
export class BoxesComponent {
@Input() boxes: noosfero.Box[];
@Input() owner: noosfero.Profile | noosfero.Environment;
+ @Input() layout: string;
- boxesOrder(box: noosfero.Box) {
- if (box.position === 2) return 0;
- return box.position;
- }
}
diff --git a/src/app/layout/boxes/boxes.html b/src/app/layout/boxes/boxes.html
index 5478806..ecd413c 100644
--- a/src/app/layout/boxes/boxes.html
+++ b/src/app/layout/boxes/boxes.html
@@ -1 +1 @@
-
+
diff --git a/src/app/layout/boxes/display-boxes.filter.spec.ts b/src/app/layout/boxes/display-boxes.filter.spec.ts
new file mode 100644
index 0000000..31005d7
--- /dev/null
+++ b/src/app/layout/boxes/display-boxes.filter.spec.ts
@@ -0,0 +1,51 @@
+import {DisplayBoxes} from './display-boxes.filter';
+
+describe("Boxes Filters", () => {
+ describe("Display Boxes Filter", () => {
+
+ let boxes: noosfero.Box[] = [
+ {id: 1, position: 1 },
+ {id: 2, position: 2 },
+ {id: 3, position: 3 },
+ {id: 4, position: 4 }
+ ];
+
+ let expected_on_default: noosfero.Box[] = [
+ {id: 1, position: 1 },
+ {id: 2, position: 2 },
+ {id: 3, position: 3 },
+ ];
+
+ let expected_on_rightbar: noosfero.Box[] = [
+ {id: 1, position: 1 },
+ {id: 3, position: 3 },
+ ];
+
+ it("filter boxes when layout is set to default", done => {
+ let filter = new DisplayBoxes();
+
+ let filtered_boxes: noosfero.Box[] = filter.transform(boxes, "default");
+ expect(filtered_boxes.length).toEqual(3);
+ expect(filtered_boxes).toEqual(expected_on_default);
+ done();
+ });
+
+ it("filter boxes when layout is set to rightbar", done => {
+ let filter = new DisplayBoxes();
+
+ let filtered_boxes: noosfero.Box[] = filter.transform(boxes, "rightbar");
+ expect(filtered_boxes.length).toEqual(2);
+ expect(filtered_boxes).toEqual(expected_on_rightbar);
+ done();
+ });
+
+ it("filter boxes with default layout when invalid layout is given", done => {
+ let filter = new DisplayBoxes();
+
+ let filtered_boxes: noosfero.Box[] = filter.transform(boxes, "");
+ expect(filtered_boxes.length).toEqual(3);
+ expect(filtered_boxes).toEqual(expected_on_default);
+ done();
+ });
+ });
+});
diff --git a/src/app/layout/boxes/display-boxes.filter.ts b/src/app/layout/boxes/display-boxes.filter.ts
new file mode 100644
index 0000000..7cf9887
--- /dev/null
+++ b/src/app/layout/boxes/display-boxes.filter.ts
@@ -0,0 +1,35 @@
+import {Pipe, Inject} from "ng-forward";
+
+@Pipe("displayBoxes")
+export class DisplayBoxes {
+
+ transform(boxes: noosfero.Box[], layout: string) {
+ let function_str: string = "visible_on" + layout;
+ let valid_boxes: number[] = [];
+ let selected: noosfero.Box[] = [];
+ boxes = boxes || [];
+
+ if (layout === "rightbar") {
+ valid_boxes = this.visible_on_right_bar();
+ }else {
+ valid_boxes = this.visible_on_default();
+ }
+
+ for (let box of boxes) {
+ if (valid_boxes.indexOf(box.position) !== -1) {
+ selected.push(box);
+ }
+ }
+ return selected;
+ }
+
+ private visible_on_default() {
+ return [1, 2, 3];
+ }
+
+ private visible_on_right_bar() {
+ return [1, 3];
+ }
+
+}
+
diff --git a/src/app/layout/boxes/set-box-layout.filter.spec.ts b/src/app/layout/boxes/set-box-layout.filter.spec.ts
new file mode 100644
index 0000000..f2e07e3
--- /dev/null
+++ b/src/app/layout/boxes/set-box-layout.filter.spec.ts
@@ -0,0 +1,34 @@
+import {SetBoxLayout} from './set-box-layout.filter';
+
+describe("Boxes Filters", () => {
+ describe("Set Box Layout Filter", () => {
+ let box_layout_filter = new SetBoxLayout();
+ describe("When layout is set to default", () => {
+ it("return style when box position is 1 ", done => {
+ expect(box_layout_filter.transform(1, "default")).toEqual("col-md-6 col-md-push-3");
+ done();
+ });
+ it("return style when box position is 2", done => {
+ expect(box_layout_filter.transform(2, "default")).toEqual("col-md-3 col-md-pull-6");
+ done();
+ });
+ it("return style when any other position is given", done => {
+ expect(box_layout_filter.transform(null, "default")).toEqual("col-md-3");
+ expect(box_layout_filter.transform(3, "default")).toEqual("col-md-3");
+ expect(box_layout_filter.transform(99, "default")).toEqual("col-md-3");
+ done();
+ });
+ });
+
+ describe("When layout is set to right_bar", () => {
+ it("return style when box position is 1 ", done => {
+ expect(box_layout_filter.transform(1, "rightbar")).toEqual("col-sm-12 col-md-8");
+ done();
+ });
+ it("return style when box other position is given", done => {
+ expect(box_layout_filter.transform(2, "rightbar")).toEqual("col-sm-12 col-md-4");
+ done();
+ });
+ });
+ });
+});
diff --git a/src/app/layout/boxes/set-box-layout.filter.ts b/src/app/layout/boxes/set-box-layout.filter.ts
new file mode 100644
index 0000000..ebb9379
--- /dev/null
+++ b/src/app/layout/boxes/set-box-layout.filter.ts
@@ -0,0 +1,32 @@
+import {Pipe, Inject} from "ng-forward";
+
+@Pipe("setBoxLayout")
+export class SetBoxLayout {
+
+ transform(pos: number, layout: string) {
+ if (layout === "rightbar") {
+ return this.right_bar(pos);
+ }else {
+ return this.default(pos);
+ }
+ }
+
+ private default(position: number) {
+ if (position === 1) {
+ return "col-md-6 col-md-push-3";
+ }else if (position === 2) {
+ return "col-md-3 col-md-pull-6";
+ }else {
+ return "col-md-3";
+ }
+ }
+
+ private right_bar(position: number) {
+ if (position === 1) {
+ return "col-sm-12 col-md-8";
+ }else {
+ return "col-sm-12 col-md-4";
+ }
+ }
+
+}
diff --git a/src/app/profile/profile.html b/src/app/profile/profile.html
index 160f623..9ba268a 100644
--- a/src/app/profile/profile.html
+++ b/src/app/profile/profile.html
@@ -1,7 +1,13 @@
diff --git a/src/lib/ng-noosfero-api/interfaces/environment.ts b/src/lib/ng-noosfero-api/interfaces/environment.ts
index 14a8585..590a3a0 100644
--- a/src/lib/ng-noosfero-api/interfaces/environment.ts
+++ b/src/lib/ng-noosfero-api/interfaces/environment.ts
@@ -15,5 +15,14 @@ namespace noosfero {
*/
id: number;
settings: any
+
+ /**
+ * @ngdoc property
+ * @name layout_template
+ * @propertyOf noofero.Environment
+ * @returns {string} The Environment layout (e.g. default, rightbar)
+ */
+ layout_template: string;
}
-}
\ No newline at end of file
+}
+
diff --git a/src/lib/ng-noosfero-api/interfaces/profile.ts b/src/lib/ng-noosfero-api/interfaces/profile.ts
index 7a317c8..607270b 100644
--- a/src/lib/ng-noosfero-api/interfaces/profile.ts
+++ b/src/lib/ng-noosfero-api/interfaces/profile.ts
@@ -80,5 +80,13 @@ namespace noosfero {
custom_footer: string;
permissions: string[];
+
+ /**
+ * @ngdoc property
+ * @name layout_template
+ * @propertyOf noofero.Profile
+ * @returns {string} The Profile layout template (e.g.: "rightbar", "default")
+ */
+ layout_template: string;
}
}
--
libgit2 0.21.2