浅析Lotus Connections 2.0的定制-技术开发专区

浅析Lotus Connections 2.0的定制

作者：IT168 张明编辑：李倩 2008-10-28 10:54 来源：IT168�

【IT168 专稿】

　　在当今互联网的世界里，Web 2.0技术已经发展得如火如荼，随之产生的博客、社会书签、社区等已经逐渐改变人们社会交往的沟通方式。大家慢慢习惯了在博客中发表自己的见解，通过评论和其他人交流；使用社会书签来标记感兴趣的内容，并与其他人分享；在论坛中与专家进行讨论。对于企业而言，如何发挥员工的积极性，在企业内部提供同样基于Web 2.0技术的沟通平台，激发员工的创造性，从而促进企业的业务发展，已经成为企业CEO越来越重视的问题。

　　IBM Lotus Connections是由IBM公司推出的业界第一款企业级的社会网络解决方案，采用了大量Web 2.0技术，帮助企业用户能够轻松与组织内部的专家、同事进行沟通，分享彼此的观点，发起协作和创新。在Lotus Connections 2.0版本中，包含个人档案（Profiles）、活动（Activities）、博客（Blog）、社区（Communities）、社会书签（Dogear）和主页（Homepage）六大功能组件：

　　个人档案：专家定位系统，帮助用户轻松快速的找到企业内部的专家，通过提供的联系信息、工作背景介绍、上下级汇报链、关系网络等功能快速建立对专家和同事的了解；

　　活动：帮助用户轻松地组织日常工作，能够将工作涉及的文档、待办工作、邮件、聊天记录、书签等内容聚合到一起，可以非常方便地与其他人展开共享和工作交流；

　　社区：企业中具有相同兴趣爱好或者技术特长的同事展开讨论的非常好的平台，提供论坛、社区共享标记和订阅源来实现知识共享；

　　博客：员工的个人博客，允许用户发表个人观点和见解，并从其他人那里接收评论和反馈。同时提供博客内容评级的功能来帮助用户快速定位到精品博客；

　　社会书签：帮助用户轻松地组织、保存和共享书签，通过“标签云”的方式为用户提供最直观的热点内容；

　　主页：在Connections 2.0版本中新增加的组件，用于定制其他五个功能组件的组织方式，同时支持将外部的widget添加到其中。

　　随着Lotus Connections产品在企业中的不断应用，对产品的定制和开发的需求也在不断增加。本文主要针对产品的定制进行介绍，希望能够为大家在基于产品进行定制和开发的工作中起到抛砖引玉的作用。

　　Lotus Connections六个组件均采用了基于MVC（MVC是Model－View－Controller的简写，模型-视图-控制器）设计模式的struts开发框架实现，因此熟悉Struts框架的朋友能够非常快速地了解定制的方法。Connections的六个组件作为相互独立的轻量级应用，可以独立部署或者部署到同一WebSphere应用服务器上。在每一个组件中，主要分为导航模块和业务功能模块。以下从这两个部分分别进行介绍：

一、定制页面导航模块

　　对于页面顶部的导航栏，为所有已安装的功能组件实现相互感知的功能，提供快速访问其他组件的链接，为用户提供统一的访问方式。对于导航栏中各个组件访问的地址，可以通过定制配置文件LotusConnections-config.xml完成，在配置文件中定义了各个组件的访问地址和端口号，可以启用或者屏蔽已安装的组件。该文件位于<WAS_HOME>/profiles/<profile_name>/config/cells/<cell_name>/LotusConnections-config/目录下。对于该导航方式的定制，建议使用命令行wsadmin脚本的方式完成。具体的配置方法可以在这里找到。

　　如果您希望向导航栏中加入其他内容，比如添加访问其他系统的链接或者修改企业徽标，是无法通过配置LotusConnections-config.xml完成的，而是需要修改导航模块（sn-coreui.war）中的header.html，该文件位于文件系统<WAS_home>/profiles/<profile_name>/installedApps/<cell_name>/<feature_name.ear>/sn-coreui.war/templates目录下。在header.html中使用了宏来定义徽标图片路径和链接地址等信息，因此修改该文件之后需要进入WebSphere应用服务器的集成解决方案控制台，对导航模块所在的组件重新启动以后修改才会生效。请参考以下对header.html的修改示例：

……

<ul class="lotusInlinelist lotusLinks">
{{application links: li }}
<li><a href="http://yourco.com">企业门户</a></li>
</ul>

……

图1 导航栏修改效果示例

　　对于页面底部的页脚内容，默认包含了产品相关的工具和帮助信息。通过修改footer.html文件来定制其中的内容，例如向页脚中加入段或者企业的徽标等信息。footer.html与header.html位于相同的目录下，其定制方式也与header.html的定制方式完全相同，请参考以下示例：

