localize plugin installation process

dashboard-ui/addplugin.html

@@ -13,19 +13,23 @@
                     <a href="plugincatalog.html" data-role="button" class="ui-btn-active">${TabCatalog}</a>
                     <a href="channelsettings.html" data-role="button">${TabChannels}</a>
                 </div>
-                <form class="addPluginForm">
+
+                <div class="readOnlyContent">
 
                     <h2 class="pluginName"></h2>
                     <p id="tagline" style="font-style: italic;"></p>
-                    <p id="pPreviewImage" style="text-align: center; margin: 2em 0;"></p>
+                    <p id="pPreviewImage" style="text-align: center;"></p>
 
                     <p id="overview"></p>
 
                     <div data-role="collapsible" data-collapsed="false" style="margin-top: 2em;">
-                        <h3>Install</h3>
+                        <h3>${HeaderInstall}</h3>
+
+                        <div>
+                            <form class="addPluginForm">
                                 <p id="pCurrentVersion"></p>
                                 <p id="pSelectVersion" class="hide">
-                            <label for="selectVersion">Select version to install:</label>
+                                    <label for="selectVersion">${LabelSelectVersionToInstall}</label>
                                     <select id="selectVersion" name="selectVersion"></select>
                                 </p>
 
@@ -33,50 +37,55 @@
                                     <button id="btnInstall" type="submit" data-icon="arrow-d" data-theme="b">Install</button>
                                 </p>
                                 <p id="nonServerMsg"></p>
-                    </div>
                             </form>
 
+                            <div class="premiumPackage" style="display: none; margin-top: 1.5em;">
+                                <div>
                                     <form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" method="post">
-                    <div class="premiumPackage" data-role="collapsible" data-collapsed="false" style="margin-top: 2em; display: none">
-                        <h3>Registration</h3>
                                         <p id="regStatus">
                                         </p>
                                         <p id="regInfo">
                                         </p>
-                        <p class="supporterDescription">
+                                        <div class="supporterDescription">
-                            This is a <a data-rel="popup" href="#supporterPlugins">supporter-only</a> plugin.<br />
+
-                            <br />
+                                            <p>${MessageSupporterPluginRequiresMembership}</p>
-                            It will require a <a href="supporter.html">supporter key</a> in order to register after the <strong>14-day free trial</strong>.
+
-                        </p>
+                                            <p><a href="supporter.html">${LinkSupporterMembership}</a></p>
-                        <p class="premiumDescription">
+
-                            This is a <a data-rel="popup" href="#premiumPlugins">premium</a> plugin.<br />
+                                        </div>
-                            <br />
+                                        <div class="premiumDescription">
-                            It will require a <a href="supporter.html">supporter key</a> in order to purchase and register after the <strong>14-day free trial</strong>.
+
-                        </p>
+                                            <p>${MessagePremiumPluginRequiresMembership}</p>
+
+                                            <p><a href="supporter.html">${LinkSupporterMembership}</a></p>
+                                        </div>
                                         <div class="premiumHasPrice" style="display: none">
                                             <p id="regPrice">
                                             </p>
                                             <input type="hidden" name="cmd" value="_xclick">
                                             <input type="hidden" id="payPalEmail" name="business" value="mb_1358534950_biz@reedsplace.com">
                                             <input type="hidden" name="currency_code" value="USD">
-                            <input type="hidden" id="featureName" name="item_name" value="MBSupporter">
+                                            <input type="hidden" id="featureName" name="item_name" value="">
                                             <input type="hidden" id="amount" name="amount" value="10">
-                            <input type="hidden" id="featureId" name="item_number" value="MBSupporter">
+                                            <input type="hidden" id="featureId" name="item_number" value="">
                                             <input type="hidden" name="notify_url" value="http://mb3admin.com/admin/service/services/ppipn.php">
                                             <input type="hidden" name="return" id="paypalReturnUrl" value="#">
                                             <a data-role="button" id="ppButton" onclick="$(this).parents('form')[0].submit();">
-                                <img src="css/images/supporter/registerpaypal.png" /></a>
+                                                <img src="css/images/supporter/registerpaypal.png" />
-                            <p id="noEmail" style="display: none">
+                                            </a>
-                                <strong>This developer has not provided a PayPal email. Please see their
-                                                                      website for registration information.</strong>
-                            </p>
 
                                         </div>
+                                    </form>
+                                </div>
 
                             </div>
+                        </div>
+                    </div>
+                </div>
 
