How to change Portrait/Profile photo in liferay programitically.

Sometime liferay developer need to change profile/portrait photo programmatically . Here i want to share my experience. Create portlet action url and method as below:

In jsp file create action url:

<script type="text/javascript" src="<%= request.getContextPath()%>/js/jasny-bootstrap.min.js"></script>
<link rel="stylesheet" href="<%= request.getContextPath()%>/css/jasny-bootstrap.min.css">

<portlet:actionURL name="updateProfile" var="updateProfileURL" windowState="normal"/>

<form action="<%=updateProfileURL %>" method="post" enctype="multipart/form-data" id='<portlet:namespace/>updateProfile'>
                <input name="<portlet:namespace/>userEmail" id='<portlet:namespace/>userEmail' type="hidden" value="" />
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="col-xs-4 col-sm-3 col-md-3">
                        <span class="profile-label">First Name*:</span>
                    </div>
                    <div class="col-xs-8 col-sm-5 col-md-5">
                        <input type="text" class="form-control" placeholder="First Name" id="<portlet:namespace/>firstName" name='<portlet:namespace/>firstName' value="<%= user.getFirstName()%>">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="col-xs-4 col-sm-3 col-md-3">
                        <span class="profile-label">Last Name*:</span>
                    </div>
                    <div class="col-xs-8 col-sm-5 col-md-5">
                        <input type="text" class="form-control" placeholder="Last Name" id="<portlet:namespace/>lastName" name='<portlet:namespace/>lastName' value="<%=user.getLastName()%>">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="col-xs-4 col-sm-3 col-md-3">
                        <span class="profile-label">Email*:</span>
                    </div>
                    <div class="col-xs-8 col-sm-5 col-md-5">
                        <input type="email" class="form-control" placeholder="Email" id="<portlet:namespace/>email" name='<portlet:namespace/>email' value="<%=user.getEmailAddress()%>">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="col-xs-3 col-sm-3 col-md-3">
                        <span class="profile-label">Photo:</span>
                    </div>
                   
                    <div class="col-xs-8 col-sm-5 col-md-5">
                            <div class="fileinput fileinput-new" data-provides="fileinput">
                              <div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; height: 150px;">
                                      <span>
                                          <img height="auto" width="100%" src="<%=themeDisplay.getUser().getPortraitURL(themeDisplay) %>"
                                        class="img-responsive" alt="Responsive image">
                                    </span>
                                    <span>Profile Photo</span>
                              </div>
                              <div>
                                <span class="btn btn-default btn-file"><span class="fileinput-new">Select image</span><span class="fileinput-exists">Change</span> <input type="file" name='<portlet:namespace/>file'/> </span>
                                <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
                              </div>
                            </div>
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="col-xs-4 col-sm-3 col-md-3">
                        <span class="profile-label">&nbsp;</span>
                    </div>
                    <div class="col-xs-2 col-sm-2 col-md-2">
                        <div>
                            <a class="form-control btn btn-default"  href="javascript:updateProfile()">
                                Save
                            </a>
                        </div>
                    </div>
                </div>
 </form>

<script>

    function validateEmail(sEmail) {
            var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
            if (filter.test(sEmail)) {
                return true;
            }
            else {
                return false;
            }
        }

    function updateProfile(){
             var     firstName=$('#<portlet:namespace/>firstName').val();
             var    lastName=$('#<portlet:namespace/>lastName').val();
             var    email=$('#<portlet:namespace/>email').val();
             if ($.trim(firstName).length == 0) {
                    alert('Please enter first name');
             }else if($.trim(lastName).length == 0){
                   alert('Please enter last name');
             }else if($.trim(email).length == 0){
                   alert('Please enter email address');
             }else if(validateEmail(email)){                     document.getElementById('<portlet:namespace/>updateProfile').submit();
           
             }else {
                   alert('Please enter valid email address');
             }
           
        }
 </script>
And  process action method in portlet class :

@ProcessAction(name="updateProfile")
    public void updateProfile(ActionRequest actionRequest, ActionResponse actionResponse){
        ThemeDisplay themeDisplay = (ThemeDisplay)actionRequest.getAttribute(WebKeys.THEME_DISPLAY);
        UploadPortletRequest uploadRequest = PortalUtil.getUploadPortletRequest(actionRequest);
        String firstName= uploadRequest.getParameter("firstName");
        String lastName= uploadRequest.getParameter("lastName");
        String email= uploadRequest.getParameter("email");
       
         File file = uploadRequest.getFile("file");
          if(file!=null){
            try {
                   
                User user=themeDisplay.getUser();
                user.setFirstName(firstName);
                user.setLastName(lastName);
                user.setEmailAddress(email);
                UserLocalServiceUtil.updateUser(user);
                InputStream inputStream = new FileInputStream(file);
                byte[] bytes = FileUtil.getBytes(inputStream);
                UserServiceUtil.updatePortrait(themeDisplay.getUser().getUserId(), bytes);
            } catch (FileNotFoundException e) {
                e.printStackTrace();
            } catch (IOException e) {
                e.printStackTrace();
            } catch (PortalException e) {
                e.printStackTrace();
            } catch (SystemException e) {
                e.printStackTrace();
            }
             
          }
   }

Comments

Popular posts from this blog

How to run ofbiz as ubuntu Service.

JPA vs Spring JPA vs Spring Data JPA vs Hibernate

Java Array Interview Questions for Entry-Level Developers Part 01