AEM: 2011

Wednesday, 28 December 2011

Event Listeners

How to use even handlers??

Will be updated...

Note:
Difference between sling:resourceType and sling:resourceSuperType properties:

Assume that we have added sling:resourceType to the component, and it doesn't consists body.jsp then body.jsp will not used.. but whereas if add sling:resoureSuperType and the component doesn't have body.jsp then it gets body.jsp from resourecesupertype and will be used in the current component.

Dialog & Design_Dialog

dialog:
The Dialog is a special kind of window with a form in the body and a button group in the footer. It is typically used to edit content, but can also just display information.

design_dialog:

design_dialog (nt:unstructured) -specifies the design editing options for this component.
=============================================
1. How to retrieve values read from dialog (widget) to jsp?
Sol: String var= properties.get("<name of widget>","");

2. How to retrieve values from design_dialog to jsp?
Sol: String var= currentStyle.get("<name of widget>","");

==============================================

Tuesday, 27 December 2011

GoogleMap Component

In order to add a Google map to your site, you need to get a Google Maps API key for that site. This allows you to embed the maps into your web pages, and provides you with the terms and services for using the API key.

Steps:

1. Create a component called 'GoogleMap'
a. Create a dialog which consists address, latitude and longitude fields.
b. GoogleMap.jsp

GoogleMap.Jsp LOGIC:

1. Read Address or location from user through dialog.
2. Get the latitude and longitude values based on location
3. Output the map on page.

GoogleMap.jsp code:
============================
<%--

Google Map component.
NA
--%><%
%><%@include file="/libs/foundation/global.jsp"%><%
%><%@page session="false" %>
<%
            String searchLoc= properties.get("address","");
%>

<!DOCTYPE html>

            <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
            <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
            <script type="text/javascript">

            function initialize() {

            var geocoder = new google.maps.Geocoder();
            var address = '<%=searchLoc %>' ;
            alert(address);
            geocoder.geocode( { 'address': address}, function(results, status)
            {
            alert("--------------");
            if (status == google.maps.GeocoderStatus.OK)
            {
                        var latitude = results[0].geometry.location.lat();
                        var longitude = results[0].geometry.location.lng();
                        alert(latitude);
                        alert(longitude);
                        //document.write(latitude);
                        var latlng = new google.maps.LatLng(latitude,longitude);
                        var myOptions = {
                        zoom: 18,
                        center: latlng,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                        };

                 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                        var myMarker = new google.maps.Marker({ position: latlng, map: map, title:"About.com Headquarters" });

            }
            });
            return true;

            }

            </script>

<div>Google Map</div>
<div id="map_canvas" style="width:300px; height:300px;"></div>
<script type="text/javascript">
            initialize(); /// call Java script function automatically...

</script>

============================

References:
http://code.google.com/apis/maps/documentation/javascript/tutorial.html
http://webdesign.about.com/od/javascript/ss/add-google-maps-to-a-web-page.htm
http://briancray.com/2009/04/01/how-to-calculate-the-distance-between-two-addresses-with-javascript-and-google-maps-api/

Thursday, 22 December 2011

Widgets & xtypes

Class: CQ.Ext.form.TextField
Class: TextField
xtype: textfield

Config Options:
1. allowBlank: Boolean
Specify false to validate that the value's length is >0 (defaults to true)

2. defaultValue: String
The default value is set on processRecord when the record doesn't contain an according value.

