設(shè)計所見即所得編輯器例程庫過程詳解_第1頁
設(shè)計所見即所得編輯器例程庫過程詳解_第2頁
設(shè)計所見即所得編輯器例程庫過程詳解_第3頁
設(shè)計所見即所得編輯器例程庫過程詳解_第4頁
設(shè)計所見即所得編輯器例程庫過程詳解_第5頁
已閱讀5頁,還剩15頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)

文檔簡介

1、.設(shè)計 所見即所得編輯器 例程庫過程詳解設(shè)計所見即所得編輯器例程庫過程詳解2011-04-06 12:11設(shè)計所見即所得編輯器例程庫過程詳解發(fā)表于2007,January 18,5:14 PM也許你已經(jīng)習(xí)慣于使用Word進行文檔的編寫和編輯,因為它提供了強大的所見即所得類型的編輯器,使得對文檔的編排更容易進行,但是Word畢竟是只能在單機使用,如果也想在Web上使用類似Word的功能怎么辦呢?這個問題其實很多的論壇程序已經(jīng)給出了答案:集成Web形式的所見即所得編輯器控件(這里說的控件并不是指微軟的ActiveX)。目前比較成熟的Web形式的所見即所得編輯器有兩個:TinyMCE和FCKEdit

2、or。其中的TinyMCE,從名字中就可以看出,Tiny本來就有小的意思,其實它并不小,而是輕量級的,集成它特別簡單,簡單到只需兩行代碼(當(dāng)然其它的圖片資源文件是要首先放在合適的位置),然而輕量級并不意味著簡單,TinyMCE能實現(xiàn)Word的許多基本功能,并且程序支持自定義,可以簡易的對其進行擴展。FCKEditor可以說是Web形式的所見即所得編輯器的大哥大,從其網(wǎng)站上面的演示即可看出,它提供了許多的工具欄,并且加入了Web中經(jīng)常使用的一些元素的直接操作(按鈕),可完全定制的樣式和工具欄按鈕顯示,多種語言的自動檢測并顯示,等等等等,要查看關(guān)于它的更多信息,請訪問它的網(wǎng)站。值得一提的還有另外一

3、件事:上面提到的兩個Web形式的所見即所得編輯器都是OpenSource的,不必擔(dān)心侵權(quán):-)本文將以集成TinyMCE為例進行講解,畢竟集成它還是比較簡單的:-)本文將按照真實項目的方式來講解,其中涉及到需求報告的形成、概要設(shè)計、詳細設(shè)計、編碼、測試、發(fā)布、維護等等階段。_看了上面的介紹是不是很興奮?本文作者也想那樣寫,不過畢竟這是個人作品,沒有太多的條條框框的束縛,能省的就省了:-)本文將按照下面的步驟進行講解:程序界面構(gòu)思及界面區(qū)域劃分,根據(jù)界面區(qū)域劃分,確定每個區(qū)域需要實現(xiàn)的功能設(shè)計第二點中的功能(編寫各種數(shù)據(jù)庫元素,比如表單、視圖、子表單、代理等)集成TinyMCE測試并發(fā)布第一節(jié)程

4、序界面構(gòu)思及界面區(qū)域劃分為了能更好的表現(xiàn)完成后的作品,以及對其進行介紹,例庫使用三個頁面來表現(xiàn):本數(shù)據(jù)庫簡介、編輯器演示和所有演示文檔。其中本數(shù)據(jù)庫簡介頁面主要用來對本數(shù)據(jù)庫進行介紹以及對TinyMCE進行一些簡單的介紹,讓使用者首先了解一些基本的內(nèi)容;編輯器演示頁面就是集成TinyMCE之后的頁面,用以對其功能進行演示;所有演示文檔頁面用來顯示所有保存的演示文檔,任何人都可以對其進行編輯和刪除。界面基本上就是這三個頁面,但是為了讓例庫更美觀,需要加入網(wǎng)頁設(shè)計中常用的Banner和Footer。Banner使用作者設(shè)計的圖片,圖中顯示了編輯器一部分,可以直觀的看出本數(shù)據(jù)庫的用途,F(xiàn)ooter部

