Linux 系統安裝 CBETA 閱經器 CBReader

Linux 系統安裝 CBETA 閱經器 CBReader


【摘要】詳細介紹在 Debian 10 系統安裝 CBETA 閱經器 CBReader 的方法,包括字型的設定、修改與深灰色樣式的設定。


demo

【目錄】

    【前言
    【安裝方法
    【界面字型
    【安裝必需組件
    【啟動 CBReader
    【悉曇字型及蘭札字型
    【設定〔經文區〕字型
    【設定〔校勘區〕字型
    【設定〔表格區〕字型
    【Wine 樣式設定
    【CBReader 樣式設定
    【附錄
        〖iStyle.css
        〖cbreader.js
        〖user.reg

【前言】

一、中華電子佛典協會(CBETA)的閱藏系統(CBReader)是針對 Windows 平台設計,無法直接在 Linux 系統使用,這是非常遺憾的事。所幸,Linux 有 Wine 程式,可藉此使用 CBReader 閱經器。本篇網誌即敘述其安裝方法,以利 Linux 大眾。


二、本文曾於兩年前在 Google 的 Blogger 發表過,當時是用 Ubuntu 作業系統。近日在自組的 Debian GNU/Linux 10 重新安裝,發覺有些不同,所以更新內容,發表於此。Mac 系統有 PlayOnMac 可用,過程應該大同小異。


三、建議備份安裝好的目錄(本例是 iDrive),以後就不用再安裝了。


四、此處也提供本文的PDF檔供人下載


【安裝方法】

一、若是 Debian 10 系統,要先設定支援 386 架構;另外若有未更新的程式也順便處理:

sudo dpkg --add-architecture i386 && sudo apt update && sudo apt upgrade

二、安裝 Wine

sudo apt install wine

目前是 4.0 版,大小共 925 M。


三、安裝 PlayOnLinux

sudo apt install playonlinux

目前是 4.3.4 版,共 110 M。


四、下載安裝檔

至 CBETA 下載安裝程式 cbreader_v53_20160615_install.exe

儘量用官方的,但如果找不到,本網誌將以前下載的「CBReader 2016 版安裝程式」放在網路硬碟中(687 M),願意的人可以試試。

MD5: e35180f74fc3ea2071ebb8dacb563847


五、在 PlayOnLinux 中安裝 CBReader

  ⑴ 執行 PlayOnLinux。

  安裝時,有包括其 .desktop 檔,所以,在程式選單中應該有。


  ⑵ 按上方工具列 [Install] 按鈕;第一次執行會下載最新程式清單。

  速度似乎非常慢,若不想等,直接執行下一步沒關係。

a01-playonlinux-install-button

  ⑶ 點選視窗左下方 [Install a non-listed program] 連結。

a02-install-non-listed-program

  會出現注意事項:

during-playonlinux-installation
  • 第一條是要使用者不要變更預裝的目錄。
  • 第二條是勿讓安裝程式在最後一步啟動剛安裝好的程式。
  • 第三條是若有要求重啟系統,可以答 Yes,但使用者不要自己去重啟。

  可勾選左下方 [Don’t remind me anymore]。
  按 [Next]。


  ⑷ 出現以下訊息

a04-playonlinux-not-related-to-winehq

  主要意思是:若有問題,不要去 Wine 網站詢問,因為與他們無關。

  可勾選左下方 [Don’t remind me anymore]。
  按 [Next]。


  ⑸ 出現 [Manual installation] 訊息。

a05-manual-installation

  按 [Next]。


  ⑹ 接著是 [PlayOnLinux Wizard] 窗格。

new-virtual-drive

  根據上面注意事項第一條,選 [Install a program in a new virtual drive]。

  按 [Next]。


  ⑺ 輸入虛擬硬碟名稱。

virtual-drive-name

  此處以 iDrive 為例。

  按 [Next]。


  ⑻ 詢問安裝前要做什麼。

before-installation

  都不選,按 [Next]。


  ⑼ 詢問虛擬硬碟種類。

32-bits-windows

  選 32 位元者,按 [Next]。

  這會新增 $HOME/.PlayOnLinux/wineprefix/iDrive 目錄 。

  (試過 64 位元者,無效。)


  ⑽ 詢問安裝程式。

select-install-file

  按 [Browse] 選下載的安裝檔 cbreader_v53_20160615_install.exe

  按 [Next]。


  ⑾ 全依預設值安裝。

  各位看到的可能是一大堆豆腐,不要管內容,一直按 [Enter]。

  最後一步驟會開啟網路瀏覽器看 Readme,先略過。

