nicer plugins ui

This commit is contained in:
Eugene Pankov 2018-10-25 16:38:42 +02:00
parent 2ebb107bed
commit 9f35ab1a66

View File

@ -6,44 +6,43 @@ button.btn.btn-outline-info.btn-sm.pull-right((click)='openPluginsFolder()')
i.fa.fa-folder i.fa.fa-folder
span Plugins folder span Plugins folder
h3 Installed h3.mb-1 Installed
.list-group .mb-3.d-flex.w-100.align-items-center(*ngFor='let plugin of pluginManager.installedPlugins|orderBy:"name"')
ng-container(*ngFor='let plugin of pluginManager.installedPlugins|orderBy:"name"') button.btn.btn-outline-danger.active.mr-2(
.list-group-item.flex-column.align-items-start *ngIf='config.store.pluginBlacklist.includes(plugin.name)',
.d-flex.w-100 (click)='enablePlugin(plugin)'
.mr-auto.d-flex.flex-column )
strong {{plugin.name}} i.fa.fa-fw.fa-pause
a.text-muted.mb-0((click)='showPluginInfo(plugin)') button.btn.btn-outline-secondary.mr-2(
small {{plugin.description}} *ngIf='!config.store.pluginBlacklist.includes(plugin.name)',
.d-flex.flex-column.align-items-end.mr-3 (click)='disablePlugin(plugin)'
div {{plugin.version}} )
small.text-muted {{plugin.author}} i.fa.fa-fw.fa-check
button.btn.btn-secondary.ml-2(
*ngIf='npmInstalled && knownUpgrades[plugin.name]', .mr-auto.d-flex.flex-column
(click)='upgradePlugin(plugin)', div
[disabled]='busy[plugin.name] != undefined' strong {{plugin.name}}
) small.text-muted.ml-1 {{plugin.version}} / {{plugin.author}}
i.fa.fa-fw.fa-arrow-up(*ngIf='busy[plugin.name] != BusyState.Installing') a.text-muted.mb-0((click)='showPluginInfo(plugin)')
i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing') small {{plugin.description}}
span Upgrade ({{knownUpgrades[plugin.name].version}})
button.btn.btn-secondary.ml-2( button.btn.btn-primary.ml-2(
(click)='uninstallPlugin(plugin)', *ngIf='npmInstalled && knownUpgrades[plugin.name]',
*ngIf='!plugin.isBuiltin && npmInstalled', (click)='upgradePlugin(plugin)',
[disabled]='busy[plugin.name] != undefined' [disabled]='busy[plugin.name] != undefined'
) )
i.fa.fa-fw.fa-trash-o(*ngIf='busy[plugin.name] != BusyState.Uninstalling') i.fa.fa-fw.fa-arrow-up(*ngIf='busy[plugin.name] != BusyState.Installing')
i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Uninstalling') i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing')
button.btn.btn-secondary.ml-2( span Upgrade ({{knownUpgrades[plugin.name].version}})
*ngIf='config.store.pluginBlacklist.includes(plugin.name)',
(click)='enablePlugin(plugin)' button.btn.btn-outline-danger.ml-2(
) (click)='uninstallPlugin(plugin)',
i.fa.fa-fw.fa-play *ngIf='!plugin.isBuiltin && npmInstalled',
button.btn.btn-secondary.ml-2( [disabled]='busy[plugin.name] != undefined'
*ngIf='!config.store.pluginBlacklist.includes(plugin.name)', )
(click)='disablePlugin(plugin)' i.fa.fa-fw.fa-trash-o(*ngIf='busy[plugin.name] != BusyState.Uninstalling')
) i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Uninstalling')
i.fa.fa-fw.fa-pause
.text-center.mt-5(*ngIf='npmMissing') .text-center.mt-5(*ngIf='npmMissing')
h4 npm not installed h4 npm not installed
@ -59,7 +58,7 @@ h3 Installed
div(*ngIf='npmInstalled') div(*ngIf='npmInstalled')
h3.mt-4 Available h3.mt-4 Available
.input-group.mb-4 .input-group.mb-3
.input-group-prepend .input-group-prepend
.input-group-text .input-group-text
i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='!availablePluginsReady') i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='!availablePluginsReady')
@ -72,21 +71,19 @@ div(*ngIf='npmInstalled')
) )
.list-group.mb-4(*ngIf='availablePlugins$') .mb-4(*ngIf='availablePlugins$')
ng-container(*ngFor='let plugin of (availablePlugins$|async|orderBy:"name")') ng-container(*ngFor='let plugin of (availablePlugins$|async|orderBy:"name")')
.list-group-item.flex-column.align-items-start(*ngIf='!isAlreadyInstalled(plugin)') .d-flex.w-100.align-items-center.mb-3(*ngIf='!isAlreadyInstalled(plugin)')
.d-flex.w-100 button.btn.btn-primary.mr-2(
.mr-auto.d-flex.flex-column (click)='installPlugin(plugin)',
[disabled]='busy[plugin.name] != undefined'
)
i.fa.fa-fw.fa-download(*ngIf='busy[plugin.name] != BusyState.Installing')
i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing')
div((click)='showPluginInfo(plugin)')
div
strong {{plugin.name}} strong {{plugin.name}}
a.text-muted.mb-0((click)='showPluginInfo(plugin)') small.text-muted.ml-1 {{plugin.version}} / {{plugin.author}}
small {{plugin.description}} i.fa.fa-check.text-success.ml-1(*ngIf='plugin.isOfficial', title='Official')
.d-flex.flex-column.align-items-end.mr-3 small.text-muted {{plugin.description}}
div {{plugin.version}}
small.text-muted {{plugin.author}}
i.fa.fa-check.text-success.ml-1(*ngIf='plugin.isOfficial', title='Official')
button.btn.btn-primary(
(click)='installPlugin(plugin)',
[disabled]='busy[plugin.name] != undefined'
)
i.fa.fa-fw.fa-download(*ngIf='busy[plugin.name] != BusyState.Installing')
i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing')