一种基于HTML5的IPTV播放器渲染方法及播控方法技术

本发明专利技术提供一种基于HTML5的IPTV播放器渲染方法及播控方法，包括两种不同的渲染模型，分别为小视频渲染模型和全屏渲染模型，在浏览器内部通过接口定义语言Interface Description Language创建MediaPlayer扩展JS对象，包括IPTV规范中的setVideoDisplayArea、playFromStart、joinChanel、setVideoDisplayMode和setSingleMedia。本发明专利技术解决了现有IPTV小视频无法做到嵌入网页渲染，不能通过CSS或者扩展属性对其调整层级等操作；对于复杂页面，存在网页遮住小视频的情况，这样须依赖前端UI设计人员修改或者终端设备的兼容性才能正常显示的问题。

【技术实现步骤摘要】
一种基于HTML5的IPTV播放器渲染方法及播控方法
本专利技术涉及HTML5
、播放器渲染
，更具体地涉及一种基于HTML5的IPTV播放器渲染方法及播控方法。
技术介绍
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准，是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。IPTV即交互式网络电视，是一种利用宽带有线电视网，集互联网、多媒体、通讯等多种技术于一体，向家庭用户提供包括数字电视在内的多种交互式服务的崭新技术。现有IPTV播放器不支持标签播放，不支持小视频嵌入网页中，不支持播放器在网页渲染层级中任意调整，小视频时会存在被遮挡情况且前端开发人员无法操作。因此，有必要提供一种基于HTML5的IPTV播放器渲染方法及播控方法，以克服上述问题。
技术实现思路
本专利技术提供了一种基于HTML5的IPTV播放器渲染方法及播控方法，以解决现有IPTV小视频无法做到嵌入网页渲染，不能通过CSS或者扩展属性对其调整层级等操作；对于复杂页面，存在网页遮住小视频的情况，这样须依赖前端UI设计人员修改或者终端设备的兼容性才能正常显示的问题。为解决上述技术问题，本专利技术所采用的技术方案是：一种基于HTML5的IPTV播放器渲染方法，包括两种不同的渲染模型，分别为小视频渲染模型和全屏渲染模型，小视频渲染模型过程为：a1.创建播放器，并设置播放模式为小视频，设置小视频的位置和大小；a2.创建surfacetexture，并设置为播放器的输出；a3.当播放器成功播放后，播放器解码数据输出到surfacetexture；a4.解码数据输出到surfacetexture后引起浏览器中的合成器进行重绘，与网页Layer一起合成；a5.合成后，播放帧数据输出到窗口缓存；全屏渲染模型过程为：b1.创建播放器，并设置播放模式为全屏；b2.创建独立于网页层级之外的surfaceview，并设置为播放器的输出；b3.当播放器成功播放后，播放器解码数据输出到surfaceview；b4.由安卓系统的窗口合成器SurfaceFlinger完成视频帧的显示，而网页层的网页Layer则合成输出到窗口缓存，完成网页的显示。进一步地，小视频渲染模型中，创建播放器时，在浏览器中把播放器视频帧输出作为网页层级的一部分，在合成器中单独创建一个videolayer并插入到渲染层级树layertree中。进一步地，小视频渲染模型中，通过OpenGL为对应播放器创建一个surfacetexture作为播放器的解码输出，绑定到之前创建的videolayer中。进一步地，小视频渲染模型中，当播放成功后播放数据帧就直接输出到surfacetexture中，同时引起浏览器中合成器进行重绘，播放帧数据就输出到合成器中的layertree中，与网页UI其它layer一起输出到窗口缓存中，网页和视频就作为同一帧输出到屏幕。进一步地，全屏渲染模型中，如果页面创建播放器是通过video标签，则可以通过标准的video标签使用方法。进一步地，全屏渲染模型中，通过设置video标签的css全屏样式大小来设置全屏。进一步地，全屏渲染模型中，如果页面创建播放器是通过IPTV规范MediaPlayer扩展对象，则全屏依赖IPTV标准的JS播放接口setVideoDisplayMode来设置播放器显示模式，此时隐藏的video标签位置和大小就会进入全屏状态。一种基于HTML5的IPTV播放器播控方法，在浏览器内部通过接口定义语言InterfaceDescriptionLanguage创建MediaPlayer扩展JS对象，包括IPTV规范中的setVideoDisplayArea、playFromStart、joinChanel、setVideoDisplayMode和setSingleMedia；setVideoDisplayArea为视频窗口位置，playFromStart为从头开始播放，joinChanel为加入组播，setVideoDisplayMode为设置播放模式，setSingleMedia为设置播放地址。进一步地，页面通过JS创建播放器时，在CTCMediaPlayer创建一个HTML5的video对象，HTML5的video对象为HTMLVideoElement。进一步地，页面调用的所有IPTV规范的MeidaPlayer接口都通过CTCMediaPlayer类进行调用到标准的HTML5播放对象HTMLVideoElement。与现有技术相比，本专利技术具有以下有益效果：本专利技术的基于HTML5的IPTV播放器渲染方法及播控方法，在实现电信运营商规范标准以外，扩宽了播放器的使用场景，在互联网视频时代能够给大屏电视带来新体验。使前端开发人员能够像使用标准HTML5视频那样的去操作IPTV播放器相关操作，带来比较好的开发体验与效果呈现。提供的小视频渲染方案，可以将视频渲染嵌入到页面渲染中，可以通过CSS或者扩展属性对其调整层级等操作。对于复杂页面，前端开发人员就直接通过CSS调节小视频的相关信息，无须UI人员参与，也无须终端干预。视频渲染方式，对于IPTV视频播放，根据不同的应用场景采用了两种不同的渲染方式，规避掉了现有方案的不足，同时提供了前端开发人员对于视频更多的操作空间。视频创建方式，对于IPTV视频也可以通过HTML5的方式创建，通过HTML5视频的方式来播控IPTV播放器。附图说明图1为本专利技术的一种基于HTML5的IPTV播放器渲染方法及播控方法的原理示意图。图2为本专利技术的一种基于HTML5的IPTV播放器播控方法的原理解析示意图图3为本专利技术的一种基于HTML5的IPTV播放器渲染方法中的小视频渲染模型的原理示意图。图4为本专利技术的一种基于HTML5的IPTV播放器渲染方法中的全屏渲染模型的原理示意图。具体实施方式下面结合附图进一步详细描述本专利技术的技术方案，但本专利技术的保护范围不局限于以下所述。为使本专利技术实施方式的目的、技术方案和优点更加清楚，下面将结合本专利技术实施方式中的附图，对本专利技术实施方式中的技术方案进行清楚、完整地描述，显然，所描述的实施方式是本专利技术一部分实施方式，而不是全部的实施方式。基于本专利技术中的实施方式，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施方式，都属于本专利技术保护的范围。因此，以下对在附图中提供的本专利技术的实施方式的详细描述并非旨在限制要求保护的本专利技术的范围，而是仅仅表示本专利技术的选定实施方式。基于本专利技术中的实施方式，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施方式，都属于本专利技术保护的范围。下面结合实施例对本专利技术作进一步的描述，所描述的实施例仅仅是本专利技术一部分实施例，并不是全部的实施例。基于本专利技术中的实施例，本领域的普通技术人本文档来自技高网...

