{include file="./index_top.tpl"}
<script type='text/javascript'>
    // значения для системной подсказки
    var help_section = 'Settings';
    var help_sub_section = 'Adds_buttons';
</script>
<script src="include/js/ConditionsConstruct.js?{$revision}"></script>
<script language="JavaScript" type="text/javascript">
    /**
     Состояние, аналогичное React, для отслеживания и обновления значения.
     * 
     * @param any initialValue - Начальное значение состояния.
    * @returns Array Массив, содержащий:
    *  - Функция для получения текущего значения состояния.
    *  - Функция для обновления состояния.
    *  - Функция для подписки на изменение состояния.
    */
    const useState = (initialValue) => {
      let value = initialValue; // Храним текущее состояние
      const listeners = new Set(); // Множество слушателей изменений состояния

      // Функция для обновления состояния
      const setState = (newValue) => {
        // Если передано как функция, вызываем её с текущим значением
        if (typeof newValue === 'function') {
          value = newValue(value);
        } 
        // Если передан объект, создаем новый объект для предотвращения мутации
        else if (typeof newValue === 'object' && newValue !== null) {
          value = JSON.parse(JSON.stringify(newValue)); // Создаем новый объект (глубокое копирование)
        } else {
          // Для примитивных значений просто присваиваем
          value = newValue;
        }
        
        // Уведомляем всех подписчиков о новом значении
        listeners.forEach((listener) => listener(value));
      };

      // Функция для подписки на изменения состояния
      const onStateChange = (listener) => {
        listeners.add(listener);
        return () => listeners.delete(listener); // Возвращаем функцию для отмены подписки
      };

      // Возвращаем массив с функцией для получения значения, функцией для его обновления и функцией подписки
      return [() => value, setState, onStateChange]; 
    };
    $(document).ready(() => {
        setTimeout(init_chosen, 4);
        setTimeout(show_window_size, 1000);
    });
    function check_all(type, obj) {
        {if $parent}
            par = 1;
        {else}
            par = 0;
        {/if}

        if ($(obj).attr("o_value") == "2") {
            $(obj).attr("src", "images/check_on_m.png");
            $(obj).attr("o_value", "1");
            on_off = "on";
        }
        else if ($(obj).attr("o_value") == "1") {
            $(obj).attr("src", "images/check_off_m.png");
            $(obj).attr("o_value", "0");
            on_off = "off";
        }
        else if (par) {
            $(obj).attr("src", "images/check_dis_off_m.png");
            $(obj).attr("o_value", "2");
            on_off = "dis_on";
        }
        else {
            $(obj).attr("src", "images/check_on_m.png");
            $(obj).attr("o_value", "1");
            on_off = "on";
        }

        $('[id^="par_' + type + '_"]').each(function () {
            $(this).attr("src", "images/check_" + on_off + "_m.png");
            if ($(this).attr("o_value") == 3 && on_off == "dis_on")  $(this).attr("src", "images/check_dis_off_m.png");
        });
        $('[id^="' + type + '_"]').each(function () {
            if (on_off == 'on') {
                $(this).val('1');
            }
            else if (on_off == 'dis_on') {
                if ($(this).attr('o_value') == '2') $(this).val('2');
                if ($(this).attr('o_value') == '3') $(this).val('3');
            }
            else {
                $(this).val('0');
            }
            if ($(this).val() != $(this).attr('data-o_value')) {
                $(this).parent().css('backgroundColor', 'rgb(255, 255, 153)');
            }
            else {
                $(this).parent().css('backgroundColor', 'transparent');
            }
        });
    }
    function show_window_size() {
        var mode = document.getElementById("type_button").value;
        if (mode == 1) { // Скрываем размеры
            $('.show_size_div').hide();
        }
        if (mode == 2) { // Показываем размеры
            $('.show_size_div').show();
        }
    }

    //функция show/hide режима редактироваия цвета
    function color_moding()
    {
        var mode1 = document.getElementById("color_mode1"),
            mode2 = document.getElementById("color_mode2");
        if (mode1.hasAttribute("checked")) {
            document.getElementById("old_mode").style.display = "none";
            document.getElementById("new_mode1").style.display = "table-row";
            document.getElementById("new_mode2").style.display = "table-row";

            mode2.setAttribute('checked', true);
            mode1.removeAttribute('checked');
        } else {
            document.getElementById("old_mode").style.display = "table-row";
            document.getElementById("new_mode1").style.display = "none";
            document.getElementById("new_mode2").style.display = "none";
            mode1.setAttribute('checked', true);
            mode2.removeAttribute('checked');
        }
    }

    var test_window = 0;
    function open_test_window() {
        var t_width = document.getElementById("width").value;
        var t_height = document.getElementById("height").value;
        var left = ( screen.width - t_width - 50 ) / 2;
        if (left < 0) left = 0;
        var top = ( screen.height - t_height - 50 ) / 2;
        if (top < 0) top = 0;
        if ((test_window) && (!test_window.closed)) test_window.close();
        test_window = window.open('user_button.php?id={$button.id}&test_size=1', 'CustomButton', 'menubar=0, resizable=1, scrollbars=0, status=0, toolbar=0, top=' + top + ', left=' + left + ', width=' + t_width + ', height=' + t_height);
        return false;
    }
</script>
<style>
    .checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
        margin-top: 3px;
    }
    {if $button.expert eq 1}
        {literal}
            .calc_area {
                display: table-row;
            }
            .calc_tpl_class {
                display: none;
            }
        {/literal}
    {else}
        {literal}
            .calc_area {
                display: none;
            }
            .calc_tpl_class {
                display: table-row;
            }
        {/literal}
    {/if}

    .new-action-button {
        box-shadow: inset 0 -18px 20px rgba(0,0,0,0.08);
        border: 1px solid rgba(0,0,0,0.25);
    }

    .new-action-button:hover {
        box-shadow: inset 0 -22px 30px rgba(0,0,0,0.16);
    }
</style>
<br>
<div align=center>
    {if $no_save_mode}<img src="images/lock.svg" style="width:20px; padding-right:5px;" title="{$lang.Element_no_edit_msg}">{/if}
    {if $button_id eq -1}{$lang.Create_button}{else}{$lang.Edit_button} "{$button.name_button}"{/if} {$lang.of_table} "{$name_table}"
    {if $button_id != -1 && !$blocked}
        <div style="left: 10px; top: 2px; float: none;"
            onclick="switchOnObject('{$button_id}')"
            class="switch-btn {if !$disabled}switch-on{/if}"
            id="switch-on-btn_{$button_id}"></div>
        <script>
            let ajaxObj = new XMLHTTP("edit_button.php");
            ajaxObj.format = 0;
            ajaxObj.method = "POST";
            function switchOnObject(button_id) {
                $('#switch-on-btn_'+button_id).toggleClass('switch-on');
                $('#switch-on-btn_'+button_id).trigger('on.switch');
                ajaxObj.call('button_id='+button_id+'&sel=disable&enbl='+($('#switch-on-btn_'+button_id).hasClass('switch-on')?1:0)+'&csrf={$csrf}',()=>{});
            }
        </script>
    {/if}
