Tuesday, November 5, 2013

Contextual User Impersonation in Liferay

It has been little more than a year since I started working on Liferay. As a horizontal portal, it does several things and is real good at many of those things it does. One such feature is called User Impersonation and I can't tell you how under appreciated this feature is.

In a nutshell User Impersonation is a feature which allows administrative users to impersonate any other Liferay user from control panel  -> user and organization. And this allows the administrative user to view the portal application as the person they are impersonating. This is cool way to troubleshoot any user specific issues without doing a screen sharing or having to visit the user.

Now, bear in mind that this feature is available only within control panel under user and organization portlet. So every time you need to use this feature you have to navigate to control panel first and once you have impersonated the user then you navigate to the page where some troubleshooting is required.

Wouldn't it be nice to have this feature at your fingertip irrespective of which page you are on at a given point in time? Well, ABSOLUTELY!!

So why the wait, just download the plug-in and make some minor entries to your existing theme(s) and you are good to go. You may also add this to your control panel theme and this way not only the end user pages, but the control panel pages can be impersonated right within their context.

Contextual User Impersonation in Action:





Notice how it disappears when non admin user views the page
Code to embed in theme:
Replace your dock bar code with this. Make sure to keep the admin check because this is a run time include and you don't want too many run time includes in your theme for regular users.
#if ($is_signed_in)
       #dockbar()
       #if($themeDisplay.getPermissionChecker().isOmniadmin())
              $theme.runtime("userimpersonation_WAR_userimpersonationportlet")
       #end
#end
 


Download This Plugin


If you liked this plug-in, a simple link back to this blog would be appreciated. Also provide your feedback if any. May be in future we'll see this feature built right into the docbar itself.

Monday, October 28, 2013

Liferay 6.2 - An Overview

Recently I attended Liferay North America Symposium 2013. Everyone kinda knew that the next Liferay release will be unveiled at the symposium. But we were all guessing if this will be called 6.2 or 7. But I guess Liferay was feeling generous and ended up calling it 6.2.

When you look at the features and enhancements packed into this release you would also agree with me that Liferay was being generous by not making it a major release.

Here are some of the 6.2 features I made note of during the symposium. And I am sure there's a lot more to this. Right now I am playing with the latest 6.2 CE edition. In coming weeks I will elaborate on these features and add more to the list as and when I come across any new feature.

Liferay 6.2

  1. European UI (light and modern)
  2. Responsive Design (Boothstrap 2.3.2)
  3. Alloy UI 2.0
  4. Comprehensive Mobile Support (with all new mobile sdk)
  5. Plugin Sand-boxing
  6. Recycle Bin
  7. Improved Site Publication
  8. Folder Structure Support for Web Contents
  9. Greater Internationalization (i18n) Support
  10. Several Performance Improvements
  11. ...
  12. ...
I also took some time out of the symposium and went around town with my camera. I must say that SFO is a beautiful town. I will post them in a separate blog.

Saturday, October 26, 2013

Yes Tripods Can Hurt You... Literally

Am I the only one who had this kind of accident or, it's just too trivial to post? Anyways, this has happened with me.





Don't get me wrong. This is a great tripod and it can happen with any tripod. The point here is how it happened and how to avoid this.

I bought MeFoto A1350Q1T Roadtrip Travel Tripod Kit (Titanium) almost a month ago and took it on a trip to San Francisco recently. It is an excellent tripod.

This happened when I was trying to wrap up from a night shoot on a riverside. I was in a hurry and I loosen all the screws and then held the tripod upside down so that the legs will fall into place on their own. But unfortunately my hand was on a screw joint. And it did hurt like a b****. So please be careful.

If you find this post helpful, please share with others.



Thursday, October 17, 2013

Bootstrapping with Liferay

Recently I integrated Bootstrap with Liferay portal. Liferay portal does not come with Bootstrap out of the box. Those who are not aware of Bootstrap look below for the links under reference section.
 
Anyways, as part of this exercise I came up with few recommendations of my own. Some of these are just common sense but I have listed them anyways. These recommendations are primarily meant for UX(user experience), prototyping professionals or, graphic designers who don't necessarily work with Liferay.

There are several changes we need to make within liferay to make it’s pages responsive using bootstrap. At the same time we need to follow several liferay specific conventions to ensure the structural and functional integrity of the portal is intact or, at least as close to the original as possible.



Folder Structure:

Liferay themes have the following folder structure for the static resources. As long as these folder structure are followed, integration with the portal becomes seamless and less error prone.

[Application Name]/css
For all cascading style sheet, SASS/SCSS files. Liferay does not support LESS at present. Bootstrap related css go here. All browser specific css files can go under their respective sub folders within this folder. e.g. css/ie

