Translate

Saturday, November 16, 2013

Example 9: In-Context Content Editing

Insite Editing (IN-CONTEXT) : Describes how to render insite editing tags for different attribute types with different formatting.

1. STRING: 
<insite:edit field="attribute_name" value="value from variable"/>
or 
<insite:edit field="headline" list="from list" column="value" />

2. TEXT with CkEditor:
<insite:edit list="bodyList" column="value" editor="ckeditor" field="body" params="{width:                               '500px', height: '350px'}" />

3. DATE:
* Insite editing for date is little bit tricky as it depends on how we are formatting date
* With timezone and timezoneID:
************** First, format the date **************
<dateformat:create name="df" datestyle="long" timestyle="long" timezoneid="IST"/>
<dateformat:getdate name="df" varname="formattedDate" valuetype="jdbcdate"                                                    value='<%=ics.GetVar("postDate") %>' />

* If TIMESTAMP is needed, then use
<dateformat:getdatetime name="df" varname="formattedDate" valuetype="jdbcdate"                                      value='<%=ics.GetVar("postDate") %>' />

************** Render date using insite tag **************
<insite:edit field="postDate" value='<%=ics.GetVar("formattedDate") %>' params="                                        {constraints:{formatLength: 'long'} , timePicker:true, timeZoneID:'IST'}"/>

* Without timezone and timezoneID, just remove timestyle, timezoneid while formatting and while                     rendering remove timepicker and timezoneid.

4. BINARY FIELDS:
* We require imageID and list where it would be saved as followed:
<assetset:setasset name="image" type="AVIImage" id='<%= ics.GetVar("imageId")%>'/>
<assetset:getattributevalues name="image" listvarname="largeThumbnailList"                                                              typename="ContentAttribute" attribute="largeThumbnail"/>

* Render image using insite tag:
<render:getbloburl outstr="imageURL" c="AVIImage" cid='<%=ics.GetVar("imageId") %>'                               field="largeThumbnail" />
<insite:edit field="largeThumbnail" assetid='<%=ics.GetVar("imageId")%>'                                                         assettype="AVIImage" list="largeThumbnailList" column="value">
<img class="photo left" src='<%=ics.GetVar("imageURL")%>' />
</insite:edit>

* Following options are available on hovering with toolbaar:
• Upload
• Edit with Clarkii (displays the Clarkii image editor)
• Clear

5. ASSET FIELDS(Single Valued):
* Instead of calling templates with render:calltemplate use insite:template; provide proper                                  c,cid,fieldname
* fieldname values can change for
- type:asset subtype:AVIArticle --> fieldname="attribute_name"
- association --> fieldname="Association-named:<associationName>"
- parent asset --> fieldname="Group_<parentDefinitionName>"

6. NUMBER FIELDS(i.e. integer, double and money):
* For example: attribute_name=price
* Create currency object and display with insite edit as followed:
<currency:create name="curname" isocurrency="USD" separator="comma|dot|default"/>
<currency:getcurrency varname='curout' name="curname" value='<%=price %>'/>

<insite:edit field="price" value='<%=ics.GetVar("curout")%>' params="{currency:'USD'}"/>

7. MULTIVALUED FIELDS
* When dealing with multivalued fields, beyond editing the existing values, editors need to access                       more features such as:
• adding a new value
• removing an existing value
• reordering existing values

a) Editing Multivalued Text Fields (having CKEDITOR)
* Editing all the text fields (attribute type - text (MULTIPLE))
* Following code just enables to edit every text list

<ics:listloop listname="teaserList">
<ics:listget listname="teaserList" fieldname="#curRow" output="currentRowNb" />
<insite:edit assetid='<%=ics.GetVar("cid")%>' 
assettype='<%=ics.GetVar("c")%>'
field="teaserText"
list="teaserList"
column="value"
index='<%=ics.GetVar("currentRowNb")%>'
editor="ckeditor" />
</ics:listloop>

* Following code includes adding, removing, and reordering values

<insite:list field="teaserText"
editor="ckeditor"
assetid='<%=ics.GetVar("cid")%>'
assettype='<%=ics.GetVar("c")%>'>
<ics:listloop listname="teaserList">
<insite:edit list="teaserList" column="value" />
</ics:listloop>
</insite:list>

* In the case of asset reference fields, we will use the insite:slotlist tag instead of the insite:list tag.
 In this case, rather than nested insite:edit tags, we will have nested insite:calltemplate tags.
 
<insite:slotlist field="relatedStories">
<ics:listloop listname="relatedStories">
<ics:listget listname="relatedStories" fieldname="value" output="articleId" />
<insite:calltemplate tname="Summary/SideBar" c="AVIArticle"                                                                          cid='<%=ics.GetVar("articleId")%>' />
</ics:listloop>
   </insite:slotlist>

INFO:

  • This examples were simple taken from Oracle WebCenter Sites developer guide.
  • All asset types, examples and attributes were used from AVISPORTS site.
  • User was given all sites privileges and roles to AVISPORTS site.
----------------------------------------------------
SUGGESTIONS/COMMENTS ARE INVITED
----------------------------------------------------

No comments: