mirror of
https://github.com/neocities/neocities.git
synced 2025-04-25 01:32:36 +02:00
404 lines
17 KiB
Text
404 lines
17 KiB
Text
<%
|
||
def plan_pricing_button(plan_type)
|
||
plan_type = plan_type.to_s
|
||
|
||
if !parent_site
|
||
%{<a href="/#new" class="btn-Action">Sign Up</a>}
|
||
elsif parent_site && parent_site.plan_type == plan_type
|
||
if request.path.match /\/welcome/
|
||
%{<a href="/" class="btn-Action">Get Started</a>}
|
||
else
|
||
%{<div class="current-plan">Current Plan</div>}
|
||
end
|
||
else
|
||
#if plan_type == 'supporter'
|
||
# plan_price = "$#{Site::PLAN_FEATURES[plan_type.to_sym][:price]*12}, once per year"
|
||
#else
|
||
plan_price = "$#{Site::PLAN_FEATURES[plan_type.to_sym][:price]}, monthly"
|
||
#end
|
||
|
||
if request.path.match /\/welcome/
|
||
button_title = 'Get Started'
|
||
else
|
||
button_title = parent_site.plan_type == 'free' ? 'Upgrade' : 'Change'
|
||
end
|
||
|
||
%{<a data-plan_name="#{Site::PLAN_FEATURES[plan_type.to_sym][:name]}" data-plan_type="#{plan_type}" data-plan_price="#{plan_price}" onclick="card = new Skeuocard($('#skeuocard')); return false" class="btn-Action planPricingButton">#{button_title}</a>}
|
||
end
|
||
end
|
||
%>
|
||
|
||
<section class="section plans">
|
||
<% if request.path.match /\/welcome/ %>
|
||
<div class="txt-Center"><img src="/img/heartcat.png"></div>
|
||
<% end %>
|
||
<h2>
|
||
<% if request.path == '/' %>
|
||
Need more space? We’ve got you covered.
|
||
<br>
|
||
Upgrading gives you more space, bandwidth, features, <strong>and helps us stay independent and keep the free sites free.</strong>
|
||
<% elsif request.path.match /\/welcome/ %>
|
||
Welcome to Neocities!
|
||
<% else %>
|
||
Support Us
|
||
<% end %>
|
||
</h2>
|
||
|
||
<% if request.path.match /\/plan/ %>
|
||
<div class="row" style="margin-top: 0px">
|
||
<div class="col-75" style="margin-left: auto; margin-right: auto;">
|
||
<h3 class="subtitle">
|
||
The Neocities Supporter Plan is a way to help sustain the site. When you become a supporter, you are directly helping our quest to bring back the creative, independent web, and to continue to improve Neocities for everyone.
|
||
</h3>
|
||
</div>
|
||
</div>
|
||
<% elsif request.path.match /\/welcome/ %>
|
||
<div class="row" style="margin-top: 0px">
|
||
<div class="col-75" style="margin-left: auto; margin-right: auto;">
|
||
<h3 class="subtitle">
|
||
Welcome, and thanks for signing up! We can't wait to see your web site!
|
||
<br>
|
||
Neocities does not put advertising on your site, <strong>and we never will</strong>.
|
||
<br>
|
||
Instead, Neocities is powered by supporters like you. If you'd like to help us out, we'd love your support. Thank you!
|
||
</h3>
|
||
</div>
|
||
</div>
|
||
<% end %>
|
||
|
||
<div class="plan-overview">
|
||
<div class="header">
|
||
<div class="col col-50 personal">
|
||
Free
|
||
</div>
|
||
<div class="col col-50 professional">
|
||
Supporter
|
||
</div>
|
||
</div>
|
||
|
||
<div class="body">
|
||
<div class="col col-25 free">
|
||
<div class="plan-image free">
|
||
</div>
|
||
<h3>Free</h3>
|
||
<div class="price">$<%= Site::PLAN_FEATURES[:free][:price] %></div>
|
||
<div class="interval">per month</div>
|
||
<%== plan_pricing_button :free %>
|
||
<ul>
|
||
<li><strong><%= Site::PLAN_FEATURES[:free][:space].to_space_pretty %></strong> storage</li>
|
||
<li><strong><%= Site::PLAN_FEATURES[:free][:bandwidth].to_space_pretty %></strong> bandwidth</li>
|
||
</ul>
|
||
<ul>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="col col-25 supporter">
|
||
<div class="plan-image" data-original-title="Meow!"></div>
|
||
<h3>Supporter</h3>
|
||
<% if parent_site && parent_site.legacy_supporter? %>
|
||
<div class="price">$<%= Site::LEGACY_SUPPORTER_PRICES[parent_site[:plan_type].to_sym] %></div>
|
||
<div class="interval">per month, billed annually</div>
|
||
<% else %>
|
||
<div class="price">$<%= Site::PLAN_FEATURES[:supporter][:price] %></div>
|
||
<div class="interval">per month</div>
|
||
<% end %>
|
||
|
||
<% if parent_site && parent_site.legacy_supporter? %>
|
||
<div class="current-plan">Current Plan</div>
|
||
<% else %>
|
||
<%== plan_pricing_button :supporter %>
|
||
<% end %>
|
||
<ul>
|
||
<li><strong><%= Site::PLAN_FEATURES[:supporter][:space].to_space_pretty %></strong> storage</li>
|
||
<li><strong><%= Site::PLAN_FEATURES[:supporter][:bandwidth].to_space_pretty %></strong> bandwidth</li>
|
||
</ul>
|
||
<ul>
|
||
<li>Lots of Web Space</li>
|
||
<li>No File Upload Type Restrictions</li>
|
||
<li>Unlimited Site Creation</li>
|
||
<li>Custom Domains (yoursite.com)</li>
|
||
<li>Remote Filesystem Support</li>
|
||
<li>Custom SSL Certs (coming soon!)</li>
|
||
</ul>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <h2><a href="">Compare Plans <i class="fa fa-caret-down"></i></a></h2> -->
|
||
<h2 style="margin-top: 2em">Compare</h2>
|
||
<table class="plan-chart">
|
||
<tr>
|
||
<th class="feature-column"></th>
|
||
<th>
|
||
<h3>Free</h3>
|
||
<p>$<%= Site::PLAN_FEATURES[:free][:price] %>/mo</p>
|
||
<%== plan_pricing_button :free %>
|
||
</th>
|
||
<th class="professional">
|
||
<h3>Supporter</h3>
|
||
<% if parent_site && parent_site.legacy_supporter? %>
|
||
<p>$<%= Site::LEGACY_SUPPORTER_PRICES[parent_site.values[:plan_type].to_sym] %>/mo</p>
|
||
<div class="current-plan">Current Plan</div>
|
||
<% else %>
|
||
<p>$<%= Site::PLAN_FEATURES[:supporter][:price] %>/mo</p>
|
||
<%== plan_pricing_button :supporter %>
|
||
<% end %>
|
||
</th>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="How much disk space you can use for your site. More space means you can upload more files.">Storage</span>
|
||
</td>
|
||
<td><%= Site::PLAN_FEATURES[:free][:space].to_bytes_pretty %></td>
|
||
<td><%= Site::PLAN_FEATURES[:supporter][:space].to_bytes_pretty %></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="How much content you can serve in one month. Don’t worry—these are soft limits. Temporary surges are fine, we won't take your site down automatically, and we're very flexible.">Bandwidth</span>
|
||
</td>
|
||
<td><%= Site::PLAN_FEATURES[:free][:bandwidth].to_bytes_pretty %></td>
|
||
<td>1000 GB</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="We will never put ads on your site, or give your data to marketers. In fact, we’re prohibited from doing it in our own Terms of Service.">No advertising, ever</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Our worldwide network of CDN servers cache your web site regionally, making your site load fast—no matter where your users are. 頑張る, 日本!">Global CDN Site Cache</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Each site comes with a free Neocities address (yoursitename.neocities.org).">Free Site Subdomain</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Downloading your neocities site is as easy as clicking a button.">One-Click Backups</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Site tags make it easy to find sites you’re interested in, and join communities of sites. It’s like a web ring, but even better.">Site Tags</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Each site has its own RSS feed that make it easy to let people know when your site changes.">RSS Feed</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Like a site on Neocities? Now you can follow it, and see when they update!">Follow Your Favorite Sites</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Each site now has its own profile page, allowing users to see when your site updates, follow your site, and leave feedback.">Site Profile</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Our HTML5 site editor makes it easy to make quick changes to your site, even if you’re on the run.">Neocities Site Editor</span>
|
||
</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<!--
|
||
<tr>
|
||
<td class="feature-column">Site Tipping (Coming Soon)</td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
-->
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="You can mount your Neocities site to your computer as a hard drive, making it easy to update with your favorite HTML editor.">WebDAV Uploading</span>
|
||
</td>
|
||
<td></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Add your domain name (yoursite.com) to your site!">Custom Domains</span>
|
||
</td>
|
||
<td></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Make as many sites as you want with one account, and easily switch between them.">Unlimited Site Creation</span>
|
||
</td>
|
||
<td></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="Upload your SSL certificate for your custom domain name, preventing snoops from seeing your user’s traffic.">Custom SSL Certs (soon)</span>
|
||
</td>
|
||
<td></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="feature-column">
|
||
<span data-original-title="No whitelists—you can upload anything you want (no copyrighted content, trojans, or w4r3z, please).">No File Upload Type Restrictions</span>
|
||
</td>
|
||
<td></td>
|
||
<td><i class="fa fa-check"></i></td>
|
||
</tr>
|
||
</table>
|
||
|
||
<% if request.path.match /\/plan/ %>
|
||
<div class="row" style="margin-top: 50px; margin-bottom: 0px;">
|
||
<div class="col-50" style="margin-left: auto; margin-right: auto">
|
||
<h2>Why become a Supporter?</h2>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-60" style="margin-left: auto; margin-right: auto">
|
||
<ul>
|
||
<li>
|
||
<strong>You get more space!</strong> Right now supporter plans get up to <strong><%= Site::PLAN_FEATURES[:supporter][:space].to_space_pretty %></strong>.
|
||
</li>
|
||
<li>
|
||
<strong>It helps your site.</strong> Funding helps us make your site faster globally, and provide more features.
|
||
</li>
|
||
<li>
|
||
<strong>It helps us build.</strong> It supports our goal to work on Neocities full-time, without worrying about bills.
|
||
</li>
|
||
<li>
|
||
<strong>It helps the web.</strong> The web needs more independent, creative sites.
|
||
</li>
|
||
<li>
|
||
<strong>It's Open Source.</strong> Neocities is an <a href="http://www.opencompany.org">Open Company</a>, our site is <a href="https://github.com/neocities">completely open source</a>, and we share code with the community.
|
||
</li>
|
||
<li>
|
||
<strong>No lock-in.</strong> Redirecting your site is easy, free site downloads, and support for custom domains.
|
||
</li>
|
||
<li><strong>No ads, ever.</strong> We'll never put ads or watermarks on sites, and we don't sell user data.</li>
|
||
<li>
|
||
<strong>It's safe.</strong> We use <a href="https://stripe.com" target="_blank">Stripe</a> for payments, and never store your credit card information directly.
|
||
</li>
|
||
<li>
|
||
<strong>It's affordable.</strong> As low as <strong>$<%= Site::PLAN_FEATURES[:supporter][:price] %>/month</strong> (billed once every year). Higher tiers are optional (and appreciated!)
|
||
</li>
|
||
<li>
|
||
<strong>You can cancel or change plans anytime.</strong> If you do, we'll refund or credit the amount you didn't use.
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<% end %>
|
||
</section>
|
||
|
||
<script>
|
||
$(function() {
|
||
$('.feature-column span').tooltip({
|
||
placement: 'right'
|
||
})
|
||
|
||
$('.plan-image').tooltip({
|
||
placement: 'top'
|
||
})
|
||
})
|
||
|
||
$(".planPricingButton").on('click', function(obj) {
|
||
$('#upgradePlanType').val($(obj.target).attr('data-plan_type'))
|
||
$('#upgradeFormPlanName').text($(obj.target).attr('data-plan_name'))
|
||
$('#upgradeFormPlanPrice').text($(obj.target).attr('data-plan_price'))
|
||
$('#planSignup').modal()
|
||
})
|
||
</script>
|
||
|
||
<div class="modal hide fade" id="planSignup" tabindex="-1" role="dialog" aria-labelledby="planSignupLabel" aria-hidden="true">
|
||
<form id="upgradeForm" method="POST" action="/plan/update">
|
||
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
|
||
<input type="hidden" value="" name="plan_type" id="upgradePlanType">
|
||
<div class="modal-header">
|
||
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
|
||
<h3 id="planSignupLabel">
|
||
<% if parent_site && parent_site.plan_type == 'free' %>
|
||
Upgrade
|
||
<% else %>
|
||
Change
|
||
<% end %>
|
||
</h3>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div>
|
||
You are <% if current_site && parent_site.plan_type == 'free' %>upgrading<%else%>changing<%end%> to the <strong><span id="upgradeFormPlanName"></span> Plan</strong>. You will be charged <span id="upgradeFormPlanPrice"></span>. <% if current_site && parent_site.plan_type != 'free' %>We'll credit or refund the remaining amount you didn't use on your previous plan.<% end %>
|
||
<% unless current_site && parent_site.stripe_customer_id %>
|
||
Please enter your Credit Card number:
|
||
<% end %>
|
||
</div>
|
||
|
||
<input id="stripe_token" name="stripe_token" type="hidden" value="<%= params[:stripe_token] %>">
|
||
|
||
<div style="margin-top: 30px">
|
||
<div id="plan_error" class="alert alert-block alert-error" style="display:none"></div>
|
||
|
||
<% unless params[:stripe_token] || (current_site && parent_site.stripe_customer_id) %>
|
||
<div class="credit-card-input no-js" id="skeuocard" style="margin-left: auto; margin-right: auto; margin-bottom: 20px">
|
||
<p class="no-support-warning"></p>
|
||
<label for="cc_type">Card Type</label>
|
||
<select name="cc_type">
|
||
<option value="">...</option>
|
||
<option value="visa">Visa</option>
|
||
<option value="discover">Discover</option>
|
||
<option value="mastercard">MasterCard</option>
|
||
<option value="maestro">Maestro</option>
|
||
<option value="jcb">JCB</option>
|
||
<option value="unionpay">China UnionPay</option>
|
||
<option value="amex">American Express</option>
|
||
<option value="dinersclubintl">Diners Club</option>
|
||
</select>
|
||
<label for="cc_number">Card Number</label>
|
||
<input type="text" name="cc_number" id="cc_number" placeholder="XXXX XXXX XXXX XXXX" maxlength="19" size="19">
|
||
<label for="cc_exp_month">Expiration Month</label>
|
||
<input type="text" name="cc_exp_month" id="cc_exp_month" placeholder="00">
|
||
<label for="cc_exp_year">Expiration Year</label>
|
||
<input type="text" name="cc_exp_year" id="cc_exp_year" placeholder="00">
|
||
<label for="cc_name">Cardholder's Name</label>
|
||
<input type="text" name="cc_name" id="cc_name" placeholder="John Doe">
|
||
<label for="cc_cvc">Card Validation Code</label>
|
||
<input type="text" name="cc_cvc" id="cc_cvc" placeholder="123" maxlength="3" size="3">
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
|
||
<% unless params[:stripe_token] || (current_site && parent_site.stripe_customer_id) %>
|
||
<p>
|
||
<strong>Don't have a Credit/Debit Card?</strong> We support Bitcoin and Paypal! <a href="/plan/alternate">Click here</a> for more information.
|
||
</p>
|
||
<% end %>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
|
||
<button type="submit" class="btn-Action">Upgrade</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<% if current_site %>
|
||
<%== erb :'plan/_signupcode', layout: false %>
|
||
<% end %>
|