5、分主要是版權(quán)的顯示。構(gòu)思好的界面以及區(qū)域劃分見下圖。第二節(jié)子表單設(shè)計經(jīng)過規(guī)劃好的界面,需要使用一種設(shè)計元素來表現(xiàn)出來,在DreamWeaver等工具中,這個過程就是創(chuàng)建頁面,而在Domino中,頁面的作用已經(jīng)不是很大,表單承擔(dān)起了幾乎全部界面的表現(xiàn)和動態(tài)執(zhí)行等工作,其實也可以理解,因為在DreamWeaver中,頁面里面是需要嵌入一個或者多個表單,這樣的頁面才是有生命的頁面。在第一節(jié)中,已經(jīng)將界面規(guī)劃好了,共三個表單,每個表單分為三個部分:頂部的Banner,中間的內(nèi)容部分、底部的Copyright部分。由于每個表單都有頂部的Banner和底部的Copyright部分,所以這兩部分可以做成一種

6、通用的元素,在Domino中已經(jīng)考慮到了這個需求,那就是:子表單。子表單可以在數(shù)據(jù)庫標簽里面的共享代碼里面找到。下面講解建立子表單的過程。要建立子表單,需要在數(shù)據(jù)庫標簽中展開共享代碼,然后單擊其中的子表單項,之后在Designer右側(cè)的視圖中就顯示出此數(shù)據(jù)庫中已經(jīng)存在的子表單,如果是新建的數(shù)據(jù)庫,列表就是空的,單擊列表上方的新建子表單按鈕,Designer打開一個空白的子表單設(shè)計界面,我們可以在其中進行設(shè)計工作,下面我們以建立用于表現(xiàn)頂部Banner部分的子表單為例來講解。頂部的Banner為了取得比較好的視覺效果,我們用圖片來表現(xiàn)它,這時就需要使用我們掌握的HTML知識了,表現(xiàn)圖片的HTML

7、方式的代碼如下:上面代碼中的jpg只是圖片的一種類型,當(dāng)然也可以換成其它類型,為了讓圖片路徑更簡單,我們可以直接將圖片放到數(shù)據(jù)庫的資源里面,然后在需要使用的地方就可以用/數(shù)據(jù)庫名/圖片名的方式來調(diào)用圖片了,設(shè)計好的頂部Banner子表單(命名為TopBanner)的界面如下圖所示圖中的ThisDB域是一個顯示時計算的域,計算公式為:WebDbName就是取當(dāng)前數(shù)據(jù)庫的名稱(帶路徑),然后加上斜線和圖片名字,最后還要將這行代碼內(nèi)置為HTML(選中要內(nèi)置的行,然后選擇菜單中的文本-內(nèi)置HTML),都設(shè)計好之后,將子表單保存,然后關(guān)閉。底部Footer部分的設(shè)計過程和Banner部分的類似,只不過使

8、用了更復(fù)雜的HTML代碼,用表格的形式來表現(xiàn),設(shè)計好的footer部分的子表單如下圖所示:這樣一來,表現(xiàn)頂部的Banner部分和底部的Footer部分的子表單就設(shè)計好了,如何在設(shè)計過程中使用子表單,請查看本文的表單設(shè)計一節(jié)(第三節(jié))第三節(jié)表單設(shè)計上面第二節(jié)中講過,在Domino的Web開發(fā)中,主要是使用表單來表現(xiàn)用戶界面,本節(jié)就講述表單的設(shè)計過程。經(jīng)過第二節(jié)的子表單的設(shè)計,一些通用的元素已經(jīng)設(shè)計出來了,為了在表單中取得當(dāng)前服務(wù)器的CGI信息,本例庫中還設(shè)計了一個CGI子表單,用來取得CGI的值,首先將CGI子表單加入到表單中。注意:某些域的放置順序(表單的上面和下面)都有關(guān)系,注意將下面用到其