3. fieldLabe: String
The label text to display next to this Component (defaults to")

4. fieldDescription: String
THe text to display below this component.

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

Class CQ.Ext.form.TextArea
Package: CQ.Ext.form
Class: TextArea
Extends: TextField
xtype: textarea
Multiline text field. Can be used as a direct replacement for traditional textarea fields, plus adds support for auto-sizing.
--------------------------------------
Class CQ.form.Selection

Package:	CQ.form
Class:	Selection
Extends:	CompositeField
xtype:	selection

The Selection lets the user choose between several options. The options can be part of the configuration or loaded from a JSON repsone. The Selection can either be rendered as dropdown (select), combobox (select plus free text entry), checkboxes or radio buttons.

Thursday, 15 December 2011

cq:defineObject

The Day provided global.jsp declares the Sling, CQ and JSTL taglibs and exposes the regularly used scripting objects defined by the

<cq:defineObjects /> tag

The above tag exposes the following regularly used, scripting objects which can be referenced by the developer. It also exposes the objects defined by the <sling:defineObjects> tag.

componentContext

Package: com.day.cq.wcm.api.components

public interface ComponentContext

The current component context object of the request.

2. component

Package: com.day.cq.wcm.api.components.Component interface

The current cQ5 component object of the current resource

3. currentDesign

Package: com.day.cq.wcm.api.designer.Design interface

The current design object of the current page

4. currentPage

Package: com.day.cq.wcm.api.Page interface

The current CQ WCM page object.

Script

Scripts:

JSP Scripts or Servlets are usually used to render components.

According to the request processing rules of Sling the name for the default script is <componentname>.jsp.

global.jsp

The JSP script file global.jsp is used to provide quick access to specific objects (i.e. to access content) to any JSP script file used to render a component.

Therefore global.jsp should be included in every component rendering JSP script where one or more of the objects provided in global.jsp are used.

Note:

The path /libs/wcm/global.jsp, which was used by earlier versions of CQ, is now obsolete. In CQ 5.3, the correct global.jsp path changed to /libs/foundation/global.jsp

More details: http://dev.day.com/docs/en/cq/current/developing/scripts.print.html

Wednesday, 14 December 2011

Day CQ5?

What is Day CQ?

  Day's CQ4 platform allows you to build compelling content-centric application that combine Web Content Management, Workflow Management, Digital Asset Management and Social Collaboration.

Prerequisites for Developing with CQ:


The following skills are recommended before starting with CQ:
1. Basic knowledge of web application techniques, including:
a. The request-response cycle
b. HTML
   c. CSS
   d. JavaScript
2. Working knowledge of CRX(Content Repository Extreme); including the content explorer
3. Basic knowledge of JSP (Java Server Pages), with the ability to understand and modify simple JSP example.

CQ5 Platform Architecture:

CQSE - CQ Servlet Engine
a. J2EE Servlet engine
b. 3 Webapps loaded
CRXDE Lite
Browser-based IDE
Launchpad
Sling application framework
Provides access to the Websites, Digital Assets, Inbox, tools, Packages and so on..

CRX
JCR
Servlet Engine: Acts as the server within which each CQ instance runs as a web application.
Any servlet Engine supporting the servlet API 2.4 can be used.

CRX:
1. General purpose repository
2. Allows for separation of application and content
3. content is available through a standardized API
a. JCR 283
b. JCR API
Node node.addNode("JCR");
Node node.getnode("JCR");
Node node.setProperty("opinion","excellent and recommended");
Node node.getProperty("opinion").getString();

JCR:
1. JSR 283
2. Key principles
a. Common programmatic interface to content repositories
b. API not tied directly to underlying architecture, data source, or protocol
c. Content organization in repository model
Hierarchical modeling
3. Reference implementations
a. Apache Jackrabbit
c. Jackrabbit.apache.org
4. Content Repository Extreme (CRX)
Day implementaion of JSR 283

Apache Sling:
==========
Apache sling is a content access framework providing a RESTful way to access and manage data stored in a
JCR (CRX/Jackrabbit/other).

Apache Sling is not specific to any JCR implementaion and has been tested with various JCR implementaions.
Sling provides a Resource API to make it easier to work within a JCR and manage resources.

Key principles:
a. Web application framework
b. Content-oriented (JCR-based) application development
c. REST-based

Sling:
1. Maps content objects to components
2. Server-side and AJAX scripting support
3. Can be used with a range of scripting languages
JSP, ESP, Ruby, Scala
========================================================================
CMS application - enables the creation, management, and control of content.

Workflow engine - controls the processing of workflow instances
-- Workflow instances often control the process of generating and publishing content

WCM Application:
1. Components - independent, reusable pieces of content rendering logic (code)
2. Widgets - basic elements that implement a specific user function
oftern manifested as a dialog box that enables entering or editing of a piece of content
3. sling - component framework that provides the underlying mechanisms for rendering content.

Author Vs Publish Instances:
------------------------------
Authors: Developers create Templates & pages
Publish: Visitors request Pages

Available Interfaces:
====================
1. CQSE Administration Interface
2. CRX Interfaces
3. Apache Felix Interface

CQSE: http://localhost:4502/admin
CQSE Administration:
1. Used for stand-alone installation
Default CQ5/CRx installation uses CQSE
2. Used to manage:
a. web applications
b. Connectors
c. Password
d. System information