select-language
readme
license-agreement
choose-components
destination-folder
installing
completing
open-readme

  ⑿ 建立捷徑。

make-cbreader-shortcut

  選 cbreader.exe,按 [Next]。


  ⒀ 視個人喜好更改捷徑名稱。

shortcut-name

  本例不更改。

  按 [Next]。


  ⒁ 其他捷徑,自己看著辦。

  最後,選第一項 [I don’t want to make another shortcut]。

  按 [Next]。

not-make-shortcut


至此,CBReader 大致安裝完畢,但還缺一些必需零件。不過,為了解決豆腐的問題,先設定用無豆腐字型。請關閉所有 PlayOnLinux 視窗。


【界面字型】

一、CBReader 開發時並未考慮 Linux 系統,預設使用的字型都是 Windows 系統的,所以必需自行修改設定檔。


二、取代 Windows 的中文字型

用文書程式開啟 $HOME/.PlayOnLinux/wineprefix/iDrive/user.reg,在檔末加入以下內容:

[Software\\Wine\\Fonts\\Replacements]
"MingLiU"="Noto Sans Mono CJK TC Regular"
"PMingLiU"="Noto Sans CJK TC Regular"
"SimSun"="Noto Sans CJK SC Regular"

如果系統有安裝文鼎的“AR PL UMing”字型想要用的話,用:

[Software\\Wine\\Fonts\\Replacements]
"MingLiU"="AR PL UMing TW"
"PMingLiU"="AR PL UMing TW"
"SimSun"="AR PL UMing CN"

儲存,關閉文書程式。


【安裝必需組件】

一、啟動 PlayOnLinux,在主視窗選剛建立的 cbreader 捷徑,然後按上方的 [Configure] 按鈕。

cbreader-configuration

二、選 [Install components] 分頁;安裝 [Internet Explorer 6]。

install-ie6
i-agree

(看不到完整內容就將窗格放大一些。)

install-microsoft-fonts
fonts-agree
ie6-agreement
update-ie-tools
restart
register-libs

(試過 IE8,無效。)


三、安裝 [msxml3]。

install-msxml3

四、完成後,按右上角 X 關閉窗格。這樣 CBReader 安裝完成了。


提醒:$HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/users/USER/Temp 有解壓縮的 CBETA 2016 目錄,如果想保留,移到他處;不想保留就刪掉,很佔空間。

  USER:自己的使用者名稱


【啟動 CBReader】

一、在 PlayOnLinux 主視窗:

雙擊 cbreader 捷徑,或
點選後,按左上方 [Run] 按鈕,或
點選後,按 [Enter]。

當然,用桌面捷徑會比較方便。


這是剛安裝完成的樣子:

cbreader-first-run

二、至此,閱讀中文經文大致沒有問題,但悉曇等字要用圖檔顯示。這是因為 CBETA 提供的悉曇字型檔不適用於 Linux 系統。

設定方法:[設定] > [選項設定] > [經文格式] > [梵文原則] > [使用圖檔]

問題是除非看得懂悉曇字,不然也不知其發音。而選項中只有 [使用TTF字型+羅馬轉寫],而沒有 [使用圖檔+羅馬轉寫]。所以,想要同時顯示悉曇字和羅馬轉寫,必需修改字型檔。下一節即敘述修改方法。


聲明:為了不侵犯版權,請不要索取修改後的字型檔,自己看著辦。依教奉行,應該可以做得出來。要提醒的是:做出來的字型檔不要隨意流通,除非確定不會侵犯版權。


提醒:因 IE6 是安裝在 PlayOnLinux 中,所以從 Wine 執行 cbreader.exe 會有問題。


【悉曇字型及蘭札字型】

這兩個字型若用 CBETA 提供的會有問題,必需修改成 Linux 可以用的。


一、安裝 FontForge。

sudo apt install fontforge

共 22 M。


二、找到 $HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/windows/Fonts/Siddam.ttf。對它按滑鼠右鍵,用 FontForge 開啟。(若無此字型檔,是因為尚未執行過 CBReader。)


三、在 FontForge 進行以下操作。

[Encoding] > [Reencode] > [ISO 10646-1 (Unicode, Full)]

re-encode

[Element] > [Font Info] > [PS Names] > [Fontname] > 改成 Siddam > [OK]

change-name