9、值的域放在上面。要建立表單,需要在左側(cè)的數(shù)據(jù)庫書簽中找到表單分類,然后在右側(cè)的表單列表中單擊新建表單按鈕,一個空白的表單就顯示在Designer中,要將CGI子表單加入到表單中,需要單擊菜單:創(chuàng)建-資源-插入子表單,然后在彈出的對話框中選擇CGI子表單,如下圖所示:單擊確定按鈕,即可將子表單插入到表單中的光標位置,如果為了在設(shè)計界面中顯示更多的其它元素,還可以將子表單做成計算類型的,那樣就需要在插入子表單對話框中,選中對話框底部的根據(jù)公式插入子表單復(fù)選框,這樣就不能用鼠標選定子表單來插入,而要先單擊對話框中的確定按鈕,然后在表單中顯示的計算子表單上面單擊一下,在下面的代碼框中填寫要插入的子表單

10、的名字,如下圖所示:插入子表單后,還要進行表單功能以及界面的設(shè)計,這就需要用到基本的Web頁面語言HTML了,還有就是要使用Domino本身的的設(shè)計元素來實現(xiàn)所需要的功能(比如用按鈕來觸發(fā)某個事件),為了讓Domino服務(wù)器能正確解釋我們輸入的HTML代碼,我們需要將輸入的HTML代碼內(nèi)置為HTML(選中需要內(nèi)置的部分,選擇菜單:文本-內(nèi)HTML),這樣Domino服務(wù)器就能正確按照我們所寫的代碼來顯示表單,下圖為設(shè)計好的HTMLFormAdv表單(此表單用來實現(xiàn)所見即所得編輯器的功能)。圖中的HTML代碼在此不做解釋,因為在任何一本講解Web開發(fā)的入門書籍中都有對它們的解釋,下面主要講解其中

11、的Domino特有的設(shè)計元素:域和按鈕。域Domino中的域有兩種,一種是域名的域,還有另外一種域是用來輸入或者顯示內(nèi)容的域,也就是HTML語言中的input類型為文本的元素,本文主要講解后一種域。Domino中的域比HTML中的簡單的文本輸入框要復(fù)雜的多,它可以被設(shè)置成各種類型(比如文本、密碼、RTF、數(shù)值、單選按鈕、復(fù)選按鈕等等,可以通過域的屬性窗口進行調(diào)整),上圖所示表單中的Subject域的屬性窗口如下圖所示:從圖中可以看到,Domino的域可以設(shè)置將近20種類型,并且可以通過類型右側(cè)的下拉列表選擇域是否可以輸入還是使用計算方式顯示。本例庫中的Subject域只是用來輸入文檔的標題,所

12、以就只設(shè)置為文本類型,并且可以編輯(也就是可以輸入內(nèi)容),并且默認值為空,也就是在用這個表單新建文檔的時候,這個域是空白的,如下圖所示:在標題域的下面,還有一個yimingstudio域,類型為RTF,可編輯類型,由于集成所見即所得編輯器需要一個HTML Area元素,而在Domino中只有RTF類型的域在Web中能自動轉(zhuǎn)換成這種類型,所以我們把它作為所見即所得編輯器的載體,關(guān)于集成TinyMCE的講解將在后面詳細闡述,這個域的屬性如下圖所示:HTML屬性如下圖所示:按鈕Domino中的按鈕和HTML中的功能相同,都是用來觸發(fā)某些事件。不過Domino中的按鈕使用起來更靈活一些,可以自由設(shè)定其

13、顯示效果,可以通過CSS來進行效果的調(diào)整等等。本例庫中的按鈕分為兩類:一類是在Web頁面中能看到的按鈕,一類是在Web頁面中看不到的按鈕。blockquote style=margin-right:0px;dir=ltr在Web中能看到的按鈕此類按鈕用來在Web頁面中來實現(xiàn)各種功能的提示以及執(zhí)行事件之前的確認,比如在刪除之前的確認,可見按鈕的圖片如下:此表單共有三個可見按鈕,用來實現(xiàn)對文檔的操作(保存、編輯和刪除),并且每個按鈕都有不同的隱藏條件,因為按鈕需要在文檔的不同狀態(tài)下顯示(編輯狀態(tài)和讀狀態(tài));另外還需要為每個按鈕編寫相應(yīng)的代碼,才能讓它在界面中顯示出來,如果沒有為按鈕編寫任何代碼,在

