視窗
這篇文章將闡述視窗插件的基本概念。
絕大部分的插件都應該使用這種方式開發。它提供了一個瀏覽器視窗,你可以在這個視窗中開發想要達成的功能,當使用者點擊插件時,這個視窗會自動彈出。

我們可以在 manifest.json 檔案中設定 main 欄位來設定視窗屬性。
{
"main": {}
}為視窗設定預設開啓連結url:
{
"main": {
"url": "index.html"
}
}設定視窗預設寬度 width及高度height:
{
"main": {
"url": "index.html",
"width": 640,
"height": 480
}
}設定其它 metadata.json 欄位後,最終程式碼如下:
{
"id": "LBCZE8V6LPCKD",
"version": "1.0.0",
"name": "視窗插件",
"logo": "/logo.png",
"keywords": [],
"main":
{
"url": "index.html",
"width": 640,
"height": 480
}
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<script type="text/javascript" src="js/plugin.js"></script>
</head>
<body>
<div id="message"></div>
</body>
</html>eagle.onPluginCreate((plugin) => {
console.log('eagle.onPluginCreate');
console.log(plugin);
document.querySelector('#message').innerHTML = `
<ul>
<li>id: ${plugin.manifest.id}</li>
<li>version: ${plugin.manifest.version}</li>
<li>name: ${plugin.manifest.name}</li>
<li>logo: ${plugin.manifest.logo}</li>
<li>path: ${plugin.path}</li>
</ul>
`;
});
eagle.onPluginShow(() => {
console.log('eagle.onPluginShow');
});
eagle.onPluginHide(() => {
console.log('eagle.onPluginHide');
});
eagle.onPluginBeforeExit((event) => {
console.log('eagle.onPluginBeforeExit');
});Last updated