Creating a Knowledge Directory Adaptive Page Layout

The Knowledge Directory adaptive page layout defines the content area of the Knowledge Directory. The outer area (header, footer, navigation areas) is based on the Base Page adaptive layout.

All content in the Knowledge Directory can be displayed using tags in the pt:kdpage library. The tags in this library can only be used in the Knowledge Directory page layout.

Data about the folder in the Directory can be accessed using the currentfolderdata and subfoldersdata tags.
Data about each folder's contents can be accessed using the documentsdata and relatedresourcesdata tags.
This data can be arranged in a useful way using the documentcolumnheadersdata, paginationdata, documentfilterdata, and documentsperpagedata tags.

The example below uses tags from the pt:kdpage library to define Knowledge Directory page components, and logic tags to handle iteration and display.

For an overview of adaptive tags, see About Adaptive Tags.
For an introduction to logic tags, see Logic Adaptive Tag Library (pt:logic).
For a list of tags in the pt:kdpage library, see . http://download.oracle.com/docs/cd/E13183_01/en/alui/devdoc/docs6x/api_libraries/tagdocs/ali/6.5/kdpage/tld-summary.htmlFor a complete list of tags, see the 6.5 tagdocs (http://download.oracle.com/docs/cd/E13183_01/en/alui/devdoc/docs6x/api_libraries/tagdocs/ali/6.5/index.html).

Note: This example has been oversimplified for illustration purposes; for a complete implementation of the Knowledge Directory page layout, see the knowledgedirectorylayout.html file in the \imageserver\plumtree\portal\private\pagelayouts folder on your ALI image server.

The first section of the page retrieves the folder data.

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

<div id="content" xmlns:pt='http://www.plumtree.com/xmlschemas/ptui/'>
    <pt:kdpage.currentfolderdata pt:id="currentfolder"/>
    <pt:kdpage.paginationdata pt:id="pagination" pt:pageslist="pageslist" pt:pagestodisplay="2"/>
    <pt:logic.variable pt:key="currentfolderlevel" pt:value="$currentfolder.level"/>
    <pt:logic.stringexpr pt:expr="($currentfolderlevel) == 1" pt:key="isrootfolder"/>

After the breadcrumbs section (not shown here), the next section implements the column display. This section defines an index and divid for each column (3 in this example) The code iterates over the subfolders to display each folder in the correct column, using logic tags to divide the subfolder index by the number of columns to determine which column to display each folder. To change the number of columns, you would add or remove folders from the <pt:logic.collection pt:key=”foldercolumns”> section and change the divisor in the <pt:logic.intops pt:expr="($subfolderindex) % 3" pt:key="col"/> expression to reflect the correct number of columns.

... breadcrumbs section ... 

	<!-- Start Root Folder Display -->
	<pt:logic.if pt:expr="$isrootfolder">
	<pt:logic.iftrue>
		<pt:logic.variable pt:key="displayrelatedresource" pt:value="false"/>
		<div id="ali-kd-main-bar">
		</div>

		<pt:core.comment>This collection contains the meta-data about the 3 subfolder columns.</pt:core.comment>

		<pt:logic.collection pt:key="foldercolumns">
			<pt:logic.data index="0" divid="ali-kd-main-col1"/>
			<pt:logic.data index="1" divid="ali-kd-main-col2"/>
            <pt:logic.data index="2" divid="ali-kd-main-col3"/>
		</pt:logic.collection>

		<!-- Displaying Columns Start -->
		<pt:logic.foreach pt:data="foldercolumns" pt:var="foldercolumn">

			<pt:kdpage.subfoldersdata pt:id="subfolders"/>
			<pt:logic.collectionlength pt:data="subfolders" pt:key="flength"/>
			<pt:logic.intexpr pt:expr="($flength) > 0" pt:key="hasfolders"/>

			<pt:logic.if pt:expr="$hasfolders">
				<pt:logic.iftrue>

					<pt:core.html pt:tag="div" id="$foldercolumn.divid">
						<!-- Display Each Folder Start -->
						<pt:logic.foreach pt:data="subfolders" pt:var="subfolder">
							<pt:logic.intops pt:expr="($subfolderindex) % 3" pt:key="col"/>
							<pt:logic.intexpr pt:expr="($col) == ($foldercolumn.index)" pt:key="incol"/>
							<pt:logic.if pt:expr="$incol">
								<pt:logic.iftrue>
									<div class="ali-kd-main-header">
									    <pt:logic.variable pt:key="htmlEncodedName" pt:value="$subfolder.name" pt:encode="1" />
										<pt:core.html pt:tag="a" href="$subfolder.url" title="$htmlEncodedName">
											<pt:logic.value pt:value="$subfolder.name"/>
										</pt:core.html>
									</div>
									<!-- Display Subfolders Folder Start -->
									<pt:logic.variable pt:key="subsubfolderskey" pt:value="$subfolder.subsubfolderskey"/>
									<pt:logic.collectionlength pt:data="$subsubfolderskey" pt:key="flength"/>
									<pt:logic.intexpr pt:expr="($flength) > 0" pt:key="hassubsubfolders"/>
									<pt:logic.if pt:expr="$hassubsubfolders">
										<pt:logic.iftrue>
											<div class="ali-kd-main-lists">
												<ul>
													<pt:logic.foreach pt:data="$subsubfolderskey" pt:var="subsubfolder">
														<pt:core.comment><!-- Only display max 5 subfolder --></pt:core.comment>
														<pt:logic.intexpr pt:expr="($subsubfolderindex) < 5" pt:key="undermax"/>
														<pt:logic.if pt:expr="$undermax">
														<pt:logic.iftrue>
															<li>
																<pt:logic.variable pt:key="htmlEncodedName" pt:value="$subsubfolder.name" pt:encode="1" />
																<pt:core.html pt:tag="a" href="$subsubfolder.url" title="$htmlEncodedName">
																	<pt:logic.value pt:value="$subsubfolder.name"/>
																</pt:core.html>
															</li>
														</pt:logic.iftrue>
														</pt:logic.if>
													</pt:logic.foreach>
												</ul>
											</div>
										</pt:logic.iftrue>
									</pt:logic.if>
								</pt:logic.iftrue>
							</pt:logic.if>
						</pt:logic.foreach>
						<!-- Display Each Folder End -->
					</pt:core.html>

				</pt:logic.iftrue>
			</pt:logic.if>
		</pt:logic.foreach>
		<!-- End Display Columns -->
	</pt:logic.iftrue>
	<!-- End Root Folder Display -->

After the sorting and filtering section (not shown here), the next section displays the document list and content.

		<!-- Start Document List and content -->
		<div id="ali-kd-content-container">
			<div id="ali-kd-documents">
			    <div id="ali-kd-docs-showing">
			    	<pt:logic.value pt:value="$#1932.ptmsgs_portalbrowsingmsgs"/>
			    	<pt:logic.value pt:value="$pagination.start"/>
			    	-
			    	<pt:logic.value pt:value="$pagination.end"/>
			    	<pt:logic.value pt:value="$#811.ptmsgs_portalbrowsingmsgs"/>
			    	<pt:logic.value pt:value="$pagination.total"/>
			    	<pt:logic.value pt:value="$#1043.ptmsgs_portalbrowsingmsgs"/>
			    </div>

... edit document code ... 

             <!-- Start display documents -->
					    <pt:logic.foreach pt:data="docs" pt:var="doc">
                            <pt:logic.variable pt:key="htmlEncodedName" pt:value="$doc.name" pt:encode="1" />
                            <tr>
                                <!-- Document Image Icon -->
                                <td><pt:core.html pt:tag="img" src="$doc.imagesrc" alt="$htmlEncodedName"/></td>
                                <td>
                                    <!-- Document Title -->
                                    <p class="ali-kd-docs-title">
	                                    <pt:logic.variable pt:key="htmlEncodedName" pt:value="$doc.name" pt:encode="1" />
	                 	                <pt:core.html pt:tag="a" href="$doc.url" title="$htmlEncodedName"><pt:logic.value pt:value="$doc.name"/></pt:core.html>
	                                </p>
	                                <!-- Document Description -->
	                                <p>
	                        	        <pt:logic.variable pt:key="description" pt:value="$doc.description"/>
	                                    <pt:logic.stringexpr pt:expr="($description) == EMPTY_STRING" pt:key="nodescription"/>
	                                    <pt:logic.if pt:expr="$nodescription">
	                                        <pt:logic.iftrue>
	                                            <i><pt:logic.value pt:value="$#832.ptmsgs_portalbrowsingmsgs"/></i>
	                                        </pt:logic.iftrue>
	                        	            <pt:logic.iffalse>
	                        	                <pt:logic.value pt:value="$doc.description"/>
	                                        </pt:logic.iffalse>
	                                    </pt:logic.if>
	                                </p>
                                    <p class="ali-kd-docs-modified">
	
... pagination code ...

	        <div id="ali-kd-side">
		        <ul id="ali-kd-subfolder">
	            <pt:kdpage.subfoldersdata pt:id="subfolders"/>
		        <pt:logic.collectionlength pt:data="subfolders" pt:key="flength"/>
		        <pt:logic.intexpr pt:expr="($flength) > 0" pt:key="hasfolders"/>
		        <pt:logic.if pt:expr="$hasfolders">
			        <pt:logic.iftrue>
				        <pt:logic.value pt:value="$#1931.ptmsgs_portalbrowsingmsgs"/>
			            <pt:logic.foreach pt:data="subfolders" pt:var="subfolder">
			    	        <li>
			    	            <pt:logic.variable pt:key="htmlEncodedName" pt:value="$subfolder.name" pt:encode="1" />
						        <pt:core.html pt:tag="a" href="$subfolder.url" title="$htmlEncodedName"><pt:logic.value pt:value="$subfolder.name"/></pt:core.html>
					        </li>
				        </pt:logic.foreach>
			        </pt:logic.iftrue>
		        </pt:logic.if>
		        </ul>

...related resource display code ...

	</pt:logic.iffalse>
    </pt:logic.if>
</div>
<!-- End documents view -->

For details on configuring adaptive page layouts in the portal, see the AquaLogic Interaction Administrator Guide.

Parent topic: About Adaptive Page Layouts (ALI 6.5)

AquaLogic User Interaction Development Guide

Creating a Knowledge Directory Adaptive Page Layout