From 8694b4beafd432b72d33cf343ed1ed1dfa197836 Mon Sep 17 00:00:00 2001
From: Alex Ling <hkalexling@gmail.com>
Date: Fri, 24 Jul 2020 15:02:05 +0000
Subject: [PATCH] Show plugin info on the plugin download page

---
 public/css/mango.css               |  3 ++-
 src/plugin/plugin.cr               | 10 +++++++---
 src/views/plugin-download.html.ecr | 18 ++++++++++++++++--
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/public/css/mango.css b/public/css/mango.css
index caece11..dfabe06 100644
--- a/public/css/mango.css
+++ b/public/css/mango.css
@@ -118,6 +118,7 @@ td>.uk-dropdown {
     color: #ccc;
 }
 
-.uk-light .uk-nav-header {
+.uk-light .uk-nav-header,
+.uk-light .uk-description-list>dt {
     color: #555;
 }
diff --git a/src/plugin/plugin.cr b/src/plugin/plugin.cr
index 850f129..f72dcb4 100644
--- a/src/plugin/plugin.cr
+++ b/src/plugin/plugin.cr
@@ -31,13 +31,13 @@ class Plugin
                                 "plugin directory #{dir}"
       end
 
-      json = JSON.parse File.read info_path
+      @json = JSON.parse File.read info_path
 
       begin
         {% for name in ["id", "title", "author", "version", "placeholder"] %}
-          @{{name.id}} = json[{{name}}].as_s
+          @{{name.id}} = @json[{{name}}].as_s
         {% end %}
-        @wait_seconds = json["wait_seconds"].as_i.to_u64
+        @wait_seconds = @json["wait_seconds"].as_i.to_u64
 
         unless @id.alphanumeric_underscore?
           raise "Plugin ID can only contain alphanumeric characters and " \
@@ -48,6 +48,10 @@ class Plugin
                                 "at #{@dir}. Error: #{e.message}"
       end
     end
+
+    def each(&block : String, JSON::Any -> _)
+      @json.as_h.each &block
+    end
   end
 
   struct Storage
diff --git a/src/views/plugin-download.html.ecr b/src/views/plugin-download.html.ecr
index 86f61e0..b754067 100644
--- a/src/views/plugin-download.html.ecr
+++ b/src/views/plugin-download.html.ecr
@@ -9,7 +9,7 @@
   <h2 class=uk-title>Download with Plugins</h2>
 
   <div class="uk-grid-small" uk-grid>
-    <div class="uk-width-3-4">
+    <div class="uk-width-3-4@m uk-child-width-1-1">
       <div class="uk-margin">
         <label class="uk-form-label" for="search-input">&nbsp;</label>
         <div class="uk-form-controls">
@@ -17,7 +17,7 @@
         </div>
       </div>
     </div>
-    <div class="uk-width-1-4">
+    <div class="uk-width-expand">
       <div class="uk-margin">
         <label class="uk-form-label" for="plugin-select">Choose a plugin</label>
         <div class="uk-form-controls">
@@ -29,8 +29,22 @@
         </div>
       </div>
     </div>
+    <div class="uk-width-auto">
+      <div class="uk-margin">
+        <label class="uk-form-label" for="search-input">&nbsp;</label>
+        <div class="uk-form-controls" style="padding-top: 10px;">
+          <span uk-icon="info" uk-toggle="target: #toggle"></span>
+        </div>
+      </div>
+    </div>
   </div>
 
+  <dl class="uk-description-list" id="toggle" hidden>
+    <% plugin.info.each do |k, v| %>
+      <dt><%= k %></dt>
+      <dd><%= v.to_s %></dd>
+    <% end %>
+  </dl>
 
   <div id="table" class="uk-margin-large-top" hidden>
     <h3 id="title-text"></h3>