diff --git a/apps/profile/urls.py b/apps/profile/urls.py index ac5a0b949..4d18c6ff9 100644 --- a/apps/profile/urls.py +++ b/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" diff --git a/apps/profile/views.py b/apps/profile/views.py index 16e62d09c..bf803066b 100644 --- a/apps/profile/views.py +++ b/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")) diff --git a/media/css/reader/reader.css b/media/css/reader/reader.css index 8ba98c322..9e9937a94 100644 --- a/media/css/reader/reader.css +++ b/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; } diff --git a/media/js/newsblur/reader/reader_feedchooser.js b/media/js/newsblur/reader/reader_feedchooser.js index c2fba6f99..8a16099c0 100644 --- a/media/js/newsblur/reader/reader_feedchooser.js +++ b/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); diff --git a/templates/base.html b/templates/base.html index 48b3fbc6c..e9049f810 100644 --- a/templates/base.html +++ b/templates/base.html @@ -2,22 +2,29 @@ {% load static %} {% load pipeline %} {% autoescape off %} - - - - {% block title %}NewsBlur{% endblock %} - - - - - - - - - - - - - - {% include_stylesheets "common" %} - - {% if debug_assets %} - - {% else %} - - {% endif %} - - - - - - {% block header %}{% endblock %} - -
-
- + + {% include_stylesheets "common" %} + {% if debug_assets %} + + {% else %} + + {% endif %} + + + {% block header %}{% endblock %} +
+
+ + + +
+ {% block content %}{% endblock %} + {% block footer %} + {% render_footer "welcome" %} + {% endblock footer %}
- - {% block content %}{% endblock %} - - {% block footer %} - {% render_footer "welcome" %} - {% endblock footer %} - -
- - {% block head_js %} - {% include_javascripts "common" %} - {% endblock head_js %} - - - - {% block extra_head_js %} - {% endblock extra_head_js %} - - - + + {% block extra_head_js %} + {% endblock extra_head_js %} + + {% endautoescape %} diff --git a/templates/reader/paypal_pro_return.xhtml b/templates/reader/paypal_pro_return.xhtml new file mode 100644 index 000000000..1f23fa403 --- /dev/null +++ b/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 %} + +
+ +
+ Thank you for subscribing to NewsBlur Premium Pro +
+ +
+ Hold tight while your account is being upgraded... +
+ +
+ +
+ +{% endblock %}