14、瀏覽器中將不會顯示按鈕。要設(shè)置按鈕的隱藏條件,需要打開按鈕屬性對話框,并選擇相應(yīng)的標簽,如下圖所示:上圖是編輯文檔按鈕的屬性窗口中的隱藏條件標簽,從圖中可以看出,只是勾選了幾個復(fù)選框,就可以實現(xiàn)簡單的隱藏,如果需要隱藏的元素有很多需要滿足的條件,那就需要在下面的公式窗口中編寫隱藏公式了,本文不對隱藏公式做介紹。圖中勾選的意思就是當(dāng)文檔處于編輯狀態(tài)時,隱藏編輯文檔按鈕,另外兩個可見按鈕的隱藏屬性設(shè)置類似,不再贅述。功能復(fù)雜的可見按鈕有時需要得到用戶確認才能繼續(xù)執(zhí)行,執(zhí)行時一般是調(diào)用后臺代理,而JavaScript代碼調(diào)用代理很麻煩(要用到微軟的XHTTP),所以就去調(diào)用頁面中的不可見按鈕,來達到

15、執(zhí)行代理的目的;功能簡單的可見按鈕就可以直接執(zhí)行相關(guān)的公式來達到簡化代碼設(shè)計的目的(編輯文檔按鈕就是直接使用公式來使文檔轉(zhuǎn)換到編輯狀態(tài)),下圖是刪除文檔按鈕的代碼,從中可以看到,要執(zhí)行刪除操作,需要先得到用戶確認,然后才能繼續(xù)執(zhí)行刪除。代碼中的document.all(deldoc).click();就是調(diào)用不可見按鈕的代碼,不可見按鈕有個名稱,在其屬性窗口的最后一個標簽中可以進行設(shè)置。Web中看不到的按鈕在Web中看不到的按鈕一般用來執(zhí)行后臺代理,達到操作文檔的目的??梢姲粹o將會調(diào)用相應(yīng)的不可見按鈕,來執(zhí)行相關(guān)的代理,而在執(zhí)行代理之前,可以取得用戶的確認(JavaScript代碼就是設(shè)計用來

16、在客戶端執(zhí)行確認操作的),由于不可見按鈕都是通過DOM中的名稱來調(diào)用的,所以需要設(shè)置其名稱,要設(shè)置其名稱,需要打開其屬性窗口,選擇最后的一個HTML標簽,如下圖所示:從圖中可以看到,按鈕執(zhí)行的是deldocument代理,設(shè)置的名稱為deldoc。/blockquote表單中其它內(nèi)容表單中的其它內(nèi)容都是配合上面介紹的域和按鈕而編寫的HTML代碼,主要作用是使表單中的各種元素顯示的更美觀一些,可以參照講解HTML的書籍進行查看。表單作為Domino的Web開發(fā)中的主要表現(xiàn)元素,其中的元素不外乎上面介紹的幾種:域、按鈕和HTML代碼等,復(fù)雜的Web應(yīng)用中,表單中的元素可能更多一些,但是對于入門的程

17、序員來說,這些元素足夠來構(gòu)建常見的應(yīng)用程序了。下面的章節(jié)將介紹配合表單運行的視圖、代理等元素,由于代理中要使用相關(guān)的視圖,所以視圖和代理將放在一個章節(jié)中進行介紹。第四節(jié)代理和視圖設(shè)計上一節(jié)中介紹的表單設(shè)計中,還有一部分沒有介紹,因為涉及到了表單執(zhí)行動作所用的代碼部分,本節(jié)進行介紹。要保存錄入的內(nèi)容,只要單擊頁面中的保存文檔按鈕,為了讓保存按鈕能夠在Web頁面中顯示出來并且執(zhí)行正確的功能,需要為其編寫代碼,上一節(jié)中看到的刪除文檔按鈕的代碼是JavaScript,保存按鈕需要驗證的內(nèi)容更多,所以也用JavaScript來編寫,查看腳本時會發(fā)現(xiàn),只有一句話:doSubmit();這是什么意思呢?其實

