├── Block
    └── Attributes
    │   └── Avatar.php
├── Controller
    └── Avatar
    │   └── View.php
├── Model
    ├── Attribute
    │   └── Backend
    │   │   └── Avatar.php
    └── Source
    │   └── Validation
    │       └── Image.php
├── Plugin
    ├── CustomerData
    │   └── Customer.php
    └── Metadata
    │   └── Form
    │       └── Image.php
├── README.md
├── Setup
    ├── InstallData.php
    └── Uninstall.php
├── Snapshot
    ├── avatar-in-customer-grid.png
    ├── customer-review.png
    ├── header-avatar.png
    ├── image-is-invalid.png
    ├── upload-delete-an-avatar.png
    ├── upload-new-avatar.png
    └── validate-by-js.png
├── Ui
    └── Component
    │   └── Listing
    │       └── Columns
    │           └── Avatar.php
├── composer.json
├── etc
    ├── di.xml
    ├── frontend
    │   ├── routes.xml
    │   └── sections.xml
    └── module.xml
├── registration.php
└── view
    ├── adminhtml
        ├── ui_component
        │   └── customer_listing.xml
        └── web
        │   └── images
        │       └── no-profile-photo.jpg
    └── frontend
        ├── layout
            ├── customer_account_edit.xml
            ├── default.xml
            └── review_product_listajax.xml
        ├── templates
            ├── account
            │   └── customer.phtml
            ├── form
            │   └── edit.phtml
            └── review
            │   └── product
            │       └── view
            │           └── list.phtml
        └── web
            ├── css
                ├── avatar.css
                ├── global-avatar.css
                └── review-item.css
            ├── images
                └── no-profile-photo.jpg
            └── js
                └── avatar-validation.js


/Block/Attributes/Avatar.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | /**
  4 |  * @Author: Ngo Quang Cuong
  5 |  * @Date:   2017-07-02 12:04:38
  6 |  * @Last Modified by:   nquangcuong
  7 |  * @Last Modified time: 2017-07-05 08:17:47
  8 |  * @website: http://giaphugroup.com
  9 |  */
 10 | 
 11 | namespace PHPCuong\CustomerProfilePicture\Block\Attributes;
 12 | 
 13 | use Magento\Framework\View\Element\Template\Context;
 14 | use Magento\Framework\App\Filesystem\DirectoryList;
 15 | use Magento\Customer\Api\CustomerMetadataInterface;
 16 | use Magento\Framework\ObjectManagerInterface;
 17 | 
 18 | class Avatar extends \Magento\Framework\View\Element\Template
 19 | {
 20 |     /**
 21 |      * @var \Magento\Framework\ObjectManagerInterface
 22 |      */
 23 |     protected $objectManager;
 24 | 
 25 |     /**
 26 |      * @var \Magento\Framework\View\Element\AbstractBlock
 27 |      */
 28 |     protected $viewFileUrl;
 29 | 
 30 |     /**
 31 |      * @var \Magento\Customer\Model\Customer
 32 |      */
 33 |     protected $customer;
 34 | 
 35 |     /**
 36 |      *
 37 |      * @param Context $context
 38 |      * @param ObjectManagerInterface $objectManager
 39 |      * @param \Magento\Framework\View\Asset\Repository $viewFileUrl
 40 |      * @param \Magento\Customer\Model\Customer $customer
 41 |      */
 42 |     public function __construct(
 43 |         Context $context,
 44 |         ObjectManagerInterface $objectManager,
 45 |         \Magento\Framework\View\Asset\Repository $viewFileUrl,
 46 |         \Magento\Customer\Model\Customer $customer
 47 |     ) {
 48 |         $this->objectManager = $objectManager;
 49 |         $this->viewFileUrl = $viewFileUrl;
 50 |         $this->customer = $customer;
 51 |         parent::__construct($context);
 52 |     }
 53 | 
 54 |     /**
 55 |      * Check the file is already exist in the path.
 56 |      * @return boolean
 57 |      */
 58 |     public function checkImageFile($file)
 59 |     {
 60 |         $file = base64_decode($file);
 61 |         $filesystem = $this->objectManager->get('Magento\Framework\Filesystem');
 62 |         $directory = $filesystem->getDirectoryRead(DirectoryList::MEDIA);
 63 |         $fileName = CustomerMetadataInterface::ENTITY_TYPE_CUSTOMER . '/' . ltrim($file, '/');
 64 |         $path = $directory->getAbsolutePath($fileName);
 65 |         if (!$directory->isFile($fileName)
 66 |             && !$this->objectManager->get('Magento\MediaStorage\Helper\File\Storage')->processStorageFile($path)
 67 |         ) {
 68 |             return false;
 69 |         }
 70 |         return true;
 71 |     }
 72 | 
 73 |     /**
 74 |      * Get the avatar of the customer is already logged in
 75 |      * @return string
 76 |      */
 77 |     public function getAvatarCurrentCustomer($file)
 78 |     {
 79 |         if ($this->checkImageFile(base64_encode($file)) === true) {
 80 |             return $this->getUrl('viewfile/avatar/view/', ['image' => base64_encode($file)]);
 81 |         }
 82 |         return $this->viewFileUrl->getUrl('PHPCuong_CustomerProfilePicture::images/no-profile-photo.jpg');
 83 |     }
 84 | 
 85 |     /**
 86 |      * Get the avatar of the customer by the customer id
 87 |      * @return string
 88 |      */
 89 |     public function getCustomerAvatarById($customer_id = false)
 90 |     {
 91 |         if ($customer_id) {
 92 |             $customerDetail = $this->customer->load($customer_id);
 93 |             if ($customerDetail && !empty($customerDetail->getProfilePicture())) {
 94 |                 if ($this->checkImageFile(base64_encode($customerDetail->getProfilePicture())) === true) {
 95 |                     return $this->getUrl('viewfile/avatar/view/', ['image' => base64_encode($customerDetail->getProfilePicture())]);
 96 |                 }
 97 |             }
 98 |         }
 99 |         return $this->viewFileUrl->getUrl('PHPCuong_CustomerProfilePicture::images/no-profile-photo.jpg');
100 |     }
101 | }
102 | 


