{% extends '::base.html.twig' %}
{% block title %}{{ parent() }} - Connect Account{% endblock %}
{% block body %}
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h3 class="panel-title">{{ 'header.connecting' | trans({}, 'HWIOAuthBundle')}}</h3>
                    </div>
                    <div class="panel-body">
                        <p>{{ 'connect.confirm.text' | trans({
                                '%service%': externalAccountProviderManager.getProviderByName('oauth_'~service).serviceName,
                                '%name%': userInformation.realName
                            }, 'HWIOAuthBundle') }}</p>
                        <p>
                            {{ form_start(form, {'action': path('hwi_oauth_connect_service', {'service': service, 'key': key})}) }}
                            {{ form_widget(form) }}
                        <div>
                            <button type="submit" class="btn btn-primary">{{ 'connect.confirm.submit' | trans({}, 'HWIOAuthBundle') }}</button>
                            <a href="{{ path('user_profile') }}" class="btn btn-link">{{ 'connect.confirm.cancel' | trans({}, 'HWIOAuthBundle') }}</a>
                        </div>
                        {{ form_end(form) }}
                        </p>
                    </div>
                    {% if userInformation.profilePicture is defined and userInformation.profilePicture is not empty %}
                    <div class="panel-body">
                        <img src="{{ userInformation.profilePicture }}" style="width: 100%" />
                    </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
{% endblock %}