+                <div class="readOnlyContent">
                     <div data-role="collapsible" data-collapsed="false" style="margin-top: 2em;">
-                        <h3>Rating and Reviews</h3>
+                        <h3>${HeaderReviews}</h3>
                         <div>
                             <br />
                             <div id="ratingLine"></div>
@@ -85,39 +94,17 @@
                     </div>
 
                     <div data-role="collapsible" data-collapsed="false" style="margin-top: 2em;">
-                        <h3>Developer Info</h3>
+                        <h3>${HeaderDeveloperInfo}</h3>
                         <p id="developer"></p>
                         <p id="pViewWebsite" style="display: none;">
-                            <a href="#" data-rel="external" target="_blank">View Website</a>
+                            <a href="#" data-rel="external" target="_blank">${ButtonViewWebsite}</a>
                         </p>
                     </div>
 
                     <div data-role="collapsible" style="margin-top: 2em;">
-                        <h3>Revision History</h3>
+                        <h3>${HeaderRevisionHistory}</h3>
                         <div id="revisionHistory"></div>
                     </div>
-                </form>
-
-                <div data-role="popup" class="ui-content" id="supporterPlugins" style="max-width: 250px;">
-                    <a href="#" data-rel="back" data-role="button" data-theme="b" 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" class="ui-content" id="premiumPlugins" style="max-width: 250px;">
-                    <a href="#" data-rel="back" data-role="button" data-theme="b" 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>
         </div>

dashboard-ui/scripts/addpluginpage.js

