0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

💄 bazaar

Browse source
This commit is contained in:
Vanessa 2022-09-02 10:30:03 +08:00
parent 424ea9b1ca
commit 1b89ebee28
1 changed files with 37 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
app/src/config/bazaar.ts
View file

@ -31,31 +31,14 @@ export const bazaar = {
const loadingHTML = `<div style="height: ${bazaar.element.clientHeight - 72}px;display: flex;align-items: center;justify-content: center;"><img src="/stage/loading-pure.svg"></div>`; const loadingHTML = `<div style="height: ${bazaar.element.clientHeight - 72}px;display: flex;align-items: center;justify-content: center;"><img src="/stage/loading-pure.svg"></div>`;
return `<div class="fn__flex-column" style="height: 100%"> return `<div class="fn__flex-column" style="height: 100%">
<div class="layout-tab-bar fn__flex"> <div class="layout-tab-bar fn__flex">
<div data-type="downloaded" class="item item--focus"><span class="item__text">${window.siyuan.languages.downloaded}</span></div> <div data-type="theme" class="item item--focus"><span class="item__text">${window.siyuan.languages.theme}</span></div>
<div data-type="theme" class="item"><span class="item__text">${window.siyuan.languages.theme}</span></div>
<div data-type="template" class="item"><span class="item__text">${window.siyuan.languages.template}</span></div> <div data-type="template" class="item"><span class="item__text">${window.siyuan.languages.template}</span></div>
<div data-type="icon" class="item"><span class="item__text">${window.siyuan.languages.icon}</span></div> <div data-type="icon" class="item"><span class="item__text">${window.siyuan.languages.icon}</span></div>
<div data-type="widget" class="item"><span class="item__text">${window.siyuan.languages.widget}</span></div> <div data-type="widget" class="item"><span class="item__text">${window.siyuan.languages.widget}</span></div>
<div data-type="downloaded" class="item"><span class="item__text">${window.siyuan.languages.downloaded}</span></div>
</div> </div>
<div class="fn__flex-1"> <div class="fn__flex-1">
<div class="bazaarPanel" data-init="true" data-type="downloaded"> <div data-type="theme" class="bazaarPanel" data-init="true">
<div class="fn__hr"></div>
<div class="fn__flex">
<div class="fn__space"></div>
<div class="fn__space"></div>
<button data-type="myTheme" class="b3-button">${window.siyuan.languages.theme}</button>
<div class="fn__space"></div>
<button data-type="myTemplate" class="b3-button b3-button--outline">${window.siyuan.languages.template}</button>
<div class="fn__space"></div>
<button data-type="myIcon" class="b3-button b3-button--outline">${window.siyuan.languages.icon}</button>
<div class="fn__space"></div>
<button data-type="myWidget" class="b3-button b3-button--outline">${window.siyuan.languages.widget}</button>
</div>
<div id="configBazaarDownloaded">
${loadingHTML}
</div>
</div>
<div data-type="theme" class="fn__none bazaarPanel">
<div class="fn__hr"></div> <div class="fn__hr"></div>
<div class="fn__flex"> <div class="fn__flex">
<div class="fn__space"></div> <div class="fn__space"></div>
@ -135,6 +118,23 @@ export const bazaar = {
${loadingHTML} ${loadingHTML}
</div> </div>
</div> </div>
<div class="bazaarPanel fn__none" data-type="downloaded">
<div class="fn__hr"></div>
<div class="fn__flex">
<div class="fn__space"></div>
<div class="fn__space"></div>
<button data-type="myTheme" class="b3-button">${window.siyuan.languages.theme}</button>
<div class="fn__space"></div>
<button data-type="myTemplate" class="b3-button b3-button--outline">${window.siyuan.languages.template}</button>
<div class="fn__space"></div>
<button data-type="myIcon" class="b3-button b3-button--outline">${window.siyuan.languages.icon}</button>
<div class="fn__space"></div>
<button data-type="myWidget" class="b3-button b3-button--outline">${window.siyuan.languages.widget}</button>
</div>
<div id="configBazaarDownloaded">
${loadingHTML}
</div>
</div>
</div> </div>
<div id="configBazaarReadme" class="config-bazaar__readme"></div> <div id="configBazaarReadme" class="config-bazaar__readme"></div>
</div>`; </div>`;
@ -166,11 +166,18 @@ export const bazaar = {
<span class="fn__flex-center">${item.downloads}</span> <span class="fn__flex-center">${item.downloads}</span>
</div> </div>
<div class="b3-card__actions"${item.current ? " style='background-color:var(--b3-theme-primary-lightest)'" : ""} data-name="${item.name}" data-url="${item.repoURL}" data-hash="${item.repoHash}"> <div class="b3-card__actions"${item.current ? " style='background-color:var(--b3-theme-primary-lightest)'" : ""} data-name="${item.name}" data-url="${item.repoURL}" data-hash="${item.repoHash}">
<button data-type="install-t" class="b3-button b3-button--text${item.outdated ? "" : " fn__none"}">${window.siyuan.languages.update}</button> <div class="fn__flex-1"></div>
<span class="b3-tooltips b3-tooltips__nw block__icon block__icon--show${item.installed ? "" : " fn__none"}" data-type="uninstall" aria-label="${window.siyuan.languages.uninstall}">
<svg><use xlink:href="#iconTrashcan"></use></svg>
</span>
<div class="fn__space${!item.current && item.installed && showSwitch ? "" : " fn__none"}"></div>
<span class="b3-tooltips b3-tooltips__nw block__icon block__icon--show${!item.current && item.installed && showSwitch ? "" : " fn__none"}" data-type="switch" aria-label="${window.siyuan.languages.use}">
<svg><use xlink:href="#iconSettings"></use></svg>
</span>
<div class="fn__space${item.outdated ? "" : " fn__none"}"></div> <div class="fn__space${item.outdated ? "" : " fn__none"}"></div>
<button class="b3-button b3-button--text${item.installed ? "" : " fn__none"}" data-type="uninstall">${window.siyuan.languages.uninstall}</button> <span data-type="install-t" class="b3-tooltips b3-tooltips__nw block__icon block__icon--show${item.outdated ? "" : " fn__none"}" aria-label="${window.siyuan.languages.update}">
<div class="fn__flex-1 fn__space"></div> <svg><use xlink:href="#iconRefresh"></use></svg>
<button class="b3-button b3-button--text${!item.current && item.installed && showSwitch ? "" : " fn__none"}" data-type="switch">${window.siyuan.languages.use}</button> </span>
</div> </div>
</div>`; </div>`;
}, },
@ -317,7 +324,10 @@ export const bazaar = {
readmeElement.style.right = "0"; readmeElement.style.right = "0";
}, },
bindEvent() { bindEvent() {
this._genMyHTML("themes"); fetchPost("/api/bazaar/getBazaarTheme", {}, response => {
bazaar.onBazaar(response, "themes", false);
bazaar.data.themes = response.data.packages;
});
bazaar.element.addEventListener("click", (event) => { bazaar.element.addEventListener("click", (event) => {
let target = event.target as HTMLElement; let target = event.target as HTMLElement;
while (target && !target.isEqualNode(bazaar.element)) { while (target && !target.isEqualNode(bazaar.element)) {
@ -542,11 +552,8 @@ export const bazaar = {
bazaar.onBazaar(response, "widgets", false); bazaar.onBazaar(response, "widgets", false);
bazaar.data.widgets = response.data.packages; bazaar.data.widgets = response.data.packages;
}); });
} else if (type === "theme") { } else if (type === "downloaded") {
fetchPost("/api/bazaar/getBazaarTheme", {}, response => { this._genMyHTML("themes");
bazaar.onBazaar(response, "themes", false);
bazaar.data.themes = response.data.packages;
});
} }
item.setAttribute("data-init", "true"); item.setAttribute("data-init", "true");
} }