[File] > [Generate Fonts] > 檔案類型選 TrueType > 檔名 Siddam.ttf > 可取消 [Validate Before Saving] > [Generate] > [Replace]

generate-font

若有任何錯誤或警告訊息,全部略過。


四、如果想做 .otf 檔,可用以下方法。

[Encoding] > [Reencode] > [ISO 10646-1 (Unicode, Full)]

[Element] > [Font Info] > [PS Names] > [Fontname] > 改成 Siddam
[Element] > [Font Info] > [General] > [Em Size] > 下拉選單中選 1000 > [OK]

[File] > [Generate Fonts] > 檔案類型選 OpenType (CFF) > 檔名 Siddam.otf > 可取消 [Validate Before Saving] > [Generate]


五、關閉 FontForge 視窗,不需儲存。


六、擺放字型檔的目錄。

如果只有 CBReader 會用到,放在:

$HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/windows/Fonts/


如果自己其他場合會用到,放在:

$HOME/.fonts/


如果系統其他場合會用到,放在:

/usr/share/fonts/ (若有 truetype 或 opentype 目錄,可放其中)。


以上三處任一處皆可,但不要 .ttf 和 .otf 同時有。一方面,內容都是一樣的;另一方面,可能造成混淆。.otf 檔似乎是 .ttf 檔的 3~4 倍大。


七、啟動 CBReader,找篇有悉曇字的來檢查,如「事𢑥部類」T2132《悉曇字記》(T54, No. 2132)。


八、蘭札字型檔 Ranjana.ttf 也需做同樣的修改。含蘭札字的經文:「密教部類」X1079《持誦準提真言法要》(X59, No. 1079)。


九、如果字型修改過,也曾正常顯示,某日又不能正常顯示的話,檢查字型檔的修改時間是不是自己修改的時間。


【設定〔經文區〕字型】

一、CBReader 視窗可分成左右兩區,左邊是〔目錄區〕;右邊上方是〔經文區〕,下方右邊是〔校勘區〕,其左邊是〔表格區〕,請記住這些名稱。


二、從《悉曇字記》可以看到〔經文區〕有些羅馬轉寫未能正確顯示,那是因為未給予正確的字型檔。原先設定的字型都是 Windows 的,Linux 系統沒有預裝這些。而 CBReader 的 [選項設定] 只能設定字的顏色、大小,所以要用 CSS 檔來設定。


三、開啟 $HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/CBETA/CBReader/cbreader.css。

原檔留起來做參考,所以另存新檔;此處以 iStyle.css 為例。


四、為了自訂中文字型,先在 body 中設定〔經文區〕整體的字型,以覆寫預設值。在 } 前加入:

font-family: Noto Serif CJK TC Regular, AR PL UMing TW;

Google 的 Noto 字型則是 Debian 在新增中文語系時,預設附帶的。
文鼎的“AR PL UMing TW”是 Linux 系統很常用的中文字型,有如 Windows 的新細明體。

字體尺寸可能至少要 15pt 才容易閱讀:

font-size:15pt;

字加大了,行距也要加大:

line-height:20pt;

五、將缺字 span.gaiji 的內容去掉,沿用 body 的整體字型即可。因為此缺字包括了經文原本所缺少的字(用豆腐顯示)、組合字、悉曇等字,所以若用其他字型或顏色,看起來會有些突兀。


六、羅馬轉寫等外文字在 CBReader 中是屬於 nonhan 這個 class,原本的 cbreader.css 不含此項,要自己加。

span.nonhan {font-family:Noto Sans CJK TC Regular, Gandhari Unicode, DejaVu Sans; font-size:13pt;}

這三個字型經個別試驗,皆可正確顯示羅馬轉寫。其中 “Gandhari Unicode” 是安裝 CBReader 時附帶的。用 “GandhariUnicode” 也可以。這是 serif 字型,另兩個是 sans-serif 字型。


七、啟動 CBReader,[設定] > [選項設定] > [字型格式] > [使用自訂CSS] 勾選 > […]按鈕 > 選 iStyle.css > [儲存]。

再開啟「事𢑥部類」T2132《悉曇字記》(T54, No. 2132)看看。應該能正確顯示羅馬轉寫了。


八、上項雖可在〔經文區〕正確顯示羅馬轉寫,但下方的〔校勘區〕和〔表格區〕倒是未必。


【設定〔校勘區〕字型】

一、CBReader 預設用“Times New Roman”或“Gandhari Unicode”顯示羅馬轉寫。

