From 3f87725379ef03722db35952badead49339224f0 Mon Sep 17 00:00:00 2001
From: Eric Reed <ebr@mediabrowser3.com>
Date: Mon, 26 Aug 2013 13:11:21 -0400
Subject: [PATCH] Beginnings of clarifications for types of plug-ins

---
 dashboard-ui/plugincatalog.html | 34 +++++++++++++++++++++++++++++++--
 dashboard-ui/plugins.html       |  5 ++++-
 dashboard-ui/pluginupdates.html |  3 +++
 3 files changed, 39 insertions(+), 3 deletions(-)

diff --git a/dashboard-ui/plugincatalog.html b/dashboard-ui/plugincatalog.html
index 0c6d109e00..6986fad130 100644
--- a/dashboard-ui/plugincatalog.html
+++ b/dashboard-ui/plugincatalog.html
@@ -14,11 +14,17 @@
                     <a href="pluginupdates.html" data-role="button">Automatic Updates</a>
                 </div>
 
-                <div style="margin: .75em 0;">
+                <div style=" margin-bottom: 10px">
+                    <p><strong>These are all the plug-ins available for Media Browser - including ones for other components. </strong></p>
+                    <p><strong>You can view basic information, registration status (for premium plug-ins) and register all plug-ins here, 
+                           but only server plug-ins can be installed. There are three types of plug-ins: <a data-rel="popup" href="#freePlugins">Free</a>, 
+                        <a data-rel="popup" href="#supporterPlugins">Supporter-Only</a>, and <a data-rel="popup" href="#premiumPlugins">Premium</a>.</strong></p>
+                </div>
+               <div style="margin: .75em 0;">
 
                     <div style="display: inline-block; margin-right: 1em;">
                         <label for="selectTargetSystem">Show plugins for</label>
-                        <select id="selectTargetSystem" data-role="none" style="margin-left: .5em;">
+                        <select id="selectTargetSystem" data-mini="true" data-inline="true" style="margin-left: .5em;">
                             <option value="Server">MB Server</option>
                             <option value="MBTheater">MB Theater</option>
                             <option value="MBClassic">MB Classic</option>
@@ -48,6 +54,30 @@
                 </fieldset>
             </form>
         </div>
+        
+        <div data-role="popup" id="freePlugins" data-theme="e" data-overlay-theme="a" data-position-to="window" style="max-width: 50%; margin: 10px">
+            <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
+            <p>Free plug-ins can be installed and used by anyone for free. They will appear in the catalog without any banners.<p>
+        </div>
+
+        <div data-role="popup" id="supporterPlugins" data-theme="e" data-overlay-theme="a" data-position-to="window" style="max-width: 50%; margin: 10px">
+            <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
+            <p>Supporter-Only plug-ins are free for anyone who is an <strong>MB3 Supporter</strong> (with a valid MB3 key who has donated the minimum amount to the overall project).</p>
+            <p>Anyone can install them and enjoy a free trial period of 14 days in most instances.  The trial period may commence as soon as you install the plug-in.<p>
+                <p>These plug-ins will appear in the catalog with a "Supporter" banner.</p>
+        </div>
+
+        <div data-role="popup" id="premiumPlugins" data-theme="e" data-overlay-theme="a" data-position-to="window" style="max-width: 50%; margin: 10px">
+            <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
+            <p>Premium plug-ins are developed by third-parties and require that you be an <strong>MB3 Supporter <em>and</em> also register the plug-in with its creator.</strong>
+                The cost of registering these plug-ins is set for each one by its creator and all revenues go to that person.</p>
+            <p>Anyone can install them and enjoy a free trial period of 14 days in most instances.  The trial period may commence as soon as you install the plug-in.</p>
+            <p>You should install premium plug-ins without registering them first to take advantage of this trial period.  Then, if you find the functionality useful,
+                                                                                                                                                                         you can register it via its detail page here in the catalog.
+                                                                                                                                                                     </p>
+                <p>These plug-ins will appear in the catalog with a "Premium" banner.</p>
+        </div>
+
     </div>
 </body>
 </html>
diff --git a/dashboard-ui/plugins.html b/dashboard-ui/plugins.html
index c423efc072..e7cfbdbf93 100644
--- a/dashboard-ui/plugins.html
+++ b/dashboard-ui/plugins.html
@@ -13,7 +13,10 @@
                     <a href="plugincatalog.html" data-role="button">Plugin Catalog</a>
                     <a href="pluginupdates.html" data-role="button">Automatic Updates</a>
                 </div>
-
+                <div style="margin-top: -25px; margin-bottom: 10px">
+                    <p><strong>These are the plug-ins installed on this <em>server.</em> Plug-ins for other components of MB3 are installed on those components.</strong></p>
+                    <p ><strong>Select a plug-in to configure it.</strong></p>
+                </div>
                 <div class="readOnlyContent">
                     <ul id="ulInstalledPlugins" data-role="listview" data-inset="true" data-auto-enhanced="false" data-split-icon="minus"></ul>
                 </div>
diff --git a/dashboard-ui/pluginupdates.html b/dashboard-ui/pluginupdates.html
index efdb72f7aa..86fb6b58f0 100644
--- a/dashboard-ui/pluginupdates.html
+++ b/dashboard-ui/pluginupdates.html
@@ -13,6 +13,9 @@
                     <a href="plugincatalog.html" data-role="button">Plugin Catalog</a>
                     <a href="pluginupdates.html" data-role="button" class="ui-btn-active">Automatic Updates</a>
                 </div>
+                <div style="margin-top: -25px; margin-bottom: 10px">
+                    <p><strong>You can set the update level for your installed server plug-ins here.</strong></p>
+                </div>
 
                 <form id="pluginUpdatesForm">