From f23accc5728fc9d5280bb49caed8d7e73238b7a0 Mon Sep 17 00:00:00 2001 From: M Fahru Date: Thu, 7 Apr 2022 09:15:11 -0400 Subject: [PATCH] Merge pull request #7292 from overleaf/tm-plans-page-layout-teardown Tear down plans page split test variant with new layout GitOrigin-RevId: ab09066f05d17ca17a19ab8895fac141e1e89bff --- .../Subscription/SubscriptionController.js | 9 -- .../views/subscriptions/plans-marketing.pug | 125 ++++++------------ .../subscriptions/plans-marketing/_mixins.pug | 109 --------------- .../features/plans/group-plan-modal/index.js | 17 +-- .../web/frontend/stylesheets/app/plans.less | 3 - services/web/locales/en.json | 3 +- 6 files changed, 45 insertions(+), 221 deletions(-) diff --git a/services/web/app/src/Features/Subscription/SubscriptionController.js b/services/web/app/src/Features/Subscription/SubscriptionController.js index 0581bb5f8a..4d8a615fc4 100644 --- a/services/web/app/src/Features/Subscription/SubscriptionController.js +++ b/services/web/app/src/Features/Subscription/SubscriptionController.js @@ -57,14 +57,6 @@ async function plansPage(req, res) { AnalyticsManager.recordEventForSession(req.session, 'plans-page-view') - const assignment = await SplitTestHandler.promises.getAssignment( - req, - 'plans-page-layout' - ) - - const newPlansPageVariant = - assignment && assignment.variant === 'new-plans-page' - const standardPlanNameAssignment = await SplitTestHandler.promises.getAssignment(req, 'standard-plan-name') @@ -82,7 +74,6 @@ async function plansPage(req, res) { groupPlans: GroupPlansData, groupPlanModalOptions, groupPlanModalDefaults, - newPlansPageVariant, useNewPlanName, }) } diff --git a/services/web/app/views/subscriptions/plans-marketing.pug b/services/web/app/views/subscriptions/plans-marketing.pug index 5f16b5e5d8..1163223386 100644 --- a/services/web/app/views/subscriptions/plans-marketing.pug +++ b/services/web/app/views/subscriptions/plans-marketing.pug @@ -25,94 +25,53 @@ block content .col-md-8.col-md-offset-2 p.text-centered #{translate("sl_benefits_plans")} - if (newPlansPageVariant) - +allCardsAndControlsForVariant - else - +allCardsAndControls() + +allCardsAndControls() - if (newPlansPageVariant) - .row.features-table(event-tracking="features-table-viewed" event-tracking-ga="subscription-funnel" event-tracking-trigger="scroll" event-tracking-send-once="true" event-tracking-label="exp-") - .col-sm-12(data-ol-view='monthly') - +table_premium - .col-sm-12(hidden data-ol-view='annual') - +table_premium - .col-sm-12(hidden data-ol-view='student') - +table_student + .row.row-spaced-large.text-centered + .col-xs-12 + p.text-centered !{translate('also_provides_free_plan', {}, [{ name: 'a', attrs: { href: '/register' }}])} + i.fa.fa-cc-mastercard.fa-2x(aria-hidden="true")   + span.sr-only Mastercard accepted + i.fa.fa-cc-visa.fa-2x(aria-hidden="true")   + span.sr-only Visa accepted + i.fa.fa-cc-amex.fa-2x(aria-hidden="true")   + span.sr-only Amex accepted + i.fa.fa-cc-paypal.fa-2x(aria-hidden="true")   + span.sr-only Paypal accepted + div.text-centered #{translate('change_plans_any_time')}
#{translate('billed_after_x_days', {len:'7'})} + br + div.text-centered #{translate('subject_to_additional_vat')}
#{translate('select_country_vat')} - .row.row-spaced-large - .col-md-8.col-md-offset-2 - .card.text-centered - .card-header - h2 #{translate('looking_multiple_licenses')} - span #{translate('reduce_costs_group_licenses')} - br - br - a.btn.btn-default( - href="#groups" - data-ol-open-group-plan-modal - data-ol-location='callout' - ) #{translate('find_out_more')} - - .row.row-spaced-large.text-centered - .col-xs-12 - p.text-centered !{translate('also_provides_free_plan', {}, [{ name: 'a', attrs: { href: '/register' }}])} - i.fa.fa-cc-mastercard.fa-2x(aria-hidden="true")   - span.sr-only Mastercard accepted - i.fa.fa-cc-visa.fa-2x(aria-hidden="true")   - span.sr-only Visa accepted - i.fa.fa-cc-amex.fa-2x(aria-hidden="true")   - span.sr-only Amex accepted - i.fa.fa-cc-paypal.fa-2x(aria-hidden="true")   - span.sr-only Paypal accepted - div.text-centered #{translate('change_plans_any_time')}
#{translate('billed_after_x_days', {len:'7'})} + .row.row-spaced-large + .col-md-8.col-md-offset-2 + .card.text-centered + .card-header + h2 #{translate('looking_multiple_licenses')} + span #{translate('reduce_costs_group_licenses')} br - div.text-centered #{translate('subject_to_additional_vat')}
#{translate('select_country_vat')} - else - .row.row-spaced-large.text-centered - .col-xs-12 - p.text-centered !{translate('also_provides_free_plan', {}, [{ name: 'a', attrs: { href: '/register' }}])} - i.fa.fa-cc-mastercard.fa-2x(aria-hidden="true")   - span.sr-only Mastercard accepted - i.fa.fa-cc-visa.fa-2x(aria-hidden="true")   - span.sr-only Visa accepted - i.fa.fa-cc-amex.fa-2x(aria-hidden="true")   - span.sr-only Amex accepted - i.fa.fa-cc-paypal.fa-2x(aria-hidden="true")   - span.sr-only Paypal accepted - div.text-centered #{translate('change_plans_any_time')}
#{translate('billed_after_x_days', {len:'7'})} br - div.text-centered #{translate('subject_to_additional_vat')}
#{translate('select_country_vat')} + a.btn.btn-default( + href="#groups" + data-ol-open-group-plan-modal + data-ol-location='callout' + ) #{translate('find_out_more')} - .row.row-spaced-large - .col-md-8.col-md-offset-2 - .card.text-centered - .card-header - h2 #{translate('looking_multiple_licenses')} - span #{translate('reduce_costs_group_licenses')} - br - br - a.btn.btn-default( - href="#groups" - data-ol-open-group-plan-modal - data-ol-location='callout' - ) #{translate('find_out_more')} - - .row.row-spaced-large - .col-sm-12 - .page-header.plans-header.plans-subheader.text-centered - h2 #{translate('compare_plan_features')} - .row - .col-md-6.col-md-offset-3 - +plan_switch('table') - .col-md-3.text-right - +currency_dropdown - .row(event-tracking="features-table-viewed" event-tracking-ga="subscription-funnel" event-tracking-trigger="scroll" event-tracking-send-once="true" event-tracking-label="exp-") - .col-sm-12(data-ol-view='monthly') - +table_premium - .col-sm-12(hidden data-ol-view='annual') - +table_premium - .col-sm-12(hidden data-ol-view='student') - +table_student + .row.row-spaced-large + .col-sm-12 + .page-header.plans-header.plans-subheader.text-centered + h2 #{translate('compare_plan_features')} + .row + .col-md-6.col-md-offset-3 + +plan_switch('table') + .col-md-3.text-right + +currency_dropdown + .row(event-tracking="features-table-viewed" event-tracking-ga="subscription-funnel" event-tracking-trigger="scroll" event-tracking-send-once="true" event-tracking-label="exp-") + .col-sm-12(data-ol-view='monthly') + +table_premium + .col-sm-12(hidden data-ol-view='annual') + +table_premium + .col-sm-12(hidden data-ol-view='student') + +table_student include ./plans-marketing/_quotes diff --git a/services/web/app/views/subscriptions/plans-marketing/_mixins.pug b/services/web/app/views/subscriptions/plans-marketing/_mixins.pug index e4f15746f3..6a89362240 100644 --- a/services/web/app/views/subscriptions/plans-marketing/_mixins.pug +++ b/services/web/app/views/subscriptions/plans-marketing/_mixins.pug @@ -65,24 +65,6 @@ mixin card_student_monthly(location) span +price_student_monthly +features_student(location, 'monthly') -mixin card_student_annual_variant(location) - .best-value - strong #{translate('best_value')} - .card-header - h2 #{translate("student")} (#{translate("annual")}) - h5.tagline #{translate('tagline_student_annual')} - .circle - span - +price_student_annual - +btn_buy_student(location, 'annual') -mixin card_student_monthly_variant(location) - .card-header - h2 #{translate("student")} - h5.tagline #{translate('tagline_student_monthly')} - .circle - span - +price_student_monthly - +btn_buy_student(location, 'monthly') //- Features Lists, used within cards mixin features_collaborator(location) @@ -210,27 +192,6 @@ mixin plan_switch(location) href="#" ) #{translate("special_price_student")} -mixin plan_switch_variant() - ul.nav.nav-pills - li.active(data-ol-view-tab='monthly') - a.btn.btn-default-outline( - href="#" - ) #{translate("monthly")} - li(data-ol-view-tab='annual') - a.btn.btn-default-outline( - href="#" - ) #{translate("annual")} - li(data-ol-view-tab='student') - a.btn.btn-default-outline( - href="#" - ) #{translate("special_price_student")} - li() - a.btn.btn-default-outline( - href="#groups" - data-ol-open-group-plan-modal - data-ol-location='toggle' - ) #{translate("group_plans")} - mixin allCardsAndControls(controlsRowSpaced, listLocation) - var location = listLocation ? 'card_' + listLocation : 'card' .row.top-switch(class=(controlsRowSpaced ? "row-spaced" : "")) @@ -290,73 +251,3 @@ mixin allCardsAndControls(controlsRowSpaced, listLocation) .col-md-4 .card.card-last +card_student_monthly(location) - -mixin allCardsAndControlsForVariant() - - var location = listLocation ? 'card_' + listLocation : 'card' - .row.top-switch(class=(controlsRowSpaced ? "row-spaced" : "")) - .col-lg-6.col-lg-offset-3.col-md-8.col-md-offset-1 - +plan_switch_variant('card') - .col-md-2.text-right - +currency_dropdown - - .row - .col-md-10.col-md-offset-1 - .row - for view in ['monthly', 'annual'] - .card-group.text-centered(data-ol-view=view hidden=(view==='annual')) - .col-md-4 - .card.card-first - .card-header - h2 #{translate("personal")} - h5.tagline #{translate("tagline_personal")} - .circle - +price_personal - ul.list-unstyled - li #{translate("one_collaborator")} - +btn_buy_personal(location) - .col-md-4 - .card.card-highlighted - .best-value - strong #{translate('best_value')} - .card-header - if (useNewPlanName) - h2 #{translate("standard")} - else - h2 #{translate("collaborator")} - h5.tagline #{translate("tagline_collaborator")} - .circle - +price_collaborator - ul.list-unstyled - li - strong #{translate("collabs_per_proj", {collabcount:10})} - +btn_buy_collaborator(location) - .col-md-4 - .card.card-last - .card-header - h2 #{translate("professional")} - h5.tagline #{translate("tagline_professional")} - .circle - +price_professional - ul.list-unstyled - li - strong #{translate("unlimited_collabs")} - +btn_buy_professional(location) - - .card-group.text-centered(hidden data-ol-view='student') - .col-md-4 - .card.card-first - .card-header - h2 #{translate("free")} - h5.tagline #{translate("tagline_free")} - .circle #{translate("free")} - ul.list-unstyled - li #{translate("one_collaborator")} - +btn_buy_free(location) - - .col-md-4 - .card.card-highlighted - +card_student_annual_variant(location) - - .col-md-4 - .card.card-last - +card_student_monthly_variant(location) diff --git a/services/web/frontend/js/features/plans/group-plan-modal/index.js b/services/web/frontend/js/features/plans/group-plan-modal/index.js index ee5bab66fd..153ee16a90 100644 --- a/services/web/frontend/js/features/plans/group-plan-modal/index.js +++ b/services/web/frontend/js/features/plans/group-plan-modal/index.js @@ -53,11 +53,6 @@ function updateGroupPlanView() { ).hidden = size >= 10 } -function getGroupModalOpeningLocation() { - const modalEl = $('[data-ol-group-plan-modal]') - return modalEl.data('ol-modal-opening-location') -} - const modalEl = $('[data-ol-group-plan-modal]') modalEl .on('shown.bs.modal', function () { @@ -68,11 +63,8 @@ modalEl history.replaceState(null, document.title, window.location.pathname) }) -function showGroupPlanModal(location) { +function showGroupPlanModal() { modalEl.modal() - if (location) { - modalEl.data('ol-modal-opening-location', location) - } eventTracking.send( 'subscription-funnel', 'plans-page', @@ -101,11 +93,6 @@ document.querySelectorAll('[data-ol-purchase-group-plan]').forEach(el => const itmContent = getMeta('ol-itm_content') if (itmContent) { queryParams.set('itm_content', itmContent) - } else { - const openingLocation = getGroupModalOpeningLocation() - if (openingLocation === 'toggle') { - queryParams.set('itm_content', openingLocation) - } } eventTracking.sendMB('groups-modal-click', { plan: planCode, @@ -128,7 +115,7 @@ document.querySelectorAll('[data-ol-open-group-plan-modal]').forEach(el => { location, period: 'annual', }) - showGroupPlanModal(location) + showGroupPlanModal() }) }) diff --git a/services/web/frontend/stylesheets/app/plans.less b/services/web/frontend/stylesheets/app/plans.less index 06ec8e61e2..a961e61fd5 100644 --- a/services/web/frontend/stylesheets/app/plans.less +++ b/services/web/frontend/stylesheets/app/plans.less @@ -132,9 +132,6 @@ margin-left: @line-height-computed / 2; } } - .features-table { - margin-top: 20px; - } } #changePlanSection { diff --git a/services/web/locales/en.json b/services/web/locales/en.json index c5119a75ce..1fe3789bd8 100644 --- a/services/web/locales/en.json +++ b/services/web/locales/en.json @@ -923,7 +923,6 @@ "monthly": "Monthly", "personal": "Personal", "free": "Free", - "group_plans": "Group plans", "one_collaborator": "Only one collaborator", "collaborator": "Collaborator", "standard": "Standard", @@ -1611,6 +1610,6 @@ "keep_your_email_updated": "Keep your email updated so that you don’t lose access to your account and data.", "learn_more_about_emails": "<0>Learn more about managing your __appName__ emails.", "thank_you_email_checked": "Thank you, we’re now taking you back to the projects page", - "change_primary_email_address_instructions": "To change your primary email, please add your new primary email address first (by clicking <0>Add another email) and confirm it. Then click the <0>Make Primary button. <1>Learn more about managing your __appName__ emails.", + "change_primary_email_address_instructions": "To change your primary email, please add your new primary email address first (by clicking <0>Add another email) and confirm it. Then click the <0>Make Primary button. <1>Learn more about managing your __appName__ emails.", "help_improve_overleaf_fill_out_this_survey": "If you would like to help us improve Overleaf, please take a moment to fill out <0>this survey." }