</div>
<br>
<form action="edit_button.php?button={$button_id}" method="post" button-id="{$button_id}" id="edit_button_form"
    table-id="{$table_id}">
    <table align="center" border=0 cellpadding=3 cellspacing=0 width="100%">
        {if $message}
            <tr>
                <td colspan=2 align=center>
                    <span id="edit_config__info-maessage" style="color:green">{$message}</span><br><br>
                </td>
            </tr>
        {/if}
        {if $error}
            <tr>
                <td colspan=2 align=center>
                    <span id="edit_config__info-maessage" style="color:red">{$error}</span><br><br>
                </td>
            </tr>
        {/if}
        {if $blocked}
            <tr>
                <td colspan=2 align=center>
                    <a href="edit_button.php?table={$table_id}">{$lang.Return}</a>
                </td>
            </tr>
        {else}
        <tr>
            <td width="45%" align=right>{$lang.Button_name}<span class='help_bt' h_id='Button_name'></span>:</td>
            <td><input class="form-control form-control-250" type=text name="name_button" id="name_button"
                       value="{$button.name_button}" size="50" MAXLENGTH="20"></td>
        </tr>
        <tr>
            <td align=right>{$lang.Color_mode}<span class='help_bt' h_id='Color_mode'></span>:</td>
            <td>
                <table>
                    <tr>
                        <td>
                            <label class="radio-inline">
                                <input type="radio" id="color_mode1" onchange="color_moding();" name="color_mode" value=0 {if !$button.color_mode}checked{/if}>{$lang.Standart}
                            </label>
                            <label class="radio-inline">
                                <input type="radio" id="color_mode2" onchange="color_moding();" name="color_mode" value=1 {if $button.color_mode}checked{/if}>{$lang.Paint}
                            </label>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr id="old_mode" {if $button.color_mode}style="display: none;"{/if}>
            <td align=right>{$lang.Button_color}<span class='help_bt' h_id='Button_color'></span>:</td>
            <td>
                <table>
                    <tr>
                        <td><select class="form-control form-control-160" name="old_color"
                                    onchange="change_color(this.value);">{$button.sel_color}</select>
                        </td>
                        <td>
                            <button id="color_demo" type="button" style="background: {if !$button.color_mode}{if $button.color}{$button.color}{else}#969696{/if}{/if}"
                                    class="new-action-button action-btns__item action-btns__itemm action-btns__item--bottom default-btn user-data__addit-act color-btn-example">
                            </button>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr id="new_mode1" {if !$button.color_mode}style="display: none;"{/if}>
            <td align=right>{$lang.Background_color}<span class='help_bt' h_id='Button_background_color'></span>:</td>
            <td>
                <table>
                    <tr>
                        <td>
                            <input type="hidden" id='input_color' name='new_color' value='{if $button.color}{$button.color|htmlspecialchars}{else}#ededed{/if}'>
                            <input type='text' id="color" class="colorSelector" value="{if $button.color}{$button.color|htmlspecialchars}{else}#ededed{/if}" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr id="new_mode2" {if !$button.color_mode}style="display: none;"{/if}>
            <td align=right>{$lang.Text_color}<span class='help_bt' h_id='Text_color'></span>:</td>
            <td>
                <table>
                    <tr>
                        <td>
                            <input type="hidden" id='input_textColor' name='text_color' value='{if $button.text_color}{$button.text_color|htmlspecialchars}{else}#4B4B4B{/if}'>
                            <input type='text' id="textColor" class="colorSelector" value="{if $button.text_color}{$button.text_color|htmlspecialchars}{else}#4B4B4B{/if}" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        {if $user.group_id == 1 || $user.sub_admin_rights.edit_php}
        <tr>
            <td align=right>{$lang.Mode}<span class='help_bt' h_id='Mode'></span>:</td>
            <td>
                <label class="radio-inline">
                    <input type="radio" name="calc_mode" value=0 {if !($mode === 0)}disabled style="color: #999;"{else} checked {/if}>
                    <span {if !($mode === 0)}style="color: #999;"{/if}>{$lang.construct_mode}</span>
                </label>
                <label class="radio-inline">
                    <input type="radio" name="calc_mode" value=1 {if !$all_modules.pro_tariff && $mode === 0}disabled style="color: #999;"{/if} {if !($mode === 0)}checked{/if}>
                    <span {if !$all_modules.pro_tariff && $mode === 0}style="color: #999;" title="{$lang.Pro_tariff_func_message}"{/if}>{$lang.Expert_mode}</span>
                </label>
            </td>
        </tr>
        {/if}

        <tr data-type="construct">
            <td align=right>{$lang.Enter_params}<span class='help_bt' h_id='Enter_params'></span>:</td>
            <td>
                <label class="radio-inline">
                    <input type="radio" name="use_params" value=0 {if !$button['use_params']}checked{/if}>{$lang['No']}
                </label>
                <label class="radio-inline">
                    <input type="radio" name="use_params" value=1 {if $button['use_params']}checked{/if}>{$lang['Yes']}
                </label>
            </td>
        </tr>
        <tbody>
        <tr data-type="construct" id="calc_params_block">
            <td align="right" valign="top">
                {$lang.Parameters}<span class='help_bt' h_id='Parameters'></span>:
            </td>
            <td id="calc_params">
                <div class="calc_params_list">
                    {if empty($parameters_list)}
                        <p class="calc_no_params">Параметры отсутствуют</p>
                    {else}
                        <p class="calc_no_params" hidden>Параметры отсутствуют</p>
                        {foreach from=$parameters_list item=item}
                            <div class="calc_params_block" id="calc_params_block_{$item.id}" data-id="{$item.id}">
                                {if !$no_save_mode}<button type="button" class="cond-remove-btn btn-drop" data-btn-id="{$button.id}" data-id="{$item.id}"></button>{/if}
                                <a data-id="{$item.id}" class="calc_param_link">{$item.name}</a>
                            </div>
                        {/foreach}
                    {/if}
                </div>
                {if !$no_save_mode}
                <button class="btn btn-default btn-sm calc_params_create-btn"
                        id="calc_params_create-btn"
                        type="button">Добавить новый параметр</button>
                {/if}
            </td>
        </tr>
        <tr data-type="construct" id="calc_params_block_create">
            <td colspan="2">
                <div class="calc_params_create-div" style="display: none;"></div>
            </td>
        </tr>
        </tbody>
        <tbody data-type="construct">
            <tr>
                <td align=right>{$lang.Set_conds}<span class='help_bt' h_id='Conditions'></span>:</td>
                <td>
                    <label class="radio-inline">
                        <input type="radio" name="set_conds" value="0" {if !$button['set_conds']} checked{/if}><span>{$lang['No']}</span>
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="set_conds" value="1"{if $button['set_conds']} checked{/if}><span>{$lang['Yes']}</span>
                    </label>
                </td>
            </tr>
            <tr id="cond_block">
                <td align=right>{$lang.Conditions}<span class='help_bt' h_id='Conditions'></span>:</td>
                <td id="cond_construct">

                </td>
            </tr>
        </tbody>
        <tbody data-type="construct">
            <tr>
                <td align=right>{$lang.Ask_confirm}<span class='help_bt' h_id='dd_ask_confirm'></span>:</td>
                <td>
                    <label class="radio-inline">
                        <input type="radio" name="ask_confirm" value="0" {if !$button['ask_confirm']}checked{/if} onclick="$('#confirm_text').hide()">{$lang['No']}
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="ask_confirm" value="1" {if $button['ask_confirm']}checked{/if} onclick="$('#confirm_text').show()">{$lang['Yes']}
                    </label>
                </td>
            </tr>
            <tr id="confirm_text" {if !$button['ask_confirm']}style="display:none"{/if}>
                <td align="right">{$lang.Confirm_text}<span class='help_bt' h_id='dd_confirm_text'></span>:</td>
                <td><input class="form-control form-control-300" name="confirm_text" value="{$button.confirm_text}"></td>
            </tr>
        </tbody>

        <tr data-type="expert" class="calc_area">
            <td align=right>{$lang.Work_in}<span class='help_bt' h_id='Work_in'></span>:</td>
            <td><select class="form-control form-control-160" name="type_button" id="type_button"
                        onchange="show_window_size();">{$button.select_type}</select></td>
        </tr>
        {if $user.group_id == 1 || $user.sub_admin_rights.edit_php}
        <tr data-type="expert" class="calc_area">
            <td align=right>JavaScript<span class='help_bt' h_id='JavaScript'></span>:</td>
            <td>{if $button.javascript|strlen < "1"}
                    <textarea class="form-control" name="javascript" rows=5 cols=38>{$button.javascript}</textarea>
                {else}
                    <a href="#"
                       onclick="open_calc('part=button_javas&button={$button_id}',{$button.javascript|strlen});return false;">{$lang.Edit}</a>
                    <input type="hidden" name="javascript" value="dont_save">
                {/if}</td>
        </tr>
        <tr data-type="expert" class="calc_area">
            <td align=right>{$lang.Computation}<span class='help_bt' h_id='Computation'></span>:</td>
            <td>{if $button.calculate|strlen < "1" && $button_id == -1}<textarea class="form-control" name="calculate" rows=5
                                                                                 cols=38>{$button.calculate}</textarea>
                {else}
                    <a href="#"
                       onclick="open_calc('part=button_php&button={$button_id}',{$button.calculate|strlen}{if ($mode === 0)}, 1{/if});return false;">{$lang.Edit}</a>
                    <input type="hidden" name="calculate" value="dont_save">
                {/if}</td>
        </tr>
        {/if}
        <tr data-type="construct" class="calc_tpl_class">
            <td align=right>{$lang.Template}<span class='help_bt' h_id='Template'></span>:</td>
            <td id="calc_tpl_area">
            </td>
        </tr>
        <tr data-type="construct" id="calc_tpl_tr" class="calc_tpl_class">
        </tr>
        <tr>
            <td></td>
            <td>
                <a href="" id="open_add_set" style="width: 110px;display: inline-block">{$lang.Additional}</a>
                {if $user.group_id == 1 || $user.sub_admin_rights.set_rights.tables[$table_id] == 2}
                    <a href="" id="config_access_rules" style="width: 110px;display: inline-block">{if $request_expert_mode}{$lang.Hide}{else}{$lang.Access_rules}{/if}</a>
                {/if}
                {if $config.protect_of_elements && $user.id == 1}<a href="" id="protect_switch">{$lang.Protect}</a>{/if}
                <input type=hidden name="add_set_on2" id="add_set_on2" value="{if $smarty.post.add_set_on}1{/if}">
            </td>
        </tr>

        <tbody id="additional_settings" style="display:none;">
            <tr class="show_size_div" {if $button.type eq 1}style="display:none;"{/if}>
                <td align=right>   {$lang.Window_width}</td>
                <td><input class="form-control form-control-100" type=text name="width" id="width" value="{$button.width}" size="5"></td>
            </tr>
            <tr class="show_size_div" {if $button.type eq 1}style="display:none;"{/if}>
                <td align=right>{$lang.Window_height}</td>
                <td><input class="form-control form-control-100" type=text name="height" id="height" value="{$button.height}" size="5"> &nbsp;
                    <input class="btn btn-default btn-sm" type="button" onclick="open_test_window()" value="{$lang.Test}"></td>
            </tr>
            <tr class="show_size_div" {if $button.type eq 1}style="display:none;"{/if}>
                <td align=right></td>
                <td><input type="checkbox" name="enable_scroll_bar" {if $button.scroll_bar}checked{/if}> {$lang.enable_scroll_bar}</td>
            </tr>
            <tr class="construct">
                <td align=right>{$lang.clever_hint}<span class='help_bt' h_id='clever_hint'></span>:</td></td>
                <td><input type="checkbox" name="check_conditions" {if $button.check_conditions}checked{/if}></td>
            </tr>
            <tr data-type="construct">
                <td align=right>{$lang.Successful}<span class='help_bt' h_id='successful_msg'></span>:</td>
                <td><input class="form-control form-control-250" name="successful_msg" value="{$button.successful_msg}"></td>
            </tr>
            <tr data-type="construct">
                <td align=right>{$lang.Fail}<span class='help_bt' h_id='fail_msg'></span>:</td>
                <td><input class="form-control form-control-250" name="fail_msg" value="{$button.fail_msg}"></td>
            </tr>
            <tr>
                <td align=right>{$lang.Help}<span class='help_bt' h_id='Help'></span>:</td>
                <td><textarea class="form-control" name="help" rows=5 cols=38>{$button.help}</textarea></td>
            </tr>
            <tr>
                <td align=right>
                    {$lang.Last_run_time}<span class='help_bt' h_id='button_last_runtime'></span>:
                </td>
                <td>
                    {$last_runtime} {$lang.seconds}
                </td>
            </tr>
            <tr>
                <td align=right>
                    {$lang.Day_run_time}<span class='help_bt' h_id='button_day_runtime'></span>:
                </td>
                <td>
                    {$day_runtime} {$lang.seconds}
                </td>
            </tr>
        </tbody>

        {if $user.group_id == 1 || $user.sub_admin_rights.set_rights.tables[$table_id] == 2}
        <tr class="config_access_rules_window access_window_header">
            <td></td>
            <td>{$lang.Access}</td>
        </tr>
        <tr class="config_access_rules_window access_window_header">
            <td align="left" valign="top" width="227px"></td>
            <td>
                <div style="float: left;margin:0 0 0 -1px;width: 31px; padding-top: 8px; padding-bottom: 6px; text-align: center;">
                    <img style="margin-top:4px;{if $acc_blocked}cursor:not-allowed;{/if}" id="all_read" src="images/check_off_m.png"
                        {if !$acc_blocked}onclick="check_all('read', this)"{/if} o_value="{if $parent}2{else}0{/if}">
                </div>
            </td>
        </tr>
        {foreach from=$access_data key=gid item=acc}
            <tr class="config_access_rules_window access_window_eyes {if !$acc_blocked}access_checkbox_wrapper{/if}">
                <td align="right">{$acc.name}:</td>
                <td>
                    <div class="edit-button__access-rules-checkbox">
                        <input id="read_" name="ob_access[{$gid}]" value="{$acc.access}" data-o_value="{if $acc.access}1{else}0{/if}"
                               data-type="access" data-gid="{$gid}" {if $acc.pid}data-parent="{$acc.parent}"
                               data-pid='{$acc.pid.access}'{/if} type="hidden">
                        <img id="par_read_" {if $acc_blocked}style="cursor:not-allowed"{/if}
                             src="images/check_{if $acc.access==2}dis_on{elseif $acc.access==3}dis_off{elseif $acc.access}on{else}off{/if}_m.png">
                    </div>
                </td>
            </tr>
        {/foreach}
        {/if}
        {if $config.protect_of_elements && $user.id == 1}
        <tbody id="protect_block" style="display:none">
            <tr>
                <td align="right">{$lang.Protected}<span class='help_bt' h_id='Protect_of_element'></span>:</td>
                <td>
                    <input type="checkbox" name="protected" {if $protected}checked{/if} onclick="$('[id^=pr_]').prop('disabled', !this.checked)">
                    <span class="access_param_wrapper">{$lang.View2}<span class='help_bt' h_id='protect_of_view'></span></span>
                    <span class="access_param_wrapper">{$lang.Edit3}<span class='help_bt' h_id='protect_of_edit'></span></span>
                    {if $config.access_protect_mode == 2}
                    <span class="access_param_wrapper">{$lang.Access}<span class='help_bt' h_id='protect_of_access'></span></span>
                    {/if}
                </td>
            </tr>
            <tr>
                <td align="right"></td>
                <td>
                    <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 15px; text-align: center;">
                        <input type="checkbox" id="pr_view_all" {if !$protected}disabled{/if}
                               onclick="$('[id^=pr_view]').prop('checked', this.checked); if (!this.checked) $('[id^=pr_edit]').prop('checked', 0);">
                    </div>
                    <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 0; text-align: center;">
                        <input type="checkbox" id="pr_edit_all" {if !$protected}disabled{/if}
                               onclick="$('[id^=pr_edit]').prop('checked', this.checked); if ( this.checked) $('[id^=pr_view]').prop('checked', 1);">
                    </div>
                    {if $config.access_protect_mode == 2}
                    <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 0; text-align: center;">
                        <input type="checkbox" id="pr_acc_all" {if !$protected}disabled{/if}
                               onclick="$('[id^=pr_acc]').prop('checked', this.checked);">
                    </div>
                    {/if}
                </td>
            </tr>
            {foreach from=$protect key=gid item=acc}
                <tr>
                    <td align="right" style="padding-top: 11px;">{$acc.name}:</td>
                    <td style="display: flex; flex-wrap: nowrap;">
                        <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 15px; text-align: center;">
                            <input type="checkbox" name="protect_rights[{$gid}][view]" id="pr_view{$gid}" value="1"
                                   {if $acc.view}checked{/if} {if !$protected}disabled{/if}
                                   onclick="if (!this.checked) $('#pr_edit{$gid}').prop('checked', 0)">
                        </div>
                        <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 0; text-align: center;">
                            <input type="checkbox" name="protect_rights[{$gid}][edit]" id="pr_edit{$gid}" value="1"
                                   {if $acc.edit}checked{/if} {if !$protected}disabled{/if}
                                   onclick="if ( this.checked) $('#pr_view{$gid}').prop('checked', 1)">
                        </div>
                        {if $config.access_protect_mode == 2}
                        <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 0; text-align: center;">
                            <input type="checkbox" name="protect_rights[{$gid}][acc]" id="pr_acc{$gid}" value="1"
                                   {if $acc.acc}checked{/if} {if !$protected}disabled{/if}>
                        </div>
                        <div style="float: left; margin:0 34px; width: 60px; padding: 8px 0 6px 0; text-align: center;">
                            <a href="edit_protect.php?group={$gid}&cat={$cat_id}&table={$table_id}&menu=buttons" target="_blanc">{$lang.Go}</a>
                        </div>
                        {/if}
                    </td>
                </tr>
            {/foreach}
            <tr><td></td></tr>
            <tr>
                <td align=right>{$lang.Comment}<span class='help_bt' h_id='protect_comment'></span>:</td>
                <td><textarea class="form-control form-control-250" name="protect_comment" rows=5>{$protect_comment}</textarea></td>
            </tr>
        </tbody>
        {/if}

        <tr>
            <td colspan=4 align=center>
                <br>
                <input class="btn btn-default btn-sm" type=submit name=save value="{$lang.Save}" id="submit_btn"
                       {if $no_save_mode == 2}disabled title="{$lang.Element_no_edit_msg}"{/if}>
                <input type=hidden name=change_type_value id=change_type_value value=0>
                <input type=hidden name=table value="{$table_id}">
                <br>
                <br>
                <a href="edit_button.php?table={$table_id}">{$lang.Return}</a>
            </td>
        </tr>
        {/if}{*blocked*}
    </table>
    {if $user.group_id != 1 && !$user.sub_admin_rights.edit_php}
    <input type="hidden" name="calc_mode" value="{$mode}">
    <input type="hidden" name="javascript" value="dont_save">
    <input type="hidden" name="calculate" value="dont_save">
    {/if}
    <input type='hidden' name=back_url value="{$base64_back_url}">
    <input type='hidden' name=csrf value="{$csrf}">
    <input type="hidden" name="params_data" id="params-data-hidden">
