<div class="card card-primary h-100">
    <!-- Default panel contents -->
    <div class="card-header">
        <h5 class="card-title">{{ gT("Share survey") }}</h5>
    </div>
    <!-- List group -->
    <ul class="list-group list-group-flush">
        <!-- Base language -->
        <li class="list-group-item p-0 border-0" id="adminsidepanel__surveysummary--mainLanguageLink">
            <div class="ls-flex-row col-12">
                <div class="col-4 card-label">
                    {{ getLanguageNameFromCode(oSurvey.language, false)}} ({{ gT("Base language") }}):
                </div>
                <div class="col-8 ls-card-grid__description">
                    {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                        {% set tmp_url = surveyUrls[oSurvey.language] %}
                    {% endif %}
                    <a href='{{tmp_url}}' target='_blank'> {{tmp_url}} </a>
                </div>
            </div>
        </li>
        <!-- Additional languages  -->
        {% for langname in aAdditionalLanguages %}
        <li class="list-group-item p-0 border-0">
            <div class="ls-flex-row col-12">
               <div class="col-4 card-label">
                    {{ getLanguageNameFromCode(langname, false) ~ ":" }}
                </div>
                <div class="col-8 ls-card-grid__description">
                    {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                        {% set tmp_url = surveyUrls[langname] %}
                    {% endif %}
                    <a href='{{tmp_url}}' target='_blank'> {{tmp_url}} </a>
                </div>
            </div>
        </li>
        {% endfor %}

        <!-- End URL -->
        <li class="list-group-item p-0 border-0">
            <div class="ls-flex-row col-12">
               <div class="col-4 card-label">
                    {{ gT("End URL:") }}
                </div>
                <div class="col-8 ls-card-grid__description">
                        {{endurl}}
                </div>
            </div>
        </li>
        <!-- Number of questions/groups -->
        <li class="list-group-item p-0 border-0">
            <div class="ls-flex-row col-12">
               <div class="col-4 card-label">
                    {{ gT("Number of questions/groups:") }}
                </div>
                <div class="col-8 ls-card-grid__description">
                    {{ sumcount3 ~ "/" ~ sumcount2 }}
                </div>
            </div>
        </li>
        <!-- Sharing panel -->
        <li class="list-group-item p-0 border-0">
            <div class="ls-flex-row col-12" style="align-items:center">
                <div class="col-4 card-label">
                    {{ gT("Sharing panel:") }}
                </div>
                <div class="col-8 ls-card-grid__description">
                   <div class='selector_openSharePanel'  data-bs-toggle="tooltip" data-bs-placement="top" title="{{ oSurvey.active == 'Y' ? '' : gT('Activate your survey to open this panel') }}">
                        <a href="#sharingdialog" class="btn btn-outline-secondary {{ oSurvey.active == 'Y' ? '' : 'disabled' }}" data-bs-toggle="modal"
                        id="sharePanelButton_{{ oSurvey.sid }}" data-surveyid="{{ oSurvey.sid }}">
                            {{ gT("Open sharing panel") }}
                        </a>
                    </div>
                </div>
            </div>
        </li>
        <!-- Access mode -->
        <li class="list-group-item p-0 border-0" >
            <div class="ls-flex-row col-12" style="align-items:center; margin-top:6px">
                <div class="col-4 card-label">
                    {{ gT("Access mode:") }}
                </div>
                <div class="col-8 ls-card-grid__description"  style="align-content:center">
                    {% set accessModeIcon = accessMode == 'O' ? "ri-global-line" : "ri-lock-2-line" %}
                    {% set accessModeText = accessMode == 'O' ? gT("Anyone with link") : gT("Link with access code") %}
                    <div class="dropdown">
                        <button class="btn btn-outline-secondary dropdown-toggle" type="button" id="access-mode-dropdown" data-bs-toggle="dropdown" aria-expanded="false" {{ oSurvey.active == 'Y' ? '' : 'disabled' }}>
                            <i class="{{ accessModeIcon }}"></i> {{ accessModeText }}
                        </button>
                         <ul class="dropdown-menu" aria-labelledby="access-mode-dropdown">
                            <li><a data-surveyid="{{ oSurvey.sid }}" data-newaccessmode="O" class="dropdown-item updateAccessModeBtn" href="#"><i class="ri-global-line"></i> {{ gT("Anyone with link") }}</a></li>
                            <li><a data-surveyid="{{ oSurvey.sid }}" data-newaccessmode="C" class="dropdown-item updateAccessModeBtn" href="#"><i class="ri-lock-2-line"></i> {{ gT("Link with access code") }}</a></li>
                        </ul>
                    </div>
                </div>
        </li>
    </ul>
</div>

{% if oSurvey.active == 'Y' %}
    <div class="modal fade" tabindex="-1" role="dialog" id="sharingdialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ gT("Share survey") }}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="card card-primary h-100 mb-3 p-4">
                        <div class="card-header">
                            <h5 class="card-title">{{ gT("Share QR-code:") }}</h5>
                        </div>
                        <div class="card-body border rounded">
                            <ul class="list-group list-group-flush">
                                {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                        {% set tmp_url = surveyUrls[oSurvey.language] %}
                                {% endif %}
                                 <li class="list-group-item p-0 border-0 mb-2">
                                    <div class="ls-flex-row col-12 align-items-center">
                                        <div class="col-4">
                                            {{ getLanguageNameFromCode(oSurvey.language, false)}}
                                        </div>
                                        <div class="col-8 d-flex justify-content-center">
                                            <div class="selector__qrcode_container">
                                                <button class="btn btn-outline-secondary selector__qrcode_trigger">{{ gT("Generate QR-Code") }}</button>
                                                <div class="selector__qrcode" data-url="{{tmp_url}}"></div>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                {% for langname in aAdditionalLanguages %}
                                    {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                        {% set tmp_url = surveyUrls[langname] %}
                                    {% endif %}
                                    <li class="list-group-item p-0 border-0{% if not loop.last %} mb-2{% endif %}">
                                        <div class="ls-flex-row col-12 align-items-center">
                                            <div class="col-4">
                                                {{ getLanguageNameFromCode(langname, false)}}
                                            </div>
                                            <div class="col-8 d-flex justify-content-center">
                                                <div class="selector__qrcode_container">
                                                    <button class="btn btn-outline-secondary selector__qrcode_trigger">{{ gT("Generate QR-Code") }}</button>
                                                    <div class="selector__qrcode" data-url="{{tmp_url}}"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                    <div class="card card-primary h-100 mb-3 p-4">
                        <div class="card-header">
                            <h5 class="card-title">
                                {{ gT("Share on Facebook:") }}
                            </h5>
                            <button class="btn btn-xs btn-warning float-end facebook-button" 
                                  id="selector_activateFacebookSharing">{{ gT("Enable") }}</button>
                        </div>
                        <div class="card-body border rounded">
                            <ul class="list-group list-group-flush">
                                {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                        {% set tmp_url = surveyUrls[oSurvey.language] %}
                                {% endif %}
                                    <li class="list-group-item p-0 border-0 mb-2">
                                    <div class="ls-flex-row col-12 align-items-center">
                                        <div class="col-4">
                                            {{ getLanguageNameFromCode(oSurvey.language, false)}}
                                        </div>
                                        <div class="col-8 d-flex justify-content-center">
                                            <button class="btn btn-disabled facebook-button selector_fb_share_disabled" disabled ><i class="ri-facebook-box-fill"></i> {{ gT("Disabled") }}</button>
                                            <iframe class="selector_fb_share d-none" data-src="https://www.facebook.com/plugins/share_button.php?href={{tmp_url|url_encode}}&layout=button_count&size=large&mobile_iframe=true&appId=328433594315978&width=106&height=28" width="106" height="28" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
                                        </div>
                                    </div>
                                </li>
                                {% for langname in aAdditionalLanguages %}
                                    {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                        {% set tmp_url = surveyUrls[langname] %}
                                    {% endif %}
                                    <li class="list-group-item p-0 border-0{% if not loop.last %} mb-2{% endif %}">
                                        <div class="ls-flex-row col-12 align-items-center">
                                            <div class="col-4">
                                                {{ getLanguageNameFromCode(langname, false)}}
                                            </div>
                                            <div class="col-8 d-flex justify-content-center">
                                                <button class="btn btn-disabled facebook-button selector_fb_share_disabled" disabled ><i class="ri-facebook-box-fill"></i> {{ gT("Disabled") }}</button>
                                                <iframe class="selector_fb_share d-none h-12" data-src="https://www.facebook.com/plugins/share_button.php?href={{tmp_url|url_encode}}&layout=button_count&size=large&mobile_iframe=true&appId=1321262851319939&width=106&height=28" width="106" height="28" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
                                            </div>
                                        </div>
                                    </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                    <div class="card card-primary h-100 mb-3 p-4">
                        <div class="card-header">
                            <h5 class="card-title">
                                {{ gT("Share on Twitter:") }}
                            </h5>
                        </div>
                        <div class="card-body border rounded">
                            <ul class="list-group list-group-flush">
                                {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                    {% set tmp_url = surveyUrls[oSurvey.language] %}
                                {% endif %}
                                <li class="list-group-item p-0 border-0 mb-2">
                                    <div class="ls-flex-row col-12 align-items-center">
                                        <div class="col-4">
                                            {{ getLanguageNameFromCode(oSurvey.language, false)}}
                                        </div>
                                        <div class="col-8 d-flex justify-content-center">
                                            <a class="btn btn-outline-secondary twitter-button" target='_blank' href="https://twitter.com/intent/tweet?text={{ gT("Thanks for taking this survey!")|url_encode}}&url={{tmp_url|url_encode}}&hashtags=limesurvey,survey">
                                                <i class="ri-twitter-fill"></i>{{ gT("Tweet it") }}
                                            </a>
                                        </div>
                                    </div>
                                </li>
                                {% for langname in aAdditionalLanguages %}
                                    {% if oSurvey.sid %} {# pseudo condition due to reverse parsing problems while generating twig admin cache via console.php twig generateAdminCache #}
                                        {% set tmp_url = surveyUrls[langname] %}
                                    {% endif %}
                                    <li class="list-group-item p-0 border-0{% if not loop.last %} mb-2{% endif %}">
                                        <div class="ls-flex-row col-12 align-items-center">
                                            <div class="col-4">
                                                {{ getLanguageNameFromCode(langname, false)}}
                                            </div>
                                            <div class="col-8 d-flex justify-content-center">
                                                <a class="btn btn-outline-secondary twitter-button" target='_blank' href="https://twitter.com/intent/tweet?text={{ gT("Thanks for taking this survey!")|url_encode}}&url={{tmp_url|url_encode}}&hashtags=limesurvey,survey">
                                                    <i class="ri-twitter-fill"></i>{{ gT("Tweet it") }}
                                                </a>
                                            </div>
                                        </div>
                                    </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{{gT ("Close") }}</button>
                </div>
            </div>
        </div>
    </div>

{% endif %}