專利名稱：網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法
技術(shù)領(lǐng)域：
本發(fā)明涉及一種本發(fā)明涉及一種IPTV中基于嵌入式瀏覽器的EPG (Electronic program guide,電子節(jié)目指南)頁(yè)面的展示才支術(shù)，具體i兌，涉 及一種網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法。
背景技術(shù)：
隨著網(wǎng)絡(luò)電視(IPTV)走進(jìn)千家萬戶，使更多的人體驗(yàn)到寬帶帶來的 樂趣，使人們的生活質(zhì)量得到提高。IPTV系統(tǒng)中音頻視頻解碼技術(shù)、流媒 體傳送技術(shù)、寬帶接入網(wǎng)絡(luò)技術(shù)、IP機(jī)頂盒技術(shù)都得到了快速的發(fā)展。
而由于受制于IPTV終端展示中所使用的嵌入式瀏覽器的一些先天缺 陷，例如，瀏覽器支持的WEB特性相對(duì)較弱， 一般只是支持有限的超文本 置標(biāo)語(yǔ)言(HTML, Hyper Text Markup Language )和功能非常有限的腳本語(yǔ) 言，且頁(yè)面之間的遷移關(guān)系往往不同于普通PC上的有鼠標(biāo)配合的瀏覽器的 展示，從而導(dǎo)致了直接面對(duì)客戶的IPTV的用戶界面展示不能像普通PC機(jī) 上的瀏覽器那樣展示具有動(dòng)畫(FLASH)特效的頁(yè)面，從而使頁(yè)面的美觀性 大打折扣，并且只能實(shí)現(xiàn)簡(jiǎn)單的頁(yè)面切換。展現(xiàn)給終端用戶的EPG界面如果能夠美觀、動(dòng)感并且多樣化，將會(huì)大 大提高用戶視覺上的沖擊和愉悅性，而 一個(gè)枯燥單調(diào)的頁(yè)面則會(huì)大大降低用 戶頁(yè)面操作的興趣，甚至可能影響用戶對(duì)IPTV的興趣
發(fā)明內(nèi)容
本發(fā)明所解決的技術(shù)問題是提供一種網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面 動(dòng)感效果的實(shí)現(xiàn)方法，能夠使使EPG頁(yè)面展示動(dòng)感效果。技術(shù)方案如下
一種網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法，步驟包括(1) 在模版中定義用戶動(dòng)作或者頁(yè)面位置的觸發(fā)條件；(2) 當(dāng)焦點(diǎn)在頁(yè)面上移動(dòng)時(shí)，通過嵌入式瀏覽器所提供的腳本功能捕 捉所述焦點(diǎn)的用戶動(dòng)作或者頁(yè)面位置；(3) 當(dāng)所述用戶動(dòng)作滿足所述觸發(fā)條件時(shí)，更改頁(yè)面鏈接的圖片；或 者，當(dāng)所述焦點(diǎn)的頁(yè)面位置滿足所述觸發(fā)條件時(shí)，進(jìn)行翻頁(yè)操作。進(jìn)一步，步驟(l)中，在所述模版的JS函數(shù)中定義所述觸發(fā)條件。進(jìn)一步，步驟(3)中，在JS函數(shù)中，通過獲取用戶觸發(fā)的頁(yè)面元素的 編號(hào)來獲取所述頁(yè)面元素的實(shí)體，再通過修改所述實(shí)體的屬性來實(shí)時(shí)更改頁(yè) 面鏈接的圖片。進(jìn)一步，步驟(l)中，網(wǎng)絡(luò)電視的模版中，界面鏈接響應(yīng)的所述用戶 動(dòng)作的動(dòng)作狀態(tài)包括獲取焦點(diǎn)、失去焦點(diǎn)、點(diǎn)擊狀態(tài)，在頁(yè)面中定義動(dòng)作狀 態(tài)觸發(fā)的JS函數(shù)，在所述JS函數(shù)中判斷用戶的觸發(fā)動(dòng)作。進(jìn)一步，步驟(3)中，判斷所述動(dòng)作狀態(tài)，當(dāng)所述動(dòng)作狀態(tài)為獲取焦 點(diǎn)時(shí)，更換為獲取焦點(diǎn)時(shí)的圖片；當(dāng)所述動(dòng)作狀態(tài)為失去焦點(diǎn)時(shí)，更換為失 去焦點(diǎn)時(shí)的圖片；當(dāng)所述動(dòng)作狀態(tài)為點(diǎn)擊狀態(tài)時(shí)，更換為點(diǎn)擊焦點(diǎn)時(shí)的圖片。進(jìn)一步，步驟(1)中，在模版的JS函數(shù)中，自定義JS函數(shù)，取代默 認(rèn)的機(jī)頂盒按鍵處理。進(jìn)一步，步驟(2)中，當(dāng)焦點(diǎn)移動(dòng)時(shí)，調(diào)用所述自定義的JS函數(shù)， 在所述自定義JS函數(shù)中，調(diào)用所述機(jī)頂盒所提供的按鍵截獲接口截獲遙控 器的按鍵操作，用所述自定義JS函數(shù)取代默認(rèn)的機(jī)頂盒按鍵處理。進(jìn)一步，步驟(3)中，在JS函數(shù)中，判斷所述焦點(diǎn)的位置是否在表格 的邊沿元素上；如果是則強(qiáng)行觸發(fā)頁(yè)面的翻頁(yè)操作，否則，調(diào)用默認(rèn)的機(jī)頂 盒按鍵處理。本發(fā)明利用IPTV嵌入式瀏覽器實(shí)現(xiàn)了頁(yè)面動(dòng)感效果，當(dāng)用戶瀏覽和操 作EPG頁(yè)面時(shí)，使EPG頁(yè)面能夠展示給用戶動(dòng)感效果。本發(fā)明通過嵌入式 瀏覽器所提供的有限的腳本功能捕捉用戶的動(dòng)作，根據(jù)不同的動(dòng)作，更換不 同的按鈕圖片來實(shí)現(xiàn)簡(jiǎn)單的FLASH特效，很好地開發(fā)出美觀、動(dòng)感、交互 性強(qiáng)的頁(yè)面。通過本發(fā)明技術(shù)方案，可以實(shí)現(xiàn)EPG頁(yè)面展示時(shí)的FLASH動(dòng)感效果 和擴(kuò)展用戶對(duì)頁(yè)面的特殊操作方式，從而大大提高了頁(yè)面的可觀賞性和可擴(kuò) 展性，打破了 EPG頁(yè)面固有的展示方式。


