mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2025-10-25 04:37:40 +00:00
Lots of improvements to the plugin library
* Moved “add new plugin” into a modal wizard * Adopt big friendly buttons * Add plugin icons and readmes to “add new plugin” modal * Use tabs for splitting plugins/themes/languages * Consistent styling between the “add new plugin” modal and the “installed plugins” control panel tab * Behind the scenes, moved from addressing the library as `recipes/defaults/tiddlers/<etc>` to `recipes/library/tiddlers<etc>`
This commit is contained in:
116
core/ui/ControlPanel/Modals/AddPlugins.tid
Normal file
116
core/ui/ControlPanel/Modals/AddPlugins.tid
Normal file
@@ -0,0 +1,116 @@
|
||||
title: $:/core/ui/ControlPanel/Modals/AddPlugins
|
||||
subtitle: {{$:/core/images/download-button}} {{$:/language/ControlPanel/Plugins/Add/Caption}}
|
||||
|
||||
\define lingo-base() $:/language/ControlPanel/Plugins/
|
||||
|
||||
\define install-plugin-button()
|
||||
<$button>
|
||||
<$action-sendmessage $message="tm-load-plugin-from-library" url={{!!url}} title={{$(assetInfo)$!!original-title}}/>
|
||||
<$list filter="[<assetInfo>get[original-title]get[version]]" variable="installedVersion" emptyMessage="""install""">
|
||||
reinstall
|
||||
</$list>
|
||||
</$button>
|
||||
\end
|
||||
|
||||
\define popup-state-macro()
|
||||
$:/state/add-plugin-info/$(connectionTiddler)$/$(assetInfo)$
|
||||
\end
|
||||
|
||||
\define display-plugin-info(type)
|
||||
<$set name="popup-state" value=<<popup-state-macro>>>
|
||||
<div class="tc-plugin-info">
|
||||
<div class="tc-plugin-info-chunk tc-small-icon">
|
||||
<$reveal type="nomatch" state=<<popup-state>> text="yes">
|
||||
<$button class="tc-btn-invisible tc-btn-dropdown" set=<<popup-state>> setTo="yes">
|
||||
{{$:/core/images/right-arrow}}
|
||||
</$button>
|
||||
</$reveal>
|
||||
<$reveal type="match" state=<<popup-state>> text="yes">
|
||||
<$button class="tc-btn-invisible tc-btn-dropdown" set=<<popup-state>> setTo="no">
|
||||
{{$:/core/images/down-arrow}}
|
||||
</$button>
|
||||
</$reveal>
|
||||
</div>
|
||||
<div class="tc-plugin-info-chunk">
|
||||
<$list filter="[<assetInfo>has[icon]]" emptyMessage="""<$transclude tiddler="$:/core/images/plugin-generic-$type$"/>""">
|
||||
<img src={{$(assetInfo)$!!icon}}/>
|
||||
</$list>
|
||||
</div>
|
||||
<div class="tc-plugin-info-chunk">
|
||||
<h1><$view tiddler=<<assetInfo>> field="description"/></h1>
|
||||
<h2><$view tiddler=<<assetInfo>> field="original-title"/></h2>
|
||||
<div><em><$view tiddler=<<assetInfo>> field="version"/></em></div>
|
||||
</div>
|
||||
<div class="tc-plugin-info-chunk">
|
||||
<<install-plugin-button>>
|
||||
</div>
|
||||
</div>
|
||||
<$reveal type="match" text="yes" state=<<popup-state>>>
|
||||
<div class="tc-plugin-info-dropdown">
|
||||
<div class="tc-plugin-info-dropdown-message">
|
||||
<$list filter="[<assetInfo>get[original-title]get[version]]" variable="installedVersion" emptyMessage="""This plugin is not currently installed""">
|
||||
<em>
|
||||
This plugin is already installed at version <$text text=<<installedVersion>>/>
|
||||
</em>
|
||||
</$list>
|
||||
</div>
|
||||
<div class="tc-plugin-info-dropdown-body">
|
||||
<$transclude tiddler=<<assetInfo>> field="readme" mode="block"/>
|
||||
</div>
|
||||
</div>
|
||||
</$reveal>
|
||||
</$set>
|
||||
\end
|
||||
|
||||
\define load-plugin-library-button()
|
||||
<$button class="tc-btn-big-green">
|
||||
<$action-sendmessage $message="tm-load-plugin-library" url={{!!url}} infoTitlePrefix="$:/temp/RemoteAssetInfo/"/>
|
||||
{{$:/core/images/chevron-right}} open plugin library
|
||||
</$button>
|
||||
\end
|
||||
|
||||
\define display-server-assets(type)
|
||||
Search: <$edit-text tiddler="""$:/temp/RemoteAssetSearch/$(currentTiddler)$""" default="" type="search" tag="input" focus="true"/>
|
||||
<$reveal state="""$:/temp/RemoteAssetSearch/$(currentTiddler)$""" type="nomatch" text="">
|
||||
<$button class="tc-btn-invisible">
|
||||
<$action-setfield $tiddler="""$:/temp/RemoteAssetSearch/$(currentTiddler)$""" $field="text" $value=""/>
|
||||
{{$:/core/images/close-button}}
|
||||
</$button>
|
||||
</$reveal>
|
||||
<div class="tc-plugin-library-listing">
|
||||
<$list filter="[all[tiddlers+shadows]tag[$:/tags/RemoteAssetInfo]server-url{!!url}original-plugin-type[$type$]search{$:/temp/RemoteAssetSearch/$(currentTiddler)$}sort[description]]" variable="assetInfo">
|
||||
<<display-plugin-info "$type$">>
|
||||
</$list>
|
||||
</div>
|
||||
\end
|
||||
|
||||
\define display-server-connection()
|
||||
<$list filter="[all[tiddlers+shadows]tag[$:/tags/ServerConnection]suffix{!!url}]" variable="connectionTiddler" emptyMessage=<<load-plugin-library-button>>>
|
||||
|
||||
<<tabs "[[$:/core/ui/ControlPanel/Plugins/Add/Plugins]] [[$:/core/ui/ControlPanel/Plugins/Add/Themes]] [[$:/core/ui/ControlPanel/Plugins/Add/Languages]]" "$:/core/ui/ControlPanel/Plugins/Add/Plugins">>
|
||||
|
||||
</$list>
|
||||
\end
|
||||
|
||||
\define plugin-library-listing()
|
||||
<$list filter="[all[tiddlers+shadows]tag[$:/tags/PluginLibrary]]">
|
||||
<div class="tc-plugin-library">
|
||||
|
||||
!! <$link><$transclude field="caption"><$view field="title"/></$transclude></$link>
|
||||
|
||||
//<$view field="url"/>//
|
||||
|
||||
<$transclude/>
|
||||
|
||||
<<display-server-connection>>
|
||||
</div>
|
||||
</$list>
|
||||
\end
|
||||
|
||||
<$importvariables filter="[[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]">
|
||||
|
||||
<div>
|
||||
<<plugin-library-listing>>
|
||||
</div>
|
||||
|
||||
</$importvariables>
|
||||
Reference in New Issue
Block a user