From 4b151aa3f841c62ad465feb808af0e52e683912c Mon Sep 17 00:00:00 2001
From: Leandro Nunes dos Santos <leandronunes@gmail.com>
Date: Thu, 4 Aug 2016 15:57:25 -0300
Subject: [PATCH] change image component name to profile image component

---
 src/app/layout/blocks/profile-image/profile-image-block.component.ts |  2 +-
 src/app/profile/image/image.component.spec.ts                        | 75 ---------------------------------------------------------------------------
 src/app/profile/image/image.component.ts                             | 94 ----------------------------------------------------------------------------------------------
 src/app/profile/image/image.html                                     | 20 --------------------
 src/app/profile/image/image.scss                                     | 59 -----------------------------------------------------------
 src/app/profile/image/index.ts                                       |  2 +-
 src/app/profile/image/profile-image-editor.component.ts              |  2 +-
 src/app/profile/image/profile-image.component.spec.ts                | 68 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/app/profile/image/profile-image.component.ts                     | 95 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/app/profile/image/profile-image.html                             | 20 ++++++++++++++++++++
 src/app/profile/image/profile-image.scss                             | 59 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 11 files changed, 245 insertions(+), 251 deletions(-)
 delete mode 100644 src/app/profile/image/image.component.spec.ts
 delete mode 100644 src/app/profile/image/image.component.ts
 delete mode 100644 src/app/profile/image/image.html
 delete mode 100644 src/app/profile/image/image.scss
 create mode 100644 src/app/profile/image/profile-image.component.spec.ts
 create mode 100644 src/app/profile/image/profile-image.component.ts
 create mode 100644 src/app/profile/image/profile-image.html
 create mode 100644 src/app/profile/image/profile-image.scss

diff --git a/src/app/layout/blocks/profile-image/profile-image-block.component.ts b/src/app/layout/blocks/profile-image/profile-image-block.component.ts
index 73934b0..ff90ee8 100644
--- a/src/app/layout/blocks/profile-image/profile-image-block.component.ts
+++ b/src/app/layout/blocks/profile-image/profile-image-block.component.ts
@@ -1,5 +1,5 @@
 import { Inject, Input, Component } from "ng-forward";
-import { ProfileImageComponent } from "./../../../profile/image/image.component";
+import { ProfileImageComponent } from "./../../../profile/image/profile-image.component";
 import { ProfileService } from "../../../../lib/ng-noosfero-api/http/profile.service";
 import { SessionService } from "./../../../login";
 import { NotificationService } from "../../../shared/services/notification.service";
