{% extends 'base.html.twig' %}

{% block wrapperClass %}campaignpage info{% endblock %}
{% block wrapperStyle %}
	{% if data.brandhub.brandhubCampaign != true %}
		{{ caCustomBg(data.pdata.data) }}
	{% endif %}
{% endblock %}

{% block brandhubWrapper %}
	{% if data.brandhub.brandhubCampaign %}
		{% include 'includes/brandhubview.html.twig' with {
		data : data
		} %}
	{% endif %}
{% endblock brandhubWrapper %}

{% block body %}
	{% if data.agepopup.html %}
		{{ data.agepopup.html|raw }}
	{% endif %}
	<div class="container clearfix navpadding{% if data.blogitem is defined %} blog{% endif %}">

		{{ renderTwigBlock('includes/campaigns/campaign.submenu',{ 'campaignData' : data}) }}

		<div class="col-md-12 col-sm-12 col-xs-12 p0">
			<div class="col-md-9 col-sm-12 col-xs-12">
				<div class="content col-md-12 col-sm-12 col-xs-12 p0">
					<div class="intro col-md-12 pt10 pb15 text-center clearfix">
						{% set intro = readFunnel(data.model, 35) %}
						{% if data.live and readFunnel(data.model, 48) is not empty %}
							{% set intro = readFunnel(data.model, 48) %}
						{% endif %}
						<div class="text-left mb20">{{ intro|raw }}</div>
						{{ renderTwigBlock('includes/campaigns/campaign.entrysurvey') }}
					</div>


					{% if data.show_steps %}
						{% include 'includes/snippets/campaign_steps.html.twig' with {
						data : data
						} %}
					{% endif %}

					{% if data.live %}
						{% include 'includes/snippets/campaign.info.live.html.twig' with {
						data : data.model
						} %}
					{% else %}
						{% include 'includes/snippets/campaign.info.pre.html.twig' with {
						data : data.model
						} %}
					{% endif %}

					<!--Info to help you further-->
					<div class="col-md-12 col-xs-12 pl0 mt30 mb20 clearfix">
						<div class="col-md-4 col-sm-3 info-image mb20 mr20 clearfix"
							 style="background-image:url('{{ regGet('imgpath') }}{{ readFunnel(data.model, 29)|raw }}')"></div>
						<div class="col-md-8 col-sm-8">
							<h2 class="mt0">{{ readFunnel(data.model, 27)|raw }}</h2>

							<div>{{ readFunnel(data.model, 28)|raw }}</div>
						</div>
					</div>
					{% if readFunnel(data.model, 54)|raw is not empty %}
						<div class="col-md-12 mt30 mb20 clearfix">
							<div class="col-md-12 col-sm-12 p0">
								<div class="text-center extra-img">{{ readFunnel(data.model, 54)|raw }}</div>
							</div>
						</div>
					{% endif %}

					{% if data.blogitem is defined and data.general.campaign_type != '14' %}
						{% include 'includes/snippets/blogreaction.html.twig' with {
							blogitem : data.blogitem,
							totalItems : data.aantalReactions,
							creationCat : data.blogcreationCat,
							reactionsOn : data.useblog,
							campaignId : data.pdata.general.item_id
						} %}
					{% endif %}
				</div>
			</div>

			{{ renderTwigBlock('includes/campaigns/campaign.sidebar', {'shareUrl' : buildCanonical()}) }}

		</div>
	</div>
{% endblock %}
{% block assetsBottom %}
	{{ parent() }}

	<script type="text/javascript">
		function agepop(t) {
			$.ajax({
				url: '{{ regGet('url') }}ajax/postdata/',
				method: 'POST',
				data: {
					actie: 'agepopup'
				},
				success: function (data) {
					//console.log(data);
					if (data.success) {
						$('#agePopupModal').modal('hide');
					}
				},
				dataType: 'json'
			});
		}
	</script>
	{% if data.blogitem is defined %}
		<script type="text/javascript">
			var callback = function (data, t, page) {

			};

			function showBlogRequest(formData, jqForm, options) {

			}
			function showBlogResponse(responseText, statusText) {

				var target = $('#output_' + responseText.target);
				var itemTarget = $('#output_' + responseText.item);

				if (responseText.target && target.length > 0) {
					var reactionButtonTarget = $("#reactieknop_" + responseText.target);
					if (responseText.status === 1) {
						target.removeClass().addClass('alert alert-success');
						setTimeout(location.reload.bind(location), 1500);
					} else {
						target.removeClass().addClass('alert alert-danger');
						reactionButtonTarget.show(1000);
					}
					target.html(responseText.message);
				} else if (responseText.item && itemTarget.length > 0) {
					var reactionButtonItem = $("#reactieknop");
					if (responseText.status === 1) {
						itemTarget.removeClass().addClass('alert alert-success');
						setTimeout(location.reload.bind(location), 1500);
					} else {
						itemTarget.removeClass().addClass('alert alert-danger');
						reactionButtonItem.show(2000);
					}
					itemTarget.html(responseText.message);
				}
			}
		</script>
	{% endif %}

    {% if data.qrp.tenping is defined %}
        {{ data.qrp.tenping|raw }}
    {% endif %}
{% endblock %}
{% block readyStateFunction %}
	loadJS('{{ regGet('general_jspath') }}ckeditor_new/ckeditor.js?rand={{ random() }}',function() {
	{% if data.blogitem is defined %}
		loadJS('{{ regGet('jspath') }}blog.js',function() {
			setTimeout(initCks, 1000);
			setTimeout(function() {
					$('.loadingmore').trigger('click');
					initAjaxForms('reactieform');
			}, 1000);
		});
	{% else %}
		void(0);
	{% endif %}
	})

	$('#agePopupModal').modal({
		keyboard: false,
		backdrop: 'static'
	}).modal('show')
{% endblock readyStateFunction %}