【技术保护点】
1.一种基于HTML5的IPTV播放器渲染方法，其特征在于，包括两种不同的渲染模型，分别为小视频渲染模型和全屏渲染模型，小视频渲染模型过程为：/na1.创建播放器，并设置播放模式为小视频，设置小视频的位置和大小；/na2.创建surfacetexture，并设置为播放器的输出；/na3.当播放器成功播放后，播放器解码数据输出到surfacetexture；/na4.解码数据输出到surfacetexture后引起浏览器中的合成器进行重绘，与网页Layer一起合成；/na5.合成后，播放帧数据输出到窗口缓存；/n全屏渲染模型过程为：/nb1.创建播放器，并设置播放模式为全屏；/nb2.创建独立于网页层级之外的surfaceview，并设置为播放器的输出；/nb3.当播放器成功播放后，播放器解码数据输出到surfaceview；/nb4.由安卓系统的窗口合成器SurfaceFlinger完成视频帧的显示，而网页层的网页Layer则合成输出到窗口缓存，完成网页的显示。/n

【技术特征摘要】
1.一种基于HTML5的IPTV播放器渲染方法，其特征在于，包括两种不同的渲染模型，分别为小视频渲染模型和全屏渲染模型，小视频渲染模型过程为：
a1.创建播放器，并设置播放模式为小视频，设置小视频的位置和大小；
a2.创建surfacetexture，并设置为播放器的输出；
a3.当播放器成功播放后，播放器解码数据输出到surfacetexture；
a4.解码数据输出到surfacetexture后引起浏览器中的合成器进行重绘，与网页Layer一起合成；
a5.合成后，播放帧数据输出到窗口缓存；
全屏渲染模型过程为：
b1.创建播放器，并设置播放模式为全屏；
b2.创建独立于网页层级之外的surfaceview，并设置为播放器的输出；
b3.当播放器成功播放后，播放器解码数据输出到surfaceview；
b4.由安卓系统的窗口合成器SurfaceFlinger完成视频帧的显示，而网页层的网页Layer则合成输出到窗口缓存，完成网页的显示。


2.如权利要求1所述的一种基于HTML5的IPTV播放器渲染方法，其特征在于，小视频渲染模型中，创建播放器时，在浏览器中把播放器视频帧输出作为网页层级的一部分，在合成器中单独创建一个videolayer并插入到渲染层级树layertree中。


3.如权利要求2所述的一种基于HTML5的IPTV播放器渲染方法，其特征在于，小视频渲染模型中，通过OpenGL为对应播放器创建一个surfacetexture作为播放器的解码输出，绑定到之前创建的videolayer中。


4.如权利要求3所述的一种基于HTML5的IPTV播放器渲染方法，其特征在于，小视频渲染模型中，当播放成功后播放数据帧就直接输出到surfacetexture中，同时引起浏览器中合成器进行重绘，播放帧数据就输出到合成器中的layertree中，与网页UI其它layer一起输出到窗口缓存中，网页和视频就作为同一帧输出到屏幕。


5.如...

【专利技术属性】
技术研发人员：于庆波，代聪，陈峻峰，赵爽，
申请(专利权)人：成都卓影科技股份有限公司，
类型：发明
国别省市：四川;51