<div class="ui small modal mp-photo-gallery-modal mbs-gg-tab-pages" data-tabs="gallery">
    <i class="close icon"></i>
    {# hiddend block #}
    <div class="mbs-gg-tab-links mbs-hidden" data-tabs="gallery">
        <div class="mbs-gg-tab-link" data-tab-info="page1">mbs-gg-tab-link</div>
        <div class="mbs-gg-tab-link" data-tab-info="page2">mbs-gg-tab-link</div>
    </div>

    {# PAGE 1 #}
    <div class="header mbs-gg-tab-page" data-tab-info="page1">
        {{ translate('Choose Gallery Preset') }}
    </div>
    <div class="content mbs-gg-tab-page" data-tab-info="page1">
        <div class="ui form">
            <select id="photoGalleryPresetSel">
                <option value="">{{ translate('Select value') }}</option>
                {% for val1 in galleriesPresets %}
                    <option value="{{ val1.id }}">{{ val1.title }}</option>
                {% endfor %}
            </select>
        </div>
    </div>
    <div class="actions mbs-gg-tab-page" data-tab-info="page1">
        <button class="ui button mini primary gg-next disabled" id="mbs-photo-gg-next">{{ translate('Next') }}</button>
        <button class="ui button mini secondary cancel">{{ translate('Cancel') }}</button>
    </div>

    {# PAGE 2 #}
    <div class="header mbs-gg-tab-page" data-tab-info="page2">
        {{ translate('Gallery Images') }}
    </div>
    <div class="content mbs-gg-tab-page" data-tab-info="page2">
        <div class="ui form">
            <button class="ui button mini primary gg-add-image" id="mbs-photo-gg-add-image">{{ translate('Add Image') }}</button>
            <button class="ui button mini gg-remove-image" id="mbs-photo-gg-remove-image">{{ translate('Remove selected images') }}</button>
            <div class="mbs-gg-img-list"></div>
        </div>
    </div>
    <div class="actions mbs-gg-tab-page" data-tab-info="page2">
        <button class="ui button mini primary mbs-modal-page2-btn-ok" id="mbs-gg-modal-page2-ok">{{ translate('Ok') }}</button>
        <button class="ui button mini secondary cancel" id="mbs-gg-modal-page2-cancel">{{ translate('Cancel') }}</button>
    </div>

    <input type="hidden" id="mbsStrImageParamIncorrect" value="{{ translate('Error! Image params are incorrect!') }}"/>
    <input type="hidden" id="mbsStrSelectImageToRemove" value="{{ translate('Please select an image to remove.') }}"/>
    <input type="hidden" id="mbsStrGalleryParamIncorrect" value="{{ translate('Error! Gallery params are incorrect!') }}"/>
    <input type="hidden" id="mbsStrServerError" value="{{ translate('Server error!') }}"/>
</div>

<div class="mbs-gg-image-template mbs-hidden">
    <div class="mbs-one-gg-image">
        <div class="mbs-preview">
            <img alt=""/>
            <div class="mbs-progress-bar">
                <div class="ui tiny indicating progress active">
                    <div class="bar"></div>
                </div>
            </div>
        </div>
    </div>
</div>