@@ -58,22 +58,21 @@
     }
 
     function populateReviews(id, page) {
-        // Get the latest positive and negative reviews
-        var promise1 = ApiClient.getPackageReviews(id, 4, null, 3, true);
-        var promise2 = ApiClient.getPackageReviews(id, null, 2, 3, true);
 
-        $.when(promise1, promise2).done(function (response1, response2) {
+        ApiClient.getPackageReviews(id, null, null, 3).done(function (positive) {
-            //positive
+
-            var html = '<div data-role="collapsible" data-collapsed="true" style="margin-top: 2em;" >';
+            var html = '';
-            html += '<h3>Latest Outstanding Reviews</h3>';
 
-            var positive = response1[0];
-            var hasReviews = false;
             if (positive && positive.length > 0) {
+
+                html += '<div data-role="collapsible" data-collapsed="true" style="margin-top: 2em;" >';
+                html += '<h3>' + Globalize.translate('HeaderLatestReviews') + '</h3>';
+
+                html += "<div><br/>";
+
                 for (var i = 0; i < positive.length; i++) {
                     var review = positive[i];
-                    if (review.title) {
+
-                        hasReviews = true;
                     html += "<div>";
                     html += "<span class='storeItemReviewText'>";
                     html += new Date(review.timestamp).toDateString();
@@ -89,53 +88,12 @@
                     html += "</div>";
                     html += "<hr/>";
                 }
-                }
-            }
-            if (!hasReviews) {
-                html += "<p>No Outstanding Reviews with additional information</p>";
-            }
-
                 html += "</div>";
-
-            //negative
-            html += '<div data-role="collapsible" data-collapsed="true" style="margin-top: 2em;" >';
-            html += '<h3>Latest Negative Reviews</h3>';
-            var negative = response2[0];
-            hasReviews = false;
-            if (negative && negative.length > 0) {
-                for (var i = 0; i < negative.length; i++) {
-                    review = negative[i];
-                    if (review.title) {
-                        hasReviews = true;
-                        html += "<div>";
-                        html += "<span class='storeItemReviewText'>";
-                        html += new Date(review.timestamp).toDateString();
-                        html += " " + RatingHelpers.getStoreRatingHtml(review.rating, review.id, review.name, true);
-                        html += " " + review.title;
-                        html += "</span>";
-                        if (review.review) {
-                            html += "<p class='storeItemReviewText'>";
-                            html += review.review;
-                            html += "</p>";
-                        }
-
                 html += "</div>";
-                        html += "<hr/>";
             }
-                }
-            }
-
-            if (!hasReviews) {
-                html += "<p>No Negative Reviews with additional information</p>";
-            }
-
-            html += "</div>";
-
 
             $('#latestReviews', page).html(html).trigger('create');
-
         });
-
     }
 
     function renderPackage(pkg, installedPlugins, pluginSecurityInfo, page) {
@@ -157,7 +115,8 @@
         } else {
             $("#btnInstallDiv", page).hide();
             $("#pSelectVersion", page).hide();
-            var msg = "This plug-in must be installed from " + pkg.targetSystem;
+
+            var msg = Globalize.translate('MessageInstallPluginFromApp');
             $("#nonServerMsg", page).html(msg).show();
         }
 
@@ -178,14 +137,15 @@
             // Fill in registration info
             var regStatus = "<strong>";
             if (pkg.isRegistered) {
-                regStatus += "You are currently registered for this feature";
             } else {
+
                 if (new Date(pkg.expDate).getTime() < new Date(1970, 1, 1).getTime()) {
                 } else {
                     if (new Date(pkg.expDate).getTime() <= new Date().getTime()) {
-                        regStatus += "The trial period for this feature has expired";
+                        regStatus += Globalize.translate('MessageTrialExpired');
                     } else {
-                        regStatus += "The trial period for this feature will expire in " + Math.round((new Date(pkg.expDate).getTime() - new Date().getTime()) / (86400000)) + " day(s)";
+
+                        regStatus += Globalize.translate('MessageTrialWillExpireIn').replace('{0}', Math.round((new Date(pkg.expDate).getTime() - new Date().getTime()) / (86400000)));
                     }
                 }
             }
@@ -205,15 +165,17 @@
                     $('#featureId', page).val(pkg.featureId);
                     $('#featureName', page).val(pkg.name);
                     $('#amount', page).val(pkg.price);
-                    $('#regPrice', page).html("<h2>Price: $" + pkg.price.toFixed(2) + " (USD)</h2>");
+
+                    $('#regPrice', page).html("<h3>" + Globalize.translate('ValuePriceUSD').replace('{0}', "$" + pkg.price.toFixed(2)) + "</h3>");
+
                     var url = "http://mb3admin.com/admin/service/user/getPayPalEmail?id=" + pkg.owner;
+
                     $.getJSON(url).done(function (dev) {
                         if (dev.payPalEmail) {
                             $('#payPalEmail', page).val(dev.payPalEmail);
 
                         } else {
                             $('#ppButton', page).hide();
-                            $('#noEmail', page).show();
                         }
                     });
                 } else {
@@ -241,9 +203,9 @@
         }
 
         //Ratings and Reviews
-        var ratingHtml = "<strong>Overall </strong>" + RatingHelpers.getStoreRatingHtml(pkg.avgRating, pkg.id, pkg.name);
+        var ratingHtml = RatingHelpers.getStoreRatingHtml(pkg.avgRating, pkg.id, pkg.name);
         ratingHtml += "<span class='storeReviewCount'>";
-        ratingHtml += " " + pkg.totalRatings + " Reviews";
+        ratingHtml += " " + Globalize.translate('ValueReviewCount').replace('{0}', pkg.totalRatings);
         ratingHtml += "</span>";
 
         $('#ratingLine', page).html(ratingHtml);
@@ -265,7 +227,9 @@
         }
 
         if (installedPlugin) {
-            $('#pCurrentVersion', page).show().html("You currently have version <strong>" + installedPlugin.Version + "</strong> installed.");
+
+            var currentVersionText = Globalize.translate('MessageYouHaveVersionInstalled').replace('{0}', '<strong>' + installedPlugin.Version + '</strong>');
+            $('#pCurrentVersion', page).show().html(currentVersionText);
 
         } else {
             $('#pCurrentVersion', page).hide().html("");
@@ -332,16 +296,9 @@
 
                     Dashboard.hideLoadingMsg();
 
-                    Dashboard.confirm("Are you sure you wish to reinstall the same version you already have? In most cases this will not have any effect.", "Plugin Reinstallation", function (confirmResult) {
+                    Dashboard.alert({
-
+                        message: Globalize.translate('MessageAlreadyInstalled'),
-                        if (confirmResult) {
+                        title: Globalize.translate('HeaderPluginInstallation')
-
-                            Dashboard.showLoadingMsg();
-                            performInstallation(name, guid, vals[1], version);
-                        } else {
-                            $('#btnInstall', page).buttonEnabled(true);
-                        }
-
                     });
                 } else {
                     performInstallation(name, guid, vals[1], version);

dashboard-ui/scripts/mediacontroller.js

@@ -2,13 +2,13 @@
 
     function setMirrorModeEnabled(enabled) {
 
-        var val = enabled ? '1' : '';
+        var val = enabled ? '1' : '0';
 
         store.setItem('displaymirror-' + Dashboard.getCurrentUserId(), val);
 
     }
     function isMirrorModeEnabled() {
-        return (store.getItem('displaymirror-' + Dashboard.getCurrentUserId()) || '') == '1';
+        return (store.getItem('displaymirror--' + Dashboard.getCurrentUserId()) || '') != '0';
     }
 
     var currentDisplayInfo;

dashboard-ui/scripts/mediaplayer.js

@@ -250,7 +250,9 @@
                 return false;
             }
 
-            if ((videoStream.Codec || '').toLowerCase().indexOf('h264') == -1) {
+            var isH264 = (videoStream.Codec || '').toLowerCase().indexOf('h264') != -1;
+
+            if (!isH264) {
                 console.log('Transcoding because the content is not h264');
                 return false;
             }
@@ -282,9 +284,11 @@
 
             var extension = (mediaSource.Container || '').toLowerCase();
 
-            // m4v's and mp4's with high profile failing in chrome
+            var profile = (videoStream ? (videoStream.Profile || '') : '').toLowerCase();
-            if (videoStream && videoStream.Profile == 'High') {
+
-                //return false;
+            // only support high, baseline variants and main variants
+            if (isH264 && profile != 'high' && profile.indexOf('baseline') == -1 && profile.indexOf('main') == -1) {
+                return false;
             }
 
             if (extension == 'm4v' || extension == 'mkv') {

dashboard-ui/scripts/supporterpage.js

@@ -67,6 +67,61 @@
         $("#donateAmt", page).val(getDonationAmount(page));
     }
 
+    function loadUserInfo(page) {
+
+        ApiClient.getJSON(ApiClient.getUrl('System/SupporterInfo')).done(function (info) {
+
+
+            $('.hfPlanType', page).val(info.PlanType || '');
+            $('.hfIsActive', page).val(info.IsActiveSupporter.toString());
+
+            $('.radioDonationType', page).checked(false).checkboxradio('refresh');
+
+            if (info.PlanType == 'Lifetime' && info.IsActiveSupporter) {
+
+                // If they have an active lifetime plan, select the one-time option
+                $('#radioOneTimeDonation', page).checked(true).checkboxradio('refresh');
+
+            } else {
+
+                // For all other statuses, select lifetime, to either acquire or upgrade
+                $('#radioLifetimeSupporter', page).checked(true).checkboxradio('refresh');
+            }
+
+            $('.radioDonationType:checked', page).trigger('change');
+
+            if (info.IsActiveSupporter || info.IsExpiredSupporter) {
+                $('.currentPlanInfo', page).show();
+            } else {
+                $('.currentPlanInfo', page).hide();
+            }
+
+            if (info.IsActiveSupporter && info.PlanType == 'Lifetime') {
+
+                $('.planSummary', page)
+                    .html('You have a lifetime supporter club membership. You can provide additional donations on a one-time or recurring basis using the options below. Thank you for supporting Media Browser.')
+                    .css('color', 'green');
+
+            }
+            else if (info.IsActiveSupporter) {
+
+                $('.planSummary', page)
+                    .html('You have an active ' + info.PlanType + ' membership. You can upgrade your plan using the options below.')
+                    .css('color', 'green');
+
+            }
+            else if (info.IsExpiredSupporter) {
+
+                var expirationDate = info.ExpirationDate ? parseISO8601Date(info.ExpirationDate, { toLocal: true }) : new Date();
+                expirationDate = expirationDate.toLocaleDateString();
+
+                $('.planSummary', page)
+                    .html('Your ' + info.PlanType + ' membership expired on ' + expirationDate + '.')
+                    .css('color', 'red');
+            }
+        });
+    }
+
     $(document).on('pageinit', "#supporterPage", function () {
 
         var page = this;
@@ -102,7 +157,6 @@
                 $('.fldOneTimeDonationAmount', page).hide();
                 removeRecurringFields(page);
                 setItemNumber(page, 'MBSupporter');
-                $('#oneTimeDescription').hide();
             }
         });
 
@@ -123,10 +177,29 @@
 
         $('.radioDonationType', page).trigger('change');
 
-        // TODO: Pull down supporter status
+        loadUserInfo(page);
-        // If already lifetime, had that option, but allow them to add monthly - many supporters probably will
-        // If already monthly, hide monthly option
-        // Or possibly not hide and select that option, but that will imply that changing the option will update their PP (can we do that?)
     });
 
+    window.SupporterPage = {
+
+        onSubmit: function () {
+
+            var form = this;
+            var page = $(form).parents('.page');
+
+            if ($('.hfIsActive', page).val() == 'true') {
+
+                var currentPlanType = $('.hfPlanType', page).val();
+
+                if (currentPlanType != 'Lifetime') {
+
+                    // Use a regular alert to block the submission process until they hit ok
+                    alert('After completing this transaction you will need to cancel your previous recurring donation from within your PayPal account. Thank you for supporting Media Browser.');
+                }
+            }
+
+        }
+
+    };
+
 })();