18、它執(zhí)行的是一個函數(shù),這個函數(shù)在表單的JS Header中編寫,代碼如下:function doSubmit()var objForm=document.forms0;if(objForm.Subject.value=)alert(請輸入標題)objForm.Subject.focus();return false;tinyMCE.triggerSave(true);if(objForm.yimingstudio.value=)alert(請輸入內(nèi)容);return false;objForm.runagent.click();這段代碼的作用就是驗證表單中的某些需要錄入文字的地方是否為空,如果為

19、空,就提示用戶錄入,中間的tinyMCE.triggerSave(true);作用是調(diào)用TinyMCE的函數(shù),來保存內(nèi)容;最后的objForm.runagent.click();是執(zhí)行保存Domino文檔的代碼,它去執(zhí)行了表單中一個不可見按鈕的單擊事件,按鈕再去執(zhí)行后臺的代理。我們來看看那個按鈕的單擊事件中的代碼:Command(ToolsRunMacro;savethis)這個公式就是去執(zhí)行本數(shù)據(jù)庫中的savethis代理,要查看代理,需要打開數(shù)據(jù)庫的共享代碼分類,然后單擊其中的代理標簽,右側(cè)的視圖中就會顯示出當(dāng)前數(shù)據(jù)庫中所有的代理。我們找到savethis代理,雙擊可以打開它,打開它的時候

20、,Designer會自動打開代理屬性對話框,如下圖所示:注意圖片最下面的Runtime分類里的Target下拉列表,在新建代理的時候,默認是All Selected Documents,需要修改成none,否則執(zhí)行代理的時候會報告一個運行時錯誤。如果代理被設(shè)計用來定時或定期執(zhí)行,就需要在Trigger(觸發(fā))單選框中選擇On schedule選項,然后在下面選擇對應(yīng)的選項,在此不再做深入介紹,有興趣的可以自行試驗。代理屬性窗口中還有一個Security標簽(就是一個小鑰匙的那個),可以用來設(shè)置運行代理的權(quán)限,如下圖所示:為了能使代理為很多登錄Domino服務(wù)器的用戶服務(wù),我們可以勾選Run a

21、s web user復(fù)選框,這樣就不只是簽名代理的用戶能運行此代理了,這個代理設(shè)計時允許所有用戶都可以運行它(包括匿名用戶:Anonymous),所以不必勾選此項;下面還有一個下拉列表框:Set runtime security level:,這個選項用來控制當(dāng)前用戶是否可以執(zhí)行某些限制性的操作,比如刪除文檔和編輯文檔,共分為三個等級,第一級是最安全的,但是在使用的時候有些不太方便,第三個級別權(quán)限最大,相應(yīng)來說也最不安全,但是在局域網(wǎng)的條件下,可以選用第三個選項來獲得更多的易操作性。下面分析一下代理的代碼,看看代理都執(zhí)行了哪些操作來保存文檔,代碼如下:(Options)部分:Option Pu

22、blic Option Declare此部分代碼的第一行是新建代理時Designer自動創(chuàng)建的,第二行是自行添加的,作用是:在編寫程序時必須先聲明變量,然后才能使用變量,否則編譯時報錯。Initialize部分:Sub Initialize On Error Goto handle_error Dim vWebSession As New notessession Dim vThisDatabase As notesdatabase Dim vThisDocument As notesdocument Dim vRichStyle As NotesRichTextStyle Dim vRTIt

