BLOG

NEXT STEPS

Posts Tagged ‘OFBiz Tutorial’

OFBiz Tutorial: Quick Updates For CMS Pages In OFBiz

Thursday, July 22nd, 2010

In my earlier posts we saw how can we setup different static pages for a site developed in OFBiz.

Now we will see how your client or a developer can directly make changes to the static pages. For this we use Content Manger application.

The following are easy steps which can be communicated to clients once the static content data setup is completed by the development team and the site is live. Later these changes can be easily managed by client.

  1. Log into backend managment app :https://localhost:8443/content/control/mainOfbiz Tutorial Quick Cms Updates 1
  2. Select Content from the menuOfbiz Tutorial Quick Cms Updates 2
  3. In the search options put in the appropriate search criteria and click on the Find button eg. STORE_POLICIES. Results will show the list of contents matching the search criteriaOfbiz Tutorial Quick Cms Updates 3
  4. Click on the Page name under the Data Resource ID Column to edit. (in this case STORE_POLICIES)Ofbiz Tutorial Quick Cms Updates 4
  5. Click the TEXT or HTML link in the top to view/edit the Text/Html text based on skills to update them one is text editor and other one is html text editorOfbiz Tutorial Quick Cms Updates 5
  6. Edit the text and press the Update button and the page will update the text on the site.

This was one of the process that can be used to update static page contents on the site without requiring any changes in code base. So now whenever it comes to updating text on static pages when the site is live, these changes can be done easily with Content Manger application.
If you want to get more details related to OOTB OFBiz processes contact HotWax Media today.


Pranay

Pranay Pandey is Manager, Enterprise Software Development at HotWax Media (OFBiz Service Provider) and has been involved with the OFBiz project since 2007. He contributes actively to OFBiz, and also trains HotWax Media developers in OFBiz techniques and best practices.

OFBiz Tutorial:Use Dependent Selects to Manage Country-State Select Boxes

Wednesday, July 14th, 2010

Javascript components for managing Dependent Selects is starting to find use in ecommerce applications we are developing. It all started with need for updating contents of State field, on change of Country in postal address forms.

More then a year ago we started using Ajax for updating State select box options on change of Country select box value. It was a step forward but I wasn’t satisfied. Recently I had time to build a Dependent Select javascript component that takes the process of managing dependent selects boxes to the next level. Please read my blog post, OFBiz Tutorial – Dependent Selects for Prototype, to know more about it. If you are wondering about a scenario from real world, Here you go.

Below is the piece of code from the Freemarker template for the Checkout page in OFBiz ecommerce application.  It renders Country and State select boxes with their options.

?View Code LANGUAGE
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div>
      <label for="shipToCountryGeoId">Country</label>
<select id="shipToCountryGeoId" class="required select dependentSelectMaster" title="shipToCountry" name="shipToCountryGeoId">
        <option title="${country.geoId}" value="${country.geoId}">${country.get("geoName")?default(country.geoId)}</option>
        <!--#list-->
      </select></div>
<div id="shipToStates">
      <label for="shipToStateProvinceGeoId">State</label>
<select id="shipToStateProvinceGeoId" class="required shipToCountry" name="shipToStateProvinceGeoId">
        <option class="${country.geoId}" title="${stateAssoc.geoId}" value="${stateAssoc.geoId}">&lt;#if shippingAddress.stateProvinceGeoId?has_content &amp;&amp; shippingAddress.stateProvinceGeoId?default("") == stateAssoc.geoId&gt; SELECTED <!--#if-->&gt;${stateAssoc.geoName?default(stateAssoc.geoId)}</option>
            <!--#list-->
          <!--#if-->
        <!--#list-->
      </select></div>

Following Javascript code will unobtrusively manage the relationship between Country select box (master) and State select box (slave),

?View Code LANGUAGE
1
2
3
$('checkoutPanel').select('.dependentSelectMaster').reverse().each( function (elt) {
  new Dependent( $$( '.'+elt.title ).first() , elt );
})

Where ‘checkoutPanel’ is Id of wrapper div that encloses checkout html form. Apply ‘dependentSelectMaster’ class to select boxes that have dependent slave elements, making them the master. Slave select box is related to its master using title and class attribute of elements, A select box is slave if it has a class applied to it that is equal to title of master select box.

The javascript code snippet traverses DOM tree looking for master select boxes. Using title attribute of master select it finds all the slaves and creates Dependent select relationship between them. Its all clean and simple.

Needless to say, you’ll need to include Prototype.js and DependentSelect.js in your webpage. I hope you will find this short OFBiz tutorial useful.

- Anil