diff --git a/src/app/profile/image/image.component.spec.ts b/src/app/profile/image/image.component.spec.ts
deleted file mode 100644
index 48d657b..0000000
--- a/src/app/profile/image/image.component.spec.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/**
- * @ngdoc overview
- * @name components.noosfero.profile-image.ProfileImageSpec
- * @description
- *  This file contains the tests for the {@link components.noosfero.profile-image.ProfileImage} component.
- */
-import { ComponentTestHelper, createClass } from '../../../spec/component-test-helper';
-import { TestComponentBuilder, ComponentFixture } from 'ng-forward/cjs/testing/test-component-builder';
-import { Pipe, Input, provide, Component } from 'ng-forward';
-import { ProfileService } from "../../../lib/ng-noosfero-api/http/profile.service";
-
-import * as helpers from "../../../spec/helpers";
-
-import { ProfileImageComponent } from "./image.component";
-
-const htmlTemplate: string = '<noosfero-profile-image [editable]="true" [edit-class]="editable-class" [profile]="ctrl.profile"></noosfero-profile-image>';
-
-describe("Components", () => {
-
-    describe("Profile Image Component", () => {
-
-        let helper: ComponentTestHelper<ProfileImageComponent>;
-
-        beforeEach(angular.mock.module("templates"));
-
-        beforeEach((done) => {
-            let scope = helpers.mocks.scopeWithEvents;
-            let profileService = jasmine.createSpyObj("profileService", ["upload"]);
-            let properties = { profile: { custom_footer: "footer" } };
-            let cls = createClass({
-                template: htmlTemplate,
-                directives: [ProfileImageComponent],
-                properties: properties,
-                providers: [
-                    helpers.createProviderToValue("ProfileService", profileService),
-                    helpers.createProviderToValue("$uibModal", helpers.mocks.$modal),
-                    helpers.createProviderToValue("$scope", scope)
-                ]
-            });
-            helper = new ComponentTestHelper<ProfileImageComponent>(cls, done);
-        });
-
-        it("set modal instance when select files modal", () => {
-            helper.component['$uibModal'].open = jasmine.createSpy("open");
-            helper.component.fileSelected("file", []);
-            expect(helper.component['$uibModal'].open).toHaveBeenCalled();
-        });
-
-
-        it("show community users image if profile is not Person", (done) => {
-
-            let profile = <noosfero.Profile>{ id: 1, identifier: "myprofile", type: "Community" };
-            helper.component.profile = profile;
-            helper.component.ngOnInit();
-
-            // Check the attribute
-            expect(helper.component.defaultIcon).toBe("fa-users", "The default icon should be community users");
-            // var elProfile = fixture.debugElement.componentViewChildren[0];
-            // expect(elProfile.query('div.profile-image-block').length).toEqual(1);
-            done();
-
-        });
-
-        it("show Person image if profile is Person", (done) => {
-
-            let profile = <noosfero.Profile>{ id: 1, identifier: "myprofile", type: "Person" };
-            helper.component.profile = profile;
-            helper.component.ngOnInit();
-            // Check the attribute
-            expect(helper.component.defaultIcon).toEqual("fa-user", "The default icon should be person user");
-            done();
-        });
-
-    });
-});
diff --git a/src/app/profile/image/image.component.ts b/src/app/profile/image/image.component.ts
deleted file mode 100644
index cb2fbb1..0000000
--- a/src/app/profile/image/image.component.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-import { Inject, Input, Component, provide } from "ng-forward";
-import { ProfileService } from "../../../lib/ng-noosfero-api/http/profile.service";
-import { PermissionService } from "../../shared/services/permission.service";
-import { ProfileImageEditorComponent } from "./profile-image-editor.component";
-
-/**
- * @ngdoc controller
- * @name components.noosfero.profile-image.ProfileImage
- * @description The component responsible for rendering the profile image
- * @exports ProfileImage
- */
-@Component({
-    selector: "noosfero-profile-image",
-    templateUrl: 'app/profile/image/image.html',
-    providers: [provide('profileService', { useClass: ProfileService })]
-})
-@Inject(ProfileService, PermissionService, "$uibModal", "$scope")
-export class ProfileImageComponent {
-    /**
-     * @ngdoc property
-     * @name profile
-     * @propertyOf components.noosfero.profile-image.ProfileImage
-     * @description
-     *  The Noosfero {@link models.Profile} holding the image.
-     */
-    @Input() profile: noosfero.Profile;
-    /**
-     * @ngdoc property
-     * @name defaultIcon
-     * @propertyOf components.noosfero.profile-image.ProfileImage
-     * @descritpion
-     *  The default icon used by this profile
-     */
-    defaultIcon: string;
-
-    @Input() editable: boolean;
-
-    @Input() editClass: string;
-
-    picFile: any;
-    croppedDataUrl: any;
-    modalInstance: any;
-
-    constructor(private profileService: ProfileService, private permissionService: PermissionService, private $uibModal: ng.ui.bootstrap.IModalService, private $scope: ng.IScope) {
-    }
-
-    fileSelected(file: any, errFiles: any) {
-        if (file) {
-            this.picFile = file;
-            this.modalInstance = this.$uibModal.open({
-                templateUrl: 'app/profile/image/profile-image-editor.html',
-                controller: ProfileImageEditorComponent,
-                controllerAs: 'ctrl',
-                scope: this.$scope,
-                bindToController: true,
-                backdrop: 'static',
-                resolve: {
-                    picFile: this.picFile,
-                    profile: this.profile,
-                    profileService: this.profileService
-                }
-            });
-        }
-    }
-
-    private _showCamera: boolean = false;
-
-    showChange(show: boolean) {
-        this._showCamera = show;
-    }
-
-    showCamera() {
-        return this._showCamera;
-    }
-
-    isEditable() {
-        return this.editable && this.permissionService.isAllowed(this.profile, 'allow_edit');
-    }
-
-    /**
-     * @ngdoc method
-     * @name ngOnInit
-     * @methodOf components.noosfero.profile-image.ProfileImage
-     * @description
-     *  Initializes the icon names to their corresponding values depending on the profile type passed to the controller
-     */
-    ngOnInit() {
-        this.defaultIcon = 'fa-users';
-        if (this.profile && this.profile.type === 'Person') {
-            this.defaultIcon = 'fa-user';
-        }
-    }
-
-}
diff --git a/src/app/profile/image/image.html b/src/app/profile/image/image.html
deleted file mode 100644
index aa5d1bb..0000000
--- a/src/app/profile/image/image.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<div ng-if="ctrl.isEditable()" id="profile-image-container">
-  <div class="profile-image-wrap" title="{{ctrl.profile.name}}" ng-mouseenter="ctrl.showChange(true)" ng-mouseleave="ctrl.showChange(false)">
-    <div class="hovereffect   ">
-      <i ng-if="!ctrl.profile.image" class="fa {{ctrl.defaultIcon}} fa-5x profile-image"></i>
-      <img ng-if="ctrl.profile.image" ng-src="{{ctrl.profile.image.url}}" class="img-responsive profile-image">
-      <div class='container-camera'>
-        <a ngf-select="ctrl.fileSelected($file)"
-            ngf-pattern="'image/*'" ngf-accept="'image/*'"
-            ngf-max-size="20MB"
-            data-toggle="modal" data-target=".crop-dialog" href="#"><i class="fa fa-camera upload-camera" ></i>
-        </a>
-      </div>
-      <div class="overlay"></div>
-    </div>
-  </div>
-</div>
-<span ng-if="!ctrl.isEditable()" class="profile-image-wrap" title="{{ctrl.profile.name}}">
-  <img ng-if="ctrl.profile.image" ng-src="{{ctrl.profile.image.url}}" class="img-responsive profile-image">
-  <i ng-if="!ctrl.profile.image" class="fa {{ctrl.defaultIcon}} fa-5x profile-image"></i>
-</span>
diff --git a/src/app/profile/image/image.scss b/src/app/profile/image/image.scss
deleted file mode 100644
index b3864e6..0000000
--- a/src/app/profile/image/image.scss
+++ /dev/null
@@ -1,59 +0,0 @@
-.hovereffect {
-  width:100%;
-  height:100%;
-  float:left;
-  overflow:hidden;
-  position:relative;
-  text-align:center;
-  cursor:default;  
-  .container-camera {
-      position: relative;
-      z-index: 2;
-      .upload-camera{
-        right: 0px;
-        left: 0px;
-        position: absolute;
-        font-size: 1.5em;
-        bottom: 2px;
-        text-shadow: 0px 0px 3px black;
-        color: white;
-        padding-top: 5px;
-        &:hover{
-          font-size: 1.5em;
-          background-color: rgba(0, 0, 0, 0.50);
-        }
-
-      }
-  }
-  .overlay {
-    width:100%;
-    height:100%;
-    position:absolute;
-    overflow:hidden;
-    top:0;
-    left:0;
-    opacity:0;
-    background-color:rgba(0,0,0,0.5);
-    -webkit-transition:all .4s ease-in-out;
-    transition:all .4s ease-in-out;
-    z-index: 1;
-  }
-  img {
-    display:block;
-    position:relative;
-    -webkit-transition:all .4s linear;
-    transition:all .4s linear;
-    width: 100%;
-  }
-  &:hover {
-    img {
-      -ms-transform:scale(1.2);
-      -webkit-transform:scale(1.2);
-      transform:scale(1.2);
-    }
-    .overlay {
-      opacity:1;
-      filter:alpha(opacity=100);
-    }
-  }
-}
diff --git a/src/app/profile/image/index.ts b/src/app/profile/image/index.ts
index 65995e1..bf4ea84 100644
--- a/src/app/profile/image/index.ts
+++ b/src/app/profile/image/index.ts
@@ -1,2 +1,2 @@
 /* Module Index Entry - generated using the script npm run generate-index */
