Pointo——同步幻灯片教学系统

成果汇报

                     by 路天一 陈力 陈光辉 魏然

A course project to capture lecture slide and send to multiple client devices(android ios tablet laptop) 

Not translated yet..

一、项目介绍

         在复旦课堂中普遍采用幻灯片教学模式，这种多媒体教学方式提供了极大的便利。但是于此同时产生了这样一种问题：在通识课程或者如讲座、报告等学术活动中，常常会利用较大型的场地，场地大导致了坐在后排的同学看不清楚幻灯片上面的文字。这是一个很普遍而且实际的问题。

    本项目利用计算机作为服务端，开发软件PCPointo，截取电脑屏幕图像，搭建轻量级服务器，开启广播模式供客户端访问；同时，在手机终端开发专用软件MBPointo，作为接收。另外，有了此应用后同学们可以解决在课堂上无法及时抄录笔记，拿起手机拍照又难以拍清楚的困难。

二. 组成部分

（一）协议：

         TCP/IP协议为当前普遍应用的数据传输协议。采用在计算机端搭建轻量级服务器的方式可以直接利用TCP/IP协议。由于传输量少，资源占用可以得到控制。

（二）计算机端：

         我们利用已有截屏软件程序代码作为参考，开发出适应于我们的预期功能的软件，采用截屏后直接将bmp格式图像转码为jpeg格式再存放至轻量级服务器开辟的指定位置作为缓存，这样可以大大减少内存使用率，直接传输jpeg格式图像，这样可以更快发放数据。

         应用功能：

         1.课程登记功能（by 路天一）

         实现了图形界面的用户交互的课程信息录入功能，实现了自动识别屏幕分辨率并截图保存为BMP的功能；实现了将BMP文件转化为JPEG的图像转码功能；维护了5张图像循环的队列；实现了图片差异识别算法，但由于性能原因并未采用；实现了MFC与后台Sqlite数据库的交互功能。

         2.截屏功能（by 路天一）

         （1）可以将截屏图像发送至服务器指定路径；

         （2）可以调整截屏帧数、分辨率；

         （3）循环利用空间，不产生过大硬件负载；

         3. 服务端搭建（by 陈力）

           采用nginx+php+sqlite的服务端配置，于windows平台运行，通过bat脚本由mfc程序控制开启关闭。以php-cgi监听端口的方式处理nginx服务器fastcgi_pass的php数据请求。

         4. 服务端程序（by 陈力）

           编写htm文件进行页面呈现；编写php实现用户登录控制、课程登记、弹幕提交等与数据库交互功能；调用sqlite数据库用于存储课程、人员、弹幕内容信息；通过jquery的animate功能实现弹幕滚动，所有客户端一次可见。

         5.图片差异算法（by 路天一）（未完成）

前台         编译语言：C++；         IDE：Microsoft Visual Studio 2012.

后台         脚本语言：php      服务器：nginx       数据库：SQLite

（三）手机端

         手机应用功能主要为访问指定地址，服务器如果稳定即可保证接入效果。智能机得到普及，所以应用可以有足够的用户。本项目中我们将尝试在Android和ios平台上开发配套应用程序。此项功能是本应用推广的重点，开发过程将非常注重用户体验。

Android端应用程序使用webview组件作为应用程序的核心。WebView(网络视图)能加载显示网页，可以将其视为一个浏览器，它使用了WebKit渲染引擎加载显示网页。实现了以下功能：在用户输入一个网址后，如果是以http开头，则访问该网页；如果是一个IP地址，则通过url = "http://" + url + ":8088/capture/login.htm";的字符串拼接，访问到我们小组所搭建的服务器，并登陆进去以浏览课件，用户在使用程序的过程中随时可以断开连接。用户可以将指定的图片存储到指定的本地目录下，以便日后复习。通过在输入框输入评论语句，发送到服务器端，实现了实时提问、弹幕评论功能。

IOS：首先用户需要输入当前服务器所在的ip地址，通过url = "http://" + url + ":8088/capture/login.htm";的字符串拼接，访问到我们小组所搭建的服务器，以浏览课件，用户在使用程序的过程中随时可以断开连接。用户可以将指定的图片存储到指定的本地目录下，以便日后复习。通过在输入框输入评论语句，发送到服务器端，实现了弹幕评论功能。因为uiwebview组件是objective-C中一个非常常用的组件，当中的功能也很多，通过调用其中不同的功能，可以很轻松地完成后退，屏幕的适应，包括随着屏幕旋转，还有界面的保存等等。非常可惜的是，由于APP想要在苹果商店发布需要99刀，所以这个APP只能够在MAC上进行模拟。