Anil Patel is Chief Development Officer at HotWax Media as well as an OFBiz project committer, PMC member, and active community contributor. He also studies karate! Anil will join other HotWax Media employees and advisors in periodically posting thoughts here related to OFBiz, eCommerce, ERP, and related topics.

OFBiz Tutorial-Using CMS for Static Web Pages

Tuesday, June 29th, 2010

In my last post regarding usage of CMS for Front End application we saw how to setup simple static content page using contentId in OFBiz screen definition. You just need to setup the content data and controller entry to make it work.

Now we will see how to setup CMS driven static page for a website. Following four steps are going to be the magic:

  • WebSite Publish Point Setup
  • Decorator Content Data Setup
  • Static Content Data Setup
  • CMS request in Controller

Assumption: A component is already setup; here the name of the component is “cmsdemo” . If you have not done that already please go through my last post OFBiz tutorial on CMS usage for front end application.

Setting up Website Publish Point

Its easy to setup Website publish point in data. Below is an example of  how to do this in the content data file, in this case the name of the file is CmsDemoData.xml:

?View Code LANGUAGE
1
2
3
<Content contentId="root" contentTypeId="WEB_SITE_PUB_PT" contentName="Webstore Site Publish Point" description="Root publish point for CMS website"/>
<WebSite webSiteId="CmsWebSite" siteName="CMS Web Site"/>
<WebSiteContent webSiteId="CmsWebSite" contentId="root" webSiteContentTypeId="PUBLISH_POINT" fromDate="2010-01-01 00:00:00"/>

Also make sure you have webSiteId entry in web.xml of your application as shown below:

?View Code LANGUAGE
1
2
3
4
5
<context-param>
    <param-name>webSiteId</param-name>
    <param-value>CmsWebSite</param-value>
    <description>A unique ID used to look up the WebSite entity</description>
</context-param>

Setting CMS Site Main Decorator

Content Data

Content data setup refers to the decorator screen for static pages:

?View Code LANGUAGE
1
2
3
4
<DataResource dataResourceId="CMS_ST_DEC" dataResourceTypeId="URL_RESOURCE" dataTemplateTypeId="SCREEN_COMBINED"
objectInfo="component://cmsdemo/widget/CommonScreens.xml#cms-main-decorator"/>
<Content contentId="CMS_ST_DEC" contentTypeId="DECORATOR" contentName="CMS Site Main Decorator" dataResourceId="CMS_ST_DEC"/>
<ContentPurpose contentId="CMS_ST_DEC" contentPurposeTypeId="SECTION"/>

Screens

Setup the main decorator for your site as shown below, it can have more resources included, but right now it has very little information:

?View Code LANGUAGE
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<screen name="main-decorator">
    <section>
        <actions>
            <property-map resource="CmsDemoUiLabels" map-name="uiLabelMap" global="true"/>
            <property-map resource="CommonUiLabels" map-name="uiLabelMap" global="true"/>
 
            <set field="layoutSettings.companyName" from-field="uiLabelMap.CmsDemoCompanyName" global="true"/>
            <set field="layoutSettings.companySubtitle" from-field="uiLabelMap.CmsDemoCompanySubtitle" global="true"/>
 
            <set field="activeApp" value="cmsdemo" global="true"/>
            <set field="applicationMenuName" value="MainAppBar" global="true"/>
            <set field="applicationMenuLocation" value="component://cmsdemo/widget/CmsDemoMenus.xml" global="true"/>
            <set field="applicationTitle" value="${uiLabelMap.CmsDemoApplication}" global="true"/>
        </actions>
        <widgets>
            <include-screen name="GlobalDecorator" location="component://common/widget/CommonScreens.xml"/>
        </widgets>
    </section>
</screen>

Now you need to setup the cms-main-decorator screen as shown in the code below which will include the above given main decorator of the site.

?View Code LANGUAGE
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<screen name="cms-main-decorator">
    <section>
        <actions></actions>
        <widgets>
            <decorator-screen name="main-decorator" location="${parameters.mainDecoratorLocation}">
                <decorator-section name="body">
                    <section>
                        <condition>
                            <not><if-empty field="decoratedContent"/></not>
                        </condition>
                        <widgets>
                            <platform-specific>
                                <html>
                                    <html-template location="component://cmsdemo/webapp/cmsdemo/cms/DecoratedContent.ftl"/>
                                </html>
                            </platform-specific>
                        </widgets>
                        <fail-widgets><label text="Problem in loading static content"/></fail-widgets>
                    </section>
                </decorator-section>
            </decorator-screen>
        </widgets>
    </section>
</screen>

Decorated Content Freemarker Template

The DecoratedContent.ftl that you included in your cms-main-decorator, shown above, needs to be created at a given location by the same name with only the code as shown below, which is setup by the cms event and rendered:

