Metro：开发日记 - zhonglong/TPV GitHub Wiki

七月五日

Play Releases
https://www.playframework.com/releases
Play Change Log
https://www.playframework.com/changelog

七月一日

Chrome/Chrumium浏览器默认最小字号是12px，导致地图线路站点拼音显示太大不协调，打开浏览器“设置”-“自定义字体”来调整最小字号。

CEF3通过 CefBrowserSettings 来设置最小字号。

CefBrowserSettings browser_settings;
browser_settings.minimum_font_size = 6;
browser_settings.minimum_logical_font_size = 6;
CefBrowserHost::CreateBrowser(window_info, handler, url, browser_settings, NULL);

六月十九日

cefsimple客制化：

wWinMain
  • 加载 loading.html 作为默认页
  • 通过 cmslang.txt 保存和读取默认语言
SimpleApp
  • 设置窗口名称和大小（最大化）
SimpleHandler
  • 出错处理，超过100次自动退出应用
  • 各种回调，例如下载，右键菜单等

六月十三日

从 http://opensource.spotify.com/cefbuilds/index.html 下载CEF3源代码，版本号过滤：3.2840.1518。

CEF General Usage(CEF3预览)
https://github.com/fanfeilong/cefutil/blob/master/doc/CEF%20General%20Usage.md

六月十二日

SmartMRT.exe為CefSimple稍微加個Icon，加上Download/Upload 視窗等修改而成。 而CefSimple又是CEF 3(Chromium Embedded Framework) 的應用。 之前的原始碼放在 \172.17.2.17\home\genebuild\media\500a\MetroShare\SmartMRT.exe_source_code (cef_binary_3.2840.1518.gffd843c_windows32_smartmrt_ots.7z) 原始碼可使用Visual Studio Express 2013 for Windows Desktop 開啟。

CefSimple build出來的exe檔，直接覆蓋至bin.7z裡的SmartMRT.exe，即可使用。 bin.7z 裡其他的dll檔，為CEF本身，也就是Chromium核心，若非必要，建議不需要重新Build CEF (libCEF)。 build 一個CefSimple應用，僅需不到幾分鐘時間，而build一個完整的CEF需耗掉數個小時。

若需要重新build CEF 請參考附件，Source code如官網。 當初是為了支援mp4撥放而自己重新build CEF，官網build好的CEF不支援mp4撥放。 要build支援mp4撥放的CEF，要設置這些參數。 set GN_DEFINES=is_official_build=true proprietary_codecs=true ffmpeg_branding=Chrome set GYP_DEFINES=buildtype=Official proprietary_codecs=1 ffmpeg_branding=Chrome

可參考 http://opensource.spotify.com/cefbuilds/index.html CefSimple Windows 32-bit Builds Standard Distribution https://bitbucket.org/chromiumembedded/cef/src/master/ (CEF) https://www.cnblogs.com/think/archive/2011/10/06/CEF-Introduce.html

六月四日

VLC播放器回调函数：

  • MediaPlayer.EventListener
  • Media.EventListener

Media.EventListener触发频率更高，包括：

    public static final int MediaChanged = 256;
    public static final int Opening = 258;
    public static final int Buffering = 259;
    public static final int Playing = 260;
    public static final int Paused = 261;
    public static final int Stopped = 262;
    public static final int EndReached = 265;
    public static final int EncounteredError = 266;
    public static final int TimeChanged = 267;
    public static final int PositionChanged = 268;
    public static final int SeekableChanged = 269;
    public static final int PausableChanged = 270;
    public static final int LengthChanged = 273;
    public static final int Vout = 274;
    public static final int ESAdded = 276;
    public static final int ESDeleted = 277;
    public static final int ESSelected = 278;

六月一日

福清开会提出，设计上不能通过锁定IP范围,此点和现有设计不同. 因此陆续移除代码中对IP的依赖，最新代码不再通过IP地址区分图文屏和地图屏，而是采用屏幕宽高比，以3为分界线，低于3代表图文屏，高于3代表地图屏（条形屏）。

支持的分辨率有：

  • 图文屏：1920x1080
  • 地图屏：1920x360，1920x290

五月三十日

地铁案IP地址规划：

  • PC：信发系统，固定用 192.168.101.8
  • 地图屏：按照《M37C拨码说明-V1.3.pdf》，由拨码板指定IP地址，用于定位车厢号和左右位置
  • 图文屏：由PC端DHCP服务指定网段，现阶段先配置静态IP地址

后续不再根据IP地址来区分地图屏和图文屏。

五月二十九日

PC端集成CEF（Chromium Embedded Framework）内核来渲染网页，基于 Chromium 54 版本，从时间点来看是在2007年上半年。

Chromium Embedded Framework (CEF) Automated Builds
http://opensource.spotify.com/cefbuilds/index.html

五月二十四日

Android端设置界面，视频同步增加一个Enable开关，配合Master开关，作用于多台设备间的视频同步。 其中必须有一台作为Master，其它作为Slave；当只有一台时必须将Enable关闭，否则无法播放视频。

五月二十二日

手机字体偏大问题的分析 Android端 通过WebSettings.setTextSize接口，可以将字体调小，但是显示偏上（没有居中），故不采用。

网页端 涉及三个JavaScript文件，

  • standard_elements_render.js，解析pagejson.js布局文件
  • layout.js，页面布局，创建text等各种widget，如createStaticText方法
  • sizelab.js，三方库，分辨率自适应相关，通过 addClass('sizelab_reCssFont') 样式来实现

测试发现，PC端会走sizelab.js，故字体大小会随页面分辨率缩放，显示正常；但Android端没有走sizelab.js，故字体大小是按1920x1080来显示的，低于此分辨率的屏幕字体显示都偏大。注意Android端网页取得的屏幕宽高是以dp为单位的。

目前对策是修改standard_elements_render.js，针对Android端手动调整字体大小。

function hdpiFontSize(fontsize) {
    if (isRunningOnAndroid) {
        return fontsize * viewportW() / sizelab_baseWidth;
    } else {
        return fontsize;
    }
}

五月二十日

smartmrt/publish目录下，扩展名为.cms的文件就是推送到Android端的节目包，这是个压缩文件，解压密码是：philips（全小写）。

五月十五日

修改 SmartMRT.nsi 打包脚本，跳过选择安装路径，默认安装到C盘（之前已提及不能安装到其它盘）。 详见skipChoseDirectory函数：

Function skipChoseDirectory
    ${If} $VERSION_COMP_RESULT == 1 
        Abort ; dont allow to change directory install
    ${EndIf}
    ${If} $VERSION_COMP_RESULT == 0
        Abort ; dont allow to change directory install
    ${EndIf}
    ${If} $VERSION_COMP_RESULT == 3
        Abort ; dont allow to change directory install
    ${EndIf}
FunctionEnd

SmartMRT数据库，用户名/密码：root/Ab123456，端口：33369，可用phpStudy带的 SQL-Front 工具查看。

五月十四日

源码 cmsserver 目录下新增一个 precompile.bat 脚本，（打包前）双击进行预编译。 优点：不受PC其它Java版本的影响，也无需修改环境变量。

@echo off
set APPDIR=%cd%
set PLAY_DIR=%APPDIR%\play
cd %PLAY_DIR%
set JAVA_HOME=%APPDIR%\jre
play precompile apps\smartmrt

参考 startplay.bat 脚本。

五月十日

Android端节目包有两层index.html，外层index.html通过iframe加载内层的index.html，因此依赖 layout.schedule.js（外层） 和 std/standard_elements_render.js （内层）来相互通信（例如js函数调用）。 故地图屏模板中加入 std/standard_elements_render.js 来解决一直停留在欢迎页面的问题。

修改 SmartMRT/cmsserver/play/startplay.bat 文件，将 -Dprecompiled=true 改为 -Dprecompiled=false，可以不做预编译，直接运行。

媒体屏和地图屏通过IP地址范围来区分，

  • 媒体屏：192.168.101.21 ~ 192.168.101.80（小于等于80）
  • 地图屏：192.168.101.81 ~ 192.168.101.100（大于80） 备注：按客户要求，通过拨码板指定地图屏的IP地址，图文屏不做限制

五月九日

地图动画是从左向右移动，还是从右向左移动，与地图屏安装位置有关，以上行列车为例，左侧地图屏动画是从左向右，右侧地图屏动画是从右向左，这样动画都是向着列车前进方向；下行列车则方向相反。 地图屏的左右，通过IP地址末位来区分，奇数是左侧，偶数是右侧。

五月七日

播放器 录播：net.protyposis.android.mediaplayer，硬解，优点是精确的seek操作 直播：org.videolan.libvlc，硬解，UDP组播，配合PC端VLC串流

五月六日

将录播节目模板替换成直播节目模板，涉及到三个文件：

  • canvasimg.png，预览图
  • layout.dbj / layout.json
  • pagejson.js

layout和pagejson文件内容很相似，但感觉起作用的是pagejson，待进一步确认。

  • "type":["android_video"] 改为 "type":["udpvideo"]
  • "data":[...] 改为 "data":[{"elements":[""]}]

为了减少节目包体积，可以删除media目录下的多余文件（视频和视频预览图）。

五月五日

按照《M37C拨码说明-V1.3.pdf》，终端的IP地址末位用于确认设备位置。 每节车厢10个显示屏，6节车厢，占用21~80共60个IP地址。

