Etherpad/外掛:修訂版本之間的差異
出自福留子孫
第 4 行: | 第 4 行: | ||
可參考以下影片 | 可參考以下影片 | ||
<videoflash>-pCNSqZF1dw</videoflash> | <videoflash>-pCNSqZF1dw</videoflash> | ||
− | + | [https://www.youtube.com/watch?v=-pCNSqZF1dw 寫出第一個Etherpad外掛] | |
+ | ===步驟=== | ||
+ | #將setting中的"minify"改成false,方便debug | ||
+ | #創造plugins資料夾(舉例 ep_previewimages) | ||
+ | #在資料夾中新增packages.json,裡面打plugins的資訊(名字 作者 版本 描述 貢獻者 運行引擎)([https://etherpad.org/doc/latest/#index_plugins 範例(搜尋Package definition)])<br><code>{"name": "ep_PLUGINNAME",<br>"version": "0.0.1",<br>"description": "DESCRIPTION",<br>"author": "USERNAME (REAL NAME) <MAIL@EXAMPLE.COM>",<br>"contributors": [],<br>"dependencies": {"MODULE": "0.3.20"},<br> "engines": {"node": ">=12.13.0"}}</code><br>其中name 為plugin名字,version為plugin版本,description為plugin介紹,author為plugin作者,contributors為貢獻者名單,dependencies為寫程式所依賴的工具包,engines為運行引擎。 | ||
+ | #*以ep_previewimages中的packages.json為例<blockquote>{ "name": "ep_previewimages",<br>"description": "Image previewer, paste the URL of an image or upload an image using ep_fileupload",<br> "version": "0.0.13",<br> "author": "johnyma22 (John McLear) <john@mclear.co.uk>",<br> "contributors": [],<br> "dependencies": {},<br> "repository": {<br> "type": "git",<br> "url": "https://github.com/JohnMcLear/ep_previewimages.git"<br> },<br> "engines": {<br> "node": "*"<br> }}</blockquote> | ||
+ | #在資料夾中新增ep.json,裡面打plugins的函式介紹( )([https://etherpad.org/doc/latest/#index_plugins 範例(搜尋Plugin definition)])<br><code>{"parts": <br>[{"name": "nameThisPartHoweverYouWant",<br>"hooks": <br>{"authenticate": "ep_<plugin>/<file>:functionName1",<br> "expressCreateServer": ep_<plugin>/<file>:functionName2" },<br> "client_hooks": { "acePopulateDOMLine": "ep_<plugin>/<file>:functionName3" }<br> } ]<br>}</code><br>其中name 為plugin名字,hook 及client hook 中會寫出plugin使用的函式及位置。 | ||
+ | #*以ep_previewimages中的ep.json為例<blockquote>{ "name": "ep_previewimages",<br>"description": "Image previewer, paste the URL of an image or upload an image using ep_fileupload",<br> "version": "0.0.13",<br> "author": "johnyma22 (John McLear) <john@mclear.co.uk>",<br> "contributors": [],<br> "dependencies": {},<br> "repository": {<br> "type": "git",<br> "url": "https://github.com/JohnMcLear/ep_previewimages.git"<br> },<br> "engines": {<br> "node": "*"<br> }}</blockquote> | ||
+ | |||
+ | #最後寫出index.js,裡面使用javascript語法寫出所需要的函式 |
2023年4月25日 (二) 13:29的修訂版本
可參考以下影片
寫出第一個Etherpad外掛步驟
- 將setting中的"minify"改成false,方便debug
- 創造plugins資料夾(舉例 ep_previewimages)
- 在資料夾中新增packages.json,裡面打plugins的資訊(名字 作者 版本 描述 貢獻者 運行引擎)(範例(搜尋Package definition))
{"name": "ep_PLUGINNAME",
"version": "0.0.1",
"description": "DESCRIPTION",
"author": "USERNAME (REAL NAME) <MAIL@EXAMPLE.COM>",
"contributors": [],
"dependencies": {"MODULE": "0.3.20"},
"engines": {"node": ">=12.13.0"}}
其中name 為plugin名字,version為plugin版本,description為plugin介紹,author為plugin作者,contributors為貢獻者名單,dependencies為寫程式所依賴的工具包,engines為運行引擎。- 以ep_previewimages中的packages.json為例
{ "name": "ep_previewimages",
"description": "Image previewer, paste the URL of an image or upload an image using ep_fileupload",
"version": "0.0.13",
"author": "johnyma22 (John McLear) <john@mclear.co.uk>",
"contributors": [],
"dependencies": {},
"repository": {
"type": "git",
"url": "https://github.com/JohnMcLear/ep_previewimages.git"
},
"engines": {
"node": "*"
}}
- 以ep_previewimages中的packages.json為例
- 在資料夾中新增ep.json,裡面打plugins的函式介紹( )(範例(搜尋Plugin definition))
{"parts":
[{"name": "nameThisPartHoweverYouWant",
"hooks":
{"authenticate": "ep_<plugin>/<file>:functionName1",
"expressCreateServer": ep_<plugin>/<file>:functionName2" },
"client_hooks": { "acePopulateDOMLine": "ep_<plugin>/<file>:functionName3" }
} ]
}
其中name 為plugin名字,hook 及client hook 中會寫出plugin使用的函式及位置。- 以ep_previewimages中的ep.json為例
{ "name": "ep_previewimages",
"description": "Image previewer, paste the URL of an image or upload an image using ep_fileupload",
"version": "0.0.13",
"author": "johnyma22 (John McLear) <john@mclear.co.uk>",
"contributors": [],
"dependencies": {},
"repository": {
"type": "git",
"url": "https://github.com/JohnMcLear/ep_previewimages.git"
},
"engines": {
"node": "*"
}}
- 以ep_previewimages中的ep.json為例
- 最後寫出index.js,裡面使用javascript語法寫出所需要的函式