-export * from "./image.component";
+export * from "./profile-image.component";
diff --git a/src/app/profile/image/profile-image-editor.component.ts b/src/app/profile/image/profile-image-editor.component.ts
index 7d6d922..dd6379f 100644
--- a/src/app/profile/image/profile-image-editor.component.ts
+++ b/src/app/profile/image/profile-image-editor.component.ts
@@ -10,7 +10,7 @@ export class ProfileImageEditorComponent {
     constructor(public picFile: any, public profile: noosfero.Profile, public profileService: ProfileService,
         public modalInstance: ng.ui.bootstrap.IModalServiceInstance) {
     }
-    
+
     uploadImage(dataUrl: any, name: any) {
         let base64ImageJson = this.getBase64ImageJson(dataUrl, name);
         this.profileService.uploadImage(this.profile, base64ImageJson).then((result: any) => {
diff --git a/src/app/profile/image/profile-image.component.spec.ts b/src/app/profile/image/profile-image.component.spec.ts
new file mode 100644
index 0000000..65893e5
--- /dev/null
+++ b/src/app/profile/image/profile-image.component.spec.ts
@@ -0,0 +1,68 @@
+/**
+ * @ngdoc overview
+ * @name components.noosfero.profile-image.ProfileImageSpec
+ * @description
+ *  This file contains the tests for the {@link components.noosfero.profile-image.ProfileImage} component.
+ */
+import { ComponentTestHelper, createClass } from '../../../spec/component-test-helper';
+import { TestComponentBuilder, ComponentFixture } from 'ng-forward/cjs/testing/test-component-builder';
+import { Pipe, Input, provide, Component } from 'ng-forward';
+import { ProfileService } from "../../../lib/ng-noosfero-api/http/profile.service";
+
+import * as helpers from "../../../spec/helpers";
+
+import { ProfileImageComponent } from "./profile-image.component";
+
+const htmlTemplate: string = '<noosfero-profile-image [editable]="true" [edit-class]="editable-class" [profile]="ctrl.profile"></noosfero-profile-image>';
+
+describe("Components", () => {
+
+    describe("Profile Image Component", () => {
+
+        let helper: ComponentTestHelper<ProfileImageComponent>;
+
+        beforeEach(angular.mock.module("templates"));
+
+        beforeEach((done) => {
+            let scope = helpers.mocks.scopeWithEvents;
+            let profileService = jasmine.createSpyObj("profileService", ["upload"]);
+            let properties = { profile: { custom_footer: "footer" } };
+            let cls = createClass({
+                template: htmlTemplate,
+                directives: [ProfileImageComponent],
+                properties: properties,
+                providers: [
+                    helpers.createProviderToValue("ProfileService", profileService),
+                    helpers.createProviderToValue("$uibModal", helpers.mocks.$modal),
+                    helpers.createProviderToValue("$scope", scope)
+                ]
+            });
+            helper = new ComponentTestHelper<ProfileImageComponent>(cls, done);
+        });
+
+        it("set modal instance when select files modal", () => {
+            helper.component['$uibModal'].open = jasmine.createSpy("open");
+            helper.component.fileSelected("file", []);
+            expect(helper.component['$uibModal'].open).toHaveBeenCalled();
+        });
+
+
+        it("show community users image if profile is not Person", (done) => {
+            let profile = <noosfero.Profile>{ id: 1, identifier: "myprofile", type: "Community" };
+            helper.component.profile = profile;
+            helper.component.ngOnInit();
+            expect(helper.component.defaultIcon).toBe("fa-users", "The default icon should be community users");
+            done();
+
+        });
+
+        it("show Person image if profile is Person", (done) => {
+            let profile = <noosfero.Profile>{ id: 1, identifier: "myprofile", type: "Person" };
+            helper.component.profile = profile;
+            helper.component.ngOnInit();
+            expect(helper.component.defaultIcon).toEqual("fa-user", "The default icon should be person user");
+            done();
+        });
+
+    });
+});
diff --git a/src/app/profile/image/profile-image.component.ts b/src/app/profile/image/profile-image.component.ts
new file mode 100644
index 0000000..2f1a0fa
--- /dev/null
+++ b/src/app/profile/image/profile-image.component.ts
@@ -0,0 +1,95 @@
+import { Inject, Input, Component, provide } from "ng-forward";
+import { ProfileService } from "../../../lib/ng-noosfero-api/http/profile.service";
+import { PermissionService } from "../../shared/services/permission.service";
+import { ProfileImageEditorComponent } from "./profile-image-editor.component";
+
+/**
+ * @ngdoc controller
+ * @name components.noosfero.profile-image.ProfileImage
+ * @description The component responsible for rendering the profile image
+ * @exports ProfileImage
+ */
+@Component({
+    selector: "noosfero-profile-image",
+    templateUrl: 'app/profile/image/profile-image.html',
+    providers: [provide('profileService', { useClass: ProfileService })]
+})
+@Inject(ProfileService, PermissionService, "$uibModal", "$scope")
+export class ProfileImageComponent {
+  
+    /**
+     * @ngdoc property
+     * @name profile
+     * @propertyOf components.noosfero.profile-image.ProfileImage
+     * @description
+     *  The Noosfero {@link models.Profile} holding the image.
+     */
+    @Input() profile: noosfero.Profile;
+    /**
+     * @ngdoc property
+     * @name defaultIcon
+     * @propertyOf components.noosfero.profile-image.ProfileImage
+     * @descritpion
+     *  The default icon used by this profile
+     */
+    defaultIcon: string;
+
+    @Input() editable: boolean;
+
+    @Input() editClass: string;
+
+    picFile: any;
+    croppedDataUrl: any;
+    modalInstance: any;
+
+    constructor(private profileService: ProfileService, private permissionService: PermissionService, private $uibModal: ng.ui.bootstrap.IModalService, private $scope: ng.IScope) {
+    }
+
+    fileSelected(file: any, errFiles: any) {
+        if (file) {
+            this.picFile = file;
+            this.modalInstance = this.$uibModal.open({
+                templateUrl: 'app/profile/image/profile-image-editor.html',
+                controller: ProfileImageEditorComponent,
+                controllerAs: 'ctrl',
+                scope: this.$scope,
+                bindToController: true,
+                backdrop: 'static',
+                resolve: {
+                    picFile: this.picFile,
+                    profile: this.profile,
+                    profileService: this.profileService
+                }
+            });
+        }
+    }
+
+    private _showCamera: boolean = false;
+
+    showChange(show: boolean) {
+        this._showCamera = show;
+    }
+
+    showCamera() {
+        return this._showCamera;
+    }
+
+    isEditable() {
+        return this.editable && this.permissionService.isAllowed(this.profile, 'allow_edit');
+    }
+
+    /**
+     * @ngdoc method
+     * @name ngOnInit
+     * @methodOf components.noosfero.profile-image.ProfileImage
+     * @description
+     *  Initializes the icon names to their corresponding values depending on the profile type passed to the controller
+     */
+    ngOnInit() {
+        this.defaultIcon = 'fa-users';
+        if (this.profile && this.profile.type === 'Person') {
+            this.defaultIcon = 'fa-user';
+        }
+    }
+
+}
diff --git a/src/app/profile/image/profile-image.html b/src/app/profile/image/profile-image.html
new file mode 100644
index 0000000..aa5d1bb
--- /dev/null
+++ b/src/app/profile/image/profile-image.html
@@ -0,0 +1,20 @@
+<div ng-if="ctrl.isEditable()" id="profile-image-container">
+  <div class="profile-image-wrap" title="{{ctrl.profile.name}}" ng-mouseenter="ctrl.showChange(true)" ng-mouseleave="ctrl.showChange(false)">
+    <div class="hovereffect   ">
+      <i ng-if="!ctrl.profile.image" class="fa {{ctrl.defaultIcon}} fa-5x profile-image"></i>
+      <img ng-if="ctrl.profile.image" ng-src="{{ctrl.profile.image.url}}" class="img-responsive profile-image">
+      <div class='container-camera'>
+        <a ngf-select="ctrl.fileSelected($file)"
+            ngf-pattern="'image/*'" ngf-accept="'image/*'"
+            ngf-max-size="20MB"
+            data-toggle="modal" data-target=".crop-dialog" href="#"><i class="fa fa-camera upload-camera" ></i>
+        </a>
+      </div>
+      <div class="overlay"></div>
+    </div>
+  </div>
+</div>
+<span ng-if="!ctrl.isEditable()" class="profile-image-wrap" title="{{ctrl.profile.name}}">
+  <img ng-if="ctrl.profile.image" ng-src="{{ctrl.profile.image.url}}" class="img-responsive profile-image">
+  <i ng-if="!ctrl.profile.image" class="fa {{ctrl.defaultIcon}} fa-5x profile-image"></i>
+</span>
diff --git a/src/app/profile/image/profile-image.scss b/src/app/profile/image/profile-image.scss
new file mode 100644
index 0000000..b3864e6
--- /dev/null
+++ b/src/app/profile/image/profile-image.scss
@@ -0,0 +1,59 @@
+.hovereffect {
+  width:100%;
+  height:100%;
+  float:left;
+  overflow:hidden;
+  position:relative;
+  text-align:center;
+  cursor:default;  
+  .container-camera {
+      position: relative;
+      z-index: 2;
+      .upload-camera{
+        right: 0px;
+        left: 0px;
+        position: absolute;
+        font-size: 1.5em;
+        bottom: 2px;
+        text-shadow: 0px 0px 3px black;
+        color: white;
+        padding-top: 5px;
+        &:hover{
+          font-size: 1.5em;
+          background-color: rgba(0, 0, 0, 0.50);
+        }
+
+      }
+  }
+  .overlay {
+    width:100%;
+    height:100%;
+    position:absolute;
+    overflow:hidden;
+    top:0;
+    left:0;
+    opacity:0;
+    background-color:rgba(0,0,0,0.5);
+    -webkit-transition:all .4s ease-in-out;
+    transition:all .4s ease-in-out;
+    z-index: 1;
+  }
+  img {
+    display:block;
+    position:relative;
+    -webkit-transition:all .4s linear;
+    transition:all .4s linear;
+    width: 100%;
+  }
+  &:hover {
+    img {
+      -ms-transform:scale(1.2);
+      -webkit-transform:scale(1.2);
+      transform:scale(1.2);
+    }
+    .overlay {
+      opacity:1;
+      filter:alpha(opacity=100);
+    }
+  }
+}
--
libgit2 0.21.2