<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
    <script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
    <!--可用來建立使用者小圖示-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <!-- W3 CSS 樣式 -->
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <script language="JavaScript">
        // 指定 秒 刷新網頁一次
        var dtn = '{{tid}}';
        var status = '{{status}}';
        console.log('dtn:' + dtn)

        var new_condition_i = 5         // 總條件數
        var cond_add_child_i = 5        // 這是子條件數
        var act_add_child_i = 5         // 子物件數

        const cond_z_data = ['', '{{DBW.cond_z1_1}}', '{{DBW.cond_z2_1}}', '{{DBW.cond_z3_1}}', '{{DBW.cond_z4_1}}', '{{DBW.cond_z5_1}}']
        const cond_tank_data = ['', '{{DBW.cond_tank1_1}}', '{{DBW.cond_tank2_1}}', '{{DBW.cond_tank3_1}}', '{{DBW.cond_tank4_1}}', '{{DBW.cond_tank5_1}}']
        const cond_a_data = [ ['','','','','',''],
                            ['','{{DBW.cond_a1_1}}', '{{DBW.cond_a1_2}}', '{{DBW.cond_a1_3}}', '{{DBW.cond_a1_4}}', '{{DBW.cond_a1_5}}'],
                            ['','{{DBW.cond_a2_1}}', '{{DBW.cond_a2_2}}', '{{DBW.cond_a2_3}}', '{{DBW.cond_a2_4}}', '{{DBW.cond_a2_5}}'],
                            ['','{{DBW.cond_a3_1}}', '{{DBW.cond_a3_2}}', '{{DBW.cond_a3_3}}', '{{DBW.cond_a3_4}}', '{{DBW.cond_a3_5}}'],
                            ['','{{DBW.cond_a4_1}}', '{{DBW.cond_a4_2}}', '{{DBW.cond_a4_3}}', '{{DBW.cond_a4_4}}', '{{DBW.cond_a4_5}}'],
                            ['','{{DBW.cond_a5_1}}', '{{DBW.cond_a5_2}}', '{{DBW.cond_a5_3}}', '{{DBW.cond_a5_4}}', '{{DBW.cond_a5_5}}']  ]
        const cond_b_data = [ ['','','','','',''],
                            ['','{{DBW.cond_b1_1}}', '{{DBW.cond_b1_2}}', '{{DBW.cond_b1_3}}', '{{DBW.cond_b1_4}}', '{{DBW.cond_b1_5}}'],
                            ['','{{DBW.cond_b2_1}}', '{{DBW.cond_b2_2}}', '{{DBW.cond_b2_3}}', '{{DBW.cond_b2_4}}', '{{DBW.cond_b2_5}}'],
                            ['','{{DBW.cond_b3_1}}', '{{DBW.cond_b3_2}}', '{{DBW.cond_b3_3}}', '{{DBW.cond_b3_4}}', '{{DBW.cond_b3_5}}'],
                            ['','{{DBW.cond_b4_1}}', '{{DBW.cond_b4_2}}', '{{DBW.cond_b4_3}}', '{{DBW.cond_b4_4}}', '{{DBW.cond_b4_5}}'],
                            ['','{{DBW.cond_b5_1}}', '{{DBW.cond_b5_2}}', '{{DBW.cond_b5_3}}', '{{DBW.cond_b5_4}}', '{{DBW.cond_b5_5}}']  ]
        const cond_c_data = [ ['','','','','',''],
                            ['','{{DBW.cond_c1_1}}', '{{DBW.cond_c1_2}}', '{{DBW.cond_c1_3}}', '{{DBW.cond_c1_4}}', '{{DBW.cond_c1_5}}'],
                            ['','{{DBW.cond_c2_1}}', '{{DBW.cond_c2_2}}', '{{DBW.cond_c2_3}}', '{{DBW.cond_c2_4}}', '{{DBW.cond_c2_5}}'],
                            ['','{{DBW.cond_c3_1}}', '{{DBW.cond_c3_2}}', '{{DBW.cond_c3_3}}', '{{DBW.cond_c3_4}}', '{{DBW.cond_c3_5}}'],
                            ['','{{DBW.cond_c4_1}}', '{{DBW.cond_c4_2}}', '{{DBW.cond_c4_3}}', '{{DBW.cond_c4_4}}', '{{DBW.cond_c4_5}}'],
                            ['','{{DBW.cond_c5_1}}', '{{DBW.cond_c5_2}}', '{{DBW.cond_c5_3}}', '{{DBW.cond_c5_4}}', '{{DBW.cond_c5_5}}']  ]
        const cond_d_data = [ ['','','','','',''],
                            ['','', '{{DBW.cond_d1_2}}', '{{DBW.cond_d1_3}}', '{{DBW.cond_d1_4}}', '{{DBW.cond_d1_5}}'],
                            ['','', '{{DBW.cond_d2_2}}', '{{DBW.cond_d2_3}}', '{{DBW.cond_d2_4}}', '{{DBW.cond_d2_5}}'],
                            ['','', '{{DBW.cond_d3_2}}', '{{DBW.cond_d3_3}}', '{{DBW.cond_d3_4}}', '{{DBW.cond_d3_5}}'],
                            ['','', '{{DBW.cond_d4_2}}', '{{DBW.cond_d4_3}}', '{{DBW.cond_d4_4}}', '{{DBW.cond_d4_5}}'],
                            ['','', '{{DBW.cond_d5_2}}', '{{DBW.cond_d5_3}}', '{{DBW.cond_d5_4}}', '{{DBW.cond_d5_5}}']  ]
        const cond_obj_data = [ ['','','','','',''],
                                ['','{{DBW.do_obj1_1}}', '{{DBW.do_obj1_2}}', '{{DBW.do_obj1_3}}', '{{DBW.do_obj1_4}}', '{{DBW.do_obj1_5}}'],
                                ['','{{DBW.do_obj2_1}}', '{{DBW.do_obj2_2}}', '{{DBW.do_obj2_3}}', '{{DBW.do_obj2_4}}', '{{DBW.do_obj2_5}}'],
                                ['','{{DBW.do_obj3_1}}', '{{DBW.do_obj3_2}}', '{{DBW.do_obj3_3}}', '{{DBW.do_obj3_4}}', '{{DBW.do_obj3_5}}'],
                                ['','{{DBW.do_obj4_1}}', '{{DBW.do_obj4_2}}', '{{DBW.do_obj4_3}}', '{{DBW.do_obj4_4}}', '{{DBW.do_obj4_5}}'],
                                ['','{{DBW.do_obj5_1}}', '{{DBW.do_obj5_2}}', '{{DBW.do_obj5_3}}', '{{DBW.do_obj5_4}}', '{{DBW.do_obj5_5}}']  ]
        const cond_act_data = [ ['','','','','',''],
                                ['','{{DBW.do_act1_1}}', '{{DBW.do_act1_2}}', '{{DBW.do_act1_3}}', '{{DBW.do_act1_4}}', '{{DBW.do_act1_5}}'],
                                ['','{{DBW.do_act2_1}}', '{{DBW.do_act2_2}}', '{{DBW.do_act2_3}}', '{{DBW.do_act2_4}}', '{{DBW.do_act2_5}}'],
                                ['','{{DBW.do_act3_1}}', '{{DBW.do_act3_2}}', '{{DBW.do_act3_3}}', '{{DBW.do_act3_4}}', '{{DBW.do_act3_5}}'],
                                ['','{{DBW.do_act4_1}}', '{{DBW.do_act4_2}}', '{{DBW.do_act4_3}}', '{{DBW.do_act4_4}}', '{{DBW.do_act4_5}}'],
                                ['','{{DBW.do_act5_1}}', '{{DBW.do_act5_2}}', '{{DBW.do_act5_3}}', '{{DBW.do_act5_4}}', '{{DBW.do_act5_5}}']  ]

        $(function(){
            $("#coffee_title_pc").text("乾燥槽積木程式介面");
            $("#coffee_title_phone").text("乾燥槽積木");

            if (status == 2) {
                $('input').prop('disabled', true);
                $('button').prop('disabled', true);
            } else if ( (status == 0) || (status == 1) ) {
                $('input').prop('disabled', false);
                $('button').prop('disabled', false);   
            }

            DBvalue_btn();
            for (let z_d = 1; z_d < cond_z_data.length; z_d++) {
                $("#cond_z" + z_d + "_1").val(cond_z_data[z_d]);
            }
            for (let tank_d = 1; tank_d < cond_tank_data.length; tank_d++) {
                $("#cond_tank" + tank_d + "_1").val(cond_tank_data[tank_d]);
            }
            for (let a_d = 1; a_d < 6; a_d++) {
                for (let a_d_n = 1; a_d_n < 6; a_d_n++) {
                    $("#cond_a" + a_d + "_" + a_d_n).val(cond_a_data[a_d][a_d_n]);
                }
            }
            for (let b_d = 1; b_d < 6; b_d++) {
                for (let b_d_n = 1; b_d_n < 6; b_d_n++) {
                    $("#cond_b" + b_d + "_" + b_d_n).val(cond_b_data[b_d][b_d_n]);
                }
            }
            for (let c_d = 1; c_d < 6; c_d++) {
                for (let c_d_n = 1; c_d_n < 6; c_d_n++) {
                    $("#cond_c" + c_d + "_" + c_d_n).val(cond_c_data[c_d][c_d_n]);
                }
            }
            for (let d_d = 1; d_d < 6; d_d++) {
                for (let d_d_n = 2; d_d_n < 6; d_d_n++) {
                    $("#cond_d" + d_d + "_" + d_d_n).val(cond_d_data[d_d][d_d_n]);
                }
            }
            for (let obj_d = 1; obj_d < 6; obj_d++) {
                for (let obj_d_n = 1; obj_d_n < 6; obj_d_n++) {
                    $("#do_obj" + obj_d + "_" + obj_d_n).val(cond_obj_data[obj_d][obj_d_n]);
                    // 設定物件後, 取得物件目前所選項目, 再呼叫 renew 顯示對應動作下拉式選單
                    const target_obj_index = $("#do_obj" + obj_d + "_" + obj_d_n).prop('selectedIndex')
                    // console.log("target_obj_index: " + target_obj_index)
                    renew(obj_d + '_' + obj_d_n, target_obj_index);
                }
            }
            for (let act_d = 1; act_d < 6; act_d++) {
                for (let act_d_n = 1; act_d_n < 6; act_d_n++) {
                    $("#do_act" + act_d + "_" + act_d_n).val(cond_act_data[act_d][act_d_n]);
                    // 若是 input range 要更新顯示文字
                    if ($("#do_obj" + act_d + "_" + act_d_n).prop('selectedIndex') == '4') {
                        let target_act_motorValue = $("#do_act" + act_d + "_" + act_d_n).prop('value')
                        showMotorValue(act_d + "_" + act_d_n, target_act_motorValue);
                    } else if ($("#do_obj" + act_d + "_" + act_d_n).prop('selectedIndex') == '13') {
                        let target_act_tempValue = $("#do_act" + act_d + "_" + act_d_n).prop('value')
                        showTempValue(act_d + "_" + act_d_n, target_act_tempValue);
                    } else if ($("#do_obj" + act_d + "_" + act_d_n).prop('selectedIndex') == '15') {
                        let target_act_sleepValue = $("#do_act" + act_d + "_" + act_d_n).prop('value')
                        showSleepValue(act_d + "_" + act_d_n, target_act_sleepValue);
                    }

                }
            }
        });
    </script>

    <style>
        .newcondition_css {
            padding: 10px;
            margin-top: 10px;
            background-color:honeydew;
        }
        hr {
            margin-top: 5px;
            margin-bottom: 5px;
        }
        .input-cond-delete {
            background: #E43030;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            width: 65px;
            height: 33px;
            font-size: 16px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        .input-cond-add {
            background: #008CBA;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            width: 65px;
            height: 33px;
            font-size: 16px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        .input-act-add {
            background: #008CBA;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            width: 100px;
            height: 33px;
            font-size: 16px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        .input-act-delete {
            background: #E43030;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            width: 100px;
            height: 33px;
            font-size: 16px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        .input-add {
            background: #008CBA;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            margin-top: 5px;
            width: 150px;
            height: 40px;
            font-size: 18px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        .input-delete {
            background: #E43030;
            border: 1px solid #CFCFCF;
            box-sizing: border-box;
            border-radius: 5px;
            margin-left: 5px;
            margin-top: 5px;
            width: 150px;
            height: 40px;
            font-size: 18px;
            text-align: center;
            line-height: 16px;
            color: #FFFFFF;
        }
        select {
            font-size: 24px;
            height: 30px;
            padding: 2px 5px;
            margin-left: 5px;
        }



        /* https://rookiesavior.net/2020/12/08/css-accordion-effect/ */
        * {
            box-sizing: border-box;
        }
        .accordion {
            width: auto;
            /* width: 600px; */
            /* margin: 80px auto 0; */
        }
        .accordion label {
            display: block;
            width: 100%;
            text-align: left;
            border-radius: 5px;
            background-color: #ccc;
            margin-top: 10px;
            padding: 6px 10px;
            cursor: pointer;
        }
        .content {
            height: 0px;
            background-color: #fff;
            overflow: hidden;
            transition: 0.5s;
        }
        input[type=checkbox]{
            display: none;
        }
        input[type=checkbox]:checked + .content {
            /* 被選取的input[type=checkbox]
            的下一個 .content 背景變成橘色。 */
            background-color: #fa0;
            height: auto;
            /* height: 100px; */
            padding: 10px 10px 10px 20px;
        }
        .content00 {
            height: 0px;
            background-color: #fff;
            overflow: hidden;
            transition: 0.5s;
        }
        input[type=checkbox]:checked + .content00 {
            /* 被選取的input[type=checkbox]
            的下一個 .content 背景變成橘色。 */
            background-color: rgb(255, 236, 199);
            height: auto;
            /* height: 100px; */
        }
        label {
            content: "+";
        }
    </style>

</head>

<body style="font-size: 18px;">
    <div id="wrapper">
        <div id="coffee_header">
            <!-- 匯入共同使用的 header.html 內容 -->
            {% include 'header.html' %}
        </div>
        <!-- [物件]文字輸入框 選擇後連結 [動作]文字輸入框 -->
        <script>
            dry_object = new Array();
            dry_object[0] = ["-"];                          // 制動器 / 感測器
            dry_object[1] = ["on", "off"];                  // 入料儲豆槽真空吸料機
            dry_object[2] = ["on", "off"];                  // 真空吸料機
            dry_object[3] = ["ON 吸料", "OFF 排氣"];         // 吸料機三通閥
            dry_object[4] = ["on", "off"];                  // 消毒電磁閥
            // dry_object[5] = ["0", "10", "20", "30", "40", "50"];              // 馬達
            dry_object[6] = ["on", "off"];                  // 桶外進水電磁閥
            dry_object[7] = ["on", "off"];                  // 廢水排水電磁閥
            dry_object[8] = ["on", "off"];                  // 加熱棒 1
            dry_object[9] = ["on", "off"];                  // 加熱棒 2
            dry_object[10] = ["on", "off"];                 // 溫控開關
            // dry_object[11] = ["on", "off"];                                  // 溫度設定
            dry_object[12] = ["on", "off"];                 // 蝴蝶閥
            dry_object[13] = ["on", "off"];                 // 出料儲豆槽真空吸料機
            dry_object[14] = ["on", "off"];                 // 電磁開關
            dry_object[15] = ["on", "off"];                 // 緊急開關
            dry_object[16] = ["on", "off"];                 // 攝影機
            dry_object[17] = ["on", "off"];                 // 警示燈
            // dry_object[18] = ["1", "5", "10", "30", "60"];  // 暫停秒數
            dry_object[19] = ["空桶等待", "入豆中", "入豆暫停", "入豆完成", "夾層入水", "乾燥", "可出豆"];  // 暫停秒數

            function renew(obj_num, index) {
                var Value = '';
                try {
                    Value = '<select id="do_act' + obj_num + '">';
                    for(var i=0; i<dry_object[index].length; i++){
                        Value += '<option value=' + dry_object[index][i] + '>' + dry_object[index][i] + '</option>';
                    }
                    Value += '</select>';
                } catch (e) {
                    if (e.name == 'TypeError' && index == '5') {
                        Value = '   轉速 : ' + 
                                ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="-50" max="50" step="5" value="0" oninput="showMotorValue(\'' + obj_num + '\', this.value)" onchange="showMotorValue(\'' + obj_num + '\', this.value)">' + 
                                ' <span id="motorValue_text' + obj_num + '">0</span>';
                    } else if (e.name == 'TypeError' && index == '11') {
                        Value = '   目標溫度 : ' + 
                                ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="20.0" max="50.0" step="0.5" value="28.0" oninput="showTempValue(\'' + obj_num + '\', this.value)" onchange="showTempValue(\'' + obj_num + '\', this.value)">' + 
                                ' <span id="tempValue_text' + obj_num + '">28.0</span>';
                    } else if (e.name == 'TypeError' && index == '18') {
                        Value = '   暫停秒數 : ' + 
                                ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="5" max="60" step="5" value="10" oninput="showSleepValue(\'' + obj_num + '\', this.value)" onchange="showSleepValue(\'' + obj_num + '\', this.value)">' + 
                                ' <span id="sleepValue_text' + obj_num + '">10s</span>';
                    }
                }

                var sectorSelect = document.getElementById("do_action" + obj_num);
                if (sectorSelect != null) {
                    sectorSelect.innerHTML = Value;
                }
            }

            
        </script>
        <!-- DB 取值測試 -->
        - - - DB 取值測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>
        <!-- <input type="button" id="test" value="DB 取值測試" onclick="DBvalue_btn();"><br> -->
        <div id="DBvalue">

        </div>

        <script>
            function DBvalue_btn(params) {
                var html = '<div id="box">';
                for (let condadd_parent_num = 1; condadd_parent_num < 6; condadd_parent_num++) {
                    html += '' + 
                            '<div id="newcondition_' + condadd_parent_num + '" class="newcondition_css">' +

                            '<div id="condition' + condadd_parent_num + '">' +
                            '<div id="condition' + condadd_parent_num + '_' + '1' + '">' +
                            '條件 ' +
                            '<select id="cond_z' + condadd_parent_num + '_' + '1' + '">' +
                            '<option value="if">if</option>' +
                            '<option value="elif">elif</option>' +
                            '<option value="else">else</option>' +
                            '</select> ' +
                            '<select id="cond_tank' + condadd_parent_num + '_' + '1' + '">' +
                            '<option value="D1">乾燥桶 D1</option>' +
                            '<option value="D2">乾燥桶 D2</option>' +
                            '<option value="D3">乾燥桶 D3</option>' +
                            '<option value="D4">乾燥桶 D4</option>' +
                            '<option value="D5">乾燥桶 D5</option>' +
                            '<option value="D6">乾燥桶 D6</option>' +
                            '<option value="D7">乾燥桶 D7</option>' +
                            '<option value="D8">乾燥桶 D8</option>' +
                            '<option value="D9">乾燥桶 D9</option>' +
                            '<option value="D10">乾燥桶 D10</option>' +
                            '<option value="D11">乾燥桶 D11</option>' +
                            '<option value="D12">乾燥桶 D12</option>' +
                            '</select> ' +
                            '<select id="cond_a' + condadd_parent_num + '_' + '1' + '">' +
                            '<option value="">制動器 / 感測器</option>' + 
                            '<optgroup label="制動器狀態">' + 
                            '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' + 
                            '<option value="tank_vacuum_status">真空吸料機</option>' + 
                            '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' + 
                            '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' + 
                            '<option value="tank_motor_status">馬達</option>' + 
                            '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' + 
                            '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' + 
                            '<option value="tank_heater1_status">加熱棒 1</option>' + 
                            '<option value="tank_heater2_status">加熱棒 2</option>' + 
                            '<option value="tank_temp_enable">溫控開關</option>' + 
                            '<option value="tank_temp">溫度設定</option>' + 
                            '<option value="tank_diskvalve_status">蝴蝶閥</option>' + 
                            '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' + 
                            '<option value="tank_magneticSwitch_status">電磁開關</option>' + 
                            '<option value="tank_emergencySwitch_status">緊急開關</option>' + 
                            '<option value="tank_camera_status">攝影機</option>' + 
                            '<option value="tank_warningLight_status">警示燈</option>' + 
                            '</optgroup>' + 
                            '<optgroup label="感測器數值">' + 
                            '<option value="tank_ultrasonic_status">超音波感測器</option>' + 
                            '<option value="tank_pa_status">大氣壓力計</option>' + 
                            '<option value="tank_motorencoder_status">馬達編碼器</option>' + 
                            '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' + 
                            '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' + 
                            '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' + 
                            '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' + 
                            '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' + 
                            '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' + 
                            '<option value="outer_waterlevel_status">夾層水位計</option>' + 
                            '</optgroup>' + 
                            '</select> ' +
                            '<select id="cond_b' + condadd_parent_num + '_' + '1' + '">' +
                            // '<option value="equal">==</option>' +
                            // '<option value="morethan">&gt;=</option>' +  
                            // '<option value="lessthan">&lt;=</option>' +
                            '<option value="MoreThan">&gt;</option>' + 
                            '<option value="MoreThanEqualTo">&gt;=</option>' + 
                            '<option value="Equal" selected>==</option>' + 
                            '<option value="LessThanEqualTo">&lt;=</option>' + 
                            '<option value="LessThan">&lt;</option>' + 
                            '</select> ' +
                            '<input list="cond_list_c' + condadd_parent_num + '_' + '1' + '" id="cond_c' + condadd_parent_num + '_' + '1' + '">' +
                            '<datalist id="cond_list_c' + condadd_parent_num + '_' + '1' + '">' +
                            '<option value="on">' +
                            '<option value="off">' +
                            '<option value="(或請自行輸入數值)">' +
                            '</datalist> ' +
                            // '<input type="button" class="input-cond-add" id="cond_add' + condadd_parent_num + '_' + '1' + '" value="條件++" onclick="cond_add(cond_add' + condadd_parent_num + '_' + '1' + ')"><br>' +
                            '</div>';
                    for (let cond_add_child_i = 2; cond_add_child_i < 6; cond_add_child_i++) {
                        // if (cond_d_data[condadd_parent_num][cond_add_child_i] == '') {
                        //     // alert("cond_d_data[" + condadd_parent_num + "][" + cond_add_child_i + " ] + 為空值")
                        //     continue
                        // }
                        html += 
                        '<div id="condition' + condadd_parent_num + '_' + cond_add_child_i + '">' +
                        '<select id="cond_d' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                        '<option value="and">and</option>' + 
                        '<option value="or">or</option>' + 
                        '</select> ' + 
                        '<select id="cond_a' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                        '<option value="">制動器 / 感測器</option>' + 
                        '<optgroup label="制動器狀態">' + 
                        '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' + 
                        '<option value="tank_vacuum_status">真空吸料機</option>' + 
                        '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' + 
                        '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' + 
                        '<option value="tank_motor_status">馬達</option>' + 
                        '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' + 
                        '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' + 
                        '<option value="tank_heater1_status">加熱棒 1</option>' + 
                        '<option value="tank_heater2_status">加熱棒 2</option>' + 
                        '<option value="tank_temp_enable">溫控開關</option>' + 
                        '<option value="tank_temp">溫度設定</option>' + 
                        '<option value="tank_diskvalve_status">蝴蝶閥</option>' + 
                        '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' + 
                        '<option value="tank_magneticSwitch_status">電磁開關</option>' + 
                        '<option value="tank_emergencySwitch_status">緊急開關</option>' + 
                        '<option value="tank_camera_status">攝影機</option>' + 
                        '<option value="tank_warningLight_status">警示燈</option>' + 
                        '</optgroup>' + 
                        '<optgroup label="感測器數值">' + 
                        '<option value="tank_ultrasonic_status">超音波感測器</option>' + 
                        '<option value="tank_pa_status">大氣壓力計</option>' + 
                        '<option value="tank_motorencoder_status">馬達編碼器</option>' + 
                        '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' + 
                        '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' + 
                        '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' + 
                        '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' + 
                        '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' + 
                        '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' + 
                        '<option value="outer_waterlevel_status">夾層水位計</option>' + 
                        '</optgroup>' + 
                        '</select> ' + 
                        '<select id="cond_b' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                        // '<option value="equal">==</option>' +
                        // '<option value="morethan">&gt;=</option>' +
                        // '<option value="lessthan">&lt;=</option>' +
                        '<option value="MoreThan">&gt;</option>' + 
                        '<option value="MoreThanEqualTo">&gt;=</option>' + 
                        '<option value="Equal" selected>==</option>' + 
                        '<option value="LessThanEqualTo">&lt;=</option>' + 
                        '<option value="LessThan">&lt;</option>' + 
                        '</select> ' +
                        '<input list="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '" id="cond_c' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                        '<datalist id="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '">' +
                        '<option value="on">' +
                        '<option value="off">' +
                        '<option value="(或請自行輸入數值)">' +
                        '</datalist> ' +
                        '<input type="button" class="input-cond-delete" id="cond_del' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件--" onclick="cond_del(\'' + condadd_parent_num + '_' + cond_add_child_i + '\');">';
                        if (cond_add_child_i == 5) {
                            html +=
                            '<input type="button" class="input-cond-add" id="cond_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件++" onclick="cond_add(cond_add' + condadd_parent_num + '_' + cond_add_child_i + ');"><br>';
                        } else {
                            html +=
                            '<input type="button" class="input-cond-add" id="cond_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件++" onclick="cond_add(cond_add' + condadd_parent_num + '_' + cond_add_child_i + ');" style="display: none;"><br>';
                        }
                        html += '</div>';
                    }

                    html += '</div>';

                    // 新增的物件動作
                    html += '<div id="action' + condadd_parent_num + '">';
                    for (let cond_add_child_i = 1; cond_add_child_i < 6; cond_add_child_i++) {
                        // if (cond_obj_data[condadd_parent_num][cond_add_child_i] == '') {
                        //     // alert("cond_d_data[" + condadd_parent_num + "][" + cond_add_child_i + " ] + 為空值")
                        //     continue
                        // }
                        html += 
                        '<div id="action' + condadd_parent_num + '_' + cond_add_child_i + '">' +
                        '物件 ' +
                        '<select id="do_obj' + condadd_parent_num + '_' + cond_add_child_i + '" onChange="renew(\''+ condadd_parent_num + '_' + cond_add_child_i + '\', this.selectedIndex);">' +
                        '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' +
                        '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
                        '<option value="tank_vacuum_status">真空吸料機</option>' +
                        '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
                        '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
                        '<option value="tank_motor_status">馬達</option>' +
                        '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
                        '<option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>' +
                        '<option value="tank_heater1_status">加熱棒 1</option>' +
                        '<option value="tank_heater2_status">加熱棒 2</option>' +
                        '<option value="tank_temp_enable">溫控開關</option>' +
                        '<option value="tank_temp">溫度設定</option>' +
                        '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
                        '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
                        '<option value="tank_magneticSwitch_status">電磁開關</option>' +
                        '<option value="tank_emergencySwitch_status">緊急開關</option>' +
                        '<option value="tank_camera_status">攝影機</option>' +
                        '<option value="tank_warningLight_status">警示燈</option>' +
                        '<option value="time.sleep">暫停秒數</option>' +
                        '<option value="dry_container_status">桶槽狀態</option>' +
                        '</select>' +
                        // '<select id="do_act' + new_condition_i + '_1">' +
                        // '<option value="">請由左方選取物件' +
                        // '</select> ' +
                        ' 動作 ' +
                        '<div id="do_action' + condadd_parent_num + '_' + cond_add_child_i + '" style="display: inline-block;">' +
                        '</div>' +
                        '<input type="button" class="input-act-delete" id="act_del' + condadd_parent_num + '_' + cond_add_child_i + '" value="物件動作--" onclick="act_del(\'' + condadd_parent_num + '_' + cond_add_child_i + '\');">';
                        if (cond_add_child_i == 5) {
                            html +=
                            '<input type="button" class="input-act-add" id="act_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="物件動作++" onclick="act_add(act_add' + condadd_parent_num + '_' + cond_add_child_i + ');"><br>';
                        } else {
                            html +=
                            '<input type="button" class="input-act-add" id="act_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="物件動作++" onclick="act_add(act_add' + condadd_parent_num + '_' + cond_add_child_i + ');" style="display: none;"><br>';
                        }
                        
                        html += '</div>';
                    }
                    html += '</div>';

                    // 新增的 條件物件動作++ 條件物件動作-- 按鈕
                    html += '<input type="button" class="input-delete" id="del' + condadd_parent_num + '" value="條件物件動作--" onclick="Delete(' + condadd_parent_num + ');"><br>' +
                            '<input type="button" class="input-add" id="add' + condadd_parent_num + '" value="條件物件動作++" onclick="Add(add' + condadd_parent_num + ');">' +
                            '</div>' ;
                }
                html += '</div>' ;
                var divbox = document.getElementById('DBvalue');
                divbox.insertAdjacentHTML('beforeend', html);
            }
        </script>


        - - - DB 取值測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>

        <!-- 0225 手風琴測試 start -->
        - - - 手風琴測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>

        

        - - - 手風琴測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>
        <!-- 0225 手風琴測試 end -->
        
        原本 BOX 的位置<br>
        - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        <br>

        <input type="button" id="test" value="取值測試" onclick="test();"><br>
        <span id="value_test"> ( 取值測試 ) </span><br>
        <span id="command_test"> ( command 測試 ) </span><br>
        <input type="button" id="test" value="ajax 測試" onclick="AJAXtest();">

        <script>
            function act_add(evt) {
                evt.style.display = "none";
                var actadd_parent_num = String(evt.id).split('_')[1].slice(3, )
                // console.log("actadd_parent_num: " + actadd_parent_num)

                act_add_child_i++;

                var html = '';
                html +=
                '<div id="action' + actadd_parent_num + '_' + act_add_child_i + '">' +
                '物件 ' +
                '<select id="do_obj' + actadd_parent_num + '_' + act_add_child_i + '" onChange="renew(\'' + actadd_parent_num + '_' + act_add_child_i + '\', this.selectedIndex);">' +
                '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' +
                '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
                '<option value="tank_vacuum_status">真空吸料機</option>' +
                '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
                '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
                '<option value="tank_motor_status">馬達</option>' +
                '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
                '<option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>' +
                '<option value="tank_heater1_status">加熱棒 1</option>' +
                '<option value="tank_heater2_status">加熱棒 2</option>' +
                '<option value="tank_temp_enable">溫控開關</option>' +
                '<option value="tank_temp">溫度設定</option>' +
                '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
                '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
                '<option value="tank_magneticSwitch_status">電磁開關</option>' +
                '<option value="tank_emergencySwitch_status">緊急開關</option>' +
                '<option value="tank_camera_status">攝影機</option>' +
                '<option value="tank_warningLight_status">警示燈</option>' +
                '<option value="time.sleep">暫停秒數</option>' +
                '<option value="dry_container_status">桶槽狀態</option>' +
                '</select> ' +
                '動作 ' +
                '<div id="do_action' + actadd_parent_num + '_' + act_add_child_i + '" style="display: inline-block;">' +
                '</div>' +
                // '<select id="do_act' + actadd_parent_num + '_' + act_add_child_i + '">' +
                // '<option value="">請由左方選取物件</option>' +
                // '</select> ' +
                '<input type="button" class="input-act-delete" id="act_del' + actadd_parent_num + '_' + act_add_child_i + '" value="物件動作--" onclick="act_del(\'' + actadd_parent_num + '_' + act_add_child_i + '\');">' +
                '<input type="button" class="input-act-add" id="act_add' + actadd_parent_num + '_' + act_add_child_i + '" value="物件動作++" onclick="act_add(act_add' + actadd_parent_num + '_' + act_add_child_i + ');"><br>' +
                '</div>';

                var divbox = document.getElementById('action' + actadd_parent_num);
                divbox.insertAdjacentHTML('beforeend', html);
            }

            function act_del(evt) {
                var del_action = document.getElementById('action' + evt);
                del_action.innerHTML = ""

                var parentObj = del_action.parentNode;       // 取得欲刪除 div 的父類別
                parentObj.removeChild(del_action)            // 刪除 div
                
                var del_act_parent_num = String(evt).split('_')[0]
                var del_act_child_num = String(evt).split('_')[1]
                // console.log('del_act_parent_num: ' + del_act_parent_num)
                // console.log('del_act_child_num: ' + del_act_child_num)
                var button_return_id = document.getElementById('act_add' + del_act_parent_num + '_' + String(parseInt(del_act_child_num)-1));
                // console.log("test: " + 'cond_add' + del_act_parent_num + '_' + String(parseInt(del_act_child_num)-1))
                // console.log("button_return_id: " + button_return_id)    // null
                if (button_return_id == null) {
                    var button_return_id = document.getElementById('act_add' + del_act_parent_num + '_1');
                }
                button_return_id.style.display = "inline";

            }   
            // --------------------------------------------------------------------------------------------------
            
            
                    
            function cond_add(evt) {                                                // cond_add1_1 下一個是 cond_add1(條件)_2(子條件)
                evt.style.display = "none";                                         // 不顯示原按鈕
                var condadd_parent_num = String(evt.id).split('_')[1].slice(3, )    // 把第一個條件的編號記下
                // console.log("condadd_parent_num: " + condadd_parent_num)

                cond_add_child_i++

                var html = '';
                html +=
                '<div id="condition' + condadd_parent_num + '_' + cond_add_child_i + '">' +
                '<select id="cond_d' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                '<option value="and">and</option>' + 
                '<option value="or">or</option>' + 
                '</select> ' + 
                '<select id="cond_a' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                '<option value="">制動器 / 感測器</option>' + 
                '<optgroup label="制動器狀態">' + 
                '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' + 
                '<option value="tank_vacuum_status">真空吸料機</option>' + 
                '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' + 
                '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' + 
                '<option value="tank_motor_status">馬達</option>' + 
                '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' + 
                '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' + 
                '<option value="tank_heater1_status">加熱棒 1</option>' + 
                '<option value="tank_heater2_status">加熱棒 2</option>' + 
                '<option value="tank_temp_enable">溫控開關</option>' + 
                '<option value="tank_temp">溫度設定</option>' + 
                '<option value="tank_diskvalve_status">蝴蝶閥</option>' + 
                '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' + 
                '<option value="tank_magneticSwitch_status">電磁開關</option>' + 
                '<option value="tank_emergencySwitch_status">緊急開關</option>' + 
                '<option value="tank_camera_status">攝影機</option>' + 
                '<option value="tank_warningLight_status">警示燈</option>' + 
                '</optgroup>' + 
                '<optgroup label="感測器數值">' + 
                '<option value="tank_ultrasonic_status">超音波感測器</option>' + 
                '<option value="tank_pa_status">大氣壓力計</option>' + 
                '<option value="tank_motorencoder_status">馬達編碼器</option>' + 
                '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' + 
                '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' + 
                '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' + 
                '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' + 
                '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' + 
                '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' + 
                '<option value="outer_waterlevel_status">夾層水位計</option>' + 
                '</optgroup>' + 
                '</select> ' + 
                '<select id="cond_b' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                // '<option value="equal">==</option>' +
                // '<option value="morethan">&gt;=</option>' +
                // '<option value="lessthan">&lt;=</option>' +
                '<option value="MoreThan">&gt;</option>' + 
                '<option value="MoreThanEqualTo">&gt;=</option>' + 
                '<option value="Equal" selected>==</option>' + 
                '<option value="LessThanEqualTo">&lt;=</option>' + 
                '<option value="LessThan">&lt;</option>' + 
                '</select> ' +
                '<input list="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '" id="cond_c' + condadd_parent_num + '_' + cond_add_child_i + '">' + 
                '<datalist id="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '">' +
                '<option value="on">' +
                '<option value="off">' +
                '<option value="(或請自行輸入數值)">' +
                '</datalist> ' +
                '<input type="button" class="input-cond-delete" id="cond_del' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件--" onclick="cond_del(\'' + condadd_parent_num + '_' + cond_add_child_i + '\');">' +
                '<input type="button" class="input-cond-add" id="cond_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件++" onclick="cond_add(cond_add' + condadd_parent_num + '_' + cond_add_child_i + ');"><br>' +
                '</div>';

                var divbox = document.getElementById('condition' + condadd_parent_num);
                divbox.insertAdjacentHTML('beforeend', html);
            }

            function cond_del(evt) {
                // console.log('evt: ' + evt)
                var del_cond_child = document.getElementById('condition' + evt);
                // console.log("del_cond_child: " + del_cond_child)
                del_cond_child.innerHTML = ""

                var parentObj = del_cond_child.parentNode;       // 取得欲刪除 div 的父類別
                parentObj.removeChild(del_cond_child)            // 刪除 div

                // 上一個按鈕要顯示出來
                var del_cond_parent_num = String(evt).split('_')[0]
                var del_cond_child_num = String(evt).split('_')[1]
                console.log('del_cond_parent_num: ' + del_cond_parent_num)
                console.log('del_cond_child_num: ' + del_cond_child_num)
                var button_return_id = document.getElementById('cond_add' + del_cond_parent_num + '_' + String(parseInt(del_cond_child_num)-1));
                console.log("test: " + 'cond_add' + del_cond_parent_num + '_' + String(parseInt(del_cond_child_num)-1))
                console.log("button_return_id: " + button_return_id)    // null
                if (button_return_id == null) {
                    var button_return_id = document.getElementById('cond_add' + del_cond_parent_num + '_1');
                }
                button_return_id.style.display = "inline";
            }

            // -------------------------------------------------------------------------------------------------------------


            

            function Add(evt) {                                 // 網頁初始按鈕 onclick="Add(add1);
                evt.style.display = "none";                     // 元素不顯示。將 add1 的 input-button 不顯示
                new_condition_i++;                                            // 設定編號用
                // var div = document.createElement('div');        // 輸出 <div></div>。此時並不會顯示, 
                                                                // 需透過 appendChild()、insertBefore() 或 replaceChild() 等方法將新元素加入至指定的位置之後才會顯示。
                // var cond_number = String(evt).slice(3, )        // 目前的 condition 條件物件動作 數 (最外層)
                // var cond_a = 'cond_a' + cond_number + '_' + new_condition_i;  // [條件] 左方 : 制動器感測器
                // var cond_b = 'cond_b' + cond_number + '_' + new_condition_i;  // [條件] 中間 : > / = / < 
                // var cond_c = 'cond_c' + cond_number + '_' + new_condition_i;  // [條件] 右方 : ON / OFF / 數值
                // var cond_d = 'cond_d' + cond_number + '_' + new_condition_i;  // 條件] 最左方條件連接 : and / or
                // div.id = 'newcondition_' + new_condition_i;                   // 設定 div 的 id
                // div.style.marginTop = "10px";                   // 新增的 div 設定 marginTop 屬性值
                var html = ''

                

                // 新增的條件
                html += 
                '<div id="newcondition_' + new_condition_i + '" class="newcondition_css">' +
                
                // 新增的分隔線
                // '<hr size="50" width="100%">' +


                '<div id="condition' + new_condition_i + '">' +
                '<div id="condition' + new_condition_i + '_1">' +
                '條件 ' +
                '<select id="cond_z' + new_condition_i + '_1">' +
                '<option value="if">if</option>' +
                '<option value="elif">elif</option>' +
                '<option value="else">else</option>' +
                '</select> ' +
                '<select id="cond_tank' + new_condition_i + '_1">' +
                '<option value="D1">乾燥桶 D1</option>' +
                '<option value="D2">乾燥桶 D2</option>' +
                '<option value="D3">乾燥桶 D3</option>' +
                '<option value="D4">乾燥桶 D4</option>' +
                '<option value="D5">乾燥桶 D5</option>' +
                '<option value="D6">乾燥桶 D6</option>' +
                '<option value="D7">乾燥桶 D7</option>' +
                '<option value="D8">乾燥桶 D8</option>' +
                '<option value="D9">乾燥桶 D9</option>' +
                '<option value="D10">乾燥桶 D10</option>' +
                '<option value="D11">乾燥桶 D11</option>' +
                '<option value="D12">乾燥桶 D12</option>' +
                '</select> ' +
                '<select id="cond_a' + new_condition_i + '_1">' +
                '<option value="">制動器 / 感測器</option>' + 
                '<optgroup label="制動器狀態">' + 
                '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' + 
                '<option value="tank_vacuum_status">真空吸料機</option>' + 
                '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' + 
                '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' + 
                '<option value="tank_motor_status">馬達</option>' + 
                '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' + 
                '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' + 
                '<option value="tank_heater1_status">加熱棒 1</option>' + 
                '<option value="tank_heater2_status">加熱棒 2</option>' + 
                '<option value="tank_temp_enable">溫控開關</option>' + 
                '<option value="tank_temp">溫度設定</option>' + 
                '<option value="tank_diskvalve_status">蝴蝶閥</option>' + 
                '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' + 
                '<option value="tank_magneticSwitch_status">電磁開關</option>' + 
                '<option value="tank_emergencySwitch_status">緊急開關</option>' + 
                '<option value="tank_camera_status">攝影機</option>' + 
                '<option value="tank_warningLight_status">警示燈</option>' + 
                '</optgroup>' + 
                '<optgroup label="感測器數值">' + 
                '<option value="tank_ultrasonic_status">超音波感測器</option>' + 
                '<option value="tank_pa_status">大氣壓力計</option>' + 
                '<option value="tank_motorencoder_status">馬達編碼器</option>' + 
                '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' + 
                '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' + 
                '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' + 
                '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' + 
                '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' + 
                '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' + 
                '<option value="outer_waterlevel_status">夾層水位計</option>' + 
                '</optgroup>' + 
                '</select> ' +
                '<select id="cond_b' + new_condition_i + '_1">' +
                // '<option value="equal">==</option>' +
                // '<option value="morethan">&gt;=</option>' +
                // '<option value="lessthan">&lt;=</option>' +
                '<option value="MoreThan">&gt;</option>' + 
                '<option value="MoreThanEqualTo">&gt;=</option>' + 
                '<option value="Equal" selected>==</option>' + 
                '<option value="LessThanEqualTo">&lt;=</option>' + 
                '<option value="LessThan">&lt;</option>' + 
                '</select> ' +
                '<input list="cond_list_c' + new_condition_i + '_1" id="cond_c' + new_condition_i + '_1">' +
                '<datalist id="cond_list_c' + new_condition_i + '_1">' +
                '<option value="on">' +
                '<option value="off">' +
                '<option value="(或請自行輸入數值)">' +
                '</datalist> ' +
                '<input type="button" class="input-cond-add" id="cond_add' + new_condition_i + '_1" value="條件++" onclick="cond_add(cond_add' + new_condition_i + '_1)"><br>' +
                '</div></div>';

                // 新增的物件動作
                html +=
                '<div id="action' + new_condition_i + '">' +
                '<div id="action' + new_condition_i + '_1">' +
                '物件 ' +
                '<select id="do_obj' + new_condition_i + '_1" onChange="renew(\''+ new_condition_i + '_1\', this.selectedIndex);">' +
                    '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' +
                '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
                '<option value="tank_vacuum_status">真空吸料機</option>' +
                '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
                '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
                '<option value="tank_motor_status">馬達</option>' +
                '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
                '<option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>' +
                '<option value="tank_heater1_status">加熱棒 1</option>' +
                '<option value="tank_heater2_status">加熱棒 2</option>' +
                '<option value="tank_temp_enable">溫控開關</option>' +
                '<option value="tank_temp">溫度設定</option>' +
                '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
                '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
                '<option value="tank_magneticSwitch_status">電磁開關</option>' +
                '<option value="tank_emergencySwitch_status">緊急開關</option>' +
                '<option value="tank_camera_status">攝影機</option>' +
                '<option value="tank_warningLight_status">警示燈</option>' +
                '<option value="time.sleep">暫停秒數</option>' +
                '<option value="dry_container_status">桶槽狀態</option>' +
                '</select>' +
                '動作 ' +
                '<div id="do_action' + new_condition_i + '_1" style="display: inline-block;">' +
                '</div>' +
                // '<select id="do_act' + new_condition_i + '_1">' +
                // '<option value="">請由左方選取物件' +
                // '</select> ' +
                '<input type="button" class="input-act-add" id="act_add' + new_condition_i + '_1" value="物件動作++" onclick="act_add(act_add' + new_condition_i + '_1);"><br>' +
                '</div>' +
                '</div>' +

                // 新增的 條件物件動作++ 條件物件動作-- 按鈕
                '<input type="button" class="input-delete" id="del' + new_condition_i + '" value="條件物件動作--" onclick="Delete(' + new_condition_i + ');"><br>' +
                '<input type="button" class="input-add" id="add' + new_condition_i + '" value="條件物件動作++" onclick="Add(add' + new_condition_i + ');">' +
                '</div>' ;

                var divbox = document.getElementById('box');
                divbox.insertAdjacentHTML('beforeend', html);

            };
            function Delete(evt) {
                var del_condition = document.getElementById('newcondition_' + evt);
                del_condition.innerHTML = ""

                var parentObj = del_condition.parentNode;       // 取得欲刪除 div 的父類別
                parentObj.removeChild(del_condition)            // 刪除 div

                // 上一個按鈕要顯示出來
                var button_return_id = document.getElementById('add' + String(parseInt(evt)-1));
                if (button_return_id == null) {
                    var button_return_id = document.getElementById('add1');
                }
                // console.log('button_return_id: ' + button_return_id)
                button_return_id.style.display = "block";        // 元素顯示。顯示前一個 input-button
            };
            // -------------------------------------------------------------------------------------- 

            var set_Schedule = '';

            function test(){
                // console.log("new_condition_i: " + new_condition_i)      // 總數 : 條件物件動作
                // console.log("cond_add_child_i: " + cond_add_child_i)    // 總數 : 子 條件
                // console.log("act_add_child_i: " + act_add_child_i)      // 總數 : 子 物件動作

                // set_Schedule += 'set_Schedule = { ';
                set_Schedule = '{ ';
                var set_key = [];
                var set_value = [];

                var command_test = '';
                var Z = 0;
                // 條件物件動作 取值
                for (let z = 1; z <= new_condition_i; z++) {
                    // if-while 取值
                    try {
                        var cond_z_value = document.getElementById("cond_z" + z + "_1").value;
                        // console.log("cond_z" + z + "_1: " + cond_z_value)
                        Z = Z + 1;
                        set_Schedule += '"cond_z' + Z + '_1": "' + cond_z_value + '", ' ;
                        set_key.push('cond_z' + Z + '_1');
                        set_value.push(cond_z_value);
                    } catch (error) {
                        if (error.name == 'TypeError') {
                            // console.log("cond_z" + z + "_1: null")
                            // set_Schedule += '"cond_z' + Z + '_1": "", ' ;
                        } else {
                            alert("cond_z" + z + "_1: " + error.name)
                            break
                        }
                    }

                    // 桶槽號碼 取值
                    try {
                        var cond_tank_value = document.getElementById("cond_tank" + z + "_1").value;
                        // console.log("cond_tank" + z + "_1: " + cond_tank_value)
                        set_Schedule += '"cond_tank' + Z + '_1": "' + cond_tank_value + '", ' ;
                        set_key.push('cond_tank' + Z + '_1');
                        set_value.push(cond_tank_value);
                    } catch (error) {
                        if (error.name == 'TypeError') {
                            // console.log("cond_tank" + z + "_1: null")
                            // set_Schedule += '"cond_tank' + Z + '_1": "", ' ;
                        } else {
                            alert("cond_tank" + z + "_1: " + error.name)
                            break
                        }
                    }

                    // 子 條件 取值
                    var X = 1;
                    for (let x = 1; x <= cond_add_child_i; x++) {
                        // 子條件取值 : 條件連接 and or
                        if (x > 1) {
                            try {
                                var cond_d_value = document.getElementById("cond_d" + z + "_" + x).value;
                                // console.log("cond_d" + z + "_" + x + ": " + cond_d_value)
                                X = X + 1;
                                set_Schedule += '"cond_d' + Z + '_' + X + '": "' + cond_d_value + '", ' ;
                                set_key.push('cond_d' + Z + '_' + X);
                                set_value.push(cond_d_value);
                            } catch (error) {
                                if (error.name == 'TypeError') {
                                    // console.log("cond_d" + z + "_" + x + ": null")
                                    // set_Schedule += '"cond_d' + Z + '_' + x + '": "", ' ;
                                } else {
                                    alert("cond_d" + z + "_" + x + ": " + error.name)
                                    break
                                }
                            }
                        }
                        try {
                            var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
                            // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
                            set_Schedule += '"cond_a' + Z + '_' + X + '": "' + cond_a_value + '", ' ;
                            set_key.push('cond_a' + Z + '_' + X);
                            set_value.push(cond_a_value);
                            if (cond_a_value == '') {
                                alert('條件欄位輸入有誤, 請再次確認')
                                break
                            }
                        } catch (error) {
                            if (error.name == 'TypeError') {
                                // console.log("cond_a" + z + "_" + x + ": null")
                                // set_Schedule += '"cond_a' + z + '_' + x + '": "", ' ;
                            } else {
                                alert("cond_a" + z + "_" + x + ": " + error.name)
                                break
                            }
                        }
                        // 子條件取值 : 條件中 > = <
                        try {
                            var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
                            // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
                            set_Schedule += '"cond_b' + Z + '_' + X + '": "' + cond_b_value + '", ' ;
                            set_key.push('cond_b' + Z + '_' + X);
                            set_value.push(cond_b_value);
                            if (cond_b_value == '') {
                                alert('條件欄位輸入有誤, 請再次確認')
                                break
                            }
                        } catch (error) {
                            if (error.name == 'TypeError') {
                                // console.log("cond_b" + z + "_" + x + ": null")
                                // set_Schedule += '"cond_b' + z + '_' + x + '": "", ' ;
                            } else {
                                alert("cond_b" + z + "_" + x + ": " + error.name)
                                break
                            }
                        }
                        // 子條件取值 : 條件右 ON / OFF / 輸入數值
                        try {
                            var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
                            // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
                            set_Schedule += '"cond_c' + Z + '_' + X + '": "' + cond_c_value + '", ' ;
                            set_key.push('cond_c' + Z + '_' + X);
                            set_value.push(cond_c_value);
                            if (cond_c_value == '') {
                                alert('條件欄位輸入有誤, 請再次確認')
                                break
                            }
                        } catch (error) {
                            if (error.name == 'TypeError') {
                                // console.log("cond_c" + z + "_" + x + ": null")
                                // set_Schedule += '"cond_c' + z + '_' + x + '": "", ' ;
                            } else {
                                alert("cond_c" + z + "_" + x + ": " + error.name)
                                break
                            }
                        }   
                    }

                    // 子 物件動作 取值
                    var Y = 0;
                    for (let y = 1; y <= act_add_child_i; y++) {
                        // 子物件動作取值 : 物件 do_obj1_1
                        try {
                            var do_obj_value = document.getElementById("do_obj" + z + "_" + y).value;
                            if (do_obj_value == '') {
                                alert('物件欄位輸入有誤, 請再次確認')
                                break
                            }
                            // console.log("do_obj" + z + "_" + y + ": " + do_obj_value)
                            Y = Y + 1;
                            set_Schedule += '"do_obj' + Z + '_' + Y + '": "' + do_obj_value + '", ' ;
                            // command_test += '{"tank_num": "' + cond_tank_value + '", "command": "' + do_obj_value + '", "value":"';
                            set_key.push('do_obj' + Z + '_' + Y);
                            set_value.push(do_obj_value);
                        } catch (error) {
                            if (error.name == 'TypeError') {
                                // console.log("do_obj" + z + "_" + y + ": null")
                                // set_Schedule += '"do_obj' + z + '_' + y + '": "", ' ;
                            } else {
                                alert("do_obj" + z + "_" + y + ": " + error.name)
                                break
                            }
                        }
                        // 子物件動作取值 : 動作 do_act1_1
                        try {
                            var do_act_value = document.getElementById("do_act" + z + "_" + y).value;
                            if (do_act_value == '') {
                                alert('動作欄位輸入有誤, 請再次確認')
                                break
                            }
                            // console.log("do_act" + z + "_" + y + ": " + do_act_value)
                            set_Schedule += '"do_act' + Z + '_' + Y + '": "' + do_act_value + '", ' ;
                            // command_test += do_act_value + '" }';
                            set_key.push('do_act' + Z + '_' + Y);
                            set_value.push(do_act_value);
                        } catch (error) {
                            if (error.name == 'TypeError') {
                                // console.log("do_obj" + z + "_" + y + ": null")
                                // set_Schedule += '"do_act' + z + '_' + y + '": "", ' ;
                            } else {
                                alert("do_act" + z + "_" + y + ": " + error.name)
                                break
                            }
                        }
                    }
                }

                // 整理資料用
                set_Schedule += '"": ""}' ;
                // console.log('set_Schedule: ' + set_Schedule)
                $('#value_test').text('set_Schedule: ' + set_Schedule)
                // $('#command_test').text('command_test: ' + command_test)

                // var SQL_insert = 'INSERT INTO `dry_block_waiting_setting`(' + 
                //                 '`datetime`, ' + 
                //                 '`cond_z1_1`, `cond_tank1_1`, `cond_a1_1`, `cond_b1_1`, `cond_c1_1`, ' +
                //                 '`cond_d1_2`, `cond_a1_2`, `cond_b1_2`, `cond_c1_2`, ' +
                //                 '`do_obj1_1`, `do_act1_1`, ' + 
                //                 '`do_obj1_2`, `do_act1_2`' + 
                //                 ') VALUES (' + 
                //                 'current_timestamp(),' + 
                //                 '"A","A","A","A","A",' + 
                //                 '"A","A","A","A",' + 
                //                 '"A","A",' + 
                //                 '"A","A")'

                var SQL_insert = 'INSERT INTO `dry_block_waiting` (' + 
                                '`datetime`, `' + set_key.join("`, `") + '`) VALUES (' + 
                                'current_timestamp(), "' + set_value.join('", "') + '")';
                

                var sql_data = { "sql":SQL_insert };
                console.log("sql_data: ", sql_data)
                // $.get('/sql_get', sql_data, function (res) {
                //     alert("OK")
                // }, 'json');
            }
        
            function AJAXtest(params) {
                test();

                var schedule_data = {
                    "condition":new_condition_i,
                    "cond_add_child":cond_add_child_i,
                    "act_add_child":act_add_child_i,
                    "set_Schedule":set_Schedule
                };

                $.get('/dry_block_set', schedule_data, function (res) {
                    // console.log("res.condition: " + res.condition)
                    // console.log("res.cond_add_child: " + res.cond_add_child)
                    // console.log("res.act_add_child: " + res.act_add_child)
                    console.log("res.response: " + res.response)
                }, 'json');                
            }
        </script>

        <div id="coffee_footer">
            <!-- 匯入共同使用的 footer.html 內容 -->
            {% include 'footer.html' %}
        </div>
    </div>


    <script>
        
        function showMotorValue(obj_num, value){
            // document.getElementById("do_act1_1").innerHTML = value;
            // console.log("newVal: " + newVal)
            document.getElementById("motorValue_text" + obj_num).innerText = value;
        }

        function showTempValue(obj_num, value) {
            document.getElementById("tempValue_text" + obj_num).innerText = value;
        }

        function showSleepValue(obj_num, value) {
            document.getElementById("sleepValue_text" + obj_num).innerText = value + 's';
        }
        
    </script>

</body>

</html>