工程中心頭端考核portal模版制作內(nèi)容

iPanelTechnologies

.

Portal模板制作規(guī)范

ver

1.0

2010年11月24日

（本文檔

應(yīng)用開(kāi)發(fā)七部

）

文檔

日志

日期

內(nèi)容

人

2010-11-24

Portal模板制作修改

雷剛強(qiáng)

2010-11-25

細(xì)節(jié)完善

廖蔚藍(lán)

目

錄

1.

概述 1

2.

模板設(shè)計(jì)方案 1

2.1.

2.2.

2.3.

2.4.

2.5.

頁(yè)面必須包含元素 1

一二級(jí)欄目編寫(xiě)規(guī)范 1

海報(bào)編寫(xiě)規(guī)范 3

跑馬燈編寫(xiě)規(guī)范規(guī)范 4

重要規(guī)范規(guī)定信息 6

1.概述

制作不同的Portal模版是為了方便用戶根據(jù)自己的喜好來(lái)選擇不同模版

式樣來(lái)發(fā)布應(yīng)用，也方便開(kāi)發(fā)

系統(tǒng)與模版之間的管理。

2.模板設(shè)計(jì)方案

2.1.

頁(yè)面必須包含元素

在頁(yè)面中必須包含一個(gè)醒目的一級(jí)欄目列表信息、二級(jí)欄目框、海報(bào)框、跑馬燈框、日期框、天氣預(yù)報(bào)欄目框，用戶操作提示信息列表（返回、主頁(yè)、退出等）。

2.2.

一二級(jí)欄目編寫(xiě)規(guī)范

2.2.1、在一級(jí)欄目、二級(jí)欄目可以采用json表達(dá)式來(lái)定義，

例如：

<!--mavarma

