图书馆日历平台开发研究

2015-12-31 09:13刘悦如余育仁张宗斌
图书馆论坛 2015年4期
关键词:视图网页图书馆

刘悦如,余育仁,张宗斌

图书馆门户网站是提供图书馆服务的有效途径之一。结合读者需求在图书馆门户网站增添新服务,能够展现图书馆不断革新的服务理念,不断提升图书馆的服务质量。在图书馆门户网站增加日历栏目,可以帮助读者了解图书馆的日程安排,更好地利用图书馆服务,提高图书馆服务效率。上海财经大学[1]、武汉大学[2]、美国西北大学[3]等国内外高校图书馆网站均制作了图书馆日历。笔者研究国外12所高校图书馆日历的表现内容,结合我国特色制定图书馆日历显示方案;利用开源软件PHP+Apache+MySQL和Fullcalendar插件,制作图书馆日历平台。

1 国外图书馆日历分析

美国西北大学图书馆(Northwestern University Library)日历以月视图的形式展开,在活动日当天用简单词组简述事件概要:若读者对该事件感兴趣,点击事件,出现下拉提示框,详细说明事件的开始、结束时间和详细链接。爱尔兰克科大学图书馆(UCCLibrary)日历[4]以月视图形式展开,但在视图上不显示事件:若当天有事件,标显绿色小点;点击日期打开新网页,详细描述该日事件。哥伦比亚大学图书馆(Columbia University Libraries)日历[5]以月视图展现,显示内容是图书馆开放时间,类似的有美国康涅狄格州立大学Elihu Burritt图书馆日历[6]、佐治亚理工学院图书馆(Georgia Tech Library)日历[7]、加利福尼亚大学图书馆(UCILibraries)日历[8]、南康涅狄格州立大学图书馆(Hilton C.Buley Library)日历[9]。有些大学图书馆日历略有不同,用不同形式显示图书馆的开放时间。佛罗里达湾海岸大学(FGCULibrary)[10]以周视图的形式显示图书馆开放时间。普林斯顿大学图书馆(Princeton University Library)日历[11]和爱荷华州立大学图书馆(Iowa State University Library)日历[12]以列表形式显示图书馆开放时间。维克森林大学图书馆(Z.Smith Reynolds Library)日历[13]以月视图形式显示图书馆开放时间,当某天有展览等事件时,在开放时间下方描述事件开始时间、事件类型以及事件简单介绍和地点,该馆日历融合显示了事件与开放时间两个特征。哈佛大学图书馆(Harvard Library)日历[14]以列表形式显示当前日期开始的图书馆事件,事件按照时间先后顺序列出,每个事件包括日期、时间、事件概述、事件地点(事件发生所在图书馆)。

总体而言,这些图书馆日历分为三类:以月视图形式显示图书馆事件;以视图或列表形式显示图书馆开放时间;以列表形式显示图书馆事件。

2 同济大学图书馆日历的功能设定

同济大学图书馆参考借鉴国外高校图书馆日历的内容,结合读者习惯,设计功能多样化的日历平台。日历平台用最简洁直观的方式浓缩图书馆事件概要,让读者对图书馆近期的活动计划一目了然,这样有助于读者按照各自需求选择参与事件。日历平台有三种视图,供读者自行挑选。分别为月视图、周视图、日视图。视图中,日历事件分为五种类型:活动、展览、电影、讲座、放假;不同类型的事件用不同的背景颜色标出,用归类的方式作最直观的展示。

图1 月视图

日历平台默认选择月视图,如图1所示,每日的事件仅显示开始时间和事件标题,简洁明了。点击该事件时,自动打开该事件的新闻网页,方便读者了解详细信息。展览、活动或放假事件等非单日事件,可以在月视图上连续表现。月视图结合传统农历,融合显示农历日期与公历日期,方便不同习惯的读者使用日历。这样设定的优点在于,月视图可以在一天内展现多个事件;日历不会因为标题过长而变形;背景色随事件类型改变,一日内的多事件不会显得杂乱无章。