--------------------------------------------------------------------------------
/Controller/Avatar/View.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | /**
  4 |  * @Author: Ngo Quang Cuong
  5 |  * @Date:   2017-07-03 15:18:20
  6 |  * @Last Modified by:   nquangcuong
  7 |  * @Last Modified time: 2017-07-05 08:23:06
  8 |  * @website: http://giaphugroup.com
  9 |  */
 10 | 
 11 | namespace PHPCuong\CustomerProfilePicture\Controller\Avatar;
 12 | 
 13 | use Magento\Framework\App\Filesystem\DirectoryList;
 14 | use Magento\Customer\Api\CustomerMetadataInterface;
 15 | use Magento\Framework\Exception\NotFoundException;
 16 | 
 17 | class View extends \Magento\Framework\App\Action\Action
 18 | {
 19 |     /**
 20 |      * @var \Magento\Framework\Controller\Result\RawFactory
 21 |      */
 22 |     protected $resultRawFactory;
 23 | 
 24 |     /**
 25 |      * @var \Magento\Framework\Url\DecoderInterface
 26 |      */
 27 |     protected $urlDecoder;
 28 | 
 29 |     /**
 30 |      * @var \Magento\Framework\App\Response\Http\FileFactory
 31 |      */
 32 |     protected $fileFactory;
 33 | 
 34 |     /**
 35 |      * @param \Magento\Framework\App\Action\Context $context
 36 |      * @param \Magento\Framework\View\Result\PageFactory $resultPageFactory
 37 |      * @param \Magento\Framework\Url\DecoderInterface $urlDecoder
 38 |      * @param \Magento\Framework\App\Response\Http\FileFactory $fileFactory
 39 |      */
 40 |     public function __construct(
 41 |         \Magento\Framework\App\Action\Context $context,
 42 |         \Magento\Framework\Controller\Result\RawFactory $resultRawFactory,
 43 |         \Magento\Framework\Url\DecoderInterface $urlDecoder,
 44 |         \Magento\Framework\App\Response\Http\FileFactory $fileFactory
 45 |     ) {
 46 |         $this->resultRawFactory    = $resultRawFactory;
 47 |         $this->urlDecoder  = $urlDecoder;
 48 |         $this->fileFactory = $fileFactory;
 49 |         return parent::__construct($context);
 50 |     }
 51 | 
 52 |     /**
 53 |      * View action
 54 |      *
 55 |      * @return \Magento\Framework\View\Result\PageFactory
 56 |      * @SuppressWarnings(PHPMD.NPathComplexity)
 57 |      */
 58 |     public function execute()
 59 |     {
 60 |         $file = null;
 61 |         $plain = false;
 62 |         if ($this->getRequest()->getParam('file')) {
 63 |             // download file
 64 |             $file = $this->urlDecoder->decode(
 65 |                 $this->getRequest()->getParam('file')
 66 |             );
 67 |         } elseif ($this->getRequest()->getParam('image')) {
 68 |             // show plain image
 69 |             $file = $this->urlDecoder->decode(
 70 |                 $this->getRequest()->getParam('image')
 71 |             );
 72 |             $plain = true;
 73 |         } else {
 74 |             throw new NotFoundException(__('Page not found.'));
 75 |         }
 76 | 
 77 |         /** @var \Magento\Framework\Filesystem $filesystem */
 78 |         $filesystem = $this->_objectManager->get('Magento\Framework\Filesystem');
 79 |         $directory = $filesystem->getDirectoryRead(DirectoryList::MEDIA);
 80 |         $fileName = CustomerMetadataInterface::ENTITY_TYPE_CUSTOMER . '/' . ltrim($file, '/');
 81 |         $path = $directory->getAbsolutePath($fileName);
 82 | 
 83 |         if (!$directory->isFile($fileName)
 84 |             && !$this->_objectManager->get('Magento\MediaStorage\Helper\File\Storage')->processStorageFile($path)
 85 |         ) {
 86 |             throw new NotFoundException(__('Page not found.'));
 87 |         }
 88 | 
 89 |         if ($plain) {
 90 |             $extension = pathinfo($path, PATHINFO_EXTENSION);
 91 |             switch (strtolower($extension)) {
 92 |                 case 'gif':
 93 |                     $contentType = 'image/gif';
 94 |                     break;
 95 |                 case 'jpg':
 96 |                     $contentType = 'image/jpeg';
 97 |                     break;
 98 |                 case 'png':
 99 |                     $contentType = 'image/png';
100 |                     break;
101 |                 default:
102 |                     $contentType = 'application/octet-stream';
103 |                     break;
104 |             }
105 |             $stat = $directory->stat($fileName);
106 |             $contentLength = $stat['size'];
107 |             $contentModify = $stat['mtime'];
108 | 
109 |             /** @var \Magento\Framework\Controller\Result\Raw $resultRaw */
110 |             $resultRaw = $this->resultRawFactory->create();
111 |             $resultRaw->setHttpResponseCode(200)
112 |                 ->setHeader('Pragma', 'public', true)
113 |                 ->setHeader('Content-type', $contentType, true)
114 |                 ->setHeader('Content-Length', $contentLength)
115 |                 ->setHeader('Last-Modified', date('r', $contentModify));
116 |             $resultRaw->setContents($directory->readFile($fileName));
117 |             return $resultRaw;
118 |         } else {
119 |             $name = pathinfo($path, PATHINFO_BASENAME);
120 |             $this->fileFactory->create(
121 |                 $name,
122 |                 ['type' => 'filename', 'value' => $fileName],
123 |                 DirectoryList::MEDIA
124 |             );
125 |         }
126 |     }
127 | }
128 | 


--------------------------------------------------------------------------------
/Model/Attribute/Backend/Avatar.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-03 08:33:28
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 08:30:51
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Model\Attribute\Backend;
12 | 
13 | use \PHPCuong\CustomerProfilePicture\Model\Source\Validation\Image;
14 | 
15 | class Avatar extends \Magento\Eav\Model\Entity\Attribute\Backend\AbstractBackend
16 | {
17 |     /**
18 |      * @param \Magento\Framework\DataObject $object
19 |      *
20 |      * @return $this
21 |      */
22 |     public function beforeSave($object)
23 |     {
24 |         $validation = new Image();
25 |         $attrCode = $this->getAttribute()->getAttributeCode();
26 |         if ($attrCode == 'profile_picture') {
27 |             if ($validation->isImageValid('tmpp_name', $attrCode) === false) {
28 |                 throw new \Magento\Framework\Exception\LocalizedException(
29 |                     __('The profile picture is not a valid image.')
30 |                 );
31 |             }
32 |         }
33 | 
34 |         return parent::beforeSave($object);
35 |     }
36 | }
37 | 


--------------------------------------------------------------------------------
/Model/Source/Validation/Image.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-03 14:09:36
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 08:32:11
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Model\Source\Validation;
12 | 
13 | class Image
14 | {
15 |     /**
16 |      * Check the image file
17 |      * @param $tmp_name, $attrCode
18 |      * @return bool
19 |      */
20 |     public function isImageValid($tmp_name, $attrCode)
21 |     {
22 |         if ($attrCode == 'profile_picture') {
23 |             if (!empty($_FILES[$attrCode][$tmp_name])) {
24 |                 $imageFile = @getimagesize($_FILES[$attrCode][$tmp_name]);
25 |                 if ($imageFile === false) {
26 |                     return false;
27 |                 } else {
28 |                     $valid_types = ['image/gif', 'image/jpeg', 'image/png'];
29 |                     if (!in_array($imageFile['mime'], $valid_types)) {
30 |                         return false;
31 |                     }
32 |                 }
33 |                 return true;
34 |             }
35 |         }
36 |         return true;
37 |     }
38 | }
39 | 


