<!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)

        $(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);   
            }
        });

        var Z;
        var X;
        var Y;
        var TT = {};  // 將總條件句/附加條件句/物件動作句存入 字典, 後續傳給 dry_block_format 再組合
        // DRY_CONTAINER_STATUS 讓 do_act / dry_object 判斷用
        const DRY_CONTAINER_STATUS = {'空桶等待':'D_Waiting',
                                        '入豆中':'D_InputtingBean',
                                        '入豆暫停':'D_InputtingBean_Pause',
                                        '入豆完成':'D_InputtingBean_Finish',
                                        '夾層入水':'D_InputtingWater',
                                        '乾燥':'D_Drying',
                                        '可出豆':'D_OutputtingBean'}
    </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;
        }
        .input-sensor-text {
            width: 80px; 
            height: 25px;
            text-align: center;
        }
        .input-actuator-text {
            width: 80px; 
            height: 25px;
            text-align: center;
        }
        /* 0325 radio button 測試 */
        #radio input[type="radio"] {display: none; }
        #radio input:checked + .button {background: #5e7380; color: #fff; cursor: default; }
        #radio .button {display: inline-block; margin: 0 5px 10px 0; padding: 5px 10px; background: #f7f7f7; color: #333; cursor: pointer; }
        #radio .button:hover {background: #bbb; color: #fff; }
        #radio .round {border-radius: 5px; }
        /* 0325 radio button 測試 */



        /* 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 背景變成橘色。 #fa0; */
            background-color: rgb(255, 198, 83);
            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>

        <!-- 0225 手風琴測試 start -->
        - - - 手風琴測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>
        <div class="accordion" style="text-align: left;">

            <label for="tab1">乾燥槽 - 空桶等待</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab1">
                <div class="content">
                    <!-- Title : <br> -->
                    <label for="tab1-1">● 制動器初始狀態</label>
                    <div class="box">
                        <input type="checkbox" name="tab1" id="tab1-1">
                        <div class="content00">
                            入料儲豆槽真空吸料機
                            <input type="text" class="input-actuator-text" id="actuatorInput_DW_0" value="off"><br>
                            <br>
                            <!-- 0325 radio button 測試 -->
                            <div id="radio">
                                <label style="width:fit-content; height: fit-content;"><input type="radio" name="label" value="on" checked="checked"><span class="round button">on</span></label>
                                <label style="width:fit-content; height: fit-content;"><input type="radio" name="label" value="off"><span class="round button">off</span></label>
                            </div>
                            <!-- 0325 radio button 測試 -->
                            <br>
                            真空吸料機<br>
                            吸料機三通閥<br>
                            消毒電磁閥<br>
                            馬達<br>
                            桶外進水電磁閥<br>
                            廢水排水電磁閥<br>
                            加熱棒 1<br>
                            加熱棒 2<br>
                            溫控開關<br>
                            溫度設定<br>
                            蝴蝶閥<br>
                            出料儲豆槽真空吸料機<br>
                            電磁開關<br>
                            緊急開關<br>
                            攝影機<br>
                            警示燈<br>
                        </div>
                    </div>
                    <label for="tab1-2">● 感測器取值頻率 (設定 0 時不取值)</label>
                    <div class="box">
                        <input type="checkbox" name="tab1" id="tab1-2">
                        <div class="content00">
                            <s>tt溫度擷取頻率
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_0" min="0" max="3600" step="5" value="10"> 秒</s><br>
                            超音波感測器
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_1" min="0" max="3600" step="5" value="10"> 秒<br>
                            大氣壓力計
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_2" min="0" max="3600" step="5" value="10"> 秒<br>
                            馬達編碼器
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_3" min="0" max="3600" step="5" value="10"> 秒<br>
                            溫溼度計_溫度/濕度
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_4" min="0" max="3600" step="5" value="10"> 秒<br>
                            三合一土壤感測器_溫度/濕度/EC
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_5" min="0" max="3600" step="5" value="10"> 秒<br>
                            蝴蝶閥狀態顯示器
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_6" min="0" max="3600" step="5" value="10"> 秒<br>
                            夾層水位計
                            <input type="number" class="input-sensor-text" id="sensorInput_DW_7" min="0" max="3600" step="5" value="10"> 秒<br>
                        </div>
                    </div>
                    <label for="tab1-3">● 條件動作</label>
                    <div class="box">
                        <input type="checkbox" name="tab1" id="tab1-3">
                        <div class="content00">
                            <div id="box">
                                <div id="newcondition_1" class="newcondition_css">
                                    <!-- 總 條件 -->
                                    <div id="condition1">
                                        <!-- 子條件 1_1-->
                                        <div id="condition1_1">
                                            條件
                                            <select id="cond_z1_1">
                                                <option value="if">if</option>
                                                <option value="elif">elif</option>
                                                <option value="else">else</option>
                                            </select>
                                            <select id="cond_tank1_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_a1_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_b1_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_c1_1" id="cond_c1_1">
                                            <datalist id="cond_list_c1_1">
                                                <option value="on">
                                                <option value="off">
                                                <option value="(或請自行輸入數值)">
                                            </datalist>
                                            <input type="button" class="input-cond-add" id="cond_add1_1" value="條件++" onclick="cond_add(cond_add1_1);"><br>
                                            <script>
                                                var cond_add_child_i = 1                                                // 這是子條件
                    
                                                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";
                                                }
                                            </script>
                    
                                        </div>
                                    </div>
                    
                                    <div id="action1">
                                        <div id="action1_1">
                                            物件
                                            <select id="do_obj1_1" onChange="renew('1_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>
                                            動作
                                            <!-- <select id="do_act1_1">
                                                <option value="">請由左方選取物件
                                            </select> -->
                                            <div id="do_action1_1" style="display: inline-block;">
                                            </div>
                                            <input type="button" class="input-act-add" id="act_add1_1" value="物件動作++" onclick="act_add(act_add1_1);"><br>
                                        
                                        </div>
                                        <script>
                                            var act_add_child_i = 1
                                            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";
                    
                                            }
                                        </script>
                    
                                        
                                    </div>
                    
                                    <input type="button" class="input-add" id="add1" value="條件物件動作++" onclick="Add(add1);">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <label for="tab2">乾燥槽 - 入豆</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab2">
                <div class="content">
                    hello<br>
                    hello<br>
                    hello<br>
                </div>
            </div>
            <label for="tab3">乾燥槽 - 入豆暫停</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab3">
                <div class="content">
                    hello<br>
                    hello<br>
                    hello<br>
                </div>
            </div>
            <label for="tab4">乾燥槽 - 入豆完成</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab4">
                <div class="content">
                    hello<br>
                    hello<br>
                    hello<br>
                </div>
            </div>
            <label for="tab5">乾燥槽 - 乾燥</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab5">
                <div class="content">
                    hello<br>
                    hello<br>
                    hello<br>
                </div>
            </div>
            <label for="tab6">乾燥槽 - 可出豆</label>
            <div class="box">
                <input type="checkbox" name="tab" id="tab6">
                <div class="content">
                    hello<br>
                    hello<br>
                    hello<br>
                </div>
            </div>

        </div>

        <script>
            var new_condition_i = 1

            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
            };

        </script>

        

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

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

        <script>
            var set_Schedule = '{ ';            // 紀錄 變數名稱 + 值

            var cond_main = '';                 // 主條件
            var cond_add_list = [];             // 附加條件 List
            var cond_add_data = '';             // 欲加入附加條件的資料
            var cond_com_list = [];             // 動作 List
            var cond_com_data = '';             // 欲加入動作的資料
            var cond_item = [];                 // 主條件+附加條件+動作 List
            var cond_all = [];                  // cond_item List (未用)

            // 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 command_test = '';
            //     // 條件物件動作 取值
            //     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)
            //             set_Schedule += '"cond_z' + z + '_1": "' + 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 + '", ' ;
            //         } 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
            //             }
            //         }

            //         // 子 條件 取值
            //         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)
            //                     set_Schedule += '"cond_d' + z + '_' + x + '": "' + 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 + '", ' ;
            //                 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 + '", ' ;
            //                 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 + '", ' ;
            //                 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
            //                 }
            //             }   
            //         }

            //         // 子 物件動作 取值
            //         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)
            //                 set_Schedule += '"do_obj' + z + '_' + y + '": "' + do_obj_value + '", ' ;
            //                 command_test += '{"tank_num": "' + cond_tank_value + '", "command": "' + do_obj_value + '", "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 + '" }';
            //             } 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)
            // }

            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 = { ';
                cond_item = [];
                var command_test = '';
                Z = 0;
                TT = {};        // 將總條件句/附加條件句/物件動作句存入 字典, 後續傳給 dry_block_format 再組合
                var set_key = [];                   // List 加入變數名稱, INSERT DB 用
                var set_value = [];                 // List 加入值, INSERT DB 用

                // 條件物件動作 取值
                for (let z = 1; z <= new_condition_i; z++) {
                    // 初始清空
                    cond_main = '';
                    // if-while 取值
                    try {
                        var cond_z_value = document.getElementById("cond_z" + z + "_1").value;
                        // console.log("cond_z" + z + "_1: " + cond_z_value)
                        if (cond_z_value == '') {
                            alert('if/while 欄位未輸入')
                        } else {
                            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);
                            cond_main += cond_z_value + ' ';
                        }
                    } catch (error) {
                        if (error.name == 'TypeError') {
                            // 跳號時, 不寫入 DB、不顯示條件
                            // console.log("cond_z" + z + "_1: null")
                            // set_Schedule += '"cond_z' + Z + '_1": "", ' ;
                        } else {
                            alert("cond_z" + z + "_1: " + error.name)
                        }
                    }

                    // 桶槽號碼 取值
                    try {
                        var cond_tank_value = document.getElementById("cond_tank" + z + "_1").value;
                        // console.log("cond_tank" + z + "_1: " + cond_tank_value)
                        if (cond_tank_value == '') {
                            alert('桶槽 欄位未輸入')
                        } else {
                            set_Schedule += '"cond_tank' + Z + '_1": "' + cond_tank_value + '", ' ;
                            set_key.push('cond_tank' + Z + '_1');
                            set_value.push(cond_tank_value);
                            cond_main += 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)
                        }
                    }
                    // 子 條件 取值
                    X = 1;
                    cond_add_list = []; // 附加條件 List 清空
                    for (let x = 1; x <= cond_add_child_i; x++) {
                        cond_add_data = '';  // 附加條件資料 清空
                        if (x == 1) {
                            // 主條件
                            try {
                                var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
                                // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
                                if (cond_a_value == '') {
                                    alert('主條件 感測器 欄位未輸入')
                                } else {
                                    set_Schedule += '"cond_a' + Z + '_' + X + '": "' + cond_a_value + '", ' ;
                                    set_key.push('cond_a' + Z + '_' + X);
                                    set_value.push(cond_a_value);
                                    cond_main += cond_a_value + ' ';
                                }
                            } 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)
                                }
                            }
                            // 子條件取值 : 條件中 > = <
                            try {
                                var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
                                // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
                                if (cond_b_value == '') {
                                    alert('主條件 比較運算子 欄位未輸入')
                                } else {
                                    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 == 'MoreThan') { cond_main += '> '; }
                                    else if (cond_b_value == 'MoreThanEqualTo') { cond_main += '>= '; }
                                    else if (cond_b_value == 'Equal') { cond_main += '== '; }
                                    else if (cond_b_value == 'LessThanEqualTo') { cond_main += '<= '; }
                                    else if (cond_b_value == 'LessThan') { cond_main += '< '; }
                                }
                            } 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)
                                }
                            }
                            // 子條件取值 : 條件右 ON / OFF / 輸入數值
                            try {
                                var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
                                // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
                                if (cond_c_value == '') {
                                    alert('主條件 數值 欄位未輸入')
                                } else {
                                    set_Schedule += '"cond_c' + Z + '_' + X + '": "' + cond_c_value + '", ' ;
                                    set_key.push('cond_c' + Z + '_' + X);
                                    set_value.push(cond_c_value);
                                    cond_main += cond_c_value;
                                }
                            } 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)
                                }
                            }
                        } else {
                            // 附加條件 x > 1
                            // 子條件取值 : 條件連接 and or
                            try {
                                var cond_d_value = document.getElementById("cond_d" + z + "_" + x).value;
                                // console.log("cond_d" + z + "_" + x + ": " + cond_d_value)
                                if (cond_d_value == '') {
                                    alert('附加條件 and/or 欄位未輸入')
                                } else {
                                    X = X + 1;
                                    // console.log("X: " + X)
                                    set_Schedule += '"cond_d' + Z + '_' + X + '": "' + cond_d_value + '", ' ;
                                    set_key.push('cond_d' + Z + '_' + X);
                                    set_value.push(cond_d_value);
                                    cond_add_data += 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)
                                }
                            }
                            // 感測器取值 : 
                            try {
                                var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
                                // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
                                if (cond_a_value == '') {
                                    alert('附加條件 感測器 欄位未輸入')
                                } else {
                                    set_Schedule += '"cond_a' + Z + '_' + X + '": "' + cond_a_value + '", ' ;
                                    set_key.push('cond_a' + Z + '_' + X);
                                    set_value.push(cond_a_value);
                                    cond_add_data += cond_a_value + ' ';
                                }
                            } 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)
                                }
                            }
                            // 子條件取值 : 條件中 > = <
                            try {
                                var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
                                // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
                                if (cond_b_value == '') {
                                    alert('附加條件 比較運算子 欄位未輸入')
                                } else {
                                    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 == 'MoreThan') { cond_add_data += '> '; }
                                    else if (cond_b_value == 'MoreThanEqualTo') { cond_add_data += '>= '; }
                                    else if (cond_b_value == 'Equal') { cond_add_data += '== '; }
                                    else if (cond_b_value == 'LessThanEqualTo') { cond_add_data += '<= '; }
                                    else if (cond_b_value == 'LessThan') { cond_add_data += '< '; }
                                }
                            } 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)
                                }
                            }
                            // 子條件取值 : 條件右 ON / OFF / 輸入數值
                            try {
                                var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
                                // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
                                if (cond_c_value == '') {
                                    alert('附加條件 數值 欄位未輸入')
                                } else {
                                    set_Schedule += '"cond_c' + Z + '_' + X + '": "' + cond_c_value + '", ' ;
                                    set_key.push('cond_c' + Z + '_' + X);
                                    set_value.push(cond_c_value);
                                    cond_add_data += cond_c_value;
                                }
                            } 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)
                                }
                            }
                            if (cond_add_data != '') {
                                console.log("cond_add_list: " + cond_add_list)
                                console.log("cond_add_data: " + cond_add_data)
                                cond_add_list.push(cond_add_data)
                            }
                        }
                    }

                    // 子 物件動作 取值
                    Y = 0;
                    cond_com_list = [];
                    for (let y = 1; y <= act_add_child_i; y++) {
                        cond_com_data = '';
                        // 子物件動作取值 : 物件 do_obj1_1
                        try {
                            var do_obj_value = document.getElementById("do_obj" + z + "_" + y).value;
                            if (do_obj_value == '') {
                                alert('物件 欄位未輸入')
                            } else {
                                // 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);
                                cond_com_data += 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)
                            }
                        }
                        // 子物件動作取值 : 動作 do_act1_1
                        try {
                            var do_act_value = document.getElementById("do_act" + z + "_" + y).value;
                            if (do_act_value == '') {
                                alert('動作 欄位未輸入')
                            } else {
                                // 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);
                                if (DRY_CONTAINER_STATUS[do_act_value] != undefined ) {
                                    // alert("!= undefined")
                                    set_value.push(DRY_CONTAINER_STATUS[do_act_value]);
                                    cond_com_data += DRY_CONTAINER_STATUS[do_act_value];
                                    cond_com_list.push(cond_com_data);
                                } else {
                                    // alert("== undefined")
                                    set_value.push(do_act_value);
                                    cond_com_data += do_act_value;
                                    cond_com_list.push(cond_com_data);
                                }
                                
                                // console.log("cond_com_list: " + cond_com_list)
                                // console.log("cond_com_data: " + cond_com_data)
                                
                            }
                        } 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)
                            }
                        }
                    }
                    // ===== 0324 測試 OK 勿刪 ===================================================
                    var A = 1;
                    var B = 1;
                    console.log("cond_add_list: " + cond_add_list);
                    console.log("cond_com_list: " + cond_com_list);
                    if (cond_main != '') {
                        TT['cond_main' + Z] = cond_main;
                        for (let a = 0; a < cond_add_list.length; a++) {
                            TT['cond_add'+ Z + '_' + A] = cond_add_list[a];
                            A = A + 1;
                        }
                        for (let b = 0; b < cond_com_list.length; b++) { 
                            TT['cond_com'+ Z + '_' + B] = cond_com_list[b]; 
                            B = B + 1;
                        }
                    }
                    // ===== 0324 測試 OK 勿刪 ===================================================

                    
                    cond_item.push(
                            "{'cond_main':'" + cond_main + "'}, " + 
                            "{'cond_add':['" + cond_add_list.join("', '") + "']}, " + 
                            "{'cond_com':['" + cond_com_list.join("', '") + "']}"
                    )
                    console.log("cond_item: [" + cond_item + "]")
                }
                // ===== 0324 測試 OK 勿刪 ===================================================
                TT['mainLength'] = Z
                TT['addLength'] = cond_add_list.length
                TT['comLength'] = cond_com_list.length
                // ===== 0324 測試 OK 勿刪 ===================================================

                // 整理資料用
                // set_Schedule += '"": ""}' ;
                // console.log('set_Schedule: ' + set_Schedule)
                
                // 0321 測試 new
                $('#value_test').text("[{" + cond_item.join('}, {') + "}]")
                // $('#command_test').text('command_test: ' + command_test)

                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 MQTTtest() {
                test();
                // ===== 0324 測試 OK 勿刪 ===================================================
                $.get('/dry_block_format', TT, function (res) {
                    alert("MQTT OK")
                }, 'json');
                // ===== 0324 測試 OK 勿刪 ===================================================       
            }
        </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>