app/views/data/referrals.html.erb
<div class="row">
<div class="col s12 m9">
<div class="hoverable card">
<div class="card-content">
<div class="card-title">Your referral code</div>
<p>
Use your personal referral URL for sharing Notebook.ai with others to make sure you get credit when they sign up!
</p>
<br />
<p>
<div class="center grey-text text-darken-2">Your referral link is</div>
<input type="text"
value="<%= @share_link %>"
style="text-align: center; font-size: 140%"
onClick="this.select();" />
</p>
</div>
</div>
</div>
<div class="col s12 m3">
<div class="hoverable card-panel center" style="border-bottom: 10px solid #2196F3">
<%# <i class="fa fa-trophy left"></i> %>
you have
<h1 style="padding: 0; margin: 0" class="blue-text">
<strong><%= @referral_count %></strong>
</h1>
<%= 'referral'.pluralize(@referral_count) %>
</div>
</div>
<div class="col s12 m6">
<%= link_to [
'http://twitter.com/share?',
'url=' + CGI.escape(@share_link),
'&text=' + CGI.escape("I'm using Notebook.ai to create fictional worlds and I'd love for you to join me!")
].join, target: '_new' do %>
<div class="hoverable card-panel white-text" style="background: #1DA1F2">
<i class="left fa fa-twitter" style="font-size: 150%"></i>
Share to Twitter
</div>
<% end %>
</div>
<div class="col s12 m6">
<a
href="https://www.facebook.com/sharer/sharer.php?app_id=1523926344336934&u=<%= CGI.escape(@share_link) %>&display=popup&ref=plugin&src=share_button"
onclick="return !window.open(this.href, 'Facebook', 'width=640,height=580')">
<div class="hoverable card-panel white-text" style="background: #4267B2">
<i class="left fa fa-facebook" style="font-size: 150%"></i>
Share to Facebook
</div>
</a>
</div>
<!--
<div class="col s12 m4">
<%= link_to '#' do %>
<div class="hoverable card-panel white-text" style="background: #E60023">
<i class="left fa fa-pinterest" style="font-size: 150%"></i>
Share to Pinterest
</div>
<% end %>
<script
type="text/javascript"
async defer
src="//assets.pinterest.com/js/pinit.js">
</script>
<a href="https://www.pinterest.com/pin/create/button/" data-pin-do="buttonBookmark"></a>
</div>
-->
</div>
<div class="row">
<div class="col s12 m12 l7">
<div class="hoverable card">
<div class="card-content">
<div class="card-title">
<span class="badge"><%= pluralize @referral_count, 'referral' %></span>
Your referrals
</div>
<% if @referrals.any? %>
<table>
<tr>
<th>User</th>
<th>Signed up</th>
<th></th>
<tr>
<% @referrals.each do |referral| %>
<tr>
<td>
<%= link_to referral.referree, class: "#{User.text_color}" do %>
<i class="material-icons left"><%= User.icon %></i>
<%= referral.referree.name %>
<% end %>
</td>
<td><%= time_ago_in_words referral.created_at %> ago</td>
<td class="right">
<% if user_signed_in? && !referral.referree.blocked_by?(current_user) %>
<% if referral.referree.followed_by?(current_user) %>
<%= form_for(current_user.user_followings.find_by(followed_user_id: referral.referree.id), method: :delete) do |f| %>
<%= f.hidden_field :followed_user_id, value: referral.referree.id %>
<%= link_to '#', onclick: "$('.edit_user_following').first().submit()", class: 'collection-item blue white-text btn waves-effect waves-light' do %>
Unfollow
<% end %>
<% end %>
<% else %>
<%= form_for UserFollowing.new, method: :post do |f| %>
<%= f.hidden_field :followed_user_id, value: referral.referree.id %>
<%= link_to '#', onclick: "$('#new_user_following').submit()", class: 'collection-item blue white-text btn waves-effect' do %>
Follow
<% end %>
<% end %>
<% end %>
<% end %>
</td>
</tr>
<% end %>
</table>
<% else %>
<em>Looks like you haven't referred anyone yet! When you do, their profiles will show up here.</em>
<% end %>
</div>
</div>
</div>
<div class="col s12 m12 l5">
<div class="hoverable card">
<div class="card-content">
<div class="card-title">Your rewards</div>
<strong>Up to 10GB in extra storage space</strong>
<p>
Each user you refer to Notebook.ai earns you an extra 100MB in permanent image upload storage space, up to 10GB (100 referrals).
</p>
<br />
<div class="right">+10GB</div>
<div class="progress">
<div class="determinate blue" style="width: <%= (@referral_count) %>%"></div>
</div>
<div>
You've earned
<% if @referral_count < 10 %>
<strong><%= @referral_count * 100 %>MB</strong>
<% else %>
<strong><%= @referral_count / 10.0 %>GB</strong>
<% end %>
in extra storage space so far.
</div>
</div>
</div>
</div>
</div>