23、em As Variant Dim vHTMLCode As Variant Set vThisDatabase=vWebSession.CurrentDatabase Set vThisDocument=vWebSession.DocumentContext Set vRichStyle=vWebSession.CreateRichTextStyle vRichStyle.PassThruHTML=True Set vRTItem=vThisDocument.GetFirstItem(yimingstudio)If(vRTItem.Type=RICHTEXT)Then vHTMLCode=v

24、RTItem.GetUnFormattedText()Call vThisDocument.RemoveItem(yimingstudio)Set vRTItem=vThisDocument.CreateRichTextItem(yimingstudio)Call vRTitem.AppendStyle(vRichStyle)Call vRTitem.AppendText(vHTMLCode)End If vThisDocument.form=HTMLFormAdvCall vThisDocument.Save(True,True)Print|script language=javascrip

25、t|br/Print|window.location=a href=color=#808000color=#808000|+vThisDocument.WebDBName(0)+|/all/|+Cstr(vThisDocument.Universa lID)+|?opendocument|br/Print|/script|Exit Sub handle_error:Exit Sub End Sub此部分是整個代理的主體部分,幾乎所有的功能都要在這里實現(xiàn),這段代碼的主要功能是保存當(dāng)前用戶錄入的內(nèi)容,將其保存為一個Domino文檔,并且保留了編輯器中的各種格式。要實現(xiàn)上述功能,其實只需要對當(dāng)前表單

26、中的一個RTF類型的域進行操作即可實現(xiàn),從代碼中可以看出,主要就是圍繞著那個名字為yimingstudio的RTF域來進行操作:1.從當(dāng)前表單中找到這個域,然后判斷其是否為RTF類型2.如果是RTF類型,就先把其中的內(nèi)容和格式先賦到變量中,然后將其刪除3.再新建一個同名的RTF域,再把變量中保存的內(nèi)容和格式賦給此域至于RTF域為何進行如此復(fù)雜的操作,筆者也不太清楚(板磚的不要:-),只是從郵件模板中看到了此種方法,并且屢試不爽,于是借鑒了一下(看來需要好好研究一下郵件模板了)。在操作完RTF域之后,就需要把當(dāng)前表單保存為一個文檔了,調(diào)用了document的save函數(shù)來完成保存。后面的prin

27、t部分是將瀏覽器頁面轉(zhuǎn)到剛剛保存的文檔的頁面,并使其在只讀狀態(tài)下打開;最后的handle_error:標簽是錯誤處理部分。這個代理的內(nèi)容比較簡單,涉及到的操作也不是很多,我們來看看刪除文檔按鈕所執(zhí)行的代理,這個代理更具有代表性。之所以說刪除文檔的代理具有代表性,是因為它涉及到了代理的安全性,還有針對視圖和文檔的操作,這些內(nèi)容在一個稍微復(fù)雜一些的應(yīng)用中是很常見的操作,刪除文檔代理的屬性窗口的Security標簽如下圖所示:為了能讓Anonymous(匿名用戶)刪除文檔,我們就需要對deldocument代理進行安全性設(shè)置,并且調(diào)整其安全級別為2級,這樣一來,在刪除文檔的時候就不會提示無權(quán)進行此操

28、作了,代理的Initialize部分的代碼如下:Sub Initialize Dim session As New NotesSession Dim db As NotesDatabase Dim note As NotesDocument Dim view As NotesView Dim docunid As String Dim doc4del As NotesDocument Set db=session.CurrentDatabase Set note=session.DocumentContext Set view=db.GetView(all4del)docunid=note.U

29、niversalID Set doc4del=view.GetDocumentByKey(docunid)If Not(doc4del Is Nothing)Then Call doc4del.Remove(True)End If Print|script language=javascript|Print|window.location=+note.Server_Name(0)+|:|+note.Server_Port(0)+|/|+note.WebDBName(0)+|/AllDoc?openform;|Print|/script|End Sub為了刪除當(dāng)前文檔,需要在后臺找到它來刪除,如