<table cellspacing="0">
<tbody>
    <tr>
      ……
      <th>{{ label.footer.about.heading }}</th>
      <th class="lotusLast">页脚内容定制</th>
    </tr>
    <tr>
      ……
      <td ><ul id="lotusFooterULAbout">
        {{ footerlink.about.about }}
        {{ footerlink.about.connectionsonline }}
        {{ footerlink.about.submitfeedback }}
      </ul></td>
      <td class="lotusLast"><ul id="lotusFooterULAbout">
        <li><a href="http://www.lotus.com">测试1</a></li>
        <li><a href="http://www.lotus.com">测试2</a></li>
      </ul></td>
    </tr>
</tbody>
</table>

图2 页脚修改效果示例

　　通常，我们需要在各个组件中实现一致的页面导航效果，这样的话就需要使各个组件的导航模块中对页面导航栏（header.html）和页脚（footer.html）的定制保持一致。以上介绍的内容就是对Connections 2.0通用导航模块的定制。

二、定制组件业务功能模块的主题

　　由于各个组件都是基于Struts框架实现，并且均采用了Tiles框架进行页面布局，因此对于各个功能组件主题的定制，其实现机制和定制方法都是类似的。以下我以对Profiles（个人档案）组件的首页为例进行定制的介绍，首先我们看到的这个页面就是个人档案的首页面：

图3 个人档案首页面

　　在文件系统中，我们可以找到其模板页面，是位于<WAS_home>/profiles/<profile_name>/installedApps/<cell_name>/Profiles.ear/peoplepages.war/WEB-INF/jsps/html/layouts/目录下的profilesXColLayout.jsp文件 (X=1/2/3，分别定义框架为1列、2列和3列的页面结构)。个人档案的首页面是框架为2列的页面，对应到profiles2ColLayout.jsp文件。以下我们对其页面代码分为几个部分进行分析。

<%@ taglib prefix="c"   uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt"  uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn"   uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="html" uri="http://jakarta.apache.org/struts/tags-html" %>
<%@ taglib prefix="tiles" uri="http://jakarta.apache.org/struts/tags-tiles" %>
<%@ taglib prefix="bidi" uri="http://www.ibm.com/lconn/tags/bidiutil" %>
<%@ taglib prefix="profiles" uri="/WEB-INF/tlds/profiles.tld" %>
<%@ taglib prefix="tags" uri="/WEB-INF/tags" %>

　　首先，在代码的开始部分引入了相关的标签库，包括JSTL v1.1（JSP Standard Tag Library，JSP 标准标记库）的core库（主要用于迭代和条件控制的基本操作等）、formatting库（用于支持通过资源束实现文本内容本地化，并支持对数字和日期的显示和解析等）、functions库（主要用于与字符串的长度、包含、替换和分隔等操作），Struts的html库（主要用于动态的生成用户输入表单和用户界面等），tiles库（通过模板来组合可复用的组件从而能够动态地生成页面），bidi库（用于显示双向语言），profiles库（提供了个人档案组件的工具类方法），tag库（用于引入一组可重用的页面组件，如登录表单、个人信息编辑页面等）。

　　通过采用标记库的方法组织页面代码，大大简化了代码复杂程度，使代码结构变得非常清晰，提高了代码的可读性。关于标记库的详细说明文档，可以查看在参考资料中给出的链接。

　　第二部分是页面HTML的内容：

……
<head>
    <tiles:useAttribute name="pageTitleKey" scope="request" />
    <title><fmt:message key="${pageTitleKey}" /></title>
    <tiles:insert attribute="frameworkHeader" />
</head>
……

　　在HTML的头部信息中，定义了页面的标题信息（title）和页面框架头部信息（frameworkHeader）。在这里使用了formatting库的<fmt:message>和tiles库的<tiles:useAttribute>和<tiles:insert>标记。

　　为了能够更加清楚了了解页面组织框架，我们首先来看一下Tiles框架在此是如何使用的。对于Tiles框架的使用，我们可以在个人档案组件的struts-config-html.xml中找到定义的tiles插件信息，其中定义了Tiles框架使用的定义文件的位置：

……
<plug-in className="org.apache.struts.tiles.TilesPlugin">
<set-property property="definitions-config" value="/WEB-INF/jsps/html/tiles-defs.xml"/>
</plug-in>
……

　　根据所指向的路径找到tiles-defs.xml，以下是示例代码片段：

……
<definition name="layout.base" path="/WEB-INF/jsps/html/layouts/profiles1ColLayout.jsp">
    <put name="pageTitleKey" value="label.page.profiles" type="string" />
    <put name="frameworkHeader" value="/WEB-INF/jsps/html/tiles/frameworkHeader.jsp" />
    <put name="sceneBanner" value="/WEB-INF/jsps/html/tiles/empty.jsp" />
    ……
    <putList name="jsIncludes">
      <add value="/javascript/prototype/prototype.js" />
      ……
    </putList>
</definition>
……

　　在tiles-defs.xml中定义了页面中所使用组件对应到的JSP文件和相关属性信息。

　　我们可以找到在HTML头部信息中定义的页面标题的名称（pageTitleKey），通过到资源束中查找label.page.profiles关键字对应的值，可以在resources-general.properties属性文件中找到对应的值。该文件被打包在<WAS_PROFILE_ROOT>/installedApps/<cellname>/ profiles.ear/peoplepages.war/WEB-INF/lib/peoplepages.web.jar文件中，位于com/ibm/peoplepages/webui/resources/目录下。由于Lotus Connections产品提供了多语言支持，因此在这一目录下可以找到很多以resources-general开头的属性文件。而对于仅使用中文的用户来讲，只需要查看和定制resources-general_zh.properties中关键字对应的值即可。在这一属性文件中，还可以找到在个人档案组件中页面引用的其他文字。

　　对于HTML头部信息中使用的<tiles:insert>标记，通过引用属性frameworkHeader的方式，来插入所对应的内容。<tiles:insert>标记和<jsp:include>标记具有相同的功能，能够将指定的组件插入到页面中。

　　之后是页面的主体内容（body）：

……
<body class="<tiles:getAsString name="bodyclass" ignore="true" />">
    <tiles:useAttribute name="editableClass" scope="session" />
    
    <div id="lotusFrame" class="<tiles:getAsString name="frameclass" ignore="true" />">
      <tiles:insert attribute="sceneBanner" />
      <tiles:insert attribute="sceneHeader" />
      
      <div id="lotusMain" class="<tiles:getAsString name="mainclass" ignore="true" />">
        <tiles:insert attribute="leftCol" />
        <tiles:insert attribute="scene" />
      </div> 
      <tiles:useAttribute name="contextualHelpList" scope="request" />
      <c:forEach items="${contextualHelpList}" var="contextualHelp">
        <tiles:insert page="${contextualHelp}" />
      </c:forEach>
      <tiles:useAttribute name="jsIncludes" scope="request" />
      <tiles:insert attribute="frameworkFooter" />
      <tiles:insert attribute="sceneFooter" />
    </div> 
</body>
</html:html>

　　同样，我们可以根据在tiles-defs.xml文件中定义的组件和body中定义的页面框架组装出我们在之前所看到的页面。通过采用Tiles框架，可以清晰地看出整个页面的组织结构，分为导航区、标题区、工具栏、主体功能区和页脚区5个部分。从而，可以根据需要找到对应的JSP文件对其中的任意部分进行定制。

图4 个人档案首页面框架图

　　对于个人档案（Profiles）的其他页面或者其他组件的页面来讲，均采用了类似的方式进行页面组织，我们可以采用相同的方法进行定制。首先进入组件的业务模块，在WEB-INF目录下的struts-config.xml或者struts-config-html.xml中找到Tiles框架定义文件tiles-defs.xml；然后根据具体的页面布局，找到对应的布局定义以及页面框架中每一部分对应的JSP文件进行定制。

　　如果您只需要对页面中的主题进行定制（如修改背景或者缺省字体样式等），可以直接对级联样式表进行修改。级联样式表分别保存在每个功能组件对应的导航模块中，位于<WAS_home>/profiles/<profile_name>/ installedApps/<cell_name>/<feature_name.ear>/ sn-coreui.war/common/styles目录下，可以找到defaultTheme.css、core.css和iehacks.css三个主要的CSS文件。其中，defaultTheme.css是最主要的样式定义文件，定义了页面背景和缺省字体的样式，core.css定义了与布局元素相关的样式，iehacks.css中则定义了用于适配不同浏览器而需要的样式。

　　以下以修改导航栏字体样式和主题背景为例，供大家参考：

　　将需要替换的背景图片上传到images路径下，然后对defaultTheme.css文件做出相应的修改：

/* CSS Document */
body{color:#222;background-color:#fbfcfd;background-image:url(images/background.jpg)}
/*** B A N N E R ***/
#lotusBanner ul.lotusLinks li.lotusSelected a, .lotusBanner ul.lotusLinks li.lotusSelected a{color:#666 !important;background-color:#999999}

图5 CSS样式表定制示例效果图

参考资料

Lotus Connections 2.0 信息中心：
http://publib.boulder.ibm.com/infocenter/ltscnnct/v2r0/index.jsp

JSTL v1.1标记库文档：
http://java.sun.com/products/jsp/jstl/1.1/docs/tlddocs/index.html

Programming Jakarta Struts: Using Tiles, Part 3：
http://www.onjava.com/pub/a/onjava/excerpt/progjakstruts_14/index3.html

关注我们