New Premium Pro subscription.

apps/profile/urls.py

@@ -13,6 +13,7 @@ urlpatterns = [
     url(r"^paypal_form/?", views.paypal_form),
     url(r"^paypal_return/?", views.paypal_return, name="paypal-return"),
     url(r"^paypal_archive_return/?", views.paypal_archive_return, name="paypal-archive-return"),
+    url(r"^paypal_pro_return/?", views.paypal_pro_return, name="paypal-pro-return"),
     url(r"^stripe_return/?", views.paypal_return, name="stripe-return"),
     url(
         r"^switch_stripe_subscription/?", views.switch_stripe_subscription, name="switch-stripe-subscription"

apps/profile/views.py

@@ -437,6 +437,17 @@ def paypal_archive_return(request):
     )
 
 
+@login_required
+def paypal_pro_return(request):
+    return render(
+        request,
+        "reader/paypal_pro_return.xhtml",
+        {
+            "user_profile": request.user.profile,
+        },
+    )
+
+
 @login_required
 def activate_premium(request):
     return HttpResponseRedirect(reverse("index"))

media/css/reader/reader.css

@@ -8924,11 +8924,16 @@ form.opml_import_form input {
 }
 
 .NB-module-premium-archive-icon.NB-5 {
-    background: transparent url('/media/embed/icons/icons8/icons8-rss-100.png') no-repeat 0 0;
+    background: transparent url('/media/embed/icons/nouns/direction_black.svg') no-repeat 0 0;
     background-size: 36px;
 }
 
 .NB-module-premium-archive-icon.NB-6 {
+    background: transparent url('/media/embed/icons/icons8/icons8-rss-100.png') no-repeat 0 0;
+    background-size: 36px;
+}
+
+.NB-module-premium-archive-icon.NB-7 {
     background: transparent url('/media/embed/icons/icons8/icons8-relax-with-book-100.png') no-repeat 0 0;
     background-size: 36px;
 }
@@ -12735,12 +12740,18 @@ form.opml_import_form input {
 
 .NB-feedchooser-premium-archive-bullets li.NB-5 .NB-feedchooser-premium-bullet-image,
 .NB-welcome-premium-archive-bullet.NB-5 {
-    background: transparent url('/media/embed/icons/icons8/icons8-rss-100.png') no-repeat 0 0;
+    background: transparent url('/media/embed/icons/nouns/direction_black.svg') no-repeat 0 0;
     background-size: 16px;
 }
 
 .NB-feedchooser-premium-archive-bullets li.NB-6 .NB-feedchooser-premium-bullet-image,
 .NB-welcome-premium-archive-bullet.NB-6 {
+    background: transparent url('/media/embed/icons/icons8/icons8-rss-100.png') no-repeat 0 0;
+    background-size: 16px;
+}
+
+.NB-feedchooser-premium-archive-bullets li.NB-7 .NB-feedchooser-premium-bullet-image,
+.NB-welcome-premium-archive-bullet.NB-7 {
     background: transparent url('/media/embed/icons/icons8/icons8-calendar-100.png') no-repeat 0 0;
     background-size: 16px;
 }

media/js/newsblur/reader/reader_feedchooser.js

@@ -209,15 +209,15 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
                             $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
                             'Feeds that support paging are back-filled in for a complete archive'
                         ]),
-                        $.make('li', { className: 'NB-4' }, [
+                        $.make('li', { className: 'NB-5' }, [
                             $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
                             'Discover related stories and sites across every story in your archive'
                         ]),
-                        $.make('li', { className: 'NB-5' }, [
+                        $.make('li', { className: 'NB-6' }, [
                             $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
                             'Export trained stories from folders as RSS feeds'
                         ]),
-                        $.make('li', { className: 'NB-6' }, [
+                        $.make('li', { className: 'NB-7' }, [
                             $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
                             'Stories can stay unread forever'
                         ])
@@ -288,6 +288,89 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
                             ])
                         ]))
                     ])
+                ]),
+                $.make('div', { className: 'NB-feedchooser-premium-plan' }, [
+                    $.make('div', { className: 'NB-feedchooser-info' }, [
+                        $.make('div', { className: 'NB-feedchooser-info-type' }, [
+                            'Premium Pro Subscription',
+                            $.make('span', { className: 'NB-feedchooser-subtitle-type-price' }, '$29/month'),
+                        ])
+                    ]),
+                    $.make('ul', { className: 'NB-feedchooser-premium-bullets NB-feedchooser-premium-pro-bullets' }, [
+                        $.make('li', { className: 'NB-1' }, [
+                            $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
+                            'Everything in the premium archive subscription, of course'
+                        ]),
+                        $.make('li', { className: 'NB-2' }, [
+                            $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }),
+                            'All of your feeds are fetched every 5 minutes'
+                        ])
+                    ]),
+                    $.make('div', { className: 'NB-payment-providers' }, [
+                        (!NEWSBLUR.Globals.is_pro && $.make("div", { className: "NB-feedchooser-premium-upgrade" }, [
+                            $.make('div', { className: 'NB-provider-main' }, [
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $creditcards.clone()),
+                                $.make('div', {
+                                    className: "NB-provider-button-pro NB-modal-submit-button NB-modal-submit-green"
+                                }, [
+                                    "Upgrade to Premium Pro",
+                                    (NEWSBLUR.Globals.active_provider == "paypal" && " with PayPal")
+                                ]),
+                                this.make_premium_pro_prorate_message(),
+                            ]),
+                            $.make('div', { className: 'NB-feedchooser-or-bar' }),
+                            $.make("div", { className: "NB-provider-alternate" }, [
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make('span', { className: "NB-provider-text" }, "subscribe with ")),
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make("div", { className: "NB-splash-link NB-paypal-button", "data-plan": "pro" }, "")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $.make("div", { className: "NB-stripe-button-switch-pro NB-modal-submit-button NB-modal-submit-green" }, "Switch to Credit Card")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $creditcards)
+                            ])
+                            // $.make('div', { className: "NB-provider-note" }, "Note: Due to the intricacies of PayPal integration, you will be charged the full amount. If you switch to credit card, you will only be charged a prorated amount.")
+                        ])),
+                        (NEWSBLUR.Globals.is_pro && $.make("div", { className: "NB-feedchooser-premium-upgrade" }, [
+                            $.make('div', {
+                                className: "NB-feedchooser-premium-already"
+                            }, [
+                                $.make('div', { className: 'NB-feedchooser-premium-already-icon' }),
+                                $.make('div', { className: 'NB-feedchooser-premium-already-message' }, [
+                                    "Your premium pro subscription is active"
+                                ])
+                            ])
+                        ])),
+                        (NEWSBLUR.Globals.is_pro && !NEWSBLUR.Globals.premium_renewal && $.make("div", { className: "NB-feedchooser-premium-upgrade" }, [
+                            $.make('div', { className: 'NB-provider-main' }, [
+                                $.make('div', {
+                                    className: "NB-provider-button-pro NB-modal-submit-button NB-modal-submit-green"
+                                }, [
+                                    !NEWSBLUR.Globals.is_pro && "Switch plans to a premium pro subscription",
+                                    NEWSBLUR.Globals.is_pro && "Restart your premium pro subscription",
+                                ])
+                            ]),
+                            $.make('div', { className: 'NB-feedchooser-or-bar' }),
+                            $.make("div", { className: "NB-provider-alternate" }, [
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make('span', { className: "NB-provider-text" }, "subscribe with ")),
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make("div", { className: "NB-splash-link NB-paypal-button", "data-plan": "pro" }, "")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $.make("div", { className: "NB-stripe-button-switch-pro NB-modal-submit-button NB-modal-submit-green" }, "Switch to Credit Card")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $creditcards.clone())
+                            ])
+                        ])),
+                        (NEWSBLUR.Globals.is_pro && !NEWSBLUR.Globals.is_pro && NEWSBLUR.Globals.premium_renewal && $.make("div", { className: "NB-feedchooser-premium-upgrade" }, [
+                            $.make('div', { className: 'NB-provider-main' }, [
+                                $.make('div', {
+                                    className: "NB-provider-button-change NB-modal-submit-button NB-modal-submit-grey"
+                                }, [
+                                    "Change billing details"
+                                ])
+                            ]),
+                            $.make('div', { className: 'NB-feedchooser-or-bar' }),
+                            $.make("div", { className: "NB-provider-alternate" }, [
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make('span', { className: "NB-provider-text" }, "subscribe with ")),
+                                (NEWSBLUR.Globals.active_provider != "paypal" && $.make("div", { className: "NB-splash-link NB-paypal-button", "data-plan": "pro" }, "")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $.make("div", { className: "NB-stripe-button-switch-pro NB-modal-submit-button NB-modal-submit-green" }, "Switch to Credit Card")),
+                                (NEWSBLUR.Globals.active_provider == "paypal" && $creditcards.clone())
+                            ])
+                        ]))
+                    ])
                 ])
             ])),
             (!this.options.premium_only && $.make('div', { className: 'NB-feedchooser-type NB-feedchooser-left' }, [
@@ -337,6 +420,12 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
         return $.make('div', { className: "NB-premium-prorate-message" }, "Your existing subscription will be prorated");
     },
 
+    make_premium_pro_prorate_message: function () {
+        if (!_.contains(["paypal", "stripe"], NEWSBLUR.Globals.active_provider))
+            return;
+        return $.make('div', { className: "NB-premium-prorate-message" }, "Your existing subscription will be prorated");
+    },
+
     make_paypal_button: function () {
         jQuery.ajax({
             type: "GET",
@@ -351,9 +440,11 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
                 if (NEWSBLUR.Globals.debug) {
                     if (plan == 'premium') plan_id = "P-4RV31836YD8080909MHZROJY";
                     else if (plan == 'archive') plan_id = "P-2EG40290653242115MHZROQQ";
+                    else if (plan == 'pro') plan_id = "P-1AE0908250058421JM565SVY";
                 } else {
                     if (plan == 'premium') plan_id = "P-48R22630SD810553FMHZONIY";
                     else if (plan == 'archive') plan_id = "P-5JM46230U31841226MHZOMZY";
+                    else if (plan == 'pro') plan_id = "P-1AE0908250058421JM565SVY";
                 }
                 var random_id = 'paypal-' + Math.round(Math.random() * 100000);
                 $button.attr('id', random_id);
@@ -382,6 +473,8 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
                         console.log('Paypal approve result', data.subscriptionID, JSON.stringify(data, null, 2));
                         if (plan == "archive") {
                             actions.redirect(NEWSBLUR.URLs.paypal_archive_return);
+                        } else if (plan == "pro") {
+                            actions.redirect(NEWSBLUR.URLs.paypal_pro_return);
                         } else {
                             actions.redirect(NEWSBLUR.URLs.paypal_return);
                         }
@@ -684,6 +777,11 @@ _.extend(NEWSBLUR.ReaderFeedchooser.prototype, {
             this.open_stripe_checkout('archive', $t);
         }, this));
 
+        $.targetIs(e, { tagSelector: '.NB-stripe-button-switch-pro' }, _.bind(function ($t, $p) {
+            e.preventDefault();
+            this.open_stripe_checkout('pro', $t);
+        }, this));
+
         $.targetIs(e, { tagSelector: '.NB-paypal-button-archive' }, _.bind(function ($t, $p) {
             e.preventDefault();
             this.open_paypal_checkout('archive', $t);

templates/base.html

@@ -2,22 +2,29 @@
 {% load static %}
 {% load pipeline %}
 {% autoescape off %}
-<!DOCTYPE html>
+  <!DOCTYPE html>
-<html>
+  <html>
-<head>
+    <head>
-  <title>{% block title %}NewsBlur{% endblock %}</title>
+      <title>
-  <link rel="shortcut icon" href="{{ MEDIA_URL }}img/favicon.ico" type="image/png" />
+        {% block title %}NewsBlur{% endblock %}
-  <link rel="icon" href="{{ MEDIA_URL }}img/favicon_32.png" sizes="32x32"/>
+      </title>
-  <link rel="icon" href="{{ MEDIA_URL }}img/favicon_64.png" sizes="64x64"/>
+      <link rel="shortcut icon"
-  <link rel="apple-touch-icon" href="/media/img/mobile/apple-touch-icon-precomposed.png" />
+            href="{{ MEDIA_URL }}img/favicon.ico"
-  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
+            type="image/png" />
-  <meta name="msapplication-TileImage" content="{{ MEDIA_URL }}img/logo_144.png" />
+      <link rel="icon" href="{{ MEDIA_URL }}img/favicon_32.png" sizes="32x32" />
-  <meta name="msapplication-TileColor" content="#F7E5A8"/>
+      <link rel="icon" href="{{ MEDIA_URL }}img/favicon_64.png" sizes="64x64" />
-  <meta name="apple-itunes-app" content="app-id=463981119">
+      <link rel="apple-touch-icon"
-  <link rel="manifest" href="/manifest.webmanifest">
+            href="/media/img/mobile/apple-touch-icon-precomposed.png" />
-  <!-- <link rel="mask-icon" href="{{ MEDIA_URL }}img/favicon_monochrome.svg" color="orange"> -->
+      <meta http-equiv="Content-type" content="text/html; charset=utf-8">
-  
+      <meta name="msapplication-TileImage"
-  <script type="text/javascript" charset="utf-8">
+            content="{{ MEDIA_URL }}img/logo_144.png" />
+      <meta name="msapplication-TileColor" content="#F7E5A8" />
+      <meta name="apple-itunes-app" content="app-id=463981119">
+      <link rel="manifest" href="/manifest.webmanifest">
+      <!-- <link rel="mask-icon"
+       href="{{ MEDIA_URL }}img/favicon_monochrome.svg"
+       color="orange"> -->
+      <script type="text/javascript" charset="utf-8">
     window.NEWSBLUR = {};
     NEWSBLUR.Globals = {
       'is_authenticated'        : {{ user.is_authenticated|yesno:"true,false" }},
@@ -131,55 +138,49 @@
       'folder_rss'              : "/reader/folder_rss/{user_id}/{secret_token}/{unread_filter}/{folder_title}",
       'paypal_checkout_js'      : 'https://www.paypal.com/sdk/js?vault=true&intent=subscription&client-id={% settings_value "PAYPAL_API_CLIENTID" %}',
       'paypal_return'           : "https://{% current_domain %}{% url "paypal-return" %}",
-      'paypal_archive_return'   : "https://{% current_domain %}{% url "paypal-archive-return" %}"
+      'paypal_archive_return'   : "https://{% current_domain %}{% url "paypal-archive-return" %}",
+      'paypal_pro_return'        : "https://{% current_domain %}{% url "paypal-pro-return" %}"
     };
     NEWSBLUR.Models = {};
     NEWSBLUR.Collections = {};
     NEWSBLUR.Views = {};
     NEWSBLUR.app = {};
-  </script>
+      </script>
-  
+      {% include_stylesheets "common" %}
-  {% include_stylesheets "common" %}
+      {% if debug_assets %}
-  
+        <link rel="stylesheet"
-  {% if debug_assets %}
+              type="text/css"
-      <link rel="stylesheet" type="text/css" href="https://cloud.typography.com/6565292/731824/css/fonts.css" />
+              href="https://cloud.typography.com/6565292/731824/css/fonts.css" />
-  {% else %}
+      {% else %}
-      <link rel="stylesheet" type="text/css" href="https://cloud.typography.com/6565292/711824/css/fonts.css" />
+        <link rel="stylesheet"
-  {% endif %}
+              type="text/css"
-  
+              href="https://cloud.typography.com/6565292/711824/css/fonts.css" />
-</head>
+      {% endif %}
-
+    </head>
-<body class="{% block bodyclass %}{% endblock %} {% if user.is_staff %}NB-staff{% endif %} {% if user_profile.is_premium %}NB-premium{% endif %}">
+    <body class="{% block bodyclass %}{% endblock %} {% if user.is_staff %}NB-staff{% endif %} {% if user_profile.is_premium %}NB-premium{% endif %}">
-
+      {% block header %}{% endblock %}
-  {% block header %}{% endblock %}
+      <div class="NB-body-inner">
-
+        <div class="NB-splash-info NB-splash-top">
-  <div class="NB-body-inner">
+          <a href="{% url "index" %}">
-      <div class="NB-splash-info NB-splash-top">
+            <div class="NB-splash-title NB-splash-blurred-logo"></div>
-        <a href="{% url "index" %}"><div class="NB-splash-title NB-splash-blurred-logo"></div></a>
+          </a>
+        </div>
+        {% block content %}{% endblock %}
+        {% block footer %}
+          {% render_footer "welcome" %}
+        {% endblock footer %}
       </div>
-  
+      {% block head_js %}
-      {% block content %}{% endblock %}
+        {% include_javascripts "common" %}
-      
+      {% endblock head_js %}
-      {% block footer %}
+      <script type="text/javascript" charset="utf-8">
-        {% render_footer "welcome" %}
-      {% endblock footer %}
-      
-  </div>
-  
-  {% block head_js %}
-    {% include_javascripts "common" %}
-  {% endblock head_js %}
-
-  <script type="text/javascript" charset="utf-8">
     _.extend(NEWSBLUR.Preferences, {% if user_profile.preferences %}{{ user_profile.preferences|safe }}{% else %}{}{% endif %});
     _.extend(NEWSBLUR.Preferences['view_settings'], {% if user_profile.view_settings %}{{ user_profile.view_settings|safe }}{% else %}{}{% endif %});
     _.extend(NEWSBLUR.Preferences['collapsed_folders'], {% if user_profile.collapsed_folders %}{{ user_profile.collapsed_folders|safe }}{% else %}[]{% endif %});
     
-  </script>
+      </script>
-
+      {% block extra_head_js %}
-  {% block extra_head_js %}
+      {% endblock extra_head_js %}
-  {% endblock extra_head_js %}
+    </body>
-  
+  </html>
-</body>
-</html>
 {% endautoescape %}

templates/reader/paypal_pro_return.xhtml

@@ -0,0 +1,26 @@
+{% extends 'base.html' %}
+
+{% load typogrify_tags utils_tags %}
+
+{% block extra_head_js %}
+  {% include_stylesheets "common" %}
+  {% include_javascripts "payments" %}
+{% endblock %}
+
+{% block content %}
+
+<div class="NB-paypal-return">
+  
+  <div class="NB-paypal-return-title">
+    Thank you for subscribing to NewsBlur Premium Pro
+  </div>
+
+  <div class="NB-paypal-return-subtitle">
+    Hold tight while your account is being upgraded...
+  </div>
+
+  <div class="NB-paypal-return-loading"></div>
+  
+</div>
+
+{% endblock %}