如果原本已有或在安裝過程中有包括“Times New Roman”(看 $HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/windows/Fonts/ 中是否有 Times.TTF 等),CBReader 就會採用。如果沒有,就用“Gandhari Unicode”。

只不過,用“Times New Roman”所顯示的字母似乎不是很一致,“Gandhari Unicode”還比較好。所以請把“Times*.TTF”移走

啟動 CBReader,再開啟「事𢑥部類」T2132《悉曇字記》(T54, No. 2132)看看。〔校勘區〕應該能正確顯示羅馬轉寫了。


二、如果覺得“Gandhari Unicode”還是不夠好,可以用“DejaVu Sans”、“DejaVu Serif”或"AR PL UMing TW"等。但這要修改登錄檔才可以。

  ⑴ 若真要改,必需先將“Times*.TTF”移走(如果有的話),不然 CBReader 還是會用它。(“Gandhari Unicode”(gu*.ttf)移走也沒用,一執行 CBReader,就會被加回來,因為有 install_font.exe 之故。)


  ⑵ 開啟 $HOME/.PlayOnLinux/wineprefix/iDrive/user.reg。(如果 CBReader 在執行中,請先關閉。以後也都一樣,凡是修改登錄檔,都要先關閉程式。)


  ⑶ 找到 [Software\\Wine\\Fonts\\Replacements](如果找不到,就自己在檔頭或檔尾加入;登錄檔會自動依字母排序),在其下加入下行:

"Times New Roman"="DejaVu Serif"

  ⑷ 儲存檔案,才啟動 CBReader。


【設定〔表格區〕字型】

一、此處的內容是在〔經文區〕或〔校勘區〕中,點選校勘連結時,才臨時產生的。用的是 cbreader.js 中的指令。


二、開啟 $HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/CBETA/CBReader/cbreader.js。

如果用文書程式開啟此檔有亂碼現象,可同時用網路瀏覽器開啟此檔,轉為 big5 編碼(Chinese, Traditional),全選,複製,取代文書程式中的原本內容,再以 big5 儲存,不能用 utf-8 儲存。可以順便把換行改成 LF。儲存時,可能會有兩個問題:「都」和「者」用了「日」右上有加點的字。把這些地方改過來,就可以了。(這個問題不一定會遇到,看如何改編碼而定。)


三、尋找“font-family”。

font-family: Gandhari Unicode, 細明體, 細明體-ExtB, SimSun, Arial Unicode MS;

改成

font-family: AR PL UMing TW, Gandhari Unicode;

四、若 CBReader 已在執行中,按 [設定] > [畫面重整] 即可。


五、之所以要用“AR PL UMing TW”,是因為它在〔表格區〕中,可以正確顯示中文和羅馬轉寫。若用“Gandhari Unicode”,只能正確顯示羅馬轉寫,而中文會用系統預設的;譬如有安裝 AR PL UKai,就會用這個楷體。如果喜歡看楷體或是沒有安裝,就不用改了。


【Wine 樣式設定】

一、會覺得 CBReader 的中字太小嗎?如果想放大,用以下步驟:

  1. 在 PlayOnLinux 主視窗點選 cbreader 捷徑。
  2. 按上方的 [Configure] 按鈕。
  3. 選 [Wine] 分頁。
  4. 按 [Configure Wine]。
  5. 選 [Graphics] 分頁。
  6. 將 [Screen resolution] 改為 100~120,視各人喜好而定。
  7. 按 [OK] 離開。
  8. 重啟 CBReader。

configure-wine
screen-resolution

此值記錄在登錄檔 $HOME/.PlayOnLinux/wineprefix/iDrive/user.reg。[Software\\Wine\\Fonts] 中的 "LogPixels"=dword:00000064 即是。此例,十六進位的 64 是十進位的 100。

此法會改變整個視窗的字體尺寸。


二、如果想各別設定「標題列」或「選單列/功能表」的樣式,上面選 [Graphics] 分頁改成選 [Desktop Integration] 分頁。然後在 [Item] 下拉選單選要修改的項目。

desktop-integration-item

  ⑴ 選單列字體是 [Menu Text];大家都知道 [Color] 改字色,[Font…] 改字體。


  ⑵ CBReader 視窗最上方的標題列預設是由作業系統的視窗管理員控制。如果要由 Wine 控制,改變其顏色和字型,方法同上,但要先選 [Graphics] 分頁,將 [Allow the window manager to decorate the windows] 取消勾選。