dashboard-ui/supporter.html

@@ -23,7 +23,11 @@
 
                     <p>${HeaderSupporterBenefit}</p>
 
-                    <form style="margin-top:2em;" name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" id="payPalForm" method="post">
+                    <div class="currentPlanInfo" style="display:none;margin-top:1.5em;">
+                        <p class="planSummary"></p>
+                    </div>
+
+                    <form style="margin-top:1.5em;" name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" id="payPalSupporterForm" method="post">
 
                         <fieldset data-role="controlgroup">
                             <legend>${HeaderDonationType}</legend>
@@ -34,7 +38,7 @@
                                     <span class="lifetimeAmount"></span>
                                 </label>
                             </div>
-                            <!--<div class="fldYearly">
+                            <div class="fldYearly">
                                 <input type="radio" class="radioDonationType" name="radioDonationType" id="radioYearlySupporter" value="yearly">
                                 <label for="radioYearlySupporter">
                                     Yearly supporter club membership<br />
@@ -47,18 +51,17 @@
                                     Monthly supporter club membership<br />
                                     <span class="monthlyAmount"></span>
                                 </label>
-                            </div>-->
+                            </div>
                         </fieldset>
+                        <div class="fieldDescription">${LabelRecurringDonationCanBeCancelledHelp}</div>
 