圖1是EPG模版框架示意圖；圖2、通過圖片更迭實(shí)現(xiàn)FLASH效果的流程圖；圖3、通過捕捉焦點(diǎn)位置實(shí)現(xiàn)頁(yè)面自動(dòng)跳轉(zhuǎn)的流程圖；圖4、利用按鍵截獲技術(shù)實(shí)現(xiàn)首頁(yè)迷你菜單用例流程圖。
具體實(shí)施方式
IPTV的模版為運(yùn)行于web服務(wù)器上的web應(yīng)用程序，是由Java服務(wù) 器頁(yè)面(JSP , Java Server Page)、圖片文件、模版配置文件所組成的。客 戶端運(yùn)行于嵌入式的瀏覽器中。模版客戶端的JSP展示與一般PC機(jī)上的網(wǎng) 頁(yè)展示有很大的區(qū)別，模版一般通過機(jī)頂盒展示于電視機(jī)或類似的播放媒介 上，界面展示直觀、清晰、簡(jiǎn)潔、大方，用戶的操作是通過機(jī)頂盒遙控器來 控制的，所以頁(yè)面展示元素要求比較大。下面參照附圖，對(duì)本發(fā)明的優(yōu)選實(shí)施例做詳細(xì)描述。參照?qǐng)Dl所示，對(duì)EPG模版框架做詳細(xì)描述。其中機(jī)頂盒用于展示IPTV的JSP頁(yè)面，模版是為IPTV用戶提供交互 界面的web應(yīng)用程序，EPG后臺(tái)提供模版訪問數(shù)據(jù)庫(kù)的后臺(tái)接口， EPG后 臺(tái)數(shù)據(jù)庫(kù)為運(yùn)行在web服務(wù)器上的本地?cái)?shù)據(jù)庫(kù)，用于存放IPTV業(yè)務(wù)的部分 數(shù)據(jù)。CDN為IPTV的內(nèi)容分發(fā)網(wǎng)絡(luò)，負(fù)責(zé)IPTV播放內(nèi)容及部分業(yè)務(wù)數(shù)據(jù) 的管理。接口機(jī)負(fù)責(zé)IPTV系統(tǒng)與其他系統(tǒng)的對(duì)接。Portal為展示和操作IPTV 業(yè)務(wù)數(shù)據(jù)的web服務(wù)器。參照?qǐng)D2所示，對(duì)通過圖片更迭實(shí)現(xiàn)FLASH效果做詳細(xì)描述。
FLASH的動(dòng)態(tài)效果的基本原理也是通過大量圖片的更迭來實(shí)現(xiàn)的，本 實(shí)施例中，通過捕捉用戶焦點(diǎn)動(dòng)作進(jìn)行圖片更迭和圖片更換，實(shí)現(xiàn)基本 FLASH特效。步驟S201,在模版中定義用戶動(dòng)作的觸發(fā)條件。IPTV的模版中，界面鏈接響應(yīng)的用戶動(dòng)作一般有三種操作類型(動(dòng)作 狀態(tài))，包括獲取焦點(diǎn)、失去焦點(diǎn)、點(diǎn)擊狀態(tài)。在頁(yè)面中定義這三種狀態(tài) 觸發(fā)的JS函數(shù)(Java Script函數(shù))，在該JS函數(shù)中判斷用戶的觸發(fā)動(dòng)作。步驟S202,用戶在頁(yè)面上移動(dòng)焦點(diǎn)。步驟S203,通過嵌入式瀏覽器所提供的有限的腳本功能捕捉用戶焦點(diǎn) 的動(dòng)作(OnFocus、 OnBlur)。步驟S204，判斷用戶動(dòng)作的操作類型，當(dāng)用戶動(dòng)作滿足觸發(fā)條件時(shí)， 執(zhí)行用戶動(dòng)作。獲取用戶觸發(fā)的頁(yè)面元素id,通常為img標(biāo)簽的id，通過該id獲耳又該 元素的實(shí)體，再通過修改實(shí)體的屬性(通常為img標(biāo)簽的src屬性)則可以 實(shí)時(shí)更改頁(yè)面鏈接的圖片，更改的效果可以實(shí)時(shí)展示在界面上，從而可以起 到FLASH效果。id是頁(yè)面元素的編號(hào)，在一個(gè)頁(yè)面中是唯一的。當(dāng)用戶動(dòng)作的操作類型為獲取焦點(diǎn)時(shí)，執(zhí)行步驟S205;當(dāng)用戶動(dòng)作的 操作類型為失去焦點(diǎn)時(shí)，執(zhí)行步驟S206;當(dāng)用戶動(dòng)作的操作類型為點(diǎn)擊狀 態(tài)時(shí)，執(zhí)行步驟S207。步驟S205，當(dāng)用戶動(dòng)作的操作類型為獲取焦點(diǎn)時(shí)，更換為獲取焦點(diǎn)時(shí) 的圖片。步驟S206，當(dāng)用戶動(dòng)作的操作類型為失去焦點(diǎn)時(shí)，更換為失去焦點(diǎn)時(shí) 的圖片。步驟S207,當(dāng)用戶動(dòng)作的操作類型為點(diǎn)擊狀態(tài)時(shí)，更換為點(diǎn)擊焦點(diǎn)時(shí) 的圖片。參照?qǐng)D3所示，對(duì)通過捕捉焦點(diǎn)位置實(shí)現(xiàn)頁(yè)面自動(dòng)跳轉(zhuǎn)的過程做詳細(xì)描述。本實(shí)施例中，利用嵌入式瀏覽器所提供的腳本捕捉用戶焦點(diǎn)的位置來實(shí)
現(xiàn)頁(yè)面展示內(nèi)容的自動(dòng)翻頁(yè)。步驟S301,截獲用戶的上、下、左、右鍵操作。在模版的JS函數(shù)中，調(diào)用機(jī)頂盒所提供的按鍵截獲接口截獲用戶對(duì)遙 控器的上、下、左、右鍵操作(該功能應(yīng)用于EPG后臺(tái)，獲取的內(nèi)容通過 TABLE (HTML語(yǔ)言中的表格)形式展示)，當(dāng)用戶移動(dòng)焦點(diǎn)時(shí)則會(huì)調(diào)用 頁(yè)面自定義的JS函數(shù)。步驟S302，用戶自定義JS函數(shù)取代默認(rèn)的機(jī)頂盒按鍵處理。步驟S303,獲取用戶焦點(diǎn)當(dāng)前所在的頁(yè)面位置。通常展示內(nèi)容的翻頁(yè)必須手動(dòng)觸發(fā)"上一頁(yè)"、"下一頁(yè)"按鈕來實(shí)現(xiàn)， 而本實(shí)施例中，通過捕捉用戶目前焦點(diǎn)的位置實(shí)現(xiàn)翻頁(yè)。當(dāng)焦點(diǎn)位于顯示內(nèi) 容表格的邊緣區(qū)域(最上面、最下面、最左面、最右面)時(shí)，如果此時(shí)用戶 繼續(xù)將焦點(diǎn)向顯示區(qū)域外移動(dòng)時(shí)，則自動(dòng)觸發(fā)翻頁(yè)操作。步驟S304,判斷用戶的焦點(diǎn)移動(dòng)是否要超出內(nèi)容鍵時(shí)區(qū)域。如果超出，執(zhí)行步驟S305;否則，執(zhí)行步驟S306。步驟S305,觸發(fā)頁(yè)面的自動(dòng)翻頁(yè)。在截獲用戶焦點(diǎn)移動(dòng)時(shí)指定的處理函數(shù)中，判斷用戶當(dāng)前焦點(diǎn)的位置是 否在TABLE的最上面或者最下面元素上。如果是且此時(shí)用戶是觸發(fā)向上或 者向下焦點(diǎn)移動(dòng)，則可以強(qiáng)行觸發(fā)頁(yè)面的翻頁(yè)梯:作。。步驟S306,調(diào)用默認(rèn)的機(jī)頂盒按鍵處理。參照?qǐng)D4所示，用戶按鍵截獲技術(shù)的應(yīng)用做詳細(xì)描述。按鍵截獲技術(shù)是利用嵌入式瀏覽器所提供的按鍵截獲接口捕捉用戶所 按的遙控器按鈕信息，實(shí)現(xiàn)頁(yè)面的對(duì)用戶觸發(fā)按鍵按鈕的處理。在頁(yè)面自動(dòng) 翻頁(yè)的時(shí)候已經(jīng)用到了該技術(shù)，還可以實(shí)現(xiàn)很多其他的特殊的頁(yè)面操作方 式，下面舉一個(gè)實(shí)例來i!L明。因?yàn)闄C(jī)頂盒對(duì)遙控器的每個(gè)按鈕都有相應(yīng)的默認(rèn)操作。為了實(shí)現(xiàn)頁(yè)面的 特殊操作效果，可以通過利用嵌入式瀏覽器所提供的按鍵截獲接口來替換 EPG頁(yè)面的相應(yīng)的默認(rèn)的按鈕響應(yīng)函數(shù)，從而轉(zhuǎn)到頁(yè)面自定義的JS函數(shù)， 在自定義的JS函數(shù)中可以根據(jù)具體的需求實(shí)現(xiàn)不同的功能，從而可以打破 常規(guī)的頁(yè)面響應(yīng)按鈕的操作方式。機(jī)頂盒默認(rèn)的菜單鍵的處理是返回模版的首頁(yè)面(一級(jí)菜單的展示)， 從而刷新原來頁(yè)面的內(nèi)容，而現(xiàn)在可以通過按鍵截獲技術(shù)改變這種頁(yè)面操作 方式。步驟S401,首先開發(fā)一個(gè)迷你首頁(yè)菜單，實(shí)現(xiàn)了首頁(yè)的一級(jí)菜單功能， 可以在每個(gè)模版頁(yè)面的邊緣區(qū)域展示。制作迷你首頁(yè)菜單代替首頁(yè)面，用于展示在該模版每個(gè)JSP頁(yè)面上，默 認(rèn)處于非激活狀態(tài)。步驟S402,截獲用戶菜單鍵操作(在每個(gè)JSP頁(yè)面上截獲菜單鍵)， 轉(zhuǎn)向自定義用戶菜單鍵的JS函數(shù)處理。步驟S403,用戶觸發(fā)菜單鍵。步驟S404,判斷此時(shí)的迷你菜單狀態(tài)。當(dāng)處于非激活狀態(tài)，執(zhí)行步驟S405;當(dāng)處于激活狀態(tài)，執(zhí)行步驟S407。步驟S405,當(dāng)處于非激活狀態(tài)，激活迷你菜單，將焦點(diǎn)移動(dòng)到迷你菜 單上。步驟S406,利用按鍵截獲技術(shù)，使焦點(diǎn)只能在迷你菜單上移動(dòng)。步驟S407，當(dāng)處于激活狀態(tài)，注銷迷你菜單，隱藏迷你菜單鏈接。當(dāng)用戶按下菜單鍵時(shí)，界面導(dǎo)入迷你菜單首頁(yè)，在頁(yè)面的邊緣區(qū)域展示， 并不更改頁(yè)面其他內(nèi)容的展示，這樣就可以改變傳統(tǒng)的模版頁(yè)面的展示方 式，增加了用戶的體驗(yàn)性和模版頁(yè)面開發(fā)的可擴(kuò)展性。
權(quán)利要求
1、一種網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法，步驟包括(1)在模版中定義用戶動(dòng)作或者頁(yè)面位置的觸發(fā)條件；(2)當(dāng)焦點(diǎn)在頁(yè)面上移動(dòng)時(shí)，通過嵌入式瀏覽器所提供的腳本功能捕捉所述焦點(diǎn)的用戶動(dòng)作或者頁(yè)面位置；(3)當(dāng)所述用戶動(dòng)作滿足所述觸發(fā)條件時(shí)，更改頁(yè)面鏈接的圖片；或者，當(dāng)所述焦點(diǎn)的頁(yè)面位置滿足所述觸發(fā)條件時(shí)，進(jìn)行翻頁(yè)操作。
2、 根據(jù)權(quán)利要求1所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(l)中，在所述模版的JS函數(shù)中定義所述觸 發(fā)條件。
3、 根據(jù)權(quán)利要求2所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(3)中，在JS函數(shù)中，通過獲取用戶觸發(fā)的 頁(yè)面元素的編號(hào)來獲取所述頁(yè)面元素的實(shí)體，再通過修改所述實(shí)體的屬性來 實(shí)時(shí)更改頁(yè)面《連《接的圖片。
4、 根據(jù)權(quán)利要求1所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(l)中，網(wǎng)絡(luò)電視的模版中，界面鏈接響應(yīng) 的所述用戶動(dòng)作的動(dòng)作狀態(tài)包括獲取焦點(diǎn)、失去焦點(diǎn)、點(diǎn)擊狀態(tài)，在頁(yè)面中 定義動(dòng)作狀態(tài)觸發(fā)的JS函數(shù)，在所述JS函數(shù)中判斷用戶的觸發(fā)動(dòng)作。
5、 根據(jù)權(quán)利要求4所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(3)中，判斷所述動(dòng)作狀態(tài)，當(dāng)所述動(dòng)作狀 態(tài)為獲取焦點(diǎn)時(shí)，更換為獲取焦點(diǎn)時(shí)的圖片；當(dāng)所述動(dòng)作狀態(tài)為失去焦點(diǎn)時(shí)， 更換為失去焦點(diǎn)時(shí)的圖片；當(dāng)所述動(dòng)作狀態(tài)為點(diǎn)擊狀態(tài)時(shí)，更換為點(diǎn)擊焦點(diǎn) 時(shí)的圖片。
6、 根據(jù)權(quán)利要求1所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法，其特征在于，步驟(l)中，在模版的JS函數(shù)中，自定義JS函 數(shù)，取代默認(rèn)的機(jī)頂盒按鍵處理。
7、 根據(jù)權(quán)利要求6所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(2)中，當(dāng)焦點(diǎn)移動(dòng)時(shí)，調(diào)用所述自定義的 JS函數(shù)，在所述自定義JS函數(shù)中，調(diào)用所述機(jī)頂盒所提供的按鍵截獲接口 截獲遙控器的按鍵操作，用所述自定義JS函數(shù)取代默認(rèn)的機(jī)頂盒按鍵處理。
8、 根據(jù)權(quán)利要求7所述的網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的 實(shí)現(xiàn)方法，其特征在于，步驟(3)中，在JS函數(shù)中，判斷所述焦點(diǎn)的位置 是否在表格的邊沿元素上；如果是則強(qiáng)行觸發(fā)頁(yè)面的翻頁(yè)操作，否則，調(diào)用 默認(rèn)的機(jī)頂盒按鍵處理。
全文摘要
本發(fā)明公開了一種網(wǎng)絡(luò)電視嵌入式瀏覽器下的頁(yè)面動(dòng)感效果的實(shí)現(xiàn)方法，步驟包括在模版中定義用戶動(dòng)作或者頁(yè)面位置的觸發(fā)條件；當(dāng)焦點(diǎn)在頁(yè)面上移動(dòng)時(shí)，通過嵌入式瀏覽器所提供的腳本功能捕捉所述焦點(diǎn)的用戶動(dòng)作或者頁(yè)面位置；當(dāng)所述用戶動(dòng)作滿足所述觸發(fā)條件時(shí)，更改頁(yè)面鏈接的圖片；或者，當(dāng)所述焦點(diǎn)的頁(yè)面位置滿足所述觸發(fā)條件時(shí)，進(jìn)行翻頁(yè)操作。本發(fā)明利用IPTV嵌入式瀏覽器實(shí)現(xiàn)了頁(yè)面動(dòng)感效果，當(dāng)用戶瀏覽和操作EPG頁(yè)面時(shí)，使EPG頁(yè)面能夠展示給用戶動(dòng)感效果。
文檔編號(hào)H04N5/00GK101119476SQ200710145888
公開日2008年2月6日 申請(qǐng)日期2007年9月4日 優(yōu)先權(quán)日2007年9月4日
發(fā)明者任建華, 劉學(xué)安, 朱興昌 申請(qǐng)人:中興通訊股份有限公司