not-to-decorate-windows

  然後在 [Item] 下拉選單選要修改的項目:

  使用中視窗標題列:
    左側漸層色是 [Active Title Bar]
    右側漸層色是 [Active Title Bar Gradient]
    文字是 [Active Title Text]

  非使用中視窗標題列:
    左側漸層色是 [Inactive Title Bar]
    右側漸層色是 [Inactive Title Bar Gradient]
    文字是 [Inactive Title Text]


  ⑶ 結果記錄在登錄檔 $HOME/.PlayOnLinux/wineprefix/iDrive/user.reg 中,就在檔頭附近。原本 [Control Panel\\Colors] 下,無任何項目。依上法修改顏色後,便會記錄在此(有修改的項目才會出現)。字型和大小在 [Control Panel\\Desktop\\WindowMetrics]。


  ⑷ [Graphics] 分頁的 [Allow the window manager to control the windows] 不建議取消,不然切換視窗會有問題。


  ⑸ 〔目錄區〕的顏色也是在此設定。

  • [Window Background] 設定文字區背景,也包括輸入框、勾選框等
  • [Window Frame] 設定控制組件的框色,如按鈕、下拉選單等
  • [Window Text] 設定文字顏色,也包括輸入框、標籤、歡迎網頁、對話框

  以上三項在 user.reg 中分別是 WindowWindowFrameWindowText


【CBReader 樣式設定】

一、現在介紹右側三區的樣式。

之前在談字型設定時,提過 CBReader 目錄中的 CSS 和 JS 檔。它們也可以用來設定樣式。

一般應用程式多設計為淺色樣式,白色最多,CBReader 也不例外。但是,寫程式的 IDE 大多用深色樣式,因為程式不是三兩下就能寫完的。而長時間看淺色的螢幕,眼睛容易累。所以,本文也用深色樣式做範例。


二、在 CBReader 的視窗中,有兩個現象影響了顏色的設定。

  • 其一,有些地方的顏色是固定的。
  • 其二,多個地方共用一個顏色。

固定顏色的一個地方是左側某些(如書籤)分頁的欄名固定為黑色;這大概由 Wine 決定,不知何處可修改。這就妨礙了用深色的樣式。

共用底色方面,[Item] 下拉選單的 [Controls Background] (在登錄檔中叫 ButtonFace)決定了多個地方的背景色,大概除了文字區、選單列、標題列以外,其他區域的背景都由它決定。

共用字色的地方有〔目錄區〕、〔表格區〕、輸入框、標籤、歡迎網頁、對話框,全由 [Item] 下拉選單的 [Window Text](登錄檔中叫 WindowText)設定。

下面的介紹以深灰色樣式為例。


三、〔經文區〕

前面既然為設定字型使用了 CSS 檔,顏色也就必需用此檔(iStyle.css)設定。以下依字母順序介紹。

  ⑴ 連結的顏色在深灰色背景中,要稍做修改。

