2021SC@SDUSC
软件工程应用与实践——OpenMeetings项目分析（六）：本周，开始进行web包下的代码的分析；
下图是openmeetings - web 包下各个类的预览：
java包下是与web功能相对应的java代码，webapp是一个web项目，里面主要包含了项目的前端实现等；
本次先从webapp开始分析；
conf包首先是conf包，conf即configure，意为配置文件；包下仅有一个名为om_ldap.cfg的文件，即定义一些代码中需要用到的常量，以便调试的时候方便进行不同值的测试。
部分代码：
ldap_conn_host=dc2.medint.local ldap_conn_port=389 ldap_conn_secure=falsecss包
此包下主要为层叠样式表文件即CSS文件，用于对html文件进行格式的规定，界面的美化等，此次主要挑里面比较典型的css文件进行分析；
数个images文件夹存放css文件中引用到的图片资源文件；
jquery-ui.css是引入的外部组件库；
jQuery UI 介绍：
jQuery UI 是建立在 jQuery Javascript 库上的一组用户界面交互、特效、小部件及主题。无论是创建高度交互的 Web 应用程序还是仅仅向窗体控件添加一个日期选择器，jQuery UI 都是一个完美的选择。jQuery UI 包含了许多维持状态的小部件（Widget），因此，它与典型的 jQuery 插件使用模式略有不同。所有的 jQuery UI 小部件（Widget）使用相同的模式，所以，只要学会使用其中一个，就可以知道如何使用其他的小部件（Widget）。
jQuery UI 小组件示例：
DatePicker：日期选择器（Datepicker）绑定到一个标准的表单 input 字段上。把焦点移到 input 上（点击或者使用 tab 键），在一个小的覆盖层上打开一个交互日历。选择一个日期，点击页面上的任意地方（输入框即失去焦点），或者点击 Esc 键来关闭。如果选择了一个日期，则反馈显示为 input 的值。
Accordion:在一个有限的空间内显示用于呈现信息的可折叠的内容面板。点击头部展开/折叠被分为各个逻辑部分的内容，就像标签页（tabs）一样。您可以选择性地设置当鼠标悬停时是否切换各部分的打开/关闭状态。基本的 HTML 标记是一系列的标题（H3 标签）和内容 div，因此内容不用通过 Javascript 即可用。
Menu:一个带有默认配置、禁用条目和嵌套菜单的菜单。由一个列表转化成的，添加了主题，并支持鼠标和键盘交互。尝试使用光标键导航菜单。
jQuery UI Example Page2 Accordion
First
11111111Second
22222222Third
33333333Datepicker
Progressbar
Selectmenu
效果截图:
raw-menu.css:
#menu .ui-menu:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#menu .ui-menu .ui-menu-item {
display: inline-block;
margin: 0;
line-height: 1.2em !important;
padding: .2em 2.1em .2em 1em;
font-weight: normal;
}
#menu .ui-menu .ui-menu-item, #menu .ui-menu .ui-menu-item .ui-state-active {
font-weight: bold;
}
#menu .ui-menu .ui-menu-item.sub {
width: 280px;
display: block;
}
#menu .ui-menu .ui-menu-item.top {
border: 0 !important;
}
#menu .ui-menu.ui-widget.ui-widget-content.ui-menu-icons {
border: 0;
}
#menu .ui-menu {
z-index: 10000000;
}
.recording .ui-menu .ui-menu-item {
display: block;
}
.room.menu .ui-menu .ui-menu-item {
padding-left: 5px;
padding-right: 0;
}
.room.menu .top.room.menu.exit {
padding-left: 0;
}
.room.menu.right {
position: absolute;
top: 0;
margin-right: 5px;
right: 0;
display: inline-block;
z-index: 10000001;
}
.room.menu.right .room {
float: right;
padding-top: 5px;
padding-right: 5px;
}
.room.menu.right .room.name {
font-weight: bold;
}
.room.menu.right .room.name.screen {
color: red;
}
.room.menu.right .room.demo {
}
.room.menu.right .icon {
width: 30px;
height: 30px;
background-repeat: no-repeat;
background-position: 5px 5px;
background-size: 22px;
float: right;
padding: 0;
}
.room.menu.right .icon.share {
background-image: url(images/monitor_go.png);
}
.room.menu.right .icon.shared {
background-image: url(images/shared.png);
}
.room.menu.right .icon .profile {
margin-top: 3px;
}
.room.menu.right .icon .profile img {
width: 28px;
}
就是利用css基本语法对html各类元素作样式上的优化，没有什么特别需要说明的，id选择器用#，name选择器用“.”等比较简单明了；
其他css文件作用相同，就不一一进行分析了；
language包此包主要包含了一个文件language.xml用于提供openmeetings系统语言的配置选择信息；
english deutsch deutsch (studIP) french italian portugues portugues brazil spanish russian swedish chinese simplified chinese traditional korean arabic japanese indonesian hungarian turkish ukrainian thai persian czech galician finnish polish greek dutch hebrew catalan bulgarian danish slovak bengali
结构清晰明了，用lang标签为各类语言加上了id以及code。
public包此包下包含了一些公用的资源，图片标签，聊天时的一段音频等
streams包此包同样只用一个hibernate包含了一个wav格式的音频文件；
Hibernate是一个开放源代码个全自动的orm框架，hibernate可以自动生成SQL语句，自动执行，使得Java程序员可以随心所欲的使用对象编程思维来操纵数据库。 Hibernate可以应用在任何使用JDBC的场合，既可以在Java的客户端程序使用，也可以在Servlet/JSP的Web应用中使用，最具革命意义的是，Hibernate可以在应用EJB的JavaEE架构中取代CMP，完成数据持久化。
WEB-INF包WEB-INF:
/WEB-INF/web.xml
Web应用程序配置文件，描述了 servlet 和其他的应用组件配置及命名规则。
/WEB-INF/classes/
包含了站点所有用的 class 文件，包括 servlet class 和非servlet class，他们不能包含在 .jar文件中。
/WEB-INF/lib/
存放web应用需要的各种JAR文件，放置仅在这个应用中要求使用的jar文件,如数据库驱动jar文件。
/WEB-INF/src/
源码目录，按照包名结构放置各个Java文件。
/WEB-INF/database.properties
meta-INF:
所谓meta-INF, 就是存放一些meta information相关的文件的这么一个文件夹, 一般来说尽量不需要自己手工放置文件到这个文件夹。也就是说这个文件夹应该被看作是JAVA工程的一个内部meta目录，所以这个目录下的文件应该都是build工具来生成的。我们自己的文件应该直接放到根目录下或者其他的子目录中。
根据官方的JAR file specification(), 一个典型的meta-INF目录下可能包含如下几种文件或者子目录：
- MANIFEST.MF
- INDEX.LIST
- x.SF
- x.DSA
- services/
相当于一个信息包，目录中的文件和目录获得Java 2平台的认可与解释，用来配置应用程序、扩展程序、类加载器和服务
manifest.mf文件，在用jar打包时自动生成。
而观察此项目的web-inf包，可以看到大体结构与上述相同：
需要注意的是：
red5-web.properties是properties配置文件，用于存储一些配置信息，避免代码重复，
而下面的red5-web.xml和applicationContext.xml以及cxf-servlet.xml都包含一个绿色叶子图标，表明了是Spring的xml配置文件，利用Spring容器来管理各种bean的实例。
Spring框架是一个开放源代码)的[J2EE应用程序框架，由Rod Johnson发起，是针对bean的生命周期进行管理的轻量级容器（lightweight container）。 Spring解决了开发者在J2EE开发中遇到的许多常见的问题，提供了功能强大IOC、AOP及Web MVC等功能。
例子：red5-web.xml
beans属性用来导入依赖以及声明命名空间；
下面每个bean标签都是一个bean的实例；
总结至此，webapp包下的代码便分析完毕，下周开始分析web包下的java代码，代码量是之前webservice包下java代码量的数倍，分析起来应该会有不少麻烦，需要加大精力的投入。