30、果直接刪除當(dāng)前文檔(documentcontext)的話,會得到一個運行時錯誤:不能刪除當(dāng)前文檔。這樣一來,只能從后臺來執(zhí)行刪除操作。要找到這個文檔,還需要了解一下Domino各種元素的包含關(guān)系:數(shù)據(jù)庫中包含視圖,視圖中包含文檔。這也就給我們指明了找到文檔的方法,需要先找到包含文檔的數(shù)據(jù)庫(當(dāng)前session的當(dāng)前數(shù)據(jù)庫),當(dāng)前數(shù)據(jù)庫中包含當(dāng)前文檔的視圖(此視圖的選擇條件需要包含創(chuàng)建此文檔的表單的名字,稍后進行講解),然后就能找到文檔了。對應(yīng)到上面的代碼里面,大家可以依次看到上述的包含關(guān)系,找到當(dāng)前文檔的方法使用了N種方法中的一種:Set doc4del=view.GetDocumentByK

31、ey(docunid),通過文檔的UNID來搜索文檔,由于每個文檔有一個唯一的UNID,所以找到它并不困難,找到文檔后,就對其進行刪除操作:Call doc4del.Remove(True),使用了文檔的Remove函數(shù)。最后的print部分和上面的保存代理類似,還是將瀏覽器的頁面轉(zhuǎn)到另外的URL。在使用上面的GetDocumentByKey(docunid)函數(shù)的時候,需要注意一個問題,那就是對視圖的要求,在GetDocumentByKey(docunid)函數(shù)的幫助文檔的描述中,可以知道:為了讓這個函數(shù)正常工作,需要視圖滿足下列要求:第一列為函數(shù)參數(shù)所要求的內(nèi)容第一列為排序列,升序降序隨意

32、所以在設(shè)計視圖時,就需要根據(jù)上面的兩個條件進行設(shè)計,設(shè)計好的視圖如下圖所示:由圖中可以看出,第一列的值是一個公式:Text(DocumentUniqueID),將文檔的UNID轉(zhuǎn)換為普通文本(如果只是文檔的UNID,將不會顯示任何文字,需要特別注意),并且此列設(shè)置了升序排序,這樣就符合了代理中的GetDocumentByKey(docunid)函數(shù)的要求,可以直接用當(dāng)前文檔的UNID來找到文檔了。本節(jié)簡要介紹了例庫中的兩個代理及其屬性設(shè)置,可見還是比較簡單的,在復(fù)雜的應(yīng)用中,代理的代碼量可能很大,但是基本操作不過如此,只是邏輯更加復(fù)雜而已,只要業(yè)務(wù)精通,幾乎可以實現(xiàn)任何邏輯。下一節(jié)將介紹此例庫

33、的重點:集成所見即所得編輯器,以TinyMCE為例進行講解。第五節(jié)集成TinyMCE本文前面介紹過TinyMCE,還有另外一種方案是使用FCKEditor,但由于FCKEditor的體積比TinyMCE龐大很多,并且TinyMCE的功能也在逐步完善,故而本文采用集成TinyMCE的方式來實現(xiàn)web上的所見即所得編輯器。TinyMCE是一個軟件包,其中包含了界面顯示所需的圖片以及JavaScript和HTML文件等,可以從上找到TinyMCE項目并下載,下載的是一個壓縮包,將壓縮包解壓縮之后,就可以看到其目錄結(jié)構(gòu)了,如下圖所示:其中有一個examples目錄,里面有三個.htm文件,打開任意一個

34、,就可以看到TinyMCE的廬山真面目了。在頁面頂端還有其它集成方式的鏈接,單擊后可看到相應(yīng)的效果。由各種效果中可以看到,Advanced方式提供的功能更多,并且可以對其工具條中的按鈕進行定制,所以本例庫就采用Advanced方式來集成它。要將其集成到Domino中,還要看一下HTML頁面中的實現(xiàn)方式,因為最后在Domino中實現(xiàn)后也是要在瀏覽器中顯示。用記事本打開Advanced方式的那個.htm文件,查看它的HTML代碼,可以看到代碼并不復(fù)雜,開始處引用了TinyMCE的一個JavaScript文件,緊接著是一段腳本,腳本中定義了幾個JS函數(shù),最開始的tinyMCE.init就是初始化Ti