a:active {color:#80ffff;}
a:hover {color:#ffa020;}    # 原版寫成 a.hover 是錯的
a:link {color:#40c0ff;}
a:visited {color:#8000ff;}  # 似乎無效

  ⑵ 在 body 標籤內可用 colorbackground-color 設定整體的字色與底色。本例為:

background-color:#202020;
color:#e0e0e0;

  ⑶ div.w 為附文,也就是一篇經文最後所附的文字;這應該是 div 而不是 span

color:#ffa0ff;

  ⑷ div.xu 是序文;這應該是 div 而不是 span

color:#00ff80;

  ⑸ img 標籤為圖片;因為圖是黑的,深色樣式時,圖需用較淺的背景色,不然看不清楚。

img { background-color:#a0a0a0; }

  ⑹ span.SearchWord 是使用「全文檢索」時,標出被檢索文字的樣式。因為文字都是連結,使用 <a> 的樣式,在此無法改變,乾脆刪掉。

span.SearchWord1 {background:#606000;}
span.SearchWord2 {background:#006060;}
span.SearchWord3 {background:#006000;}
span.SearchWord4 {background:#600000;}
span.SearchWord5 {background:#600060;}

  ⑺span.byline 為作/譯者。

color:#80f080;

  ⑻ span.corr 為修訂字,將預設的紅色改淺一點。

color:#ff6060;

  ⑼ span.dharani 為咒語,包括音譯中文和悉曇等字。原檔沒有,就自己加入。

span.dharani { color:#60ff00; }

  ⑽ span.foot 為校勘字;為了標出有多少字,所以設定顏色;又為了減少影響,只改底色且只有微小的差異。但當〔經文區〕和〔校勘區〕的校勘內容不一致時,此設定似乎無效。

span.foot { background-color:#000000; }

  ⑾ span.headname 為品名或標題。

color:#e000e0;

  ⑿ span.juanname 為經卷名。

color:#e08000;

  ⒀ span.juannum 為經號。

color:#00e000;

  ⒁ span.lg 為偈頌。

color:#ffff80;

  ⒂ span.linehead 為行首資訊。

color:#a0a0a0;

  ⒃ span.note 為雙行小註。

color:#c0c000;

  ⒄ 此外,當在〔校勘區〕點選連結後,〔經文區〕的連結文字會改變底色。預設為 lightpink,這設定在 cbreader.js 中的第一個變數 sr。因本例的字色為配合深灰色背景已改淺,這淺粉的底色可能會使文字看不清楚,所以最好修改為其他色。例如深一點的紅色:

var sr='darkred';

  但若校勘內容含梵巴對照,底色會用 yr 變數的顏色。預設的黃色,也會讓文字變得不清晰。所以把它改成和前者一樣。

var yr='darkred';

  註:可能是 CBReader 的 bug,當在〔校勘區〕點選連結後,〔經文區〕的連結文字原本會改變底色,但並不是一直如此。當〔經文區〕和〔校勘區〕的校勘內容不一致時,會無效。例如:〔經文區〕顯示的是「阿(上)」而〔校勘區〕是「阿上」,就會有問題。


四、〔表格區〕

  ⑴ 開啟 $HOME/.PlayOnLinux/wineprefix/iDrive/drive_c/CBETA/CBReader/cbreader.js。

  尋找“font-family”。前面設定字型時,也是修改此處(原檔第 242 行)。


  ⑵ 這裡除了字型外,還設定了〔表格區〕的背景為白色。但是現在想要設定的項目比較多,除了原本的,還有字色和框色。此外,由於也有可能顯示圖片,所以也要設定其底色。因此乾脆全面改寫此行。要設定的項目有:

body {
  font-family: AR PL UMing TW, GandhariUnicode;
  color: #e0e0e0;
  background-color: #202020;
}
table, td {
  border-collapse: collapse;
  border: 1px solid #e0e0e0;
}
img { background-color: #a0a0a0; }

  把這些全連成一行放在 <head> 中,第 242 行就變成:

docJK.write("<head> <style> body { font-family: AR PL UMing TW, GandhariUnicode; color: #e0e0e0; background-color: #202020; } table, td { border-collapse: collapse; border: 1px solid #e0e0e0; } img { background-color: #a0a0a0; } </style> </head>");

  ⑶ 如果覺得〔表格區〕內的第一行和表格太近,可將原檔第 295 行由

docJK.write(s);

  改成

docJK.write(s + "<br><br>");

五、〔校勘區〕

同樣是改 cbreader.js,在檔末附加兩段內容。

  ⑴ 第一段

function loadStyle() {
  var footDoc = window.parent.frames.foot.document;
  footDoc.body.style.color = "#e0e0e0";
  footDoc.body.style.backgroundColor = "#202020";
  footDoc.body.style.fontFamily = "AR PL UMing TW, GandhariUnicode, Noto Sans CJK TC Regular";
  for (i = 0; i < footDoc.anchors.length; i++) {
    footDoc.anchors[i].style.color = "#40c0ff";
  }
  for (i = 0; i < footDoc.images.length; i++) {
    footDoc.images[i].style.backgroundColor = "#a0a0a0";
  }
  window.parent.frames.jk.document.body.style.backgroundColor = "#202020";
}
 
window.onload = loadStyle;

    ⒈ 先定義一個名為 loadStyle 的 function:

      ① 其中第一行定義變數 footDoc,它是〔校勘區〕的內容。用 footDoc,是因為原檔已用 docFoot 定義相同物件,為了避免混淆,故用不一樣的名稱。

      ② 再來三行是設定文件中 body 標籤內的樣式——字色、底色、和字型。可能有人會認為字型的設定重覆了。其實沒有,這裡是〔校勘區〕的,前面第 242 行是〔表格區〕的。

      ③ 第一個 for loop 是調整連結顏色。

      ④ 接下來的 for loop 是為圖片加背景,因為此區也有可能顯示圖片。

      ⑤ 然後設定〔表格區〕的底色。雖然前面第 242 行已設定了背景,但那是在執行此 JS 檔後,才會生效。也就是,在點選任一校勘連結後。而在剛開啟一篇經文時,〔表格區〕的背景仍是預設的白色。


    ⒉ 最後一行是設定執行此 function 的時機——主文件載入後即改樣式。


  ⑵ 第二段

  這些指令是為了將連結的底色恢復為上段所設定的顏色。原程式為了恢復連結的底色,在 cbreader.exe 中設定恢復為白色,那是因為〔校勘區〕預設的底色是白色。但此例用深灰色樣式,所以要再行修改。

function resetBackground() {
  var footDoc = window.parent.frames.foot.document;
  for (i = 0; i < footDoc.anchors.length; i++) {
    footDoc.anchors[i].style.backgroundColor = "#202020";
  }
}
 
window.parent.frames.sutra.document.onclick = resetBackground;
window.parent.frames.foot.document.onclick = resetBackground;

    ⒈ 先定義一個名為 resetBackground 的 function:

      ① 其中第一行定義變數 footDoc,和上面一樣是〔校勘區〕的內容。也可以把它移到 function 外,只定義一次。

      ② for loop 就是恢復底色。


    ⒉ 最後兩行是設定:在〔經文區〕或〔校勘區〕任一處左點一下即執行此 function 將底色變回來。


範例圖:

after-setting


不敢說大功告成,因為還有少許問題。譬如:〔目錄區〕無法顯示 tooltip。不知是本例 CBReader 設定不完善,還是 Wine 的緣故。此外,修改字型檔時,忽略了錯誤訊息,會有些許悉曇字無法顯示;若想看,就要用圖檔了。也可能還有尚未發現的問題。


願諸位

智慧如海 早日成佛



【附錄】

〖iStyle.css〗

a:active {color:#80ffff;}
a:hover {color:#ffa020;}
a:link {color:#40c0ff;}
a:visited {color:#8000ff;}
body {background:#202020; color:#e0e0e0; font-size:15pt; font-family:Noto Serif CJK TC Regular, AR PL UMing TW; line-height:20pt;}
div.w {color:#ffa0ff; font-size:13pt;}
div.xu {color:#00ff80; font-size:13pt;}
img {background-color:#a0a0a0;}
span.SearchWord1 {background:#606000;}
span.SearchWord2 {background:#006060;}
span.SearchWord3 {background:#006000;}
span.SearchWord4 {background:#600000;}
span.SearchWord5 {background:#600060;}
span.byline {color:#80f080; font-size:13pt;}
span.corr {color:#ff6060;}
span.dharani {color:#60ff00;}
span.foot {background-color:#000000;}
span.headname {color:#e000e0; font-size:14pt;font-weight:bold;}
span.juanname {color:#e08000; font-size:16pt;font-weight:bold;}
span.juannum {color:#00e000; font-size:12pt;}
span.lg {color:#ffff80;}
span.linehead {color:#a0a0a0; font-size:13pt;}
span.nonhan {font-family:Noto Sans CJK TC Regular, Gandhari Unicode, DejaVu Sans; font-size:13pt;}
span.note {color:#c0c000; font-size:13pt;}

〖cbreader.js〗

只列有更改的地方。

第 5 行

var sr='darkred';

第 7 行

var yr='darkred';

第 242 行

docJK.write("<head> <style> body { font-family: AR PL UMing TW, GandhariUnicode; color: #e0e0e0; background-color: #202020; } table, td { border-collapse: collapse; border: 1px solid #e0e0e0; } img { background-color: #a0a0a0; } </style> </head>");

第 295 行

docJK.write(s + "<br><br>");

檔末加

function loadStyle() {
  var footDoc = window.parent.frames.foot.document;
  footDoc.body.style.color = "#e0e0e0";
  footDoc.body.style.backgroundColor = "#202020";
  footDoc.body.style.fontFamily = "AR PL UMing TW, GandhariUnicode, Noto Sans CJK TC Regular";
  for (i = 0; i < footDoc.anchors.length; i++) {
    footDoc.anchors[i].style.color = "#40c0ff";
  }
  for (i = 0; i < footDoc.images.length; i++) {
    footDoc.images[i].style.backgroundColor = "#a0a0a0";
  }
  window.parent.frames.jk.document.body.style.backgroundColor = "#202020";
}
 
window.onload = loadStyle;
 
function resetBackground() {
  var footDoc = window.parent.frames.foot.document;
  for (i = 0; i < footDoc.anchors.length; i++) {
    footDoc.anchors[i].style.backgroundColor = "#202020";
  }
}
 
window.parent.frames.sutra.document.onclick = resetBackground;
window.parent.frames.foot.document.onclick = resetBackground;

〖user.reg〗

只列有更改的地方。

[Control Panel\\Colors]
"ActiveBorder"="224 224 224"
"ActiveTitle"="32 32 32"
"AppWorkSpace"="128 128 128"
"Background"="128 128 128"
"ButtonAlternateFace"="128 128 128"
"ButtonDkShadow"="160 160 160"
"ButtonFace"="64 64 64"
"ButtonHilight"="160 160 160"
"ButtonLight"="64 64 64"
"ButtonShadow"="64 64 64"
"ButtonText"="192 192 192"
"GradientActiveTitle"="192 192 192"
"GradientInactiveTitle"="0 0 0"
"GrayText"="128 128 128"
"Hilight"="192 192 192"
"HilightText"="32 32 32"
"HotTrackingColor"="128 128 128"
"InactiveBorder"="128 128 128"
"InactiveTitle"="32 32 32"
"InactiveTitleText"="192 0 0"
"InfoText"="255 255 255"
"InfoWindow"="128 128 128"
"Menu"="64 64 64"
"MenuBar"="128 128 128"
"MenuHilight"="128 128 128"
"MenuText"="224 224 224"
"Scrollbar"="96 96 96"
"TitleText"="224 224 224"
"Window"="32 32 32"
"WindowFrame"="192 192 192"
"WindowText"="224 224 224"
[Control Panel\\Desktop]
"LogPixels"=dword:00000064
[Control Panel\\Desktop\\WindowMetrics]
"BorderWidth"="1"
"CaptionFont"=hex:0c,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,90,01,00,00,\
  00,00,00,00,00,00,00,22,4e,00,6f,00,74,00,6f,00,20,00,53,00,61,00,6e,00,73,\
  00,20,00,43,00,4a,00,4b,00,20,00,54,00,43,00,20,00,52,00,65,00,67,00,75,00,\
  6c,00,61,00,72,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00
"CaptionHeight"="-274"
"CaptionWidth"="-274"
"MenuFont"=hex:0c,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,90,01,00,00,00,\
  00,00,88,00,00,00,22,4e,00,6f,00,74,00,6f,00,20,00,53,00,61,00,6e,00,73,00,\
  20,00,43,00,4a,00,4b,00,20,00,54,00,43,00,20,00,52,00,65,00,67,00,75,00,6c,\
  00,61,00,72,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00
"MenuHeight"="-274"
"MenuWidth"="-274"
"MessageFont"=hex:0e,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,90,01,00,00,\
  00,00,00,00,00,00,00,22,4e,00,6f,00,74,00,6f,00,20,00,53,00,61,00,6e,00,73,\
  00,20,00,43,00,4a,00,4b,00,20,00,54,00,43,00,20,00,52,00,65,00,67,00,75,00,\
  6c,00,61,00,72,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00
"ScrollHeight"="-245"
"ScrollWidth"="-245"
"SmCaptionFont"=hex:09,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,90,01,00,\
  00,00,00,00,88,00,00,00,22,4e,00,6f,00,74,00,6f,00,20,00,53,00,61,00,6e,00,\
  73,00,20,00,43,00,4a,00,4b,00,20,00,54,00,43,00,20,00,52,00,65,00,67,00,75,\
  00,6c,00,61,00,72,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00
"SmCaptionHeight"="-302"
"SmCaptionWidth"="-230"
"StatusFont"=hex:0d,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,90,01,00,00,\
  00,00,00,88,00,00,00,22,4e,00,6f,00,74,00,6f,00,20,00,53,00,61,00,6e,00,73,\
  00,20,00,43,00,4a,00,4b,00,20,00,54,00,43,00,20,00,52,00,65,00,67,00,75,00,\
  6c,00,61,00,72,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00
[Software\\Wine\\Fonts]
"LogPixels"=dword:00000064
[Software\\Wine\\Fonts\\Replacements]
"MingLiU"="Noto Sans Mono CJK TC Regular"
"PMingLiU"="Noto Sans CJK TC Regular"
"SimSun"="Noto Sans CJK SC Regular"
"Times New Roman"="DejaVu Serif"
[Software\\Wine\\X11 Driver]
"Decorated"="N"

發表留言