houdini/app/views/campaigns/peer_to_peer.html.erb

160 lines
5.6 KiB
Text
Raw Normal View History

<%- # License: AGPL-3.0-or-later WITH Web-Template-Output-Additional-Permission-3.0-or-later -%>
<% content_for :head do %>
<meta name="viewport" content="width=device-width, user-scalable=no">
<% end %>
<% content_for :stylesheets do %>
<%= stylesheet_link_tag 'campaigns/peer_to_peer/page' %>
<% end %>
<% content_for :javascripts do %>
<script>
2018-05-30 19:58:41 +00:00
<% if @nonprofit %>
appl.def('selected_result', {
2018-05-30 19:58:41 +00:00
name: '<%= @nonprofit.name.html_safe %>',
id: <%= @nonprofit.id %>,
modal_id: 'newCampaign'
})
2018-05-30 19:58:41 +00:00
app.nonprofit_id = <%= @nonprofit.id %>
<% elsif @parent_campaign %>
appl.def('selected_result', {
2018-05-30 19:58:41 +00:00
name: '<%= @parent_campaign.nonprofit.name.html_safe %>',
parent_campaign_id: <%= @parent_campaign.id %>,
campaign_name: '<%= @parent_campaign.name %>',
modal_id: 'newPeerToPeerCampaign'
})
2018-05-30 19:58:41 +00:00
app.nonprofit_id = <%= @parent_campaign.nonprofit.id %>
<% end %>
<% if current_user %>
appl.def('is_logged_in', true)
appl.def('is_confirmed', <%= !current_user.confirmed_at.nil? %>)
appl.def('user', {
2018-05-30 19:58:41 +00:00
name: '<%= current_user.profile.name || current_user.email %>',
id: <%= current_user.id %>
})
<% end %>
</script>
<%= IncludeAsset.js '/client/js/campaigns/peer_to_peer/page.js' %>
<% end %>
2018-05-30 19:58:41 +00:00
<% if @parent_campaign.banner_image_url %>
<div class='campaign-banner u-margin'>
<img src='<%= @parent_campaign.banner_image_url %>'>
</div>
<% end %>
<main>
<header class='u-paddingX--15 container'>
<h1>Start my campaign</h1>
</header>
<hr>
<div class='container u-paddingRight--10'>
<table><tr>
<td class='u-padding--15'>
<i class='icon icon-bicycle u-fontSize--50'></i>
</td>
<td>
<h5 class='u-paddingLeft--20'>Below is a roadmap to get you started with your campaign</h5>
</td>
</tr></table>
<ul class='u-paddingLeft--10 timeline--checklist'>
2018-05-30 19:58:41 +00:00
<% if @parent_campaign.present? %>
<li>
<!--= set_attr_if selected_result 'class' 'is-complete' -->
<span class='annot'>10 seconds</span>
<p class='strong u-marginBottom--15'>My campaign</p>
<div class='u-paddingLeft--20 u-maxWidth--500'>
2018-05-30 19:58:41 +00:00
<h4><%= @parent_campaign.name %></h4>
<p>See our other <%= link_to 'active campaigns', @parent_campaign.nonprofit.url || @nonprofit.url %>.</p>
</div>
</li>
<% else %>
<li>
<!--= set_attr_if selected_result 'class' 'is-complete' -->
<span class='annot'>10 seconds</span>
<p class='strong u-marginBottom--15'>Search for a nonprofit that you want to fundraise for</p>
<div class='u-paddingLeft--20 u-maxWidth--500'>
<%= render 'search_for_npo' %>
</div>
</li>
<% end %>
<li>
<!--= set_attr_if is_logged_in 'class' 'is-complete' -->
<span class='annot'>1 minute</span>
<p class='strong u-marginBottom--15'>Sign Up or Login</p>
<div class='u-paddingLeft--20 u-maxWidth--500'>
<div>
<!--= hide_if is_logged_in -->
<%= render 'components/forms/sign_up_or_login_tabs' %>
</div>
<p class='pastelBox--green u-padding--5'>
<!--= show_if is_logged_in -->
<strong><!--= put user.name --></strong>, you're logged in.
</p>
</div>
</li>
<li>
<!--= set_attr_if is_confirmed 'class' 'is-complete' -->
<span class='annot'>1 minute</span>
<p class='strong u-marginBottom--15'>Confirm your account</p>
<div class='u-paddingLeft--20 u-maxWidth--500'>
<p>
<!--= hide_if is_confirmed -->
Simply click the confirmation link in the email we sent you when you created your <%= Settings.general.name %> account.
</p>
<p class='pastelBox--green u-padding--5'>
<!--= show_if is_confirmed -->
<strong><!--= put user.name --></strong>, you're confirmed.
</p>
</div>
</li>
<li>
<% if !@child_campaign %>
<p class='strong u-marginBottom--15'>Start your campaign</p>
<span class='annot'>5 minutes</span>
<div class='u-paddingLeft--20 u-maxWidth--500'>
<p>Use our simple wizard to create your campaign for
<strong>
<!--= show_if selected_result -->
<!--= put selected_result.name -->.
</strong>
<strong>
<!--= hide_if selected_result -->
your favorite nonprofit.
</strong>
</p>
<p><small>If you need any further help setting up your campaign, check out <a target='_blank' href='/help/peer-to-peer-campaigns-essentials-package-feature'>this handy article</a>.</small></p>
<div class='u-centered u-padding--15'>
<button class='button orange'>
<!--= show_if (all is_logged_in is_confirmed selected_result) -->
<!--= on 'click' (open_modal selected_result.modal_id) -->
Start Campaign
</button>
</div>
</div>
<% else %>
<p>
Seems like you already have a campaign for that cause! <%= link_to "Click here to see it", @child_campaign.url %>.
</p>
<% end %>
</li>
</ul>
</div>
</main>
<% if current_user %>
2018-05-30 19:58:41 +00:00
<% if @nonprofit.present? %>
<%= render 'campaigns/new_modal' %>
2018-05-30 19:58:41 +00:00
<% elsif @parent_campaign.present? %>
<%= render 'campaigns/new_peer_to_peer_modal' %>
<% end %>
<% end %>