mirror of
https://github.com/indentlabs/notebook.git
synced 2025-10-26 11:19:22 +00:00
479 lines
20 KiB
Plaintext
479 lines
20 KiB
Plaintext
<% free_for_life_user = current_user.selected_billing_plan_id == 2 %>
|
|
<% on_premium_plan = ['early-adopters', 'premium', 'premium-trio', 'premium-annual'].include? @active_billing_plan.try(:stripe_plan_id) %>
|
|
<% active_stripe_plan = @active_billing_plan.try(:stripe_plan_id) %>
|
|
|
|
<%= content_for :full_width_page_header do %>
|
|
<p class="center hide-on-small-only">
|
|
<% Rails.application.config.content_types[:all_non_universe].each do |content_class| %>
|
|
<% can_create = current_user.can_create?(content_class) || PermissionService.user_has_active_promotion_for_this_content_type(user: current_user, content_type: content_class.name) %>
|
|
<% edit_message = current_user.send(content_class.name.pluralize.downcase).any? && !can_create %>
|
|
<i class="material-icons <%= can_create ? content_class.color : 'grey' %>-text tooltipped small" data-position="bottom" data-delay="0" data-tooltip="You <%= can_create ? 'can' : 'cannot' %> create new <%= content_class.name.pluralize.downcase %>.<%= ' You can edit your existing ones.' if edit_message %>">
|
|
<%= content_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
</p>
|
|
<% end %>
|
|
|
|
<h4>Subscription Plan</h4>
|
|
|
|
<p>
|
|
<% if free_for_life_user %>
|
|
<p style="margin-top: 20px;">
|
|
Thank you! You were there at Notebook.ai's beginnings, so we've gifted you <strong>a free, unlimited account for life</strong>. Subscriptions below have been disabled, because you already have everything unlocked.
|
|
</p>
|
|
<p>
|
|
Thank you for helping make Notebook.ai what it is today.
|
|
</p>
|
|
<% else %>
|
|
You're currently subscribed to Notebook's <strong><%= @active_billing_plan.name %></strong> plan.
|
|
<% unless @active_billing_plan.nil? || @active_billing_plan.stripe_plan_id == 'starter' %>
|
|
<% renewal_day = current_user.active_subscriptions.first.start_date.day %>
|
|
While active, your subscription will automatically renew.
|
|
<% if active_stripe_plan == 'premium' %>
|
|
You will be charged <%= number_to_currency(@active_billing_plan.monthly_cents / 100) %>
|
|
on the <%= renewal_day %><%= renewal_day.ordinal %> of each month.
|
|
<% end %>
|
|
<% end %>
|
|
<% end %>
|
|
</p>
|
|
|
|
<div class="row">
|
|
<div class="col s12 m6 l3">
|
|
<div class="card <%= 'light-blue lighten-5' if @active_billing_plan.stripe_plan_id == 'starter' %>" style="min-height: 470px;">
|
|
<div class="card-content">
|
|
<h4 class="center">
|
|
<i class="material-icons" style="font-size: 90%; position: relative; top: 3px;">class</i>
|
|
Starter
|
|
</h4>
|
|
<h5 class="center">
|
|
$0/month<br /><br />
|
|
</h5>
|
|
<ul class="plan-features">
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Plan up to <strong>5</strong> universes
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Upload <strong>50MB</strong> of images
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Create <strong>core</strong> page types
|
|
</li>
|
|
<li class="center">
|
|
<i class="material-icons <%= Universe.color %>-text tooltipped" style="font-size: 240%" data-position="bottom" data-delay="0" data-tooltip="Create up to 5 <%= Universe.name.pluralize %>">
|
|
<%= Universe.icon %>
|
|
</i>
|
|
<% (Rails.application.config.content_types[:free]).each do |content_class| %>
|
|
<% next if content_class.name == "Universe" %>
|
|
<i class="material-icons <%= content_class.color %>-text tooltipped" style="font-size: 240%" data-position="bottom" data-delay="0" data-tooltip="Create unlimited <%= content_class.name.pluralize %>">
|
|
<%= content_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
<br /><br /><br />
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="row center">
|
|
<% if @active_billing_plan.stripe_plan_id == 'starter' %>
|
|
<%= link_to 'Plan is active', '#', class: 'btn-large waves-effect waves-light white disabled black-text' %>
|
|
<% else %>
|
|
<%= link_to 'Downgrade', change_subscription_path('starter'), class: "btn-large waves-effect waves-light white black-text #{'disabled' if free_for_life_user}" %>
|
|
<% end %>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col s12 m6 l3">
|
|
<div class="card <%= 'light-blue lighten-5' if active_stripe_plan == 'premium' %>" style="min-height: 470px;">
|
|
<div class="card-content">
|
|
<h4 class="center">
|
|
<i class="material-icons" style="font-size: 90%; position: relative; top: 3px;">grade</i>
|
|
Premium
|
|
</h4>
|
|
<h5 class="center">
|
|
$9/month<br />
|
|
<small>billed monthly</small>
|
|
</h5>
|
|
<ul class="plan-features">
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Plan <strong>unlimited</strong> universes
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Upload <strong>10GB</strong> of images
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Create <strong>all <%= Rails.application.config.content_types[:all].count %></strong> page types
|
|
</li>
|
|
<li class="center">
|
|
<% Rails.application.config.content_types[:all].each_with_index do |content_class, i| %>
|
|
<%= '<br />'.html_safe if i % 4 == 0 && i != 0 %>
|
|
<i class="material-icons <%= content_class.color %>-text tooltipped" style="font-size: 240%" data-position="bottom" data-delay="0" data-tooltip="Create unlimited <%= content_class.name.pluralize %>">
|
|
<%= content_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="row center">
|
|
<% if active_stripe_plan == 'premium' %>
|
|
<%= link_to 'Plan is active', '#', class: 'btn-large waves-effect waves-light white black-text disabled' %>
|
|
<% elsif on_premium_plan %>
|
|
<%= link_to 'Change Plan', change_subscription_path('premium'), class: "btn-large waves-effect waves-light white blue-text #{'disabled' if free_for_life_user}" %>
|
|
<% else %>
|
|
<%= link_to 'Upgrade', change_subscription_path('premium'), class: "btn-large waves-effect waves-light blue white-text #{'disabled' if free_for_life_user}" %>
|
|
<% end %>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col s12 m6 l3">
|
|
<div class="card <%= 'light-blue lighten-5' if active_stripe_plan == 'premium-trio' %>" style="min-height: 470px;">
|
|
<div class="card-content">
|
|
<h4 class="center">
|
|
<i class="material-icons" style="font-size: 90%; position: relative; top: 3px;">grade</i>
|
|
Premium
|
|
</h4>
|
|
<h5 class="center">
|
|
$8/month<br />
|
|
<small>billed every 3 months</small>
|
|
</h5>
|
|
<ul class="plan-features">
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Plan <strong>unlimited</strong> universes
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Upload <strong>10GB</strong> of images
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Create <strong>all <%= Rails.application.config.content_types[:all].count %></strong> page types
|
|
</li>
|
|
<li class="center">
|
|
<% Rails.application.config.content_types[:all].each_with_index do |content_class, i| %>
|
|
<%= '<br />'.html_safe if i % 4 == 0 && i != 0 %>
|
|
<i class="material-icons <%= content_class.color %>-text tooltipped" style="font-size: 240%" data-position="bottom" data-delay="0" data-tooltip="Create unlimited <%= content_class.name.pluralize %>">
|
|
<%= content_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="row center">
|
|
<% if active_stripe_plan == 'premium-trio' %>
|
|
<%= link_to 'Plan is active', '#', class: 'btn-large waves-effect waves-light white black-text disabled' %>
|
|
<% elsif on_premium_plan %>
|
|
<%= link_to 'Change Plan', change_subscription_path('premium-trio'), class: "btn-large waves-effect waves-light white blue-text #{'disabled' if free_for_life_user}" %>
|
|
<% else %>
|
|
<%= link_to 'Upgrade', change_subscription_path('premium-trio'), class: "btn-large waves-effect waves-light blue white-text #{'disabled' if free_for_life_user}" %>
|
|
<% end %>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col s12 m6 l3">
|
|
<div class="card <%= 'light-blue lighten-5' if active_stripe_plan == 'premium-annual' %>" style="min-height: 470px;">
|
|
<div class="card-content">
|
|
<h4 class="center">
|
|
<i class="material-icons" style="font-size: 90%; position: relative; top: 3px;">grade</i>
|
|
Premium
|
|
</h4>
|
|
<h5 class="center">
|
|
$7/month<br />
|
|
<small>billed annually</small>
|
|
</h5>
|
|
<ul class="plan-features">
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Plan <strong>unlimited</strong> universes
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Upload <strong>10GB</strong> of images
|
|
</li>
|
|
<li>
|
|
<i class="material-icons green-text">check</i>
|
|
Create <strong>all <%= Rails.application.config.content_types[:all].count %></strong> page types
|
|
</li>
|
|
<li class="center">
|
|
<% Rails.application.config.content_types[:all].each_with_index do |content_class, i| %>
|
|
<%= '<br />'.html_safe if i % 4 == 0 && i != 0 %>
|
|
<i class="material-icons <%= content_class.color %>-text tooltipped" style="font-size: 240%" data-position="bottom" data-delay="0" data-tooltip="Create unlimited <%= content_class.name.pluralize %>">
|
|
<%= content_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="row center">
|
|
<% if active_stripe_plan == 'premium-annual' %>
|
|
<%= link_to 'Plan is active', '#', class: 'btn-large waves-effect waves-light white black-text disabled' %>
|
|
<% elsif on_premium_plan %>
|
|
<%= link_to 'Change Plan', change_subscription_path('premium-annual'), class: "btn-large waves-effect waves-light white blue-text #{'disabled' if free_for_life_user}" %>
|
|
<% else %>
|
|
<%= link_to 'Upgrade', change_subscription_path('premium-annual'), class: "btn-large waves-effect waves-light blue white-text #{'disabled' if free_for_life_user}" %>
|
|
<% end %>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col s12 m12 l3 hide-on-small-only"></div>
|
|
<div class="col s12 m12 l9">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
|
|
<% if on_premium_plan || free_for_life_user %>
|
|
<div class="card-title">Your subscription is active!</div>
|
|
<p>
|
|
All page types are unlocked. You can turn on or off whichever ones you'd like by
|
|
<%= link_to 'clicking here', customization_content_types_path %> or on the button below.
|
|
</p>
|
|
<br />
|
|
<p>
|
|
<%= link_to 'Enable premium pages', customization_content_types_path, class: 'btn btn-large blue white-text' %>
|
|
</p>
|
|
<% else %>
|
|
<div class="card-title">Choose your way to pay</div>
|
|
<p>
|
|
The standard Premium membership is $9 per month. However, you can save more by choosing to pay every three months or once a year. Purchasing an annual Premium membership gets you the 12th month free!
|
|
</p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="card-title">Your referral code & stats</div>
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<p>
|
|
Your referral link is:
|
|
<% share_link = "https://www.notebook.ai/?referral=#{current_user.referral_code.code}" %>
|
|
<input type="text"
|
|
value="<%= share_link %>"
|
|
style="text-align: center"
|
|
onClick="this.select();" />
|
|
</p>
|
|
<ul>
|
|
<% referrals = current_user.referrals %>
|
|
<% converted_referrals = referrals.map(&:referree).select(&:on_premium_plan?) %>
|
|
<li><strong><%= pluralize referrals.count, 'user' %></strong> <%= referrals.count == 1 ? 'has' : 'have' %> signed up with your referral code.</li>
|
|
<% if converted_referrals.any? %>
|
|
<li>
|
|
Of these, <strong><%= pluralize converted_referrals.count, 'user' %></strong> <%= converted_referrals.count == 1 ? 'has' : 'have' %> earned you both a Premium bonus!
|
|
</li>
|
|
<% else %>
|
|
<li>None have signed up for Premium yet. You receive a permanent 100MB boost to your upload storage whenever someone you refers upgrades to Premium. And they get a 100MB boost, too!</li>
|
|
<% end %>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col s12 m12 l12">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
|
|
<div class="card-title">Have a promotional code to redeem?</div>
|
|
<p>
|
|
Enter it below to apply it to your account. Codes may only be used once per account.
|
|
</p>
|
|
|
|
<%= form_for :promotional_code, url: redeem_path do |form| %>
|
|
<div class="input-field col s6">
|
|
<%= form.text_field :promo_code %>
|
|
<label for="promo_code">Code</label>
|
|
</div>
|
|
|
|
<div class="input-field col s6">
|
|
<%= form.submit 'Redeem code', class: 'white black-text btn' %>
|
|
</div>
|
|
<% end %>
|
|
<div class="clearfix"></div>
|
|
|
|
<% if current_user.active_promotions.any? %>
|
|
<p>
|
|
Your active promo codes:
|
|
|
|
<ul class="browser-default">
|
|
<% current_user.active_promo_codes.each do |promo_code| %>
|
|
<% promotion = Promotion.find_by(user: current_user, page_unlock_promo_code_id: promo_code.id) %>
|
|
<li>
|
|
<p>
|
|
<strong><%= promo_code.code %></strong> - <%= promo_code.description %>
|
|
<span class="grey-text">
|
|
(active for another <%= distance_of_time_in_words(DateTime.current, promotion.expires_at) %>)
|
|
</span>
|
|
</p>
|
|
<p>
|
|
Pages unlocked:
|
|
<% promo_code.page_types.each do |page_type| %>
|
|
<% page_type_class = page_type.constantize %>
|
|
<%= link_to polymorphic_path(page_type_class) do %>
|
|
<i class="material-icons <%= page_type_class.color %>-text tooltipped" data-tooltip="<%= page_type.pluralize %>">
|
|
<%= page_type_class.icon %>
|
|
</i>
|
|
<% end %>
|
|
<% end %>
|
|
</p>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
|
|
<%= link_to 'Click here to turn on your new page types!', customization_content_types_path, class: 'btn blue white-text' %>
|
|
</p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="card-title">Your payment method</div>
|
|
<div class="row">
|
|
<div class="col s12 m6">
|
|
<p>
|
|
<strong>For your security, we don't store your payment information on file.</strong><br /><br />
|
|
</p>
|
|
<p>
|
|
Instead, we rely on industry-leading payment processor Stripe to safely and securely process payments and handle your
|
|
subscription info.
|
|
</p>
|
|
</div>
|
|
<div class="col s12 m6">
|
|
<% if @stripe_customer.sources.total_count == 0 %>
|
|
<p>
|
|
We don't currently have a payment method on file for you. You'll be asked to add one whenever you
|
|
upgrade, but you can add one at any time here.
|
|
<br /><br />
|
|
</p>
|
|
<p class="center">
|
|
<%= link_to "Add payment method", payment_info_path, class: 'btn white blue-text' %>
|
|
</p>
|
|
<% else %>
|
|
<p>
|
|
We have a payment method on file for you through Stripe
|
|
(<%= @stripe_customer.sources.data[0].brand %> ending in <%= @stripe_customer.sources.data[0].last4 %>),
|
|
but since we don't store it locally, you cannot edit it. You can choose to add a new one (replacing the old),
|
|
or delete the existing one.
|
|
</p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% if @stripe_customer.sources.total_count > 0 %>
|
|
<div class="card-action">
|
|
<%= link_to "Add new payment method", payment_info_path %>
|
|
<%= link_to "Delete existing payment method", delete_payment_method_path %>
|
|
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="card-title">
|
|
Upload Bandwidth
|
|
<div class="right">
|
|
<%= (current_user.upload_bandwidth_kb) > 0 ? Filesize.from("#{current_user.upload_bandwidth_kb}KB").pretty : '-' + Filesize.from("#{current_user.upload_bandwidth_kb.abs}KB").pretty %> remaining
|
|
</div>
|
|
</div>
|
|
<p>
|
|
You have <strong><%= (current_user.upload_bandwidth_kb) > 0 ? Filesize.from("#{current_user.upload_bandwidth_kb}KB").pretty : '-' + Filesize.from("#{current_user.upload_bandwidth_kb.abs}KB").pretty %></strong> of bandwidth remaining.
|
|
</p>
|
|
<p>
|
|
This bandwidth can be used to upload images to your content anywhere on the site. Deleting an uploaded image frees
|
|
up the same amount of bandwidth.
|
|
<% unless on_premium_plan %>
|
|
To get more bandwidth, upgrade to our Premium plan.
|
|
<% end %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="card-title">
|
|
<div class="right">
|
|
<% account_balance = @stripe_customer.account_balance %>
|
|
<%= 'Outstanding balance:' if account_balance > 0 %> <%= number_to_currency(account_balance.abs / 100.0) if account_balance != 0 %> <%= 'credit' if account_balance < 0 %>
|
|
</div>
|
|
Billing history
|
|
</div>
|
|
<table class="bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>Date</th>
|
|
<th>Description</th>
|
|
<th>Amount Billed</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% @stripe_invoices.first(10).each do |invoice| %>
|
|
<tr>
|
|
<td>
|
|
<%= Time.at(invoice.date).strftime('%B %d, %Y, %I:%M:%S %p') %>
|
|
<%= '(Pending)' if Time.at(invoice.date) > Time.now %>
|
|
</td>
|
|
<td>
|
|
<ul>
|
|
<% invoice.lines.data.reverse.each do |line_item| %>
|
|
<li>
|
|
<%
|
|
action = line_item.amount < 0 ? 'prorated' : 'charged'
|
|
if line_item.description.nil?
|
|
description = [
|
|
"a #{line_item.plan.name} subscription ",
|
|
"from #{Time.at(line_item.period.start).strftime('%B %d, %Y')} ",
|
|
"to #{Time.at(line_item.period.end).strftime('%B %d, %Y')}"
|
|
].join
|
|
else
|
|
description = line_item.description
|
|
end
|
|
%>
|
|
|
|
You were <%= action %> <%= number_to_currency(line_item.amount / 100) %> for <%= description %>.
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
</td>
|
|
<td>
|
|
<%= number_to_currency(invoice.amount_due / 100) %>
|
|
</td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|