#382 Better feedback on supporter key entry

dashboard-ui/css/site.css

@@ -272,6 +272,10 @@ form, .readOnlyContent {
         color: #fff!important;
     }
 
+	.invalidEntry {
+		background-color: lightpink!important;
+	}
+
 /* Tabs (e.g. advanced metadata page) */
 .localnav {
     margin-bottom: 40px!important;

dashboard-ui/scripts/supporterkeypage.js

@@ -20,6 +20,13 @@
             } else {
                 $('.supporterOnly', page).hide();
             }
+            if ((info.LegacyKey || info.SupporterKey) && !info.IsMBSupporter) {
+                $('#txtSupporterKey', page).addClass("invalidEntry");
+                $('.notSupporter', page).show();
+            } else {
+                $('#txtSupporterKey', page).removeClass("invalidEntry");
+                $('.notSupporter', page).hide();
+            }
             Dashboard.hideLoadingMsg();
         });
     },
@@ -40,8 +47,7 @@
             ApiClient.updatePluginSecurityInfo(info).done(function () {
                 Dashboard.resetPluginSecurityInfo();
                 Dashboard.hideLoadingMsg();
-                SupporterPage.load();
-
+                SupporterKeyPage.load();
             });
 
         return false;

dashboard-ui/supporterkey.html

@@ -26,6 +26,11 @@
                             <strong>After becoming a supporter, you will be emailed a Supporter Key.  Simply copy and paste that key into this field and start
                                 enjoying everything the community has developed for Media Browser. <em>Only MB 3 Supporter Keys are valid here</em></strong>
                         </div>
+                    <p style="display: none; padding: 1em; border-radius: 5px; font-weight: normal;" class="ui-bar-e notSupporter">
+                        <strong>MB3 Key Missing or Invalid</strong> - in order for any premium content to be registered, you must also be a MB3 Supporter.
+                        Please <a href="supporter.html">donate</a> and support the continued development of the core product.  Thank you.  
+                        
+                    </p>
 
                     </div>
                     <div style="margin-top: 40px; margin-bottom: 40px">