</form><br>
<script src="themes/clientbase/js/button/params-construct.js"></script>
<script src="include/js/configuration.js?{$revision}"></script>
<script>
    $(document).ready(function() {
        view_mode({$button['expert']}, 'button');
        view_params({$button['use_params']});
        {if $mode === 0}
            cond_mode();
            var params = null;
            {if isset($calc.construct_params)}
            var params = JSON.parse(`{$calc.construct_params_for_json|replace:"\\r\\n":"\\\\r\\\\n"}`);
            {/if}
            var CondConstruct = new ConditionsConstruct({$table_id}, params);
            CondConstruct.build_cond_construct($('#cond_construct'));
            createConstructorTemplates({
                tableId: '{$table_id}', 
                $parent: $('#calc_tpl_area'), 
                calcId: {$button.calc_id}, 
                type: 'button', 
                params
            });
            // TODO continue work
            open_parameters();
        {/if}
        $('input[name=set_conds]').click(function () {
            cond_mode();
        });
    });
    new EditButton(true);
    //функция работы палитры
    $('.colorSelector').each(function (i, item)
    {
        colorpickerSetings.change = function(color) {
            $(item).prev().val(color.toHexString());
        };
        $(this).spectrum(colorpickerSetings);
    });

    //создаем пременные цветов кнопок
    {foreach from=$buttonColors key=one_name item=one_color}
    var color_{$one_name} = '{$one_color}';
    {/foreach}

    //функция изменения цвета кнопки при изменении значения в списке
    function change_color(value)
    {
        $('#color_demo').css('background', this['color_' + value]);
    }

    //функция изменения цвета кнопки при изменении режима редактирования
    $('input[name=calc_mode]').click(function () {
        var mode = Number($(this).val());
        if (mode === 1) {
            $('[name=old_color]').val('default');
            change_color('default');
            $('#input_color').val('#ededed');
            $('#color').css('background-color', '#ededed');
            $('#input_textColor').val('#4B4B4B');
            $('#textColor').css('background-color', '#4B4B4B');
        } else {
            $('[name=old_color]').val('dark_grey');
            change_color('dark_grey');
            $('#input_color').val('#969696');
            $('#color').css('background-color', '#969696');
            $('#input_textColor').val('white');
            $('#textColor').css('background-color', 'white');
        }
    });
</script>

<script type="text/javascript">
    // Определение глобальной переменной для хранения значения def_val
    var params = {$calc.construct_params_for_json|replace:"\\r\\n":"\\\\r\\\\n"|json_decode|json_encode|@print_r:true}?.params[0]
    let globalDefVal = '';

    if (params){
        if(params.correlation) {
            globalDefVal = params.correlation.def_val;
        } else if (params.gen_field && params.gen_field.set_value) {
            globalDefVal = params.gen_field.set_value;
        }
    }
</script>
