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

{% block body %}
	{% if loggedin() == false %}
        {% if isMobilePhoneOnly() %}
            {% set images = slider_images_mobile %}
        {% else %}
            {% set images = slider_images %}
        {% endif %}

        {% include 'includes/snippets/hero.slider.html.twig' with {
            images : images
        } %}
	{% else %}
        {% include 'includes/dashboard.html.twig' %}

        <a id="inviteFriendsLink" class="invite-ribbon" data-toggle="modal" onclick="inviteFriendsText(0)" data-target="#inviteFriendsForm">
            <i class="fa fa-group"></i>
            <p>{{ "INVITE_FRIENDS"|translate }}</p>
        </a>
	{% endif %}

        <div class="col-md-12 col-sm-12 col-xs-12 p0 clearfix">

            <div id="campaign-overview" class="container">
                <h1 class="col-md-12 text-center">{{ readFunnel(texts[homePageItems.CHECK_POPPING], 1) }}</h1>
                {% include 'includes/modules/new.campaigns.html.twig' with {
                    campaigns : newCampaigns,
                    widthcol : 'col-md-6 col-sm-12 col-xs-12'
                } %}
                {% include 'includes/modules/live.campaigns.html.twig' with {
                    campaigns : liveCampaigns
                } %}
                {% include 'includes/modules/previous.campaigns.html.twig' with {
                    campaigns : previousCampaigns,
                    widthcol : 'col-md-3 col-sm-6 col-xs-12'
                } %}

                <div class="col-md-3 col-sm-6 col-xs-12">
                    <a href="/{{ regGet('locale') }}/campaigns/overview/" class="more-campaigns">
                        <span>{{ "MORE_CAMPAIGNS"|translate|raw }}</span>
                    </a>
                </div>
            </div>
        </div>

        <div class="clearfix">
            <div id="insiderstalk" class="pb30">
                <div class="container">
                    <h1 class="col-md-12 text-center white">{{ readFunnel(texts[homePageItems.JOIN_CONVERSATION], 1) }}</h1>
                    {% for article in articles %}
                    {% set urlName = readFunnel(article,1)|safeString %}
                    {% set blogText = pregReplace('(<img.*?>)', '',readFunnel(article, 3))%}
                    <div class="col-md-6 col-sm-6 col-xs-12">
                        <div class="content">
                            <div class="col-md-12 p0">
                                {% if readFunnel(article,7) is not empty %}
                                    <div class="col-md-12 p0 blogimage lazy-background"
                                         data-src="{{ regGet('imgpath') }}{{ readFunnel(article,7) }}">
                                    </div>
                                {% elseif readFunnel(article,4) is not empty %}
                                    <div class="col-md-12 p0 blogimage lazy-background"
                                         data-src="{{ regGet('imgpath') }}{{ readFunnel(article,4) }}">
                                    </div>
                                {% endif %}
                                <div class="blogtext pl15 pr15">
                                    <h1>{{ readFunnel(article,1) }}</h1>
                                    {{ shortenText(blogText)|replace({'{{': '', '}}': ''})|raw }}
                                </div>

                                <div>
                                    <a class="btn btn-primary yellow col-md-6 col-xs-6" type="submit"
                                       href="/{{ regGet('locale') }}/info/message/{{ article.item_id }}/{{ urlName }}.htm">
                                        <i class="fa fa-angle-right"></i>
                                        {{ "READMORE"|translate }}
                                    </a>
                                    <a class="btn btn-primary yellow col-md-6 col-xs-6" type="submit"
                                       href="/{{ regGet('locale') }}/info/message/{{ article.item_id }}/{{ urlName }}.htm">
                                        <i class="fa fa-comments"></i>
                                        {{ "COMMENT"|translate }}
                                    </a>
                                </div>
                            </div>

                        </div>
                    </div>
                    {% endfor %}
                </div>
            </div>
        </div>

        <div class="col-md-12 col-xs-12 clearfix">
            <div id="clients" class="container">
                <h1 class="col-md-12 text-center">{{ readFunnel(texts[homePageItems.INSIDERS_PARTNERS], 1) }}</h1>
                {{ readFunnel(texts[homePageItems.INSIDERS_PARTNERS], 3)|raw }}
                <div class="col-md-12">

                    {% for logo in client_logos %}
                    <div class="col-md-2 col-sm-2 col-xs-6 text-center">
                        <img src="{{ regGet('imgpath') }}{{ readFunnel(logo, 4) }}" height="85" width="105" alt="{{ readFunnel(logo, 4) }}">
                    </div>
                    {% endfor %}
                </div>
            </div>
        </div>

        <div class="clearfix">
            <div id="insiders" class="pb30">
                <div class="container">
                    <h1 class="col-md-12 text-center white">{{ readFunnel(texts[homePageItems.SNAPSHOT], 1) }}</h1>
                    {% include 'includes/modules/testimonials/testimonial.slider.html.twig' with {
                        experiences : experiences
                    } %}
                </div>
            </div>
        </div>

        <div class="connect clearfix">
            <div class="container col-md-12">
                <h1 class="col-md-12 text-center">{{ readFunnel(texts[homePageItems.CONNECT_US], 1) }}</h1>
                {{ readFunnel(texts[homePageItems.CONNECT_US], 3)|raw }}
                {% include 'includes/snippets/social.html.twig' %}
            </div>
        </div>

{% endblock %}

{% block readyStateFunction %}
var tablinks = document.getElementsByClassName("lazy-background");
for (i = 0; i < tablinks.length; i++) {
    var lazy = tablinks[i];
    var src = lazy.dataset.src;
    lazy.style.backgroundImage =  'url("'+src+'")';
}
initSurveyFormUploaders();
$('#circle').circleProgress({
    value: '{{ profile.percentage / 100 }}',
    startAngle: Math.PI * 1.5,
    thickness: 18,
    size: 150,
    fill: {
        color: "#68c8c6"
    },
    emptyFill: '#E2F0F3',
    animation: {
        duration: 2000
    }
}).on('circle-animation-progress', function(event, progress, stepValue) {
    $(this).parent().find('#circle-progress').html(parseInt(100*(stepValue.toFixed(2)))+ '<i>%</i>');
});
/* http://sachinchoolur.github.io/lightslider/ for documentation on configuration */
$("#heroSlider").lightSlider(
    {
        item: 1,
        speed: 1000,
        pause: 5000,
        loop:true,
        auto: true,
        controls: false
    }
);
/* http://sachinchoolur.github.io/lightslider/ for documentation on configuration*/
$("#lightSlider").lightSlider(
    {
        item: 2,
        speed: 1000,
        pause: 5000,
        loop:true,
        auto: true,
        controls: false,
        responsive: [{
            breakpoint : 959,
            settings: {
                item: 2,
                slideMove: 1,
                sliderWidth: 300
            }
        }, {
            breakpoint: 480,
            settings: {
                item: 1,
                slideMove: 1,
                sliderWidth: 375
            }
        }]
    }
);
{% endblock readyStateFunction %}