Skip to content

Commit f0ef27e

Browse files
frostimefrostime
authoredJun 28, 2023
Merge pull request #17 from siyuan-note/dev
Update
·
v1.0.0v0.1.8
2 parents d4f9ffa + ddca3e0 commit f0ef27e

11 files changed

+103
-66
lines changed
 

‎CHANGELOG.md

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
## 0.1.8
2+
3+
* [Add protyleSlash to the plugin](https://github.com/siyuan-note/siyuan/issues/8599)
4+
* [Add plugin API protyle](https://github.com/siyuan-note/siyuan/issues/8445)
5+
6+
## 0.1.7
7+
8+
* [Support build js and json](https://github.com/siyuan-note/plugin-sample/pull/8)
9+
10+
## 0.1.6
11+
12+
* add `fetchPost` example

‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
[中文版](./README_zh_CN.md)
55

6-
> Consistent with [siyuan/plugin-sample](https://github.com/siyuan-note/plugin-sample) [v0.1.5](https://github.com/siyuan-note/plugin-sample/tree/v0.1.5).
6+
> Consistent with [siyuan/plugin-sample](https://github.com/siyuan-note/plugin-sample) [v0.1.8](https://github.com/siyuan-note/plugin-sample/tree/v0.1.8).
77
88

99

‎README_zh_CN.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
[English](./README.md)
55

66

7-
> 本例和 [siyuan/plugin-sample](https://github.com/siyuan-note/plugin-sample) [v0.1.5](https://github.com/siyuan-note/plugin-sample/tree/v0.1.5)
7+
> 本例和 [siyuan/plugin-sample](https://github.com/siyuan-note/plugin-sample) [v0.1.8](https://github.com/siyuan-note/plugin-sample/tree/v0.1.8)
88
99
1. 使用 vite 打包
1010
2. 使用符号链接、而不是把项目放到插件目录下的模式进行开发

‎package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "plugin-sample-vite-svelte",
3-
"version": "0.1.5",
3+
"version": "0.1.8",
44
"type": "module",
55
"description": "",
66
"repository": "",
@@ -22,7 +22,7 @@
2222
"minimist": "^1.2.8",
2323
"rollup-plugin-livereload": "^2.0.5",
2424
"sass": "^1.62.1",
25-
"siyuan": "0.7.4",
25+
"siyuan": "0.7.5",
2626
"svelte": "^3.57.0",
2727
"ts-node": "^10.9.1",
2828
"typescript": "^5.0.4",

‎plugin.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "plugin-sample-vite-svelte",
33
"author": "frostime",
44
"url": "https://github.com/siyuan-note/plugin-sample-vite-svelte",
5-
"version": "0.1.5",
5+
"version": "0.1.8",
66
"minAppVersion": "2.9.0",
77
"backends": ["all"],
88
"frontends": ["all"],

‎src/hello.svelte

+31-42
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,50 @@
11
<script lang="ts">
22
import { onDestroy, onMount } from "svelte";
3-
import { version } from "@/api";
4-
import { showMessage } from "siyuan";
5-
import Typo from "@/libs/b3-typography.svelte";
3+
import { version, sql as query } from "@/api";
4+
import { showMessage, fetchPost, Protyle } from "siyuan";
65
7-
export let name: string;
8-
export let i18n: any;
6+
export let app;
97
10-
let time;
11-
let ver;
8+
let time: string = "";
9+
let ver: string;
1210
13-
let intv1 = setInterval(async () => {
14-
time = new Date();
15-
}, 1000);
11+
let divProtyle: HTMLDivElement;
12+
let protyle: any;
13+
let blockID: string = '';
1614
1715
onMount(async () => {
18-
time = new Date();
1916
ver = await version();
17+
fetchPost("/api/system/currentTime", {}, (response) => {
18+
time = new Date(response.data).toString();
19+
});
20+
protyle = await initProtyle();
2021
});
2122
22-
/**
23-
* You must call this function when the component is destroyed.
24-
*/
2523
onDestroy(() => {
2624
showMessage("Hello panel closed");
27-
clearInterval(intv1);
25+
protyle.destroy();
2826
});
2927
30-
$: time_str = new Date(time).toLocaleTimeString();
31-
28+
async function initProtyle() {
29+
let sql = "SELECT * FROM blocks ORDER BY RANDOM () LIMIT 1;";
30+
let blocks: Block[] = await query(sql);
31+
blockID = blocks[0].id;
32+
return new Protyle(app, divProtyle, {
33+
blockId: blockID
34+
});
35+
}
3236
</script>
3337

34-
<div id="hello">
35-
<div class="fn__flex">
36-
<div class="fn__flex-1">
37-
<h2>Hello {name} v{ver}</h2>
38-
</div>
39-
<div class="fn__flex-1 b3-label__text __text-right">
40-
{time_str}
41-
</div>
38+
<div class="b3-dialog__content">
39+
<div>API demo:</div>
40+
<div class="fn__hr" />
41+
<div class="plugin-sample__time">
42+
System current time: <span id="time">{time}</span>
4243
</div>
43-
44-
<Typo>
45-
<h2>Wellcome to plugin sample with vite & svelte</h2>
46-
<p>{@html i18n.makesure}</p>
47-
</Typo>
48-
44+
<div class="fn__hr" />
45+
<div class="fn__hr" />
46+
<div>Protyle demo: id = {blockID}</div>
47+
<div class="fn__hr" />
48+
<div id="protyle" style="height: 360px;" bind:this={divProtyle}/>
4949
</div>
5050

51-
<style lang="scss">
52-
#hello {
53-
margin: 20px;
54-
div {
55-
margin-bottom: 10px;
56-
}
57-
}
58-
.__text-right {
59-
text-align: right;
60-
}
61-
</style>

‎src/i18n/en_US.json

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"showDialog": "Show dialog",
99
"removedData": "Data deleted",
1010
"confirmRemove": "Confirm to delete the data in ${name}?",
11+
"insertEmoji": "Insert Emoji",
1112
"name": "SiYuan",
1213
"hello": {
1314
"makesure": "Before using this template, please read the <a href=\"https://github.com/siyuan-note/plugin-sample\">offical sample</a>, make sure that you've known about the pipeline for plugin developing."

‎src/i18n/zh_CN.json

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"showDialog": "弹出一个对话框",
99
"removedData": "数据已删除",
1010
"confirmRemove": "确认删除 ${name} 中的数据？",
11+
"insertEmoji": "插入表情",
1112
"name": "思源",
1213
"hello": {
1314
"makesure": "使用这个模板之前，请阅读<a href=\"https://github.com/siyuan-note/plugin-sample\">官方教程</a>, 确保自己已经理解了插件的基本开发流程。"

‎src/index.scss

+23
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,26 @@
11
#helloPanel {
22
border: 1px rgb(189, 119, 119) dashed;
3+
}
4+
5+
.plugin-sample {
6+
&__custom-tab {
7+
background-color: var(--b3-theme-background);
8+
height: 100%;
9+
width: 100%;
10+
display: flex;
11+
justify-content: center;
12+
align-items: center;
13+
}
14+
15+
&__custom-dock {
16+
display: flex;
17+
justify-content: center;
18+
align-items: center;
19+
}
20+
21+
&__time {
22+
background: var(--b3-card-info-background);
23+
border-radius: 4px;
24+
padding: 2px 8px;
25+
}
326
}

‎src/index.ts

+17-8
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,9 @@ import {
99
getFrontend,
1010
getBackend,
1111
IModel,
12-
Setting
12+
Setting,
13+
fetchPost,
14+
Protyle
1315
} from "siyuan";
1416
import "@/index.scss";
1517

@@ -83,8 +85,7 @@ export default class PluginSample extends Plugin {
8385
new HelloExample({
8486
target: tabDiv,
8587
props: {
86-
name: this.i18n.name,
87-
i18n: this.i18n.hello
88+
app: this.app,
8889
}
8990
});
9091
this.customTab = this.addTab({
@@ -167,6 +168,15 @@ export default class PluginSample extends Plugin {
167168
actionElement: btnaElement,
168169
});
169170

171+
this.protyleSlash = [{
172+
filter: ["insert emoji 😊", "插入表情 😊", "crbqwx"],
173+
html: `<div class="b3-list-item__first"><span class="b3-list-item__text">${this.i18n.insertEmoji}</span><span class="b3-list-item__meta">😊</span></div>`,
174+
id: "insertEmoji",
175+
callback(protyle: Protyle) {
176+
protyle.insert("😊");
177+
}
178+
}];
179+
170180
console.log(this.i18n.helloPlugin);
171181
}
172182

@@ -225,11 +235,10 @@ export default class PluginSample extends Plugin {
225235
// hello.$destroy();
226236
},
227237
});
228-
let hello = new HelloExample({
238+
new HelloExample({
229239
target: dialog.element.querySelector("#helloPanel"),
230240
props: {
231-
name: this.i18n.name,
232-
i18n: this.i18n.hello
241+
app: this.app,
233242
}
234243
});
235244
}
@@ -240,10 +249,10 @@ export default class PluginSample extends Plugin {
240249
});
241250
menu.addItem({
242251
icon: "iconInfo",
243-
label: "Dialog",
252+
label: "Dialog(open help first)",
244253
accelerator: this.commands[0].customHotkey,
245254
click: () => {
246-
this.showDialog()
255+
this.showDialog();
247256
}
248257
});
249258
if (!this.isMobile) {

‎src/libs/setting-item.svelte

+13-11
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
min: number;
1414
max: number;
1515
step: number;
16-
} = {min: 0, max: 100, step: 1}; // Use it if type is slider
16+
} = { min: 0, max: 100, step: 1 }; // Use it if type is slider
1717
1818
const dispatch = createEventDispatcher();
1919
@@ -76,15 +76,17 @@
7676
</select>
7777
{:else if type == "slider"}
7878
<!-- Slider -->
79-
<input
80-
class="b3-slider fn__size200"
81-
id="fontSize"
82-
min="{slider.min}"
83-
max="{slider.max}"
84-
step="{slider.step}"
85-
type="range"
86-
bind:value={settingValue}
87-
on:change={changed}
88-
/>
79+
<div class="b3-tooltips b3-tooltips__n" aria-label={settingValue}>
80+
<input
81+
class="b3-slider fn__size200"
82+
id="fontSize"
83+
min={slider.min}
84+
max={slider.max}
85+
step={slider.step}
86+
type="range"
87+
bind:value={settingValue}
88+
on:change={changed}
89+
/>
90+
</div>
8991
{/if}
9092
</label>

0 commit comments

Comments
 (0)
Please sign in to comment.