编译语言：Java，Objective C;

编译器： Xcode & Eclipse;

开发平台：Android & iOS

三、性能分析

截屏帧数每秒2.5帧，内存占用240M左右，CPU消耗率较高，运行时风扇转速很快，分析原因是不断执行BMP截屏程序而造成的。

在实际应用时，如果受众人数众多可以放开内存限制，以牺牲空间来换取时间效率和应用性能，这种方式也是软件开发中的常用策略。

在接入测试中，经我们小组六台设备同时接入时，虽然有少许丢帧，基本能满足需求，单一设备每秒流量在100K左右。且测试中服务器运行稳定，php执行正常，数据库交互正常。据理论值，nginx服务器的并发请求数可以达到百的数量级，远远超过apache的负载能力，如网络环境良好，能基本满足课堂教学需求。

四.技术难点

         本项目采用在本机建立轻量级服务器的方式来实现功能，分析本项目的难点于下：

         首先，服务器平台的移植。考虑到多数教师所用操作系统为windows，本程序全部在windows平台搭建，所以需要搭建一个适用于windows的服务器，这其中涉及到服务器配置移植的工作。经过查阅一系列文档后，最终移植成功windows，并以nginx+php+sqlite的服务端方案高效运行服务。

其次，是资源占用问题。搭建在本机上的服务器随着接入用户数的增加，广播的数量会不断增长，并且考虑到幻灯片所需清晰度未采用视屏流这种资源消耗大的模式传输，但是美秒100Kb左右的流量仍然是不小的消耗，对此，我们采用BMP转JPEG的方法以JPEG高保真的优势大幅度压缩图片大小，且通过本机服务器上的空间维护最大可能地减少了资源消耗的问题。另外，如果人数过多导致丢帧严重的情况，也可通过设置每秒帧数和控制接入人数限制加以控制。

另外，数据交互也是一大关键点。Mfc程序与服务端脚本需要共享数据信息，本项目通过sqlite数据库作为中间桥梁，以双向操作数据库的方式完成数据的交互。开始服务时通过sqlite的C语言支持组件，Mfc程序向sqlite写入课程信息；开启服务后，服务端接受客户端表单，通过查询sqlite数据判断课程是否出现在课程列表以做到接入验证。

         图像差异识别算法。判断是否有差异不是已有的简单图像差异判断算法，控制识别时间和范围是最为重要的。不可以简单的识别出来“有差异”即可。如果出现幻灯片动画，每一张截屏画面中就会有整体的位移，但是这些并不应该被识别。这些都是遇到的困难。我们基本完成了差异算法的代码，生成在了一个Compare.lib的静态库文件里。经测试，发现截屏过程耗时太长，截屏运算还没有结束，下一张截屏得到的BMP位图就已经生成好了，所以这样来看，不如直接用新生成的图片去覆盖原图节省时间。最终舍弃了这一内容。

最后是用户体验。本项目的在客户端主要以htm前端页面为主，所以页面的风格与设计尤为重要。为了保证前端显示与后端图像分发，前端提交表单与后端数据库交互等的无刷新更新，本项目采用jquery库的ajax功能实现异步数据交互，保证用户在浏览时无需刷新即可获得最新图像内容。本项目采用css对元素做整体化修饰，保证了内容格式上的一致与整齐。

五、时间安排

六、合作情况

         本次项目中，我们是一个合作良好的团队，既有明确的分工，又有具体的时间安排，按照时间节点逐步完成设计。我们的项目涉及到很多数据交互与接口确定的问题，需要组员间的良好的合作与沟通。我们每周都会进行至少一次的讨论，汇报各自进度，确定交互方式，讨论最新想法。弹幕功能、差异算法等都是在小组讨论与交流中获得的灵感。

我们的项目累计开发时间接近300个小时，先后编写代码大概有6000行左右，工程量较大，但对于我们是一个非常积累经验的经历。

七、后续设想

对于本次项目中尚未解决的图像差异算法、间歇性的丢帧等问题我们也将进一步地研究，试图解决。

本项目已经初步成功，还可考虑进阶功能：用户接入的加密控制，自动生成整理稿功能。

在一系列的更新与完善后，加以美工包装，我们的项目有良好的推广前景。我们后续设想是以复旦作为试点将此应用推广，让该软件真正具有实用性，成为课堂教学中必不可少的辅助软件，并在师生间赢得良好口碑。