-                        <fieldset data-role="controlgroup" style="margin-top:1em;">
+                        <fieldset data-role="controlgroup" style="margin-top:1.5em;">
                             <input type="radio" class="radioDonationType" name="radioDonationType" id="radioOneTimeDonation" value="once">
                             <label for="radioOneTimeDonation">
                                 ${OptionMakeOneTimeDonation}<br />
                             </label>
-                            <p id="oneTimeDescription" >${OptionOneTimeDescription}</p>
                         </fieldset>
-
+                        <div id="oneTimeDescription" class="fieldDescription" style="display:none;">${OptionOneTimeDescription}</div>
-                        <!--<span class="fieldDescription">${LabelAutomaticallyDonateHelp}</span>-->
 
                         <div class="fldOneTimeDonationAmount">
                             <br />
@@ -88,18 +91,27 @@
                         <input type="hidden" name="notify_url" value="http://mb3admin.com/admin/service/services/ppipn.php">
                         <input type="hidden" name="return" id="paypalReturnUrl" value="#">
 
-                        <a data-role="button" data-icon="arrow-r" data-iconpos="right" onclick="$(this).parents('form')[0].submit();">
+                        <button type="submit" data-icon="arrow-r" data-iconpos="right">
                             <img src="css/images/supporter/donatepaypal.png" />
-                        </a>
+                        </button>
 
                         <input type="hidden" id="donateAmt" name="amount" />
 
                     </form>
                     <p>${DonationNextStep}</p>
                     <p><a href="supporterkey.html">${ButtonEnterSupporterKey}</a></p>
+
+                    <!-- Used only for instructional message box -->
+                    <input type="hidden" class="hfPlanType" />
+                    <input type="hidden" class="hfIsActive" />
+
                 </div>
             </div>
         </div>
+
+        <script type="text/javascript">
+            $('#payPalSupporterForm').off('submit', SupporterPage.onSubmit).on('submit', SupporterPage.onSubmit);
+        </script>
     </div>
 </body>
 </html>

dashboard-ui/thirdparty/mediabrowser.apiclient.js

@@ -3196,7 +3196,7 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi
             });
         };
 
-        self.getPackageReviews = function (packageId, minRating, maxRating, limit, forceTitle) {
+        self.getPackageReviews = function (packageId, minRating, maxRating, limit) {
 
             if (!packageId) {
                 throw new Error("null packageId");
@@ -3213,9 +3213,6 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi
             if (limit) {
                 options.Limit = limit;
             }
-            if (forceTitle) {
-                options.ForceTitle = true;
-            }
 
             var url = self.getUrl("Packages/" + packageId + "/Reviews", options);