<?xml version="1.0" encoding="utf-8"?>
<configuration version="1" date="2017-12-25 13:02:48" synergyVersion="3.15">
    <objects version="1" date="2017-12-25 13:02:48" synergyVersion="3.15">
        <customComponent code="include_js_fontawesome"
            name="Fontawesome JS lib" use_in_forms="false">
            <javascript>jQuery('head').append('&lt;script defer src="https://use.fontawesome.com/releases/v5.0.2/js/all.js"&gt;&lt;/script&gt;');</javascript>
            <html></html>
        </customComponent>
        <customComponent code="ext_cmp_registry_toolbar_button"
            name="Registry Toolbar Button" use_in_forms="false">
            <javascript>/**
 * Добавляет кнопку на тулбаре реестра, начиная за кнопкой отчетов реестра (иконка принтера).
 * Каждый экземпляр объекта добавляет одну кнопку (new RegistryToolbarButtonExt(iframeSrc, faIcon)).
 * В качестве иконки используется библиотека fontawesome 5 (https://fontawesome.com/icons?d=gallery&amp;m=free),
 * т.о. необходимо выбрать иконку из библиотеки и передать ее код в конструктор.
 * Конструктор метода позволяет отобразить iframe или произвольный HTML контент вместо списка записей реестра.
 *
 * @param {String} iframeSrc - URL который необходимо загрузить в iframe
 * @param {String} faIcon - код иконки из fontawesome вместе с ее начертанием, например "fas fa-chart-pie"
 * @param {jQuery} content - объект jQuery, который будет отображен вместо iframe. Если передан данный
 *                           параметр, то параметр iframeSrc игнорируется.
 */
function RegistryToolbarButtonExt(iframeSrc, faIcon, content) {
    this.iframeSrc = iframeSrc;
    this.faIcon = faIcon;
    this.content = content;

    jQuery('.buttonTable[title]:has(img[src$="print.png"])').parent().addClass("td-registry-report-btn");

    var buttonContainer = jQuery('&lt;td class="td-registry-report-btn"&gt;&lt;/td&gt;');
    var button = jQuery('&lt;div class="ext-rtb-btn"&gt;&lt;/div&gt;');
    var buttonIcon = jQuery('&lt;div class="ext-rtb-icon"&gt;&lt;i class="' + faIcon + ' fa-lg"&gt;&lt;/i&gt;&lt;/div&gt;');
    button.append(buttonIcon);
    buttonContainer.append(button);

    jQuery('.td-registry-report-btn:last').after(buttonContainer);

    jQuery('.rtable-focusable').closest('table').addClass("registry-records-table");

    var registryRecordsTable = jQuery('.registry-records-table');
    var contentContainer = jQuery('&lt;div id="registry-toolbar-button-content" style="height:100%; width:100%; position:absolute;"&gt;&lt;/div&gt;');
    var contentElement = content ? content : jQuery('&lt;iframe id="registry-toolbar-button-ext-iframe" src="' + iframeSrc + '" height="100%" width="100%"&gt;&lt;/iframe&gt;');
    if (jQuery('#registry-toolbar-button-content').length === 0) {
        registryRecordsTable.after(contentContainer);
    }

    button.click(function () {
        if (!button.hasClass("toggled")) {
            jQuery('.ext-rtb-btn.toggled').removeClass('toggled');
            button.addClass('toggled');
            showIframe();
        } else {
            button.removeClass('toggled');
            showRegistry();
        }
    });
    
    function showRegistry() {
        registryRecordsTable.show();
        contentElement.remove();
    }

    function showIframe() {
        registryRecordsTable.hide();
        jQuery('#registry-toolbar-button-content').empty().append(contentElement);
    }

    /**
     *  Когда выбираем реестр показываем записи реестра, независимо от состояния кнопок,
     *  т.е. сбрасываем до обычного состояния Synergy.
     */
    $EVENT_BUS.subscribe(new EventHandler('REGISTRY_SELECTED', function (event, args) {
        showRegistry();
    }));
}</javascript>
            <html>&lt;style&gt;
    .td-registry-report-btn {
        width: 40px;
    }

    .ext-rtb-btn {
        width: 35px;
        height: 23px;
        border: 1px solid #cfcfcf;
        border-radius: 4px;
        cursor:pointer;
    }
    
    .ext-rtb-btn.toggled {
      background: #dddddd;
    }

    .ext-rtb-icon {
        width: 18px;
        height: 18px;
        margin: 3px auto;
        color: #707070
    }
&lt;/style&gt;</html>
        </customComponent>
        <externalModuleComponent code="komponent_dop_knopok_reestra"
            name="Компонент доп. кнопок реестра" path="main"
            action_type="ADD" comp_code="ext_cmp_registry_toolbar_button"/>
        <externalModuleComponent code="include_js_fontawesome"
            name="Подключение библиотеки Fontawesome" path="main"
            action_type="ADD" comp_code="include_js_fontawesome"/>
    </objects>
    <dependencies>
        <dependency dependingObjectType="1073741836"
            dependingObjectCode="komponent_dop_knopok_reestra"
            ownerObjectType="268435456" ownerObjectCode="ext_cmp_registry_toolbar_button"/>
        <dependency dependingObjectType="1073741836"
            dependingObjectCode="include_js_fontawesome"
            ownerObjectType="268435456" ownerObjectCode="include_js_fontawesome"/>
    </dependencies>
</configuration>