35、nyMCE編輯器的代碼,后面的函數(shù)以備表單載入后使用,JS腳本如下圖所示:余下的代碼是標準的HTML代碼,主要作用是在頁面中構(gòu)建textarea,以備TinyMCE使用,代碼如下圖所示:由上面的代碼可以看到,要使TinyMCE編輯器工作,需要引入它的JavaScript文件,并編寫對其初始化的代碼,然后在頁面中準備好TinyMCE要使用的textarea元素就可以了。那么在Domino中如何實現(xiàn)引入文件和進行初始化呢?這需要對Domino中使用文件的方式有一定了解。要在Domino的表單中引入文件,有兩種方式可以選擇:將文件放在Domino服務(wù)器的data目錄中的domino目錄里面的html

36、目錄將文件直接存放在Domino數(shù)據(jù)庫中兩種方式各有優(yōu)缺點:放在html目錄中的方式,可有效減小Domino數(shù)據(jù)庫的大小,但是在發(fā)布時,需要注意將html目錄中相應(yīng)的文件也拷貝到發(fā)布到的服務(wù)器的html目錄中,如果忘記了拷貝,應(yīng)用將不會正常運行;將文件直接存放在Domino數(shù)據(jù)庫中,會減少發(fā)布時的繁瑣,但是相應(yīng)增加了Domino數(shù)據(jù)庫的大小。權(quán)衡兩種方式,為了發(fā)布時方便一些,本例庫采用直接存放到Domino數(shù)據(jù)庫中的方式。要將文件存放到Domino數(shù)據(jù)庫中,需要用Designer打開數(shù)據(jù)庫,找到Shared Resources分類中的Files分類,選擇它之后,右側(cè)的視圖將顯示當(dāng)前數(shù)據(jù)庫中已經(jīng)

37、存在的文件資源。要將文件添加到Files分類下面,需要單擊列表上面的New File Resource按鈕,之后會彈出一個用來選擇文件的對話框,可以選擇多個文件,找到要添加的文件后,單擊對話框中的Open按鈕,稍候文件就保存到了Domino數(shù)據(jù)庫中。在集成TinyMCE時,需要注意一點:要保持存放到Domino數(shù)據(jù)庫中的相關(guān)文件的目錄結(jié)構(gòu)不變,要做到保持原目錄不變,需要將已經(jīng)添加到Domino數(shù)據(jù)庫中的文件改名,要給文件改名,可雙擊文件列表中需要修改名稱的文件,彈出文件屬性窗口,在其名稱前加上相應(yīng)的目錄名即可,如果要把a.htm文件改動到相應(yīng)的bb目錄下面,則可將文件名稱修改成這樣:bb/a.

38、htm當(dāng)然在修改時還需要細心一點,不要搞錯了名稱,在使用的時候也要注意添加文件的文件的目錄,否則將不會正常工作。將文件保存到Domino數(shù)據(jù)庫中之后的列表如下圖所示:并不是所有的文件都要放到Files分類下面,比如CSS文件就可以直接放到Style Sheets分類下面,圖片放到Images分類下面,具體的操作方法和文件類似,可以試驗一下。還要強調(diào)的一點是所有的文件都要更改一下名字,以便適應(yīng)原目錄層次。將所有文件存放到Domino數(shù)據(jù)庫中之后,就可以開始在要使用它們的頁面中進行設(shè)計了。前面介紹過,在Domino中,在Web中執(zhí)行各種功能的主要設(shè)計元素是表單,接下來就拿前面介紹的表單為例來講解如何使用TinyMCE。前面的Advanced方式的那個演示頁面中已經(jīng)非常清楚的寫出了實現(xiàn)方法:*引入JavaScript文件*初始化TinyMCE在表單中要引入JavaScript文件,有兩種方式:*在表單的HTML Header C

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論