日历平台的周视图,如图2所示,在一张视图上显示一周(7天)的事件重要信息概要,旨在让读者对一周内的事件的重点信息有所了解。周视图中,每日显示事件的开始、结束时间,事件地点,事件标题以及事件的简单描述。点击事件,链接到该事件的新闻网页。周视图中,每日的时间范围为8:00-22:00。日历平台的日视图,如图3所示,一张视图仅显示一天的事件。其他设定同周视图。

3 日历平台实现方法和难点技术

3.1 实现方式

图2 周视图

图3 日视图

日历平台采用PHP+Apache+MySQL的配置。作为开源软件常用的组合方式,以稳定性能好和运行速度快见长。不少图书馆界采用此方案开发系统。胡志刚[15]等利用PHP+MySQL,设计和实现了一种基于服务器和浏览器方式的引文分析系统;张真[16]等在Windows2003环境下,利用PHP+MySql5.0+Apache2.2开发了图书馆微信系统;明尼苏达州大学数字图书馆[17]开发的LibData同样利用开源工具组件Apache、MySQL和PHP创建。在实现日历效果方面,上海财经大学图书馆[1]采用ZOHO Calendar;王辉[18]采用JSP方式实现动态日历。同济大学图书馆日历平台选用FullCalendar[19],适用于日程安排、计划,可方便查看、标记事项。此外,Fullcalendar快速整合性高。

3.2 日历平台的运作流程概览

日历信息在网页前端的展示需要后台的配合,需要馆员结合事件的特点编辑事件的相关信息,如此才能起到日历的效果,让读者一目了然,快捷获悉活动资讯。

图4总结了日历平台运作的流程。馆员在日历平台后台点击日期新建事件,填写事件的详细信息,标题、地点、新闻链接、事件起始时间、事件类型。平台自动赋予该事件唯一索引id;平台根据事件类型赋予事件不同背景色;审核标记mark赋值为0,即false含义。确认提交新建事件后,馆员可预览效果,如不满意可继续编辑,编辑时只能修改事件详细信息和类型字段。通过审核事件,平台赋予审核标记mark字段新值1,即true含义,将所有数据保存至数据库。

读者在前端看到的日历网页是利用SQL从数据库中选取所有通过审核的日历事件,即选择条件为mark=1。读取的数据以JSON数据传入到平台,Fullcalendar自动解析,最后显示在网页前端。

图4 日历平台流程图

3.3 字段设计

针对jQuery插件Fullcalendar的Event Object事件对象属性,设计数据库主要字段见表1。

表1 数据库重要字段

事件的标题(title)、地点(place)控制在10个字以内,用精炼的文字概述事件的主题,力图在日历视图上展现直观简洁的效果,对事件的主要信息有所了解。

事件的类型是多样化的!比如活动、展览、电影、讲座,特别地还有放假通知。利用类型字段(type)和背景颜色字段(color),为每一种类型的事件赋予不同的背景颜色。通过颜色的变幻,让读者更加便捷地关注感兴趣的类型事件。

事件的开始日期默认为日历上的当天日期。图书馆可根据事件的具体安排情况,设定事件的开始时间和结束时间。在月视图上不显示结束时间字段。事件的跨度灵活,可以设定为某个时间段,如电影、讲座;也可以设置为全天;还可以设为连续的多日事件,如国庆节连续三日闭馆的事件。当读者对某一事件感兴趣时可点击事件,自动读取数据库url字段,打开事件的新闻网页,了解事件的详细信息。此外,周视图或者日视图,也可以直观显示事件的详细信息字段(describe)。事件标记字段(mark)是事件的属性,代表事件是否被删除、是否通过审核。由于MySQL不支持布尔类型,mark字段定为int类型。

3.4 技术难点

Fullcalendar内置功能较齐全,通过在网页javascript部分作简单设置就能达到日历的基本要求。根据国人使用的习惯和日历设计需求,在调用插件时对部分功能作修改,最终达到预期的效果。

3.4.1 Fullcalendar的基本设置

日历视图头部设计为:左侧一行列出“上月/下月”和“今天”的三个按钮;中间显示当前日期;右侧提供选择“月视图/周视图/日视图”,默认显示月视图。为了符合国人的习惯,每周的第一天设置为周一。