[Application Name]/js
All application specific javascript including bootstrap.min.js go here.

[Application Name]/template
Html pages go here. 

Separation of Style Sheets:


CSS files should be splitted into separate files based on their functionality. All those styling elements which are universal and/or applicable to common elements like header/footer/nav bar etc should go into a main css file.

Styling for specific functionality within the layout e.g. News Carousel, Sign-in Form etc should go into their respective css files.

This will allow liferay developers to package the css along with their respective plugins there by reducing the overall payload on the main page template. Same applies for JS files as well.


Styling Syntax: 


Liferay has built in support for SASS and Compass. All the css files are parsed for these. And it throws error when it encounters non well formed styles, missing value for any property or empty style blocks. So those should be avoided.


Page Layouts:


Special consideration is required while creating page layout or grid layout for the main content area like 2 column, 3 column, 1 row and 2 column on 2nd row etc.

Liferay layouts are reusable plugins and are meant to be used across several pages and applications. Hence any application specific or even page specific classes should not be added to the main grid layouts. They should only contain the Bootstrap related classes with additional liferay layout specific classes. Below is an example of Liferay two column layout made compatible with Bootstrap 2.

Highlighted css classes are Bootstrap related. Rest all are liferay specific classes and no custom application specific classes used there.

<div class="bootstrap_2col" id="main-content" role="main">
    <div class="portlet-layout">
        <div class="container-fluid">
            <div class="span3">
                <div class="aui-w30 portlet-column portlet-column-first" id="column-1">
                <!-- Column one content goes here-->
                </div>
             </div>          
            <div class="span7">
                 <div class="aui-w70 portlet-column portlet-column-last" id="column-2">
                 <!-- Column two content goes here-->
                 </div>
            </div>
        </div>   
    </div>
</div>






Feel free to comment below if you have any additional recommendations on this subject or, link back to this blog if it helped you.

References:

Bootstrap
Getting Started with Bootstrap
How to create Responsive Theme in Liferay Webinar (Video)
Responsive Design Testing

 


Monday, October 14, 2013

My 2 Cents On Landscape Photography (Composition)

This is my very first blog and I have been debating myself for a day or two on what topic I should choose for this very first blog. Finally I decided to go with photography over other areas of interest like technology, gadgets, fitness, sports etc. I guess I will touch upon those areas in coming days/months.

A little background on my photographic history. I had been a point-and-shoot kind of guy pretty much throughout my adulthood until 2011 when I picked up my first DSLR (Digital SLR) Canon EOS Rebel T3i. Ever since I have been trying to better myself at this craft(as a hobbyist/enthusiast).

With this series of blogs I am trying to share what I have learn so far. Here's hoping to help those who are new to digital SLR photography with my tips.

Today, I want to start with landscape photography. 

Landscape photography by definition could mean lot of things. In short, photographs of vast, natural spaces on this earth can be categorized as landscape photographs. But let us not lock ourselves down with definition and keep an open mind here.

Composition:
This plays an important role in any kind of photography not just landscape ones. You might have heard many photographer saying Location, Location & Location is key to photography. Well, that's actually true for landscape photography. But you can ruin a good location with bad composition and at the same time make a bad location standout with good composition. So I often say Composition, Composition & Composition are key to good photography. And it's true for any kind of photography, be it sports, macro or even portrait for that matter.

So what is composition. Composition is the placement of visual elements in the picture frame.

How do we go about composing a perfect landscape photograph? Lets me give some few simple tips and then leave bunch of resources for reference and inspiration.

> Horizon One Third
This is when we keep the horizon approximately at 1/3rd of the frame vertically from top. I often do this when there's not much going on in the sky but there's lot more to capture on the ground.Perhaps a rocky beach, reflection of trees on a lake, field of flowers and so on.

Here are some examples to give us better idea.

Example 1
Example 2
Example 3


> Horizon Two Third
This is exact opposite of the former. We go 2/3rd with the horizon placement when we have a lot going on in the sky and/or background.  Examples could be cloudy dramatic sky during sunrise/sunset, wide angle beach shots during sunrise/sunset, New York City skyline on a cloudy night, airshows etc.

Example 1
Example 2
Example 3

> Horizontal vs.Vertical Shot
Almost all the time landscape photos are best taken horizontally. So much so that we ofter refer horizontal mode as landscape mode. The very few landscape photos I have taken vertically, I kinda wish I had taken them horizontally.
But there are some rare scenarios where you might want to take vertical landscape photos.  Also be sure to get your knees dirty aka get close to the ground if you must take a vertical shot. Check the examples below.

Example 1
Example 2

When you are not sure, it is safer to compose horizontally.


Lighting:
Coming soon..