按照《混合型地鐵顯示屏Demo步驟.docx》，只有终端的IP地址末位在21~180范围内，才会显示在设备管理页面中。

四月三十日

地铁车头控制系统发送实时站点数据，控制页面显示，其调用流程为：

  • TrainControl：封装接口，绑定服务
  • TrainControlService：UDP组播建立，接收数据
  • TrainControlCmd：解析实时站点数据

实时站点数据参考《动态地图-网络通讯协议-V1.2.xlsx》和《北海_LCD动态地图显示器内部通信协议v1.0.docx》，其中序号29~31的三个字节在两份文档描述有差异，代码与《北海_LCD动态地图显示器内部通信协议v1.0.docx》文档一致。

代码中对实时站点只部分信息，根据这些信息来控制网页，

  • 22字节，上下行状态，左右车门开关状态
  • 23字节，离站/停稳状态
  • 25字节，始发站（站点序号从01开始）
  • 26字节，终点站
  • 27字节，当前站（停稳状态下当前站与下一站一致）
  • 28字节，下一站
  • 32~35字节，越战控制

四月二十八日

SmartMRT采用 HTML5WebView 来显示节目，大部分内容都通过网页的方式来展现，播放器等少部分内容通过native方式。

native 和 javascript 通过最简单的方式交互，即：

  • native通过 WebView.addJavascriptInterface 方法注入新的javascript函数，通过这些函数可以访问native方法
  • native通过 WebView.load("javascript:xxx") 方法直接调用javascript函数

具体来说， javascript 调用 native，包括：

  • NativeMarquee
  • NativeImage
  • NativeSlideShow
  • NativeWebpage
  • NativeVideo/NativeVideoWithSync：录播视频
  • NativeUdpVideo：直播视频
  • NativeRemoveAllAndroidViews

native 调用 javascript，包括：

  • reportVideoPlayEnd
  • setstandby
  • setjson，控制数据

四月二十六日

按照《簡易測試串流視頻步驟(透過IP分享器).docx》搭建流媒体服务器， 采用 udp multicast 的方式进行视频直播（串流），点击下方的“循环”图标可实现无间断的流媒体。 对于性能较差的PC，串流时激活转码会导致CPU负载高，影响终端流媒体的流程度。应先对视频做转码，再进行串流。

四月二十五日

阶段性总结，以下涉及的资料都上传在：\172.20.30.16\public\share\地铁系统demo

按照《混合型地鐵顯示屏Demo步驟.docx》搭建演示环境，

  1. 接著安裝pc_tools\SmartMRT_0.0.2_(20171016103837)_CN_T.exe，不能修改默认路径，否则会有各种问题，例如有些图片无法显示，终端无法注册，节目无法预览等；
  2. 安裝完成後，點擊 注入長沙地鐵四號線站點資訊\inject_ChangSha_L4.bat (免除手動輸入站點資訊的步驟)，这一步不需要，本来就已经有这些数据；
  3. 目前只有在設備IP位址在192.168.101.21 – 192.168.101.180 才會出現在此頁，若超出該範圍則不顯示。此场景对网络有要求，SCMOBILE路由器已按要求配置，请连到这个路由器上测试；

启动SmartMRT可双击exe，或者在浏览器地址栏中输入 “http://localhost:18888” ，服务端LOG保存在 cmsserver\play\apps\smartmrt\logs 目录下。

按照《簡易測試地鐵訊號說明(透過IP分享器).docx》发送站点数据， 节目推送到Android端，默认是欢迎界面，通过《網路調適助手3.7.exe》发送站点数据才能正常播放。

  1. IP位址確認完之後，勾選「Data from file….」選擇要模擬的發送資料，站点数据采用《M37B-上行全程-(01-19)長沙四號線.txt》。
  2. 接著在「RemoteIP」欄位填入「234.6.6.6」，在「RemotePort」欄位填入「20480」，先点击左侧的“连接”按钮才会出现IP地址框。

四月二十四日

跟台北同仁确认，SmartMRT采用 play framework （1.2.7版本）工具编译，这是Java语言的Web服务器（类似tomcat）。

根据官网的文档，配置好JRE路径后可以使用play命令创建或者运行新项目。特别注意的是 play framework 1.2.7 最高支持到JRE 1.7，而且对环境变量 %Path% 优先于 %JAVA_HOME%/bin 。

The High Velocity Web Framework For Java and Scala
https://www.playframework.com/documentation/1.2.7/home

四月二十三日

从 SmartMRT.7z 可以找到台北提交代码的SVN，

http://172.17.1.7/CloudCMS/
http://172.17.1.7/metromap/SmartMRT