[發明專利]一種用于家庭網關設備功能擴展的Web UI框架及方法

在審

• 申請號: 201410516720.3
• 申請日: 2014-09-30
• 公開（公告）號: CN104331303A
• 公開（公告）日: 2015-02-04
• 發明（設計）人: 靳美麗
• 申請（專利權）人: 上海斐訊數據通信技術有限公司
• 主分類號: G06F9/445
• 分類號: G06F9/445;G06F17/30;H04L29/08
• 代理公司: 上海信好專利代理事務所(普通合伙) 31249
• 代理人: 包姝晴;徐雯瓊

技術領域

本發明涉及一種Web?UI（網絡產品界面，Website?User?Interface）框架及利用該Web?UI框架進行功能擴展的方法，具體是指一種基于MVC（模型-視圖-控制器，Model-View-Controller）的用于家庭網關設備功能擴展的Web?UI框架及方法。

背景技術

現有的家庭網關設備的Web?UI頁面結構通常將數據、模型與視圖綁定，也就是該家庭網關設備的功能是與頁面綁定的，當家庭網關設備需要增加一個新功能時，就需要增加對應的頁面，并且這種方式往往是要通過升級軟件的方法才能實現將新的頁面無縫添加至主頁面中，同時使得相應的配置生效。

隨著智能家庭網絡發展的越來越成熟，其受到越來越多的關注，因此家庭網關設備已經不再僅僅局限于傳統的功能，越來越多的日益豐富起來的新功能將被添加至家庭網關設備中。如若繼續使用當前Web?UI的設計方法，會帶來兩個問題：首先，隨著功能的增加，需要增加的頁面也越來越多；其次，每次添加功能幾乎都要通過系統升級的方試來擴展對應的頁面。顯然這樣比較浪費資源，并且對于用戶而言，如果添加相應功能都需要通過軟件升級的方式來擴展配置對應的頁面，所需軟件升級的等待時間就會越來越長，導致家庭網關設備的可擴展性不好，用戶體驗較差。

發明內容

本發明的目的在于提供一種用于家庭網關設備功能擴展的Web?UI框架及方法，只需點擊安裝對應的安裝包即可使新的擴展功能配置頁面無縫嵌入到已有的主頁面中，具有良好的可擴展性，使家庭網關設備不需要通過升級軟件的方法來進行功能擴展，節省用戶的等待時間，具有良好的用戶體驗。

為了達到上述目的，本發明提供一種用于家庭網關設備功能擴展的Web?UI框架，包含：

主頁面，其用于顯示家庭網關設備的操作頁面，該主頁面包含導航菜單，以及若干擴展功能配置頁面；

若干安裝包，其分別與所述的主頁面相連接，且與所述的擴展功能配置頁面一一對應；

庫文件，其分別與所述的導航菜單以及擴展功能配置頁面相連接，用于動態創建并修飾導航菜單以及擴展功能配置頁面上的各個頁面元素。

所述的安裝包包含：控制接入模塊，其與所述的導航菜單相連接，將擴展功能配置頁面的載入接口添加至主頁面的導航菜單中；模型模塊，其與所述的擴展功能配置頁面相連接，包含擴展功能配置頁面中的全部配置項元素，用于動態創建該擴展功能配置頁面；配置數據文件模塊，其與所述的擴展功能配置頁面相連接，用于存儲擴展功能配置頁面上的全部數據值，將所述的數據值加載至擴展功能配置頁面上并與家庭網關設備進行交互，使擴展的功能生效。

所述的控制接入模塊用于決定擴展功能配置頁面的載入接口在主頁面的導航菜單中的層級位置。

所述的配置數據文件模塊中存儲的擴展功能配置頁面上的全部數據值包含家庭網關設備的默認數據值和用戶設置的數據值。

所述的庫文件包含：JavaScript庫文件，其包含與所述的導航菜單相連接的接口JavaScript庫文件以及與所述的擴展功能配置頁面相連接的配置頁面JavaScript庫文件；該接口JavaScript庫文件用于動態創建導航菜單上的載入接口的頁面元素，該配置頁面JavaScript庫文件用于動態創建擴展功能配置頁面上的頁面元素；CSS樣式庫文件，其包含與所述的導航菜單相連接的接口CSS樣式庫文件以及與所述的擴展功能配置頁面相連接的配置頁面CSS樣式庫文件；該接口CSS樣式庫文件用于修飾導航菜單上的載入接口的頁面元素的樣式，該配置頁面CSS樣式庫文件用于修飾擴展功能配置頁面上的頁面元素的樣式。

本發明還提供一種利用所述的Web?UI框架進行家庭網關設備功能擴展的方法，包含以下步驟：

S1、當用戶需要擴展家庭網關設備的功能時，選擇并點擊與該功能相對應的安裝包，將該安裝包安裝至家庭網關設備中；

S2、安裝包中的控制接入模塊在主頁面的導航菜單中添加將要創建的擴展功能配置頁面的載入接口；

S3、安裝包中的模型模塊動態創建該擴展功能配置頁面；

S4、安裝包中的配置數據文件模塊將其所存儲的擴展功能配置頁面上的全部數據值加載至該擴展功能配置頁面上，并與家庭網關設備進行交互，使擴展的功能生效。

所述的步驟S2具體包含：

S21、點擊主頁面；

S22、控制接入模塊在主頁面的導航菜單中動態創建擴展功能配置頁面的載入接口，該控制接入模塊決定所述的載入接口在導航菜單中的層級位置；