Fullcalendar读取json数据格式的事件信息,解析后在前台显示日历。Fullcalendar的事件信息封装在文件events.php。点击事件时,自动打开新网页,链接到事件的新闻地址。在周视图和日视图中,每天显示的时间跨度是8点到22点。

3.4.2 事件视图设定——eventAfterRender函数

eventAfterRender是Fullcalendar的回掉函数,是触发事件在日历上的最终摆放位置[19],可以用来编辑显示事件信息。该函数有3个参数:event,element,view。event参数是将被展示的事件;element(元素)可新建一个事件展示样式,或者修改原有样式,亦可以返回空值不显示事件;view参数是视图选项,有月视图,周视图和日视图。合理利用函数,可以根据视图、事件信息特征调用不同样式,多样化显示事件信息。

函数根据view视图判断。当视图为月视图时,即默认视图,仅显示事件的开始时间和事件标题;如事件是全天事件,则不显示开始时间。当视图为周视图和日视图时,根据日历的需求、事件信息的展示详略要求,给予不同的定义。

4 使用效果

同济大学图书馆日历平台,自9月中旬推出测试,在测试范围内获得各类读者喜爱;在读者的建议下修改于11月推出正式版,如图5所示。读者直言,日历平台非常方便记忆关键信息,能够便捷地获悉感兴趣的活动内容;此外对图书馆开放、闭馆时间的安排也有了充分了解。

图5 日历平台正式版

[1] 上海财经大学图书馆[EB/OL]. [2014-09-09]. http://www.lib.shufe.edu.cn/shcd/dzfw/yhpx/201302/t2013 0228_2071.html.

[2] 武汉大学图书馆[EB/OL]. [2014-09-09]. http: //www.lib.whu.edu.cn/web/default.asp.

[3] http://www.library.northwestern.edu/calendar.

[4] UCC Library[EB/OL]. [2014-09-10]. http://booleweb.ucc.ie/index.php?pageID=5.

[5] Columbia University Libraries [EB/OL]. [2014-09-10].http://hours.library.columbia.edu/?library=burke.

[6] Elihu Burritt Library[EB/OL]. [2014-09-10]. http://library.ccsu.edu/ calendar/month.php.

[7] Georgia Tech Library[EB/OL]. [2014-09-10]. http://www.library.gatech.edu/calendar/hours.php.

[8] UCI Libraries [EB/OL]. [2014-09-10]. http: //www.lib.uci.edu/about/hours/hours.html?Dept=lib_gateway.

[9] Hilton C. Buley Library [EB/OL]. [2014-09-10]. http://libguides.southernct.edu/hours.

[10] FGCU Library [EB/OL]. [2014-09-10]. http://library.fgcu.edu/CSD/ calendar.html.

[11] Princeton University Library [EB/OL]. [2014-09-10].http://library.princeton.edu/hours.

[12] Iowa State University Library,[ EB/OL]. [2014-09-10].http://www.lib.iastate.edu/libhours-todayall/6175.

[13] Z. Smith Reynolds Library [EB/OL]. [2014-09-10].https://zsr.wfu.edu/calendar/.

[14] Harvard Library [EB/OL]. [2014-09-10]. http:// library.harvard.edu/ library-calendar.

[15] 胡志刚,陈超美,刘则渊,等. 基于XML 全文数据引文分析系统的设计与实现[J]. 现代图书情报技术,2012(11):77-72.

[16] 张真,丁国峰. 微信在图书馆信息服务中的应用实践———以浙江省高校图书馆为例[J]. 图书馆杂志,2014(3):64-66.

[17] 赵宁,唐振宇,张玲. 国外高校图书馆构建学科服务系统的比较[J]. 图书馆学研究,2014 (4):88-92.

[18] 王辉. 基于JSP 技术的动态日历实现[J]. 现代情报,2005(7):146-148.

[19] FullCalendar [EB/OL]. [2014-09-10]. http://fullcalendar.io.

猜你喜欢
视图网页图书馆
基于HTML5与CSS3的网页设计技术研究
基于CSS的网页导航栏的设计
基于HTML5静态网页设计
图书馆
视图
Y—20重型运输机多视图
SA2型76毫米车载高炮多视图
基于URL和网页类型的网页信息采集研究
Django 框架中通用类视图的用法
去图书馆