{% extends "advantage/base_advantage.html" %} {% block title %}Buy Ubuntu Pro{% endblock %} {% block meta_description %}Ubuntu Pro offers a single, per-node packaging of the most comprehensive
software, security and IaaS support in the industry, with OpenStack support,
Kubernetes support included, and Livepatch, Landscape and Expanded Security
Maintenance to address security and compliance concerns.{% endblock %} {% block
meta_copydoc
%}https://docs.google.com/document/d/1UqL8YJH9ywvOXnrt3syY0U8fiOakfAGWmLS9uerwAWk/edit{%
endblock meta_copydoc %} {% block content %}

<div id="react-root" class="is-paper">
  <section class="p-strip u-no-padding--top">
    <div class="row">
      <div class="col-12 u-no-margin--bottom p-card">
        <i class="p-icon--spinner u-animation--spin"></i> Loading&hellip;
      </div>
    </div>
  </section>
</div>

<script
  src="{{ versioned_static('js/dist/uaSubscribe.js') }}"
  type="module"
  defer
></script>

<script defer>
  var productList = {
    {% for listing_id, listing in product_listings.items() %}
      "{{ listing.product.id }}-{{ listing.period }}": {
        id: "{{ listing.product.id }}-{{ listing.period }}",
        longId: "{{ listing.id }}",
        name: "{{ listing.product.name }}",
        price: {
          value: {{ listing.price }},
          currency: "{{ listing.currency }}"
        },
        period: "{{ listing.period }}",
        productID: "{{ listing.product.id }}",
        canBeTrialled: {% if listing.can_be_trialled %}true{% else %}false{% endif %},
        private: false,
        marketplace: "canonical-ua",
      },
    {% endfor %}
  };

  var accountId = "{% if account %}{{ account.id }}{% endif %}";
  var isLoggedIn = {% if user_info %}true{% else %}false{% endif %};
  var isTrialling = {% if is_trialling %}true{% else %}false{% endif %};
  var accountName = "{% if account %}{{ account.name }}{% endif %}";
  var previousPurchaseIds = {
    {% for period, id in previous_purchase_ids.items() %}
      "{{ period }}": "{{ id }}",
    {% endfor %}
  }

  window.stripePublishableKey = "{{ get_stripe_publishable_key }}";
</script>

{% endblock %}