--------------------------------------------------------------------------------
/Plugin/CustomerData/Customer.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-04 18:41:56
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 09:04:11
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Plugin\CustomerData;
12 | 
13 | 
14 | use Magento\Customer\Helper\Session\CurrentCustomer;
15 | use Magento\Customer\Helper\View;
16 | use PHPCuong\CustomerProfilePicture\Block\Attributes\Avatar;
17 | 
18 | class Customer
19 | {
20 |     /**
21 |      * @var CurrentCustomer
22 |      */
23 |     protected $currentCustomer;
24 | 
25 |     /**
26 |      * @var View
27 |      */
28 |     protected $customerViewHelper;
29 | 
30 |     /**
31 |      * @var Avatar
32 |      */
33 |     protected $customerAvatar;
34 | 
35 |     /**
36 |      * @param CurrentCustomer $currentCustomer
37 |      * @param View $customerViewHelper
38 |      * @param Avatar $customerAvatar
39 |      */
40 |     public function __construct(
41 |         CurrentCustomer $currentCustomer,
42 |         View $customerViewHelper,
43 |         Avatar $customerAvatar
44 |     ) {
45 |         $this->currentCustomer = $currentCustomer;
46 |         $this->customerViewHelper = $customerViewHelper;
47 |         $this->customerAvatar = $customerAvatar;
48 |     }
49 | 
50 |     /**
51 |      * {@inheritdoc}
52 |      */
53 |     public function afterGetSectionData()
54 |     {
55 |         if (!$this->currentCustomer->getCustomerId()) {
56 |             return [];
57 |         }
58 |         $customer = $this->currentCustomer->getCustomer();
59 |         if (!empty($customer->getCustomAttribute('profile_picture'))) {
60 |             $file = $customer->getCustomAttribute('profile_picture')->getValue();
61 |         } else {
62 |             $file = '';
63 |         }
64 |         return [
65 |             'fullname' => $this->customerViewHelper->getCustomerName($customer),
66 |             'firstname' => $customer->getFirstname(),
67 |             'avatar' => $this->customerAvatar->getAvatarCurrentCustomer($file)
68 |         ];
69 |     }
70 | }
71 | 