?View Code LANGUAGE
1
${decoratedContent}

Setup Content Data for Static Page

Setup the content data line like the code below, which will use section-sub-content pattern and will use the decorator content that we created in an earlier step. Here I have given an example of how you can setup a privacy policy page for your site.

?View Code LANGUAGE
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<DataResource dataResourceId="privacy" dataResourceTypeId="ELECTRONIC_TEXT" dataTemplateTypeId="FTL"/>
<ElectronicText dataResourceId="privacy">
    <textData>
        <![CDATA[
                <h1>Privacy Policy</h1>
                <h2><p>This is privacy policy page</p></h2>
                <p>Privacy Policy datailed text Goes here</p>
        ]]>
     </textData>
</ElectronicText>
<Content contentId="privacy" contentTypeId="DOCUMENT" contentName="CMS Site Privacy Page" dataResourceId="privacy" decoratorContentId="CMS_ST_DEC"/>
 
<ContentPurpose contentId="privacy" contentPurposeTypeId="SECTION"/>
<ContentAssoc contentId="root" contentIdTo="privacy" contentAssocTypeId="SUB_CONTENT" fromDate="2001-01-01 00:00:00" mapKey="privacyPage"/>

Creating Controller Entry

Now create request entries in controller.xml to handle CMS page requests as shown below:

?View Code LANGUAGE
1
2
3
4
5
6
7
8
<!-- default request; call into CMS \-->
<default-request request-uri="cms"/>
 
<request-map uri="cms">
    <event type="java" path="org.ofbiz.content.cms.CmsEvents" invoke="cms"/>
    <response name="success" type="none"/>
    <response name="error" type="view" value="error"/>
</request-map>

Provide links to CMS Page/Pages

Now its time to link CMS page with a menu on your web site as shown below:

1
<a href="<@ofbizUrl>cms/root/privacyPage</@ofbizUrl>">Privacy Policy</a>

You are done. Just load the data file which you created in CMS site data. Hit the url:http://localhost:8080/cmsdemo/control/cms/root/privacyPage which is based on ContentAssoc record we created earlier for privacy page:

?View Code LANGUAGE
1
<ContentAssoc contentId="root" contentIdTo="privacy" contentAssocTypeId="SUB_CONTENT" fromDate="2001-01-01 00:00:00" mapKey="privacyPage"/>

In the resultant screen you will see following page as per your data setup done:
FinalImage

This way you can add in as many pages as you want in a site which are static in nature and let  your client feel good when it comes to make any changes in content and they can just go in to Content Manager and can update the content easily without any code modification activity at any point of time.


Pranay

Pranay Pandey is Manager, Enterprise Software Development at HotWax Media (OFBiz Service Provider) and has been involved with the OFBiz project since 2007. He contributes actively to OFBiz, and also trains HotWax Media developers in OFBiz techniques and best practices.

OFBiz Tutorial- How To Use ECA’s To Extend Service Permission

Wednesday, June 16th, 2010

This OFBiz tutorial is the next part of our earlier tutorial “How to Setup User Permissions”.  See how using ECA’s can extend service permissions.

So far we have seen how to assign security permission to a user which will let the user access a particular application. The level of access to an application will depend on the permission(s) assigned to the user. You may want to allow the user to just view an application or maybe you want to allow them other possible permission options like creating new records, updating the existing records or deleting exiting records in a particular application.

You can also assign an admin permission to a user. This gives the user full access to an application so that the user can View, Create, Update and Delete records in a particular application.

Assigning a permission is not restricted to just one application, you can allow the user to access more then one application by assigning permissions related to other apps.

There are certain cases when a user has admin permission for an application but the user is not allowed to perform certain operation in the application. For example, if you want to view a product lookup screen in the “Asset Maint” application then you would need the permission of the Catalog application. The simplest option is to give the user all the required permissions. The downside of this approach is that this will also allow the user access to the Catalog application.

So in this case if you want the user to have access only to the “Asset Maint” app then you can do this by defining ECA (Event Condition Access) rules which will extend the permission of the other applications while still not allowing the user to access these application(s) other than “Asset Maint.”

The rule can be defined in a file under the sevicedef folder in the component directory tree as following.

OFBiz Tutorial Permissions-2-1a

This also requires the entry of this file in ofbiz-component.xml where secas.xml is the name of the above file.

OFBiz Tutorial Permissions-2-2a

Whenever the user tries to perform any catalog related operation in the “Asset Maint” application, the catalogPermissionCheck service will run first. We know that the user does not have any explicit permission to the Catalog application hence the service will return hasPermission flag as false. Every permission service implements a generic service interface and hasPermission is one of the boolean attibute that is returned by the permission service. If it is false it means that the user does not have sufficient permission.

