<%- # License: AGPL-3.0-or-later WITH WTO-AP-3.0-or-later
# Full license explanation at https://github.com/houdiniproject/houdini/blob/master/LICENSE -%>
<%= content_for(:title_prefix) { "#{@campaign.name} - #{@campaign.nonprofit.name} | ".html_safe } %>
<% content_for(:fixed_position_cta_hidden) {'hidden'} %>
<%= content_for(:meta_description) {@campaign.summary} %>
<% @brand_color = @nonprofit.brand_color ? @nonprofit.brand_color : nil %>

<%= content_for :javascripts do %>
	<script>
		app.campaign_id = <%= @campaign.id %>
    app.campaign = <%= raw(@campaign.to_json) %>
		app.header_image_url = '<%= @campaign_background_image %>'
    app.campaign_end_datetime = '<%= @campaign.end_datetime %>'
		app.timezone = '<%= @timezone %>'
    app.end_date_time = app.campaign_end_datetime
    app.hide_activities = <%= @campaign.hide_activity_feed %>
		app.days_remaining = '<%= @campaign.days_left %>'
		app.recurring_fund = <%= @campaign.recurring_fund? %>
    app.vimeo_id = "<%= @campaign.vimeo_video_id ? @campaign.vimeo_video_id : '' %>"
    app.current_campaign_editor = <%= current_campaign_editor? %>
    app.is_parent_campaign = <%= @campaign.parent_campaign? %>
		appl.def('has_video', <%= @campaign.video_url.present? %>)
    appl.def('campaign_is_deleted', <%= @campaign.deleted || false %>)
    appl.def('has_main_image', <%= @campaign.main_image.attached? %>)
  </script>

  <%= render 'schema', campaign: @campaign, url: @url %>
  <%= render 'common/froala' if current_campaign_editor? %>
<%= javascript_pack_tag 'i18n', 'page__campaigns' %>
<% end %>

<%= content_for :stylesheets do %>
	<%= stylesheet_link_tag 'campaigns/show/page' %>
	<%= stylesheet_link_tag 'campaigns/edit/page' %>
  <style>
    .ios-force-absolute-positioning {
      position: absolute !important;
    }
  </style>
<% end %>

<% content_for :head do %>
	<link rel="canonical" href='<%= @url %>' />
<% end %>

<%= content_for :facebook_tags do %>
	<meta property="og:title" content="<%= raw @campaign.name %>">
	<meta property="og:description" content="<%= @campaign.summary.present? ? raw(@campaign.summary) : raw(@campaign.name) %>">
	<meta property="og:image" content="<%= @campaign.main_image.attached? ? @campaign.main_image_by_size(:normal) : "" %>">
<% end %>

<%= content_for :twitter_tags do %>
	<meta property="twitter:title" content="<%= raw @campaign.name %>">
	<meta property="twitter:description" content="<%= raw @campaign.summary %>">
	<meta property="twitter:image" content="<%= @campaign.main_image.attached? ? @campaign.main_image_by_size(:normal) : "" %>">
<% end %>

<% if current_campaign_editor? %>
  <%= render 'admin_top_nav' %>
<% end %>

<%= render 'components/fundraising_pages/header',
	image_url: @campaign_background_image,
	is_editor: current_campaign_editor?,
	hide_title:  @campaign.hide_title && @campaign_background_image,
	header_content_partial: 'header_content',
  banner_image_url: @campaign.banner_image&.url %>

<%= render 'components/preview_mode_notification' %>

<div class="container u-marginTop--15 <%=  @brand_color ? 'is-branded' : '' %>" data-id='<%= @campaign.id %>'>

  <section class='box'>
		<%= render 'campaign_media' %>
	</section>

	<section class='box-r'>

    <% if current_campaign_editor? && !@campaign.child_campaign? %>
      <!-- Campaign editor gift option management modal -->
      <button class='button edit u-width--full u-marginBottom--15'>
        <!--= on 'click' (open_modal 'manageGiftOptionsModal') -->
        <i class='fa fa-gift'></i> Manage Gift Options
      </button>
    <% end %>

    <% if !@campaign.child_campaign? %>
      <aside class='u-marginBottom--15 pastelBox--grey'>
        <a class='button u-width--full' target='_blank' if-branded='background-color, dark' href='<%= @campaign.finished? ? "/peer-to-peer?npo_id=#{@nonprofit.id}" : "/peer-to-peer?campaign_id=#{ @peer_to_peer_campaign_param}" %>'>
          Start Your Own Campaign for <%= @nonprofit.name %>
        </a>
      </aside>
    <% end %>

    <!-- flimflam gift options javascript gets rendered into this div: -->
    <div class='ff-sidebar'></div>

		<aside class='u-marginTop--15 pastelBox--grey'>
			<header>Promote This Campaign</header>
			<div class='pastelBox-body'>
				<%= render 'common/social_buttons' %>
			</div>
		</aside>

	</section>

  <% if @campaign.child_campaign? %>
    <%= render 'components/fundraising_pages/campaigner_profile',
        profile: @campaign.profile,
        campaign_name: @campaign.name,
        reason_for_supporting: @campaign.reason_for_supporting
     %>

    <section class='box u-centered' style="margin-top:20px; margin-bottom:20px;">
      <a class='button--jumbo' target='_blank' if-branded='background-color, dark' href='/peer-to-peer?campaign_id=<%= @peer_to_peer_campaign_param %>'>
        Start Your Own Campaign for <%= @nonprofit.name %>
      </a>
    </section>
  <% end %>

	<section class='box'>

		<div id='js-campaignBody' class='editable' data-path='/nonprofits/<%= @nonprofit.id %>/campaigns/<%= @campaign.id %>.json' data-key='campaign[body]'>
			<%= raw @campaign.body %>
		</div>

		<% unless @campaign.hide_activity_feed %>
			<div class='u-marginTop--15 showWhenMobile'>
				<%= render 'components/activity_feed' %>
			</div>
		<% end %>
	</section>
</div>


<% if current_campaign_editor? %>
	<%= render 'settings_modal' %>
	<%= render 'video_modal' %>
	<%= render 'donations/campaign_new_offline_modal' %>
	<%= render 'campaign_gift_options/manage_modal'%>
	<%= render 'campaign_gift_options/form_modal'%>
	<%= render 'components/upload_background_image',
		end_point: "/nonprofits/#{@nonprofit.id}/campaigns/#{@campaign.id}",
		image_url: @campaign_background_image,
		input_name: 'campaign[background_image]' %>
  <%= render 'components/upload_banner_image',
    end_point: "/nonprofits/#{@nonprofit.id}/campaigns/#{@campaign.id}",
		image_url: @campaign.banner_image_url,
		input_name: 'campaign[banner_image]' %>
  <%= render 'components/custom_receipt_modal',
    title: 'Campaign Receipt Message',
    type: 'campaign',
    path: nonprofit_campaign_path(@nonprofit, @campaign),
    key: 'campaign[receipt_message]',
    text: @campaign.receipt_message %>
  <%= render 'components/duplicate_fundraiser_modal', type: 'campaign' %>
<% end %>

<%= render 'components/share_modal', name: @campaign.name, type: 'campaign' %>
<%= render 'common/email_share_modal', fundraiser: @campaign.name, fundraiser_url: @url  %>