--------------------------------------------------------------------------------
/Plugin/Metadata/Form/Image.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-03 11:15:40
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 08:33:08
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Plugin\Metadata\Form;
12 | 
13 | class Image
14 | {
15 |     protected $validImage;
16 | 
17 |     public function __construct(
18 |         \PHPCuong\CustomerProfilePicture\Model\Source\Validation\Image $validImage
19 |     ) {
20 |         $this->validImage = $validImage;
21 |     }
22 | 
23 |     /**
24 |      * {@inheritdoc}
25 |      *
26 |      * @return ImageContentInterface|array|string|null
27 |      */
28 |     public function beforeExtractValue(\Magento\Customer\Model\Metadata\Form\Image $subject, $value)
29 |     {
30 |         $attrCode = $subject->getAttribute()->getAttributeCode();
31 | 
32 |         if ($this->validImage->isImageValid('tmp_name', $attrCode) === false) {
33 |             $_FILES[$attrCode]['tmpp_name'] = $_FILES[$attrCode]['tmp_name'];
34 |             unset($_FILES[$attrCode]['tmp_name']);
35 |         }
36 | 
37 |         return [];
38 |     }
39 | }
40 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # You can get the professional version of this extension here (No issues and is supported free)
 2 | https://www.giaphugroup.com/magento-2-customer-avatar-extension.html
 3 | 
 4 | # How to add the profile picture for a customer in Magento 2
 5 | This is an awesome module, it allows the customers the opportunity to personalize their account by uploading an avatar.
 6 | 
 7 | Please donate if you enjoy my extension.
 8 | 
 9 | [![](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=CR756BABGNDC4)
10 | 
11 | ## See the video How this extension can work here
12 | https://www.youtube.com/watch?v=3Tt82EvXLLA&list=PL98CDCbI3TNvPczWSOnpaMoyxVISLVzYQ&index=96
13 | 
14 | ## The features of this extension:
15 | ### Frontend:
16 | - The customer can upload a new avatar.
17 | - The avatar can be displayed in the header of the website.
18 | - The avatar can be displayed in the reviews list.
19 | 
20 | ### Backend:
21 | - Display the avatar of the customer in the customer's grid of Magento Admin.
22 | - Upload a new avatar or delete an avatar of the customer.
23 | 
24 | ## Introduction installation:
25 | 
26 | ### 1 - Using Composer
27 | 
28 | ```
29 | composer require php-cuong/magento2-customer-avatar:dev-master
30 | 
31 | ```
32 | 
33 | ### 2- Enable the Customer Avatar extension
34 |  * php bin/magento setup:upgrade
35 |  * php bin/magento setup:static-content:deploy
36 |  * php bin/magento indexer:reindex
37 |  * php bin/magento cache:flush
38 | 
39 | ### 3 - See results
40 | #### Frontend
41 | Log into your customer account, go to Edit Account Information
42 | 
43 | ##### The avatar in the header
44 | 
45 | ![ScreenShot](https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/master/Snapshot/header-avatar.png)
46 | 
47 | ##### The avatar in the edit account information
48 | 
49 | ![ScreenShot](https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/master/Snapshot/upload-new-avatar.png)
50 | 
51 | ##### The avatar in the reviews list
52 | 
53 | ![ScreenShot](https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/master/Snapshot/customer-review.png)
54 | 
55 | #### Backend
56 | Log into your Magento admin, go to Customers -> All Customers
57 | 
58 | ##### The avatar in the customer's grid of Magento Admin
59 | 
60 | ![ScreenShot](https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/master/Snapshot/avatar-in-customer-grid.png)
61 | 
62 | ##### Upload a new avatar or delete an avatar of the customer
63 | 
64 | ![ScreenShot](https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/master/Snapshot/upload-delete-an-avatar.png)
65 | 
66 | ## Donations
67 | Please donate if you enjoy my extension.
68 | 
69 | [![](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=CR756BABGNDC4)
70 | 
71 | 
72 | 


--------------------------------------------------------------------------------
/Setup/InstallData.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-01 08:12:19
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 12:08:28
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Setup;
12 | 
13 | use Magento\Customer\Setup\CustomerSetupFactory;
14 | use Magento\Customer\Model\Customer;
15 | use Magento\Eav\Model\Entity\Attribute\Set as AttributeSet;
16 | use Magento\Eav\Model\Entity\Attribute\SetFactory as AttributeSetFactory;
17 | use Magento\Framework\Setup\InstallDataInterface;
18 | use Magento\Framework\Setup\ModuleContextInterface;
19 | use Magento\Framework\Setup\ModuleDataSetupInterface;
20 | 
21 | /**
22 |  * @codeCoverageIgnore
23 |  */
24 | class InstallData implements InstallDataInterface
25 | {
26 | 
27 |     /**
28 |      * @var CustomerSetupFactory
29 |      */
30 |     protected $customerSetupFactory;
31 | 
32 |     /**
33 |      * @var AttributeSetFactory
34 |      */
35 |     private $attributeSetFactory;
36 | 
37 |     /**
38 |      * @param CustomerSetupFactory $customerSetupFactory
39 |      * @param AttributeSetFactory $attributeSetFactory
40 |      */
41 |     public function __construct(
42 |         CustomerSetupFactory $customerSetupFactory,
43 |         AttributeSetFactory $attributeSetFactory
44 |     ) {
45 |         $this->customerSetupFactory = $customerSetupFactory;
46 |         $this->attributeSetFactory = $attributeSetFactory;
47 |     }
48 | 
49 | 
50 |     /**
51 |      * {@inheritdoc}
52 |      */
53 |     public function install(ModuleDataSetupInterface $setup, ModuleContextInterface $context)
54 |     {
55 | 
56 |         /** @var CustomerSetup $customerSetup */
57 |         $customerSetup = $this->customerSetupFactory->create(['setup' => $setup]);
58 | 
59 |         $customerEntity = $customerSetup->getEavConfig()->getEntityType('customer');
60 |         $attributeSetId = $customerEntity->getDefaultAttributeSetId();
61 | 
62 |         /** @var $attributeSet AttributeSet */
63 |         $attributeSet = $this->attributeSetFactory->create();
64 |         $attributeGroupId = $attributeSet->getDefaultGroupId($attributeSetId);
65 | 
66 |         $customerSetup->addAttribute(Customer::ENTITY, 'profile_picture', [
67 |             'type' => 'varchar',
68 |             'label' => 'Profile Picture',
69 |             'input' => 'image',
70 |             'backend' => 'PHPCuong\CustomerProfilePicture\Model\Attribute\Backend\Avatar',
71 |             'required' => false,
72 |             'visible' => true,
73 |             'user_defined' => true,
74 |             'sort_order' => 10,
75 |             'position' => 10,
76 |             'system' => 0,
77 |             'is_used_in_grid' => true,
78 |             'is_visible_in_grid' => true,
79 |             'is_html_allowed_on_front' => true,
80 |             'visible_on_front' => true
81 |         ]);
82 | 
83 |         $attribute = $customerSetup->getEavConfig()->getAttribute(Customer::ENTITY, 'profile_picture')
84 |         ->addData([
85 |             'attribute_set_id' => $attributeSetId,
86 |             'attribute_group_id' => $attributeGroupId,
87 |             'used_in_forms' => ['adminhtml_customer', 'customer_account_edit'],
88 |         ]);
89 | 
90 |         $attribute->save();
91 |     }
92 | }
93 | 


--------------------------------------------------------------------------------
/Setup/Uninstall.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-04 22:42:27
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 14:30:41
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Setup;
12 | 
13 | use Magento\Framework\Setup\UninstallInterface;
14 | use Magento\Framework\Setup\SchemaSetupInterface;
15 | use Magento\Framework\Setup\ModuleContextInterface;
16 | 
17 | class Uninstall implements UninstallInterface
18 | {
19 |     /**
20 |      * Eav setup factory
21 |      * @var EavSetupFactory
22 |      */
23 |     private $eavSetupFactory;
24 | 
25 |     /**
26 |      * Init
27 |      * @param CategorySetupFactory $categorySetupFactory
28 |      */
29 |     public function __construct(\Magento\Eav\Setup\EavSetupFactory $eavSetupFactory)
30 |     {
31 |         $this->eavSetupFactory = $eavSetupFactory;
32 |     }
33 | 
34 |     /**
35 |      * {@inheritdoc}
36 |      * @SuppressWarnings(PHPMD.CyclomaticComplexity)
37 |      * @SuppressWarnings(PHPMD.ExcessiveMethodLength)
38 |      * @SuppressWarnings(PHPMD.NPathComplexity)
39 |      */
40 |     public function uninstall(SchemaSetupInterface $setup, ModuleContextInterface $context)
41 |     {
42 |         $setup->startSetup();
43 |         $eavSetup = $this->eavSetupFactory->create();
44 |         $eavSetup->removeAttribute(
45 |             \Magento\Customer\Model\Customer::ENTITY,
46 |             'profile_picture'
47 |         );
48 |         $setup->endSetup();
49 |     }
50 | }
51 | 


--------------------------------------------------------------------------------
/Snapshot/avatar-in-customer-grid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/avatar-in-customer-grid.png


--------------------------------------------------------------------------------
/Snapshot/customer-review.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/customer-review.png


--------------------------------------------------------------------------------
/Snapshot/header-avatar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/header-avatar.png


--------------------------------------------------------------------------------
/Snapshot/image-is-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/image-is-invalid.png


--------------------------------------------------------------------------------
/Snapshot/upload-delete-an-avatar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/upload-delete-an-avatar.png


--------------------------------------------------------------------------------
/Snapshot/upload-new-avatar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/upload-new-avatar.png


--------------------------------------------------------------------------------
/Snapshot/validate-by-js.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/Snapshot/validate-by-js.png


--------------------------------------------------------------------------------
/Ui/Component/Listing/Columns/Avatar.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-01 13:23:24
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-05 10:13:17
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | namespace PHPCuong\CustomerProfilePicture\Ui\Component\Listing\Columns;
12 | 
13 | use Magento\Framework\View\Element\UiComponentFactory;
14 | use Magento\Framework\View\Element\UiComponent\ContextInterface;
15 | 
16 | class Avatar extends \Magento\Ui\Component\Listing\Columns\Column
17 | {
18 |     /**
19 |      * @var \Magento\Framework\View\Element\AbstractBlock
20 |      */
21 |     protected $viewFileUrl;
22 | 
23 |     /**
24 |      * @param ContextInterface $context
25 |      * @param UiComponentFactory $uiComponentFactory
26 |      * @param \Magento\Catalog\Helper\Image $imageHelper
27 |      * @param \Magento\Framework\UrlInterface $urlBuilder
28 |      * @param array $components
29 |      * @param array $data
30 |      */
31 |     public function __construct(
32 |         ContextInterface $context,
33 |         UiComponentFactory $uiComponentFactory,
34 |         \Magento\Framework\UrlInterface $urlBuilder,
35 |         \Magento\Framework\View\Asset\Repository $viewFileUrl,
36 |         array $components = [],
37 |         array $data = []
38 |     ) {
39 |         parent::__construct($context, $uiComponentFactory, $components, $data);
40 |         $this->urlBuilder = $urlBuilder;
41 |         $this->viewFileUrl = $viewFileUrl;
42 |     }
43 | 
44 |     /**
45 |      * Prepare Data Source
46 |      *
47 |      * @param array $dataSource
48 |      * @return array
49 |      */
50 |     public function prepareDataSource(array $dataSource)
51 |     {
52 |         if (isset($dataSource['data']['items'])) {
53 |             $fieldName = $this->getData('name');
54 |             foreach ($dataSource['data']['items'] as & $item) {
55 |                 $customer = new \Magento\Framework\DataObject($item);
56 |                 $picture_url = !empty($customer["profile_picture"]) ? $this->urlBuilder->getUrl(
57 |                     'customer/index/viewfile/image/'.base64_encode($customer["profile_picture"])) : $this->viewFileUrl->getUrl('PHPCuong_CustomerProfilePicture::images/no-profile-photo.jpg');
58 |                 $item[$fieldName . '_src'] = $picture_url;
59 |                 $item[$fieldName . '_orig_src'] = $picture_url;
60 |                 $item[$fieldName . '_alt'] = 'The profile picture';
61 |             }
62 |         }
63 | 
64 |         return $dataSource;
65 |     }
66 | }
67 | 


--------------------------------------------------------------------------------
/composer.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "php-cuong/magento2-customer-avatar",
 3 |     "description":"Magento 2 Customer Avatar",
 4 |     "keywords": [
 5 |         "magento 2",
 6 |         "Avatar",
 7 |         "Profile picture",
 8 |         "Customer Avatar",
 9 |         "Customer Profile Picture",
10 |         "Magento 2 Customer Avatar",
11 |         "Magento 2 Customer Profile Picture"
12 |     ],
13 |     "require": {
14 |         "php": "~5.6.0|7.0.2|~7.0.6",
15 |         "magento/module-backend": "100.0.*|100.1.*",
16 |         "magento/framework": "100.0.*|100.1.*"
17 |     },
18 |     "type": "magento2-module",
19 |     "version": "2.1.0",
20 |     "license": [
21 |         "OSL-3.0",
22 |         "AFL-3.0"
23 |     ],
24 |     "authors": [
25 |         {
26 |             "name": "Cuong NQ",
27 |             "email": "bestearnmoney87@gmail.com",
28 |             "role": "Developer"
29 |         }
30 |     ],
31 |     "autoload": {
32 |         "files": [
33 |             "registration.php"
34 |         ],
35 |         "psr-4": {
36 |             "PHPCuong\\CustomerProfilePicture\\": ""
37 |         }
38 |     }
39 | }
40 | 


--------------------------------------------------------------------------------
/etc/di.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
 3 |     <type name="Magento\Customer\Model\Metadata\Form\Image">
 4 |         <plugin name="Validate_Image" type="PHPCuong\CustomerProfilePicture\Plugin\Metadata\Form\Image" sortOrder="1"/>
 5 |     </type>
 6 |     <type name="Magento\Customer\CustomerData\Customer">
 7 |         <plugin name="customerData" type="PHPCuong\CustomerProfilePicture\Plugin\CustomerData\Customer" sortOrder="1"/>
 8 |     </type>
 9 | </config>
10 | 


--------------------------------------------------------------------------------
/etc/frontend/routes.xml:
--------------------------------------------------------------------------------
1 | <?xml version="1.0"?>
2 | <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
3 |     <router id="standard">
4 |         <route id="viewfile" frontName="viewfile">
5 |             <module name="PHPCuong_CustomerProfilePicture" />
6 |         </route>
7 |     </router>
8 | </config>
9 | 


--------------------------------------------------------------------------------
/etc/frontend/sections.xml:
--------------------------------------------------------------------------------
1 | <?xml version="1.0"?>
2 | <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
3 |     <action name="customer/account/editPost">
4 |         <section name="customer"/>
5 |     </action>
6 | </config>
7 | 


--------------------------------------------------------------------------------
/etc/module.xml:
--------------------------------------------------------------------------------
1 | <?xml version="1.0"?>
2 | <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd">
3 |     <module name="PHPCuong_CustomerProfilePicture" setup_version="2.1.0">
4 |         <sequence>
5 |             <module name="Magento_Customer"/>
6 |         </sequence>
7 |     </module>
8 | </config>
9 | 


--------------------------------------------------------------------------------
/registration.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * @Author: Ngo Quang Cuong
 5 |  * @Date:   2017-07-01 08:11:10
 6 |  * @Last Modified by:   nquangcuong
 7 |  * @Last Modified time: 2017-07-04 22:54:39
 8 |  * @website: http://giaphugroup.com
 9 |  */
10 | 
11 | \Magento\Framework\Component\ComponentRegistrar::register(
12 |     \Magento\Framework\Component\ComponentRegistrar::MODULE,
13 |     'PHPCuong_CustomerProfilePicture',
14 |     __DIR__
15 | );
16 | 


--------------------------------------------------------------------------------
/view/adminhtml/ui_component/customer_listing.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8"?>
 2 | <!--
 3 | /**
 4 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 5 |  * See COPYING.txt for license details.
 6 |  */
 7 | -->
 8 | <listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
 9 |     <columns name="customer_columns" class="Magento\Customer\Ui\Component\Listing\Columns">
10 |         <column name="profile_picture" class="PHPCuong\CustomerProfilePicture\Ui\Component\Listing\Columns\Avatar">
11 |             <argument name="data" xsi:type="array">
12 |                 <item name="config" xsi:type="array">
13 |                     <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/thumbnail</item>
14 |                     <item name="sortable" xsi:type="boolean">false</item>
15 |                     <item name="has_preview" xsi:type="string">1</item>
16 |                     <item name="label" xsi:type="string" translate="true">Avatar</item>
17 |                     <item name="sortOrder" xsi:type="number">1</item>
18 |                 </item>
19 |             </argument>
20 |         </column>
21 |     </columns>
22 | </listing>
23 | 


--------------------------------------------------------------------------------
/view/adminhtml/web/images/no-profile-photo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/view/adminhtml/web/images/no-profile-photo.jpg


--------------------------------------------------------------------------------
/view/frontend/layout/customer_account_edit.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <!--
 3 | /**
 4 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 5 |  * See COPYING.txt for license details.
 6 |  */
 7 | -->
 8 | <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 9 |     <head>
10 |         <css src="PHPCuong_CustomerProfilePicture::css/avatar.css"/>
11 |         <script src="PHPCuong_CustomerProfilePicture::js/avatar-validation.js"/>
12 |     </head>
13 |     <body>
14 |         <referenceContainer name="content">
15 |             <block class="Magento\Customer\Block\Form\Edit" name="customer_edit" template="PHPCuong_CustomerProfilePicture::form/edit.phtml" cacheable="false">
16 |                 <container name="form.additional.info" as="form_additional_info"/>
17 |             </block>
18 |         </referenceContainer>
19 |     </body>
20 | </page>
21 | 


--------------------------------------------------------------------------------
/view/frontend/layout/default.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <!--
 3 | /**
 4 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 5 |  * See COPYING.txt for license details.
 6 |  */
 7 | -->
 8 | <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 9 |     <head>
10 |         <css src="PHPCuong_CustomerProfilePicture::css/global-avatar.css"/>
11 |         <css src="PHPCuong_CustomerProfilePicture::css/review-item.css"/>
12 |     </head>
13 |     <body>
14 |         <referenceBlock name="customer">
15 |             <action method='setTemplate'>
16 |                 <argument name='template' xsi:type='string'>PHPCuong_CustomerProfilePicture::account/customer.phtml</argument>
17 |             </action>
18 |         </referenceBlock>
19 |     </body>
20 | </page>
21 | 


--------------------------------------------------------------------------------
/view/frontend/layout/review_product_listajax.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <!--
 3 | /**
 4 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 5 |  * See COPYING.txt for license details.
 6 |  */
 7 | -->
 8 | <layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/layout_generic.xsd">
 9 |     <container name="root">
10 |         <block class="Magento\Review\Block\Product\View\ListView" name="product.info.product_additional_data" as="product_additional_data" template="PHPCuong_CustomerProfilePicture::review/product/view/list.phtml" />
11 |         <block class="Magento\Theme\Block\Html\Pager" name="product_review_list.toolbar">
12 |             <arguments>
13 |                 <argument name="show_per_page" xsi:type="boolean">false</argument>
14 |                 <argument name="show_amounts" xsi:type="boolean">false</argument>
15 |             </arguments>
16 |         </block>
17 |     </container>
18 | </layout>
19 | 
20 | 


--------------------------------------------------------------------------------
/view/frontend/templates/account/customer.phtml:
--------------------------------------------------------------------------------
 1 | <?php
 2 | /**
 3 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 4 |  * See COPYING.txt for license details.
 5 |  */
 6 | 
 7 | // @codingStandardsIgnoreFile
 8 | 
 9 | ?>
10 | <?php if($block->customerLoggedIn()): ?>
11 |     <li class="customer-welcome">
12 |         <span class="customer-name"
13 |               role="link"
14 |               tabindex="0"
15 |               data-mage-init='{"dropdown":{}}'
16 |               data-toggle="dropdown"
17 |               data-trigger-keypress-button="true"
18 |               data-bind="scope: 'customer'">
19 |             <img data-bind="attr:{src: customer().avatar}" width="30px" height="25px" class="avatar-header-links action switch" data-action="customer-menu-toggle" tabindex="-1"/>
20 |         </span>
21 |         <script type="text/x-magento-init">
22 |         {
23 |             "*": {
24 |                 "Magento_Ui/js/core/app": {
25 |                     "components": {
26 |                         "customer": {
27 |                             "component": "Magento_Customer/js/view/customer"
28 |                         }
29 |                     }
30 |                 }
31 |             }
32 |         }
33 |         </script>
34 |         <?php if($block->getChildHtml()):?>
35 |             <div class="customer-menu" data-target="dropdown">
36 |                 <?php echo $block->getChildHtml();?>
37 |             </div>
38 |         <?php endif; ?>
39 |     </li>
40 | <?php endif; ?>
41 | 


--------------------------------------------------------------------------------
/view/frontend/templates/form/edit.phtml:
--------------------------------------------------------------------------------
  1 | <?php
  2 | /**
  3 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
  4 |  * See COPYING.txt for license details.
  5 |  */
  6 | 
  7 | // @codingStandardsIgnoreFile
  8 | 
  9 | /** @var \Magento\Customer\Block\Form\Edit $block */
 10 | ?>
 11 | <form class="form form-edit-account" action="<?php /* @escapeNotVerified */ echo $block->getUrl('customer/account/editPost') ?>" method="post" id="form-validate" enctype="multipart/form-data" data-hasrequired="<?php /* @escapeNotVerified */ echo __('* Required Fields') ?>" autocomplete="off">
 12 |     <fieldset class="fieldset info">
 13 |         <?php echo $block->getBlockHtml('formkey')?>
 14 |         <legend class="legend"><span><?php /* @escapeNotVerified */ echo __('Account Information') ?></span></legend><br>
 15 |         <?php echo $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Name')->setObject($block->getCustomer())->toHtml() ?>
 16 |         <div class="field field-name-avatar">
 17 |             <?php $avatarFile = !empty($block->getCustomer()->getCustomAttribute('profile_picture')) ? $block->getLayout()->createBlock('\PHPCuong\CustomerProfilePicture\Block\Attributes\Avatar')->checkImageFile(base64_encode($block->getCustomer()->getCustomAttribute('profile_picture')->getValue())) : false; ?>
 18 |             <?php $avatar = ($avatarFile) ? $block->getUrl('viewfile/avatar/view/', ['image' => base64_encode($block->getCustomer()->getCustomAttribute('profile_picture')->getValue())]) : $block->getViewFileUrl('PHPCuong_CustomerProfilePicture::images/no-profile-photo.jpg');?>
 19 |             <label class="label" for="profile_picture">
 20 |                 <span class="avatar-title"><?php echo __('Profile Picture');?></span>
 21 |                 <img src="<?php echo $avatar; ?>" width="150px" height="150px" alt="profile-picture" title="<?php echo __('Upload new avatar'); ?>" class="profile-image"/>
 22 |             </label>
 23 |             <div class="control">
 24 |                 <label for="profile_picture" class="avatar-file-upload">
 25 |                     <?php echo __('Upload new avatar'); ?>
 26 |                 </label>
 27 |                 <input type="file" id="profile_picture" name="profile_picture" value="" title="Your avatar" class="avatar validate-image" />
 28 |             </div>
 29 |         </div>
 30 |         <?php $_dob = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Dob') ?>
 31 |         <?php $_taxvat = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Taxvat') ?>
 32 |         <?php $_gender = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Gender') ?>
 33 |         <?php if ($_dob->isEnabled()): ?>
 34 |             <?php echo $_dob->setDate($block->getCustomer()->getDob())->toHtml() ?>
 35 |         <?php endif ?>
 36 |         <?php if ($_taxvat->isEnabled()): ?>
 37 |             <?php echo $_taxvat->setTaxvat($block->getCustomer()->getTaxvat())->toHtml() ?>
 38 |         <?php endif ?>
 39 |         <?php if ($_gender->isEnabled()): ?>
 40 |             <?php echo $_gender->setGender($block->getCustomer()->getGender())->toHtml() ?>
 41 |         <?php endif ?>
 42 |         <div class="field choice">
 43 |             <input type="checkbox" name="change_email" id="change-email" data-role="change-email" value="1" title="<?php /* @escapeNotVerified */ echo __('Change Email') ?>" class="checkbox" />
 44 |             <label class="label" for="change-email"><span><?php /* @escapeNotVerified */ echo __('Change Email') ?></span></label>
 45 |         </div>
 46 |         <div class="field choice">
 47 |             <input type="checkbox" name="change_password" id="change-password" data-role="change-password" value="1" title="<?php /* @escapeNotVerified */ echo __('Change Password') ?>"<?php if ($block->getChangePassword()): ?> checked="checked"<?php endif; ?> class="checkbox" />
 48 |             <label class="label" for="change-password"><span><?php /* @escapeNotVerified */ echo __('Change Password') ?></span></label>
 49 |         </div>
 50 |     </fieldset>
 51 | 
 52 |     <fieldset class="fieldset password" data-container="change-email-password">
 53 |         <legend class="legend"><span data-title="change-email-password"><?php /* @escapeNotVerified */ echo __('Change Email and Password') ?></span></legend><br>
 54 |         <div class="field email required" data-container="change-email">
 55 |             <label class="label" for="email"><span><?php /* @escapeNotVerified */ echo __('Email') ?></span></label>
 56 |             <div class="control">
 57 |                 <input type="email" name="email" id="email" autocomplete="email" data-input="change-email" value="<?php echo $block->escapeHtml($block->getCustomer()->getEmail()) ?>" title="<?php /* @escapeNotVerified */ echo __('Email') ?>" class="input-text" data-validate="{required:true, 'validate-email':true}" />
 58 |             </div>
 59 |         </div>
 60 |         <div class="field password current required">
 61 |             <label class="label" for="current-password"><span><?php /* @escapeNotVerified */ echo __('Current Password') ?></span></label>
 62 |             <div class="control">
 63 |                 <input type="password" class="input-text" name="current_password" id="current-password" data-input="current-password" autocomplete="off" />
 64 |             </div>
 65 |         </div>
 66 |         <div class="field new password required" data-container="new-password" data-mage-init='{"passwordStrengthIndicator": {}}'>
 67 |             <label class="label" for="password"><span><?php /* @escapeNotVerified */ echo __('New Password') ?></span></label>
 68 |             <div class="control">
 69 |                 <input type="password" class="input-text" name="password" id="password"
 70 |                     data-password-min-length="<?php echo $block->escapeHtml($block->getMinimumPasswordLength()) ?>"
 71 |                     data-password-min-character-sets="<?php echo $block->escapeHtml($block->getRequiredCharacterClassesNumber()) ?>"
 72 |                     data-input="new-password"
 73 |                     data-validate="{required:true, 'validate-customer-password':true}"
 74 |                     autocomplete="off" />
 75 |                 <div id="password-strength-meter-container" data-role="password-strength-meter" >
 76 |                     <div id="password-strength-meter" class="password-strength-meter">
 77 |                         <?php /* @escapeNotVerified */ echo __('Password Strength'); ?>:
 78 |                         <span id="password-strength-meter-label" data-role="password-strength-meter-label" >
 79 |                             <?php /* @escapeNotVerified */ echo __('No Password'); ?>
 80 |                         </span>
 81 |                     </div>
 82 |                 </div>
 83 |             </div>
 84 |         </div>
 85 |         <div class="field confirm password required" data-container="confirm-password">
 86 |             <label class="label" for="password-confirmation"><span><?php /* @escapeNotVerified */ echo __('Confirm New Password') ?></span></label>
 87 |             <div class="control">
 88 |                 <input type="password" class="input-text" name="password_confirmation" id="password-confirmation"
 89 |                     data-input="confirm-password"
 90 |                     autocomplete="off" />
 91 |             </div>
 92 |         </div>
 93 |         <?php echo $block->getChildHtml('form_additional_info'); ?>
 94 |     </fieldset>
 95 |     <div class="actions-toolbar">
 96 |         <div class="primary">
 97 |             <button type="submit" class="action save primary" title="<?php /* @escapeNotVerified */ echo __('Save') ?>"><span><?php /* @escapeNotVerified */ echo __('Save') ?></span></button>
 98 |         </div>
 99 |         <div class="secondary">
100 |             <a class="action back" href="<?php echo $block->escapeUrl($block->getBackUrl()) ?>"><span><?php /* @escapeNotVerified */ echo __('Go back') ?></span></a>
101 |         </div>
102 |     </div>
103 | </form>
104 | <script>
105 |     require([
106 |         "jquery",
107 |         "mage/mage"
108 |     ], function($){
109 |         var dataForm = $('#form-validate');
110 |         var ignore = <?php /* @escapeNotVerified */ echo $_dob->isEnabled() ? '\'input[id$="full"]\'' : 'null'; ?>;
111 | 
112 |         dataForm.mage('validation', {
113 |         <?php if ($_dob->isEnabled()): ?>
114 |             errorPlacement: function(error, element) {
115 |                 if (element.prop('id').search('full') !== -1) {
116 |                     var dobElement = $(element).parents('.customer-dob'),
117 |                         errorClass = error.prop('class');
118 |                     error.insertAfter(element.parent());
119 |                     dobElement.find('.validate-custom').addClass(errorClass)
120 |                         .after('<div class="' + errorClass + '"></div>');
121 |                 }
122 |                 else {
123 |                     error.insertAfter(element);
124 |                 }
125 |             },
126 |             ignore: ':hidden:not(' + ignore + ')'
127 |         <?php else: ?>
128 |             ignore: ignore ? ':hidden:not(' + ignore + ')' : ':hidden'
129 |         <?php endif ?>
130 |         });
131 | 
132 |     });
133 | </script>
134 | <script type="text/x-magento-init">
135 |     {
136 |         "[data-role=change-email], [data-role=change-password]": {
137 |             "changeEmailPassword": {
138 |                 "titleChangeEmail": "<?php /* @escapeNotVerified */ echo __('Change Email') ?>",
139 |                 "titleChangePassword": "<?php /* @escapeNotVerified */ echo __('Change Password') ?>",
140 |                 "titleChangeEmailAndPassword": "<?php /* @escapeNotVerified */ echo __('Change Email and Password') ?>"
141 |             }
142 |         }
143 |     }
144 | </script>
145 | 


--------------------------------------------------------------------------------
/view/frontend/templates/review/product/view/list.phtml:
--------------------------------------------------------------------------------
 1 | <?php
 2 | /**
 3 |  * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 4 |  * See COPYING.txt for license details.
 5 |  */
 6 | 
 7 | // @codingStandardsIgnoreFile
 8 | 
 9 | ?>
10 | <?php
11 | /**
12 |  * @description:
13 |  *
14 |  */
15 | ?>
16 | <?php
17 |     $_items = $block->getReviewsCollection()->getItems();
18 |     $format = $block->getDateFormat() ?: \IntlDateFormatter::SHORT;
19 | ?>
20 | <?php if (count($_items)):?>
21 | <div class="block review-list" id="customer-reviews">
22 |     <div class="block-title">
23 |         <strong><?php /* @escapeNotVerified */ echo __('Customers Reviews') ?></strong>
24 |     </div>
25 |     <div class="block-content">
26 |         <div class="toolbar review-toolbar">
27 |             <?php echo $block->getChildHtml('toolbar') ?>
28 |         </div>
29 |         <ol class="items review-items">
30 |         <?php foreach ($_items as $_review):?>
31 |             <li class="item review-item" itemscope itemprop="review" itemtype="http://schema.org/Review">
32 |                 <div class="review-image">
33 |                     <img src="<?php echo $block->getLayout()->createBlock('\PHPCuong\CustomerProfilePicture\Block\Attributes\Avatar')->getCustomerAvatarById($_review->getData('customer_id')); ?>" width="150px" height="150px" alt="avatar" />
34 |                 </div>
35 |                 <div class="review-infor">
36 |                     <div class="review-title" itemprop="name"><?php echo $block->escapeHtml($_review->getTitle()) ?></div>
37 |                     <div class="review-details">
38 |                         <?php if (count($_review->getRatingVotes())): ?>
39 |                             <div class="review-ratings">
40 |                                 <?php foreach ($_review->getRatingVotes() as $_vote): ?>
41 |                                 <div class="rating-summary item" itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
42 |                                     <span class="label rating-label"><span><?php echo $block->escapeHtml($_vote->getRatingCode()) ?></span></span>
43 |                                     <div class="rating-result" title="<?php /* @escapeNotVerified */ echo $_vote->getPercent() ?>%">
44 |                                         <meta itemprop="worstRating" content = "1"/>
45 |                                         <meta itemprop="bestRating" content = "100"/>
46 |                                         <span style="width:<?php /* @escapeNotVerified */ echo $_vote->getPercent() ?>%">
47 |                                             <span itemprop="ratingValue"><?php /* @escapeNotVerified */ echo $_vote->getPercent() ?>%</span>
48 |                                         </span>
49 |                                     </div>
50 |                                 </div>
51 |                                 <?php endforeach; ?>
52 |                             </div>
53 |                         <?php endif; ?>
54 |                         <p class="review-author">
55 |                             <span class="review-details-label"><?php /* @escapeNotVerified */ echo __('Review by')?></span>
56 |                             <strong class="review-details-value" itemprop="author"><?php echo $block->escapeHtml($_review->getNickname()) ?></strong>
57 |                         </p>
58 |                         <p class="review-date">
59 |                             <span class="review-details-label"><?php /* @escapeNotVerified */ echo __('Posted on') ?></span>
60 |                             <time class="review-details-value" itemprop="datePublished" datetime="<?php /* @escapeNotVerified */ echo $block->formatDate($_review->getCreatedAt(), $format) ?>"><?php /* @escapeNotVerified */ echo $block->formatDate($_review->getCreatedAt(), $format) ?></time>
61 |                         </p>
62 |                     </div>
63 |                 </div>
64 |                 <div class="review-content" itemprop="description">
65 |                     <?php echo nl2br($block->escapeHtml($_review->getDetail())) ?>
66 |                 </div>
67 |             </li>
68 |         <?php endforeach; ?>
69 |         </ol>
70 |         <div class="toolbar review-toolbar">
71 |             <?php echo $block->getChildHtml('toolbar') ?>
72 |         </div>
73 |     </div>
74 | </div>
75 | <?php endif;?>
76 | 


--------------------------------------------------------------------------------
/view/frontend/web/css/avatar.css:
--------------------------------------------------------------------------------
 1 | /*
 2 | * @Author: Ngo Quang Cuong
 3 | * @Date:   2017-07-02 15:04:26
 4 | * @Last Modified by:   nquangcuong
 5 | * @Last Modified time: 2017-07-03 14:51:49
 6 | */
 7 | .avatar {
 8 |     opacity: 0;
 9 | }
10 | .avatar-title {
11 |     display: block;
12 |     margin-bottom: 8px;
13 | }
14 | .avatar-file-upload {
15 |     border: 1px solid #ccc;
16 |     display: inline-block;
17 |     padding: 6px 12px;
18 |     cursor: pointer;
19 | }
20 | .field-name-avatar img {
21 |     cursor: pointer;
22 | }
23 | 


--------------------------------------------------------------------------------
/view/frontend/web/css/global-avatar.css:
--------------------------------------------------------------------------------
 1 | /*
 2 | * @Author: Ngo Quang Cuong
 3 | * @Date:   2017-07-03 16:29:29
 4 | * @Last Modified by:   nquangcuong
 5 | * @Last Modified time: 2017-07-03 18:40:05
 6 | */
 7 | @media(min-width: 768px) {
 8 |     .customer-welcome .customer-name {
 9 |         display: block;
10 |         height: 25px;
11 |     }
12 |     .customer-welcome ul.header.links:before {
13 |         right: 5px;
14 |     }
15 |     .customer-welcome ul.header.links:after {
16 |         right: 4px;
17 |     }
18 | }
19 | .customer-welcome .customer-name .avatar-header-links {
20 |     border-radius: 50%;
21 |     height: 25px;
22 |     width: 25px;
23 | }
24 | 


--------------------------------------------------------------------------------
/view/frontend/web/css/review-item.css:
--------------------------------------------------------------------------------
 1 | /*
 2 | * @Author: Ngo Quang Cuong
 3 | * @Date:   2017-07-04 11:02:13
 4 | * @Last Modified by:   nquangcuong
 5 | * @Last Modified time: 2017-07-04 11:22:24
 6 | */
 7 | .review-item .review-image {
 8 |     width: 70px;
 9 |     padding: 0px 10px 5px 0px;
10 |     float: left;
11 | }
12 | .review-item .review-image img {
13 |     border-radius: 50%;
14 |     width: 70px;
15 |     height: 70px;
16 | }
17 | .review-item .review-infor {
18 |     display: inline-block;
19 | }
20 | .review-item .review-infor .review-title {
21 |     padding: 0px;
22 |     margin: 0px;
23 |     line-height: inherit;
24 |     padding-bottom: 0px;
25 | }
26 | .review-item .review-infor .review-details {
27 |     color: gray;
28 |     padding-bottom: 10px;
29 |     font-size: 13px;
30 | }
31 | .review-item .review-infor .review-details .review-ratings {
32 |     float: inherit;
33 |     padding-bottom: 5px;
34 |     margin: 0px;
35 | }
36 | .review-item .review-infor .review-details .review-ratings .rating-label {
37 |     display: none;
38 | }
39 | .review-item .review-content {
40 |     margin-bottom: 20px;
41 |     float: left;
42 |     width: 100%;
43 | }
44 | @media(max-width: 767px) {
45 |     .review-item .review-image {
46 |         width: 60px;
47 |         padding: 0px 10px 5px 0px;
48 |         float: left;
49 |     }
50 |     .review-item .review-image img {
51 |         border-radius: 50%;
52 |         width: 60px;
53 |         height: 60px;
54 |     }
55 |     .review-item .review-infor .review-title {
56 |         font-size: 13px;
57 |     }
58 |     .review-item .review-infor .review-details {
59 |         color: gray;
60 |         padding-bottom: 10px;
61 |         font-size: 12px;
62 |     }
63 | }
64 | 


--------------------------------------------------------------------------------
/view/frontend/web/images/no-profile-photo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/php-cuong/magento2-customer-avatar/3f467418f9206efc00690e95c19ab4a3d37f3320/view/frontend/web/images/no-profile-photo.jpg


--------------------------------------------------------------------------------
/view/frontend/web/js/avatar-validation.js:
--------------------------------------------------------------------------------
 1 | /*
 2 | * @Author: Ngo Quang Cuong
 3 | * @Date:   2017-07-02 16:47:45
 4 | * @Last Modified by:   nquangcuong
 5 | * @Last Modified time: 2017-07-03 16:00:03
 6 | */
 7 | 
 8 | require([
 9 |         'jquery',
10 |         'jquery/ui',
11 |         'jquery/validate',
12 |         'mage/translate'
13 |     ], function ($) {
14 |     //Validate Image FileSize
15 |     $('.avatar.validate-image').on('change', function() {
16 |         $('.profile-image, .avatar-file-upload').css({'opacity':'0.5'});
17 |     });
18 |     $.validator.addMethod(
19 |         'validate-image', function (v, elm) {
20 |             if (elm.value != '') {
21 |                 var ext = elm.value.split('.').pop().toLowerCase();
22 |                 if ($.inArray(ext, ['gif', 'png', 'jpg', 'jpeg']) == -1) {
23 |                     return false;
24 |                 }
25 |             }
26 |             return true;
27 |         }, $.mage.__('Image invalid (Accepting format .gif .png .jpg .jpeg)')
28 |     );
29 | });
30 | 


--------------------------------------------------------------------------------