{

enu-start-->

enu=[

name:["用戶管理","USERCONTROL"],

pic:["icon05.png","icon15.png"],sub :[

{

name:["

自

動(dòng)

搜

索

","AUTO

SEARCH"],

url:"ui://search_result.htm",type:"dtv"},

{

name:["

系

統(tǒng)

設(shè)

置

","SYSTEM

SET"],

url:"ui://system_set.htm",type:"dtv"},

{

name:["

","

CHECK"],

郵

件

查

詢

url:"ui:// _man.htm",type:"dtv"}

]

},{

name:["數(shù)字電視","DTV"],

pic:["icon06.png","icon16.png"],sub :[

{

name:["

重

慶

頻

道

","RED

"}},

","PAY

TV"],

url:"",type:"channel",servi

:{serviceId:1104,serviceName:"重慶

{

name:["

頻

道

TV"],

url:"",type:"channel",servi

:{serviceId:902,serviceName:"首播劇場(chǎng)"}},

{

name:["

道 ","HD

TV"],

頻

url:"",type:"channel",servi

:{serviceId:3001,serviceName:" 綜合"}},

{

name:["

省

級(jí)

","Provin

l

TV"],

url:"",type:"channel",servi

:{serviceId:3002,serviceName:"浙江

"}},

{name:["音頻廣播","MUSIC"],url:"",type:"music"}

]

},{

name:["互動(dòng)影視","HDTV"],

pic:["icon04.png","icon14.png"],sub :[

{name:["VOD","VOD"],url:"../vod/index.htm",type:"iptv"}

]

},{

name:["互動(dòng)社區(qū)","Community"],

pic:["28_0.png","28_1.png"],sub :[

{

name:["

電

視

商

城

","BASIC

VOD"],

url:"../shop/index.htm",type:"iptv"},

{

name:["

互

動(dòng)

音

樂(lè)

","BASIC

VOD"],

url:"

",type:"iptv"},

{

name:["

","BASIC

VOD"],

社

區(qū)

url:"../news/index.htm",type:"iptv"},

{

name:["

天

氣

預(yù)

報(bào)

","BASIC

VOD"],

url:"../weather/index.htm",type:"iptv"},

{

name:["

福

利

","BASIC

VOD"],

url:"../lottery/login.htm",type:"iptv"},

{

name:["

雙

向

預(yù)

覽

","BASIC

VOD"],

url:"",type:"channel",servi

]

}

];

:{serviceId:902,serviceName:"首播劇場(chǎng)"}}

<!--ma

enu-end-->

2.2.2、定義的時(shí)候必須注意以下幾點(diǎn)：

1、Varma

enu這個(gè)變量必須定義在<!--ma

enu-start-->，

<!--ma

enu-end-->這2個(gè)標(biāo)記中間。

2、一定要定義好一二級(jí)欄目名稱、

路徑、跳轉(zhuǎn)位置等屬性。其中：

ma enu表示所有一級(jí)欄目的集合。

name表示一級(jí)欄目的名稱。

pic表示一級(jí)欄目圖標(biāo)的路徑。

4）sub

①sub

表示一級(jí)欄目中包含的二級(jí)欄目集合：里面name表示二級(jí)欄目名稱。

②url表示點(diǎn)擊該按鈕時(shí)要跳轉(zhuǎn)到的路徑。

③type表示二級(jí)欄目的類型，當(dāng)type=“channel”后面要有

servi

:{serviceId:902,serviceName:"首播劇場(chǎng)"}格式的字段。

2.3.

海報(bào)編寫(xiě)規(guī)范

2.3.1、海報(bào)的json信息定義如下：

varmovieList=newArray();movieList[0]=[

//{

name:"",

pic:"0_1.jpg",

"},//常見(jiàn)問(wèn)答

url:"

//{name:"",pic:"0_2.jpg",url:"

"}//用戶手冊(cè)pic:"8_1.jpg",

"+CAID},//界

{

name:"",

url:"

面更換

{name:"",pic:"8_2.jpg",url:"ui://systemSetting.htm?3"}//服務(wù)信息

];

movieList[1]=[

{name:"",pic:"1_1.jpg",url:"

"},//家庭

{name:"",pic:"1_2.jpg",url:"

"}//電視郵

箱

{name:"",pic:"1_2.jpg",url:"ui://systemSetting.htm?3"}

{name:"",pic:"2_1.jpg",url:"

{name:"",pic:"2_2.jpg",url:"

"},//美食天地

"}//天氣預(yù)

報(bào)

];

1、movieList[0]-movieList[n]的

json信息必須在<!--movieList-start-->，

<!--movieList-end-->2個(gè)標(biāo)記之間。

2、movieList[0]表示該海報(bào)信息屬于第一個(gè)一級(jí)欄目，依次類推。

3、movieList表示海報(bào)信息的一個(gè)集合，其中每一個(gè)元素表示一個(gè)海報(bào)的信息。

1）Name表示海報(bào)的名稱，2）pic表示海報(bào)點(diǎn)擊海報(bào)時(shí)跳轉(zhuǎn)到的路徑。

的路徑，3）url表示

2.3.2、海報(bào)

命名規(guī)范：

1、只有一級(jí)欄目有海報(bào)，如果portal只有幾張不隨一級(jí)欄目切換的海報(bào)。就默認(rèn)取第一個(gè)一級(jí)欄目中海報(bào)顯示。

2、每一級(jí)欄目的海報(bào)必須以”_”加有序數(shù)字顯示。例如，第一個(gè)一級(jí)欄目有四張海報(bào)：格式如下：“haibao0_1.jpg”,“haibao0_2.jpg”,“haibao0_3.jpg”,“haibao0_4.jpg”。

3、第二個(gè)一級(jí)欄目的四張海報(bào)命名格為：“haibao1_1.jpg”,“haibao1_2.jpg”,“haibao1_3.jpg”,“haibao1_4.jpg”,后面的海報(bào)以此類推。

2.3.3、海報(bào)位置規(guī)范：

1、海報(bào)顯示位置的

命名規(guī)則：

1）海報(bào)位置的img

可以在html里面的任何位置,但必須有width、

height和src屬性，id必須為movie0到movieN，N為每個(gè)一級(jí)欄目顯示的海報(bào)張數(shù)減1。

<imgsrc="pop_1.jpg"width="179"height="344"id="movie0"/>

<imgsrc="pop_2.jpg"width="179"height="344"id="movie1"/>

<imgsrc="pop_3.jpg"width="179"height="344"id="movie2"/>

<imgsrc="pop_4.jpg"width="179"height="344"id="movie3"/>

2.4.

跑馬燈編寫(xiě)規(guī)范規(guī)范

2.4.1、一級(jí)欄目跑馬燈json信息如下：

varma

enuMarqueeList=newArray();

ma enuMarqueeList[0]=[

{name:"",context:"d=CAID"}

];

ma enuMarqueeList[1]=[

{name:"",context:"d=CAID"}

];

1、該

json

須在<!--ma

enuMarqueeList-start-->

信息必

，

<!--ma

enuMarqueeList-end-->2個(gè)標(biāo)記這間。

2、ma

推。

enuMarqueeList[0]表示第一個(gè)一級(jí)欄目的跑馬燈信息，依次類

2.4.2、二級(jí)欄目跑馬燈json信息如下：

varsubsub

MarqueeList=newArray();MarqueeList[0]=[

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"}

];

sub

MarqueeList[1]=[

{name:"",context:"

x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"}

];

1、該json信息必須在<!--sub

MarqueeList-start-->

和<!--sub

MarqueeList-end-->2個(gè)標(biāo)記之間。

2、sub

MarqueeList[0]表示是第一個(gè)一級(jí)欄目，里面的每一條

json

對(duì)應(yīng)該一級(jí)欄目下所對(duì)應(yīng)的二級(jí)欄目的跑馬燈信息。

2.4.3、海報(bào)的跑馬燈json信息如下：

varmovieMarqueeList=newArray();movieMarqueeList[0]=[

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"}

];

movieMarqueeList[1]=[

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"}

];

movieMarqueeList[2]=[

{name:"",context:"x.htm?smid=CAID"},

{name:"",context:"x.htm?smid=CAID"}

];

1、該json

信息必須在<!--movieMarqueeList-start-->，

<!--movieMarqueeList-end-->2個(gè)標(biāo)記之間。

2、movieMarqueeList[0]表示第一個(gè)一級(jí)欄目，json數(shù)組信息里面的第一個(gè)表示左邊的海報(bào)對(duì)應(yīng)的跑馬燈信息，第二個(gè)表示右邊的海報(bào)對(duì)應(yīng)的跑馬燈信息，依次類推。

3、跑馬燈信息里面的name表示跑馬燈的名字，context表示跑馬燈的內(nèi)容信息。

（如果全局只有一個(gè)跑馬燈，默認(rèn)去取第一個(gè)一級(jí)欄目的跑馬燈）

2.5.

重要規(guī)范規(guī)定信息

1．Json表達(dá)式內(nèi)不得使用注釋。

2．Json表達(dá)式內(nèi)不得使用變量，必須全部都是字符串信息。

3．默認(rèn)海報(bào)

movie0，movie1內(nèi)的