Since we want to override the permission we define a permission service in the “Asset Maint” component. This service will check whether the user has permission to access the “Asset Maint” component or not instead of checking for Catalog permission. If the service returns a true for the hasPermission flag (which it will if the user has “Asset Maint” permissions) it means the user can access the catalog related screens in “Asset Maint.”

The code for the permission service will look like this: (Click to expand image.)

 OFBiz Tutorial Permissions-2-4a

This way without explicitly assigning the catalog permissions the user will still be able to access the product lookup screen in the “Asset Maint” application.

Similar you can add more rules to the ECA file to override the OFBiz user permissions of other applications in the “Asset Maint” application.

- Vikas

Vikas Mayur is a dynamic OFBiz developer working for HotWax Media as a Director of Software Development in India. He works in web based application and ERP software using OFBiz, which is a top level project of Apache Software Foundation.

OFBiz Tutorial: How to Setup User Permissions

Thursday, May 20th, 2010

In OFBiz, every application has a base permission (except a few like ecommerce, ofbizwebsite etc.) and users should have at least base OFBiz permission view or base permission admin to login in the application. Sometime base permission may consist of more then one permission and in that case both are required to login/access the application.

The base permission is defined in the ofbiz-component.xml file of each component. If the base permission consists of more then one permission then they are separated by a comma.

Below is a code snippet taken from Asset Maint component ofbiz-component file.

OFBiz Tutorial Permissions 1

We will now learn how to setup permissions for a new user to gain access to a back-end application while using an Asset Maint component as an example throughout the tutorial.

Just a note that we will not focus on the internal details of this component and we will only visit a couple of screens to see whether we have setup correct permission levels for the user or not.

Step by Step Guide

Lets first create a new user in the system. Login to the party manager application with username: admin and password: ofbiz and click on Create New link located at the top of the main screen.

The screen will provide a variety of options to choose from. Click on Create New Person.

OFBiz Tutorial Permissions 2

Enter the required fields and save the form.

OFBiz Tutorial Permissions 3

This will take you to the user profile screen.

Our next step is to create a user login for the new user. Click on Create New link on User Name(s) screen in the right column on the profile page.

OFBiz Tutorial Permissions 4

Enter the details as below and save the form.

User Login Id: joe.will
Current Password: ofbiz
Current Password Verify: ofbiz

Now coming back to the profile screen you will see that the new user login has appeared under the User Name(s) screen in the right column on the profile page.

Now click on the Security Group link. This will present you with a screen where you can add a security group to the user account. Security Group is basically a set of permissions where permissions are classified as VIEW, CREATE, UPDATE and DELETE. An admin security group contains all of these permissions. Select Asset Maint Admin group from the drop-down list. The From Date field is optional and if user does not enter it then the application will use the system’s current timestamp for this field. Thru Date is also optional but if specified then the security group will be valid for the user till the thru date has passed. You can also assign multiple security groups at the same time to the user. Save this form.

Now you have granted sufficient permission to the user to access the Asset Maint application.

OFBiz Tutorial Permissions 5

Note: The admin user is available only if demo data is installed. If only seed data is installed then you have to create the admin user explicitly through the command line with an ant target defined in the build file which is present at the root of the project. Run command create-admin-user-login from the terminal and follow onscreen instructions to complete this wizard.

Testing User’s Permissions

Logout from the party manager application and then you can login to the Asset Maint application with the new user. The user should be able to login in to this application without any issues and this signifies that the user has permission to VIEW this application.

Lets try to check whether the user has permission to perform CREATE operation in the application. Go to the Fixed Assets tab and click on New Fixed Asset link. Fill in the basic details as shown in the screenshot and click on update button. The user should be able to create new fixed asset record. This signifies that user has permission to perform create operation in the application.

OFBiz Tutorial Permissions 6

Similar you can check whether the user has UPDATE or DELETE permissions by updating or removing the fixed asset record.

Lets try to login into any other application (for example catalog) with the same user to check whether the system permits the user to access an application other than Asset Maint. As it would be obvious from the screenshot below that the security permissions assigned to the user is just enough to login and access Asset Maint application and not any other application.

Similar you can try to login into any other application with the same user and you will see the same result.

ofbiz-tutorial-permissions7

So far we have learned the basics of security permission in OFBiz and how we can assign these permissions to the user.

Hope you will enjoy this!

- Vikas

Vikas Mayur is a dynamic OFBiz developer working for HotWax Media as a Director of Software Development in India. He works in web based application and ERP software using OFBiz, which is a top level project of Apache Software Foundation.