andrey
/
CoffeeProject
원본 프로젝트 : rita/CoffeeProject


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876
							<!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://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/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">
    
    <script language="JavaScript">

        $(function(){

            $("#coffee_title_pc").text("板子燒錄程式");

            $("#coffee_title_phone").text("板子燒錄程式");

            getValue();

            $('.select-input').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>

        .boardpic_position {

            position: absolute;

            /* top: 80px; */

            left: 25px;

        }


        .r5_position {

            position: absolute;

            top: 160px;

            left: 310px;

            width: 40px;

            height: 150px;

            border-style: solid;

            border-color: aqua;

        }

        .div_relay_css {

            position: absolute; 

            border-style: solid; 

            border-color: aqua; 

            text-align: center;

            font-size: 12px;

        }

        /* header */

        /* 文字輸入框 */

        .input-text {

            height: 25px;

            width: 40px;

            text-align: center;

            margin-left: 2px;

            margin-right: 5px;

        }

        /* 致動器狀態表格置中 */

        .label_ActuatorStatus {

            margin: auto;

        }

        /* 致動器 ON 樣式 */

        .input-button-on {

            color: #008CBA;

            border: 2px rgb(182, 181, 181) solid;

            background-color: whitesmoke;

            padding: 1px 3px;

            width: 45px;

        }

        /* 致動器 OFF 樣式 */

        .input-button-off {

            color: #707070;

            border: 2px rgb(192, 192, 192) solid;

            background-color: whitesmoke;

            padding: 1px 3px;

            width: 45px;

        }

        /* 輸入按鈕 */

        .input-button {

            font-size: 14px;

            color: #008CBA;

            border: 2px rgb(182, 181, 181) solid;

            background-color: whitesmoke;

            padding: 1px 3px;

        }

        /* 大表格樣式 */

        .table-all {

            font-size:18px; 

            border:2px #cccccc solid; 

            margin-left: 10px; 

            margin-right: 10px; 

            width: 98%;

        }

        /* footer */

        .footer{

            height: 40px;

            box-sizing: border-box;

            /* 設定footer絕對位置在底部 */

            position: absolute;

            bottom: 0px;

            width: 100%;

            background-color: #eee;

            text-align: center;

        }


        html, body {

            height: 100%;

            /* margin: 0; */

            position: relative;

        }


        #wrapper {

            /* 設定高度最小為100%, 如果內容區塊很多, 可以長大 */

            min-height: 100%;

            /* 位置設為relative, 作為footer區塊位置的參考 */

            position: relative;

        }

    </style>
</head>

<body style="font-size: 18px;">
    <div id="wrapper" style="height: 1500px;">
        <div id="coffee_header">
            <!-- 匯入共同使用的 header.html 內容 -->
            {% include 'header.html' %}
        </div>
        
        <!-- 底圖 板子 -->
        <div id="board_pic" class="boardpic_position">
            <!-- 無標示版本 -->
            <!-- <img src="../static/img/0103_board_coffee1.0.png" width="905px" style="margin: auto;">   -->
            <!-- 有標示版本 -->
            <img src="../static/img/0103_board_coffee1.0_tag.png" width="900px" style="margin: auto;">
        </div>

        <!-- relay1 顯示框 -->
        <div id="relay1" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 42px; width: 28px; height: 110px;">
        </div>
        <!-- relay2 顯示框 -->
        <div id="relay2" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 85px; width: 28px; height: 110px;">
        </div>
        <!-- relay3 顯示框 -->
        <div id="relay3" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 130px; width: 28px; height: 110px;">
        </div>
        <!-- relay4 顯示框 -->
        <div id="relay4" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 170px; width: 28px; height: 110px;">
        </div>
        <!-- relay5 顯示框 -->
        <div id="relay5" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 210px; width: 28px; height: 110px;">
        </div>
        <!-- relay6 顯示框 -->
        <div id="relay6" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 250px; width: 28px; height: 110px;">
        </div>
        <!-- relay7 顯示框 -->
        <div id="relay7" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 290px; width: 28px; height: 110px;">
        </div>
        <!-- relay8 顯示框 -->
        <div id="relay8" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 335px; width: 28px; height: 110px;">
        </div>
        <!-- relay9 顯示框 -->
        <div id="relay9" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 380px; width: 28px; height: 110px;">
        </div>
        <!-- relay10 顯示框 -->
        <div id="relay10" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 420px; width: 28px; height: 110px;">
        </div>
        <!-- relay11 顯示框 -->
        <div id="relay11" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 460px; width: 28px; height: 110px;">
        </div>
        <!-- relay12 顯示框 -->
        <div id="relay12" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 504px; width: 28px; height: 110px;">
        </div>
        <!-- relay13 顯示框 -->
        <div id="relay13" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 545px; width: 28px; height: 110px;">
        </div>
        <!-- relay14 顯示框 -->
        <div id="relay14" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 585px; width: 28px; height: 110px;">
        </div>
        <!-- relay15 顯示框 -->
        <div id="relay15" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 630px; width: 28px; height: 110px;">
        </div>
        <!-- relay16 顯示框 -->
        <div id="relay16" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 670px; width: 28px; height: 110px;">
        </div>
        <!-- relay17 顯示框 -->
        <div id="relay17" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 713px; width: 28px; height: 110px;">
        </div>
        <!-- relay18 顯示框 -->
        <div id="relay18" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 755px; width: 28px; height: 110px;">
        </div>
        <!-- relay19 顯示框 -->
        <div id="relay19" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 795px; width: 28px; height: 110px;">
        </div>
        <!-- relay20 顯示框 -->
        <div id="relay20" tabindex="0" role="button" class="div_relay_css"

             style="top: 122px; left: 840px; width: 28px; height: 110px;">
        </div>

        <!-- 類比 sensor_M4 顯示框 -->
        <div id="sensor_M4" tabindex="0" role="button" class="div_relay_css"

             style="top: 360px; left: 28px; width: 37px; height: 20px;">
        </div>
        <!-- 類比 sensor_M5 顯示框 -->
        <div id="sensor_M5" tabindex="0" role="button" class="div_relay_css"

             style="top: 390px; left: 28px; width: 37px; height: 20px;">
        </div>
        <!-- 類比 sensor_M7 顯示框 -->
        <div id="sensor_M7" tabindex="0" role="button" class="div_relay_css"

             style="top: 420px; left: 28px; width: 37px; height: 20px;">
        </div>

        <!-- PWM sensor_M10 顯示框 -->
        <div id="sensor_M10" tabindex="0" role="button" class="div_relay_css"

             style="top: 360px; left: 70px; width: 45px; height: 20px;">
        </div>
        <!-- PWM sensor_M2 顯示框 -->
        <div id="sensor_M2" tabindex="0" role="button" class="div_relay_css"

             style="top: 390px; left: 70px; width: 45px; height: 20px;">
        </div>
        <!-- PWM sensor_M3 顯示框 -->
        <div id="sensor_M3" tabindex="0" role="button" class="div_relay_css"

             style="top: 420px; left: 70px; width: 45px; height: 20px;">
        </div>

        <!-- 數位 sensor_M9 顯示框 -->
        <div id="sensor_M9" tabindex="0" role="button" class="div_relay_css"

             style="top: 450px; left: 28px; width: 37px; height: 20px;">
        </div>
        <!-- 數位 sensor_M12 顯示框 -->
        <div id="sensor_M12" tabindex="0" role="button" class="div_relay_css"

             style="top: 480px; left: 28px; width: 37px; height: 20px;">
        </div>
        <!-- 數位 sensor_M19 顯示框 -->
        <div id="sensor_M19" tabindex="0" role="button" class="div_relay_css"

             style="top: 505px; left: 28px; width: 37px; height: 20px;">
        </div>
        <!-- 數位 sensor_M14 顯示框 -->
        <div id="sensor_M14" tabindex="0" role="button" class="div_relay_css"

             style="top: 450px; left: 75px; width: 33px; height: 20px;">
        </div>
        <!-- 數位 sensor_M11 顯示框 -->
        <div id="sensor_M11" tabindex="0" role="button" class="div_relay_css"

             style="top: 480px; left: 75px; width: 33px; height: 20px;">
        </div>

        <!-- UART sensor_M16 顯示框 -->
        <div id="sensor_M16" tabindex="0" role="button" class="div_relay_css"

             style="top: 360px; left: 120px; width: 32px; height: 20px;">
        </div>
        <!-- UART sensor_M17 顯示框 -->
        <div id="sensor_M17" tabindex="0" role="button" class="div_relay_css"

             style="top: 390px; left: 120px; width: 32px; height: 20px;">
        </div>
        <!-- UART sensor_M18 顯示框 -->
        <div id="sensor_M18" tabindex="0" role="button" class="div_relay_css"

             style="top: 420px; left: 120px; width: 32px; height: 20px;">
        </div>

        <!-- i2c sensor_M15 顯示框 -->
        <div id="sensor_M15" tabindex="0" role="button" class="div_relay_css"

             style="top: 450px; left: 115px; width: 42px; height: 20px;">
        </div>
        <!-- 485 sensor_M8 顯示框 -->
        <div id="sensor_M8" tabindex="0" role="button" class="div_relay_css"

             style="top: 480px; left: 115px; width: 42px; height: 20px;">
        </div>

        <!-- ppa sensor_M6 顯示框 -->
        <div id="sensor_M6" tabindex="0" role="button" class="div_relay_css"

             style="top: 420px; left: 165px; width: 42px; height: 20px;">
        </div>
        <!-- ppa sensor_M13 顯示框 -->
        <div id="sensor_M13" tabindex="0" role="button" class="div_relay_css"

             style="top: 450px; left: 165px; width: 42px; height: 20px;">
        </div>
        <!-- ppa3 sensor_M1 顯示框 -->
        <div id="sensor_M1" tabindex="0" role="button" class="div_relay_css"

             style="top: 480px; left: 165px; width: 42px; height: 20px;">
        </div>


        <script>

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - relay

            function select_relay(id) {

                var select_relay_text = $("#select_relay_" + id).find(':selected').text()

                // console.log("select_relay_text: " + select_relay_text)

                if (select_relay_text == '') {

                    $("#relay" + id).text('');

                    document.getElementById("relay" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#relay" + id).text(select_relay_text);

                    document.getElementById("relay" + id).style.backgroundColor = 'lightblue';

                    document.getElementById("relay" + id).style.color = 'black';

                    document.getElementById("relay" + id).style.fontWeight = '600';

                }

            }

            
            var sensorlist = ['', '分壓類比', 'PWM', 'PWM', '類比', '類比', '分壓類比', '類比', '485', '數位', 

                                'PWM', '數位', '數位', '分壓類比', '數位', 'I2C', 'UART', 'UART', 'UART', '數位']

            // selectSensor 

            function selectSensor(PinNum) {

                var Pin_sensor = $("#selectSensor_" + PinNum).find(':selected').text();

                // console.log("Pin_sensor: " + Pin_sensor)

                if (Pin_sensor == '') {

                    $("#sensor_" + PinNum).text('');

                    document.getElementById("sensor_" + PinNum).style.backgroundColor = 'transparent';

                } else {

                    $("#sensor_" + PinNum).text(Pin_sensor);

                    // alert("sensorlist[PinNum]]\n" + sensorlist[PinNum.substring(1)])

                    if (sensorlist[PinNum.substring(1)] == '類比') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'lightgreen';

                    } else if (sensorlist[PinNum.substring(1)] == 'PWM') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'lightcyan';

                    } else if (sensorlist[PinNum.substring(1)] == '數位') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'lightgoldenrodyellow';

                    } else if (sensorlist[PinNum.substring(1)] == 'UART') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'linen';

                    } else if (sensorlist[PinNum.substring(1)] == '分壓類比') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'lavender';

                    } else if (sensorlist[PinNum.substring(1)] == 'I2C' || sensorlist[PinNum.substring(1)] == '485') {

                        document.getElementById("sensor_" + PinNum).style.backgroundColor = 'lightpink';

                    }

                    document.getElementById("sensor_" + PinNum).style.color = 'black';

                    document.getElementById("sensor_" + PinNum).style.fontWeight = '600';

                }

                
            }


            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - 類比

            function select_analog(id) {

                var select_analog_text = $("#select_analog_" + id).find(':selected').text()

                console.log("select_analog_: " + select_analog_text)

                if (select_analog_text == ' ') {

                    $("#analog" + id).text('');

                    document.getElementById("analog" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#analog" + id).text(select_analog_text);

                    document.getElementById("analog" + id).style.backgroundColor = 'lightgreen';

                    document.getElementById("analog" + id).style.color = 'black';

                    document.getElementById("analog" + id).style.fontWeight = '600';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - PWM

            function select_pwm(id) {

                var select_pwm_text = $("#select_pwm_" + id).find(':selected').text()

                console.log("select_pwm_: " + select_pwm_text)

                if (select_pwm_text == ' ') {

                    $("#pwm" + id).text('');

                    document.getElementById("pwm" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#pwm" + id).text(select_pwm_text);

                    document.getElementById("pwm" + id).style.backgroundColor = 'lightcyan';

                    document.getElementById("pwm" + id).style.color = 'black';

                    document.getElementById("pwm" + id).style.fontWeight = '600';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - 數位

            function select_digital(id) {

                var select_digital_text = $("#select_digital_" + id).find(':selected').text()

                console.log("select_digital_: " + select_digital_text)

                if (select_digital_text == ' ') {

                    $("#digital" + id).text('');

                    document.getElementById("digital" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#digital" + id).text(select_digital_text.slice(0,2));

                    document.getElementById("digital" + id).style.backgroundColor = 'lightgoldenrodyellow';

                    document.getElementById("digital" + id).style.color = 'black';

                    document.getElementById("digital" + id).style.fontWeight = '600';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - UART

            function select_uart(id) {

                var select_uart_text = $("#select_uart_" + id).find(':selected').text()

                console.log("select_uart_: " + select_uart_text)

                if (select_uart_text == ' ') {

                    $("#uart" + id).text('');

                    document.getElementById("uart" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#uart" + id).text(select_uart_text);

                    document.getElementById("uart" + id).style.backgroundColor = 'linen';

                    document.getElementById("uart" + id).style.color = 'black';

                    document.getElementById("uart" + id).style.fontWeight = '600';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - I2C

            function select_i2c(id) {

                var select_i2c_text = $("#select_i2c_" + id).find(':selected').text()

                console.log("select_i2c_: " + select_i2c_text)

                if (select_i2c_text == ' ') {

                    $("#i2c" + id).text('');

                    document.getElementById("i2c" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#i2c" + id).text(select_i2c_text.slice(0,3));

                    document.getElementById("i2c" + id).style.backgroundColor = 'lightpink';

                    document.getElementById("i2c" + id).style.color = 'black';

                    document.getElementById("i2c" + id).style.fontWeight = '600';

                    document.getElementById("i2c" + id).style.fontSize = '10px';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - 485

            function select_485(id) {

                var select_485_text = $("#select_485_" + id).find(':selected').text()

                console.log("select_485_: " + select_485_text)

                if (select_485_text == ' ') {

                    $("#485" + id).text('');

                    document.getElementById("485" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#485" + id).text(select_485_text);

                    document.getElementById("485" + id).style.backgroundColor = 'lightpink';

                    document.getElementById("485" + id).style.color = 'black';

                    document.getElementById("485" + id).style.fontWeight = '600';

                    document.getElementById("485" + id).style.fontSize = '10px';

                }

            }

            // 當右方的下拉式選單選擇時, 更新左方圖片上的文字 - 分壓類比

            function select_ppa(id) {

                var select_ppa_text = $("#select_ppa_" + id).find(':selected').text()

                console.log("select_ppa_: " + select_ppa_text)

                if (select_ppa_text == ' ') {

                    $("#ppa" + id).text('');

                    document.getElementById("ppa" + id).style.backgroundColor = 'transparent';

                } else {

                    $("#ppa" + id).text(select_ppa_text);

                    document.getElementById("ppa" + id).style.backgroundColor = 'lavender';

                    document.getElementById("ppa" + id).style.color = 'black';

                    document.getElementById("ppa" + id).style.fontWeight = '600';

                    document.getElementById("ppa" + id).style.fontSize = '10px';

                }

            }

        </script>

        <div style="position: absolute; left: 953px;">
            <table border="5" style="border: 3px white solid;">
                <tr>
                    <td>
                        ethernet :
                        <select id="select_ethernet_1" onchange="" class="select-input">
                            <option>OFF</option>
                            <option selected>ON</option>
                        </select>
                        <br>
                        wifi :
                        <select id="select_wifi_1" onchange="" class="select-input">
                            <option>OFF</option>
                            <option selected>ON</option>
                        </select>
                        <br>
                        zigbee :
                        <select id="select_zigbee_1" onchange="" class="select-input">
                            <option>OFF</option>
                            <option selected>ON</option>
                        </select>
                        <br>
                    </td>
                </tr>
                <tr>
                    <!-- Relay 1-10 -->
                    <td style="background-color: lightblue;">
                        Relay 1 :
                        <select id="select_relay_1" onchange="select_relay('1')" class="select-input">
                            <option></option>
                            <option value="vacuum" selected>真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 2 :
                        <select id="select_relay_2" onchange="select_relay('2')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve" selected>電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 3 :
                        <select id="select_relay_3" onchange="select_relay('3')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve" selected>蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 4 :
                        <select id="select_relay_4" onchange="select_relay('4')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight" selected>警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 5 :
                        <select id="select_relay_5" onchange="select_relay('5')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera" selected>攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 6 :
                        <select id="select_relay_6" onchange="select_relay('6')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater" selected>電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 7 :
                        <select id="select_relay_7" onchange="select_relay('7')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump" selected>雙核泵</option>
                        </select>
                        <br>
                        Relay 8 :
                        <select id="select_relay_8" onchange="select_relay('8')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 9 :
                        <select id="select_relay_9" onchange="select_relay('9')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 10 :
                        <select id="select_relay_10" onchange="select_relay('10')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                    </td>
                    <td></td>
                    <!-- Relay 11-20 -->
                    <td style="background-color: lightblue;">
                        Relay 11 :
                        <select id="select_relay_11" onchange="select_relay('11')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 12 :
                        <select id="select_relay_12" onchange="select_relay('12')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 13 :
                        <select id="select_relay_13" onchange="select_relay('13')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 14 :
                        <select id="select_relay_14" onchange="select_relay('14')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 15 :
                        <select id="select_relay_15" onchange="select_relay('15')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 16 :
                        <select id="select_relay_16" onchange="select_relay('16')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 17 :
                        <select id="select_relay_17" onchange="select_relay('17')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 18 :
                        <select id="select_relay_18" onchange="select_relay('18')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 19 :
                        <select id="select_relay_19" onchange="select_relay('19')" class="select-input">
                            <option></option>
                            <option value="vacuum">真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                        Relay 20 :
                        <select id="select_relay_20" onchange="select_relay('20')" class="select-input">
                            <option></option>
                            <option value="vacuum" selected>真空吸料機</option>
                            <option value="solenoidvalve">電磁閥</option>
                            <option value="diskvalve">蝴蝶閥</option>
                            <option value="warninglight">警示燈</option>
                            <option value="camera">攝影機</option>
                            <option value="heater">電熱管</option>
                            <option value="pump">雙核泵</option>
                        </select>
                        <br>
                    </td>
                </tr>
                <tr>
                    <td> </td>
                </tr>
                <tr>
                    <!-- 類比 -->
                    <td style="background-color: lightgreen;">
                        類比 M4 : 
                        <select id="selectSensor_M4" onchange="selectSensor('M4')" class="select-input">
                            <option></option>  
                            <option selected>PH</option>
                            <option>DO</option>
                            <option>ORP</option>
                        </select>
                        <br>
                        類比 M5 : 
                        <select id="selectSensor_M5" onchange="selectSensor('M5')" class="select-input">
                            <option></option>  
                            <option>PH</option>
                            <option selected>DO</option>
                            <option>ORP</option>
                        </select>
                        <br>
                        類比 M7 : 
                        <select id="selectSensor_M7" onchange="selectSensor('M7')"  class="select-input">
                            <option></option>  
                            <option>PH</option>
                            <option>DO</option>
                            <option selected>ORP</option>
                        </select>
                        <br>
                    </td>
                    <td></td>
                    <!-- PWM -->
                    <td style="background-color: lightcyan;">
                        PWM M10 :
                        <select id="selectSensor_M10" onchange="selectSensor('M10')" class="select-input">
                            <option></option>
                            <option selected>Motor</option>
                        </select>
                        <br>
                        PWM M2 :
                        <select id="selectSensor_M2" onchange="selectSensor('M2')" class="select-input">
                            <option></option>
                            <option selected>Servo</option>
                        </select>
                        <br>
                        PWM M3 :
                        <select id="selectSensor_M3" onchange="selectSensor('M3')" class="select-input">
                            <option></option>
                            <option selected>Servo</option>
                        </select>
                        <br>
                        
                    </td>
                </tr>
                <tr>
                    <td></td>
                </tr>
                <tr>
                    <!-- 數位 1-3 -->
                    <td style="background-color: lightgoldenrodyellow;">
                        數位 M9 :
                        <select id="selectSensor_M9" onchange="selectSensor('M9')" class="select-input">
                            <option></option>
                            <option selected>SHT11</option>
                            <option>WATERLEVEL</option>
                            <option>feedback</option>
                        </select>
                        <br>
                        數位 M12 :
                        <select id="selectSensor_M12" onchange="selectSensor('M12')" class="select-input">
                            <option></option>
                            <option>SHT11</option>
                            <option selected>WATERLEVEL</option>
                            <option>feedback</option>
                        </select>
                        <br>
                        數位 M19 :
                        <select id="selectSensor_M19" onchange="selectSensor('M19')" class="select-input">
                            <option></option>
                            <option>SHT11</option>
                            <option>WATERLEVEL</option>
                            <option selected>feedback</option>
                        </select>
                        <br>
                        
                    </td>
                    <td></td>
                    <!-- 數位 4-5 -->
                    <td style="background-color: lightgoldenrodyellow;">
                        數位 M14 :
                        <select id="selectSensor_M14" onchange="selectSensor('M14')" class="select-input">
                            <option></option>
                            <option selected>SHT11</option>
                            <option>WATERLEVEL</option>
                            <option>feedback</option>
                        </select>
                        <br>
                        數位 M11 :
                        <select id="selectSensor_M11" onchange="selectSensor('M11')" class="select-input">
                            <option></option>
                            <option selected>SHT11</option>
                            <option>WATERLEVEL</option>
                            <option>feedback</option>
                        </select>
                        <br>
                        <br>
                    </td>
                </tr>
                <tr>
                    <td> </td>
                </tr>
                <tr>
                    <!-- UART -->
                    <td style="background-color: linen;">
                        UART M16 :
                        <select id="selectSensor_M16" onchange="selectSensor('M16')" class="select-input">
                            <option></option>
                            <option selected>EC</option>
                        </select>
                        <br>
                        UART M17 :
                        <select id="selectSensor_M17" onchange="selectSensor('M17')" class="select-input">
                            <option></option>
                        
                        </select>
                        <br>
                        UART M18 :
                        <select id="selectSensor_M18" onchange="selectSensor('M18')" class="select-input">
                            <option></option>
                        
                        </select>
                        <br>
                    </td>
                    <td></td>
                    <!-- 分壓類比 1 -->
                    <td style="background-color:lavender;">
                        <br>
                        <br>
                        分壓類比 M6:
                        <select id="selectSensor_M6" onchange="selectSensor('M6')" class="select-input">
                            <option></option>
                            <option selected>SEN0189</option>
                        </select>
                        <br>
                    </td>
                </tr>
                <tr>
                    <!-- I2C -->
                    <!-- 485 -->
                    <td style="background-color: lightpink;">
                        I2C M15:
                        <select id="selectSensor_M15" onchange="selectSensor('M15')" class="select-input">
                            <option></option>
                            <option selected>BMP280</option>
                        </select>
                        <br>
                        485 M8:
                        <select id="selectSensor_M8" onchange="selectSensor('M8')" class="select-input">
                            <option></option>
                            <option selected>Soil</option>
                        </select>
                        <br>
                    </td>
                    <td></td>
                    <!-- 分壓類比 2-3 -->
                    <td style="background-color:lavender;">
                        分壓類比 M13:
                        <select id="selectSensor_M13" onchange="selectSensor('M13')" class="select-input">
                            <option></option>
                            <option selected>SEN0189</option>
                        </select>
                        <br>
                        分壓類比 M1:
                        <select id="selectSensor_M1" onchange="selectSensor('M1')" class="select-input">
                            <option></option>
                            <option selected>SonicESMUS07</option>
                        </select>
                        <br>
                    </td>
                </tr>
                <tr>
                    <td> </td>
                </tr>
                <tr>
                    <td>
                        <input type="button" id="board_getValue" value="制動器感測器項目取值" onclick="getValue()"><br>
                        <br>
                        <br>
                        <input type="button" id="test" value="積木取值" onclick="test();">
                        <input type="button" id="test" value="積木MQTT" onclick="MQTTtest();"><br>
                    </td>
                </tr>
            </table>
        </div>

        <!-- 積木程式 start -->
        <div id="box" style="position: absolute; top: 740px;">
            <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="制動器狀態">
                                
                            </optgroup>
                            <optgroup label="感測器數值">
                                
                            </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="制動器狀態">';


                                // relay 取值

                                relay_dict = {};

                                for (let i = 1; i < 21; i++) {

                                    var relay_text = $("#select_relay_" + i).find(':selected').val();

                                    if (relay_text != '') {

                                        relay_dict["R" + i] = "R" + i + "_" + relay_text;

                                    }

                                }

                                for (let r in relay_dict) {

                                    html += '<option value="' + relay_dict[r] + '">' + relay_dict[r] + '</option>';

                                }


                                html +=

                                '</optgroup>' + 

                                '<optgroup label="感測器數值">';


                                // sensor 取值 dict

                                sensor_dict = {};

                                for (let i = 1; i < 20; i++) {

                                    var sensor_text = $("#selectSensor_M" + i).find(':selected').text();

                                    if (sensor_text != '') {

                                        sensor_dict["M" + i] = "M" + i + "_" + sensor_text;

                                    }

                                }

                                for (let s in sensor_dict) {

                                    html += '<option value="' + sensor_dict[s] + '">' + sensor_dict[s] + '</option>';

                                }


                                html +=

                                '</optgroup>' + 

                                '</select> ' + 

                                '<select id="cond_b' + condadd_parent_num + '_' + cond_add_child_i + '">' + 

                                '<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>

                        </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>
                        <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>' + 

                                '<optgroup label="制動器狀態">';

                                
                                // relay 取值

                                relay_dict = {};

                                for (let i = 1; i < 21; i++) {

                                    var relay_text = $("#select_relay_" + i).find(':selected').val();

                                    if (relay_text != '') {

                                        relay_dict["R" + i] = "R" + i + "_" + relay_text;

                                    }

                                }

                                for (let r in relay_dict) {

                                    html += '<option value="' + relay_dict[r] + '">' + relay_dict[r] + '</option>';

                                }

                                
                                html +=

                                '</optgroup>' +

                                '<option value="' + 'sleep' + '">' + 'sleep' + '</option>' + 

                                '<option value="' + 'tankstatus' + '">' + 'tankstatus' + '</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>
                    
                </div>
                <input type="button" class="input-add" id="add1" value="條件物件動作++" onclick="Add(add1);">
                <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">' +

                        
                        '<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="制動器狀態">';


                        // relay 取值

                        relay_dict = {};

                        for (let i = 1; i < 21; i++) {

                            var relay_text = $("#select_relay_" + i).find(':selected').val();

                            if (relay_text != '') {

                                relay_dict["R" + i] = "R" + i + "_" + relay_text;

                            }

                        }

                        for (let r in relay_dict) {

                            html += '<option value="' + relay_dict[r] + '">' + relay_dict[r] + '</option>';

                        }


                        html +=

                        '</optgroup>' + 

                        '<optgroup label="感測器數值">';


                        // sensor 取值 dict

                        sensor_dict = {};

                        for (let i = 1; i < 20; i++) {

                            var sensor_text = $("#selectSensor_M" + i).find(':selected').text();

                            if (sensor_text != '') {

                                sensor_dict["M" + i] = "M" + i + "_" + sensor_text;

                            }

                        }

                        for (let s in sensor_dict) {

                            html += '<option value="' + sensor_dict[s] + '">' + sensor_dict[s] + '</option>';

                        }


                        html +=

                        '</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>' + 

                        '<optgroup label="制動器狀態">';

                        
                        // relay 取值

                        relay_dict = {};

                        for (let i = 1; i < 21; i++) {

                            var relay_text = $("#select_relay_" + i).find(':selected').val();

                            if (relay_text != '') {

                                relay_dict["R" + i] = "R" + i + "_" + relay_text;

                            }

                        }

                        for (let r in relay_dict) {

                            html += '<option value="' + relay_dict[r] + '">' + relay_dict[r] + '</option>';

                        }

                        
                        html +=

                        '</optgroup>' +

                        '<option value="' + 'sleep' + '">' + 'sleep' + '</option>' + 

                        '<option value="' + 'tankstatus' + '">' + 'tankstatus' + '</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>
            </div>
        </div>
        <!-- 積木程式 finish -->

        <div style="position: absolute; top: 1200px;">
            Value : <span id="show_Value"></span><br>
            MySQL : <span id="show_MySQLcommand"></span><br>
            MQTT : <span id="show_MQTTcommand"></span>
        </div>

        <script>

            var relay_data = '';        // 積木程式 制動器選項

            var sensor_data = '';       // 積木程式 感測器選項

            var obj_data = '';          // 積木程式 物件選項：桶槽狀態 暫停秒數


            function getValue() {

                // ethernet、wifi、zigbee 取值測試

                // var select_ethernet_text = $("#select_ethernet_1").find(':selected').text()

                // var select_wifi_text = $("#select_wifi_1").find(':selected').text()

                // var select_zigbee_text = $("#select_zigbee_1").find(':selected').text()

                // console.log("select_ethernet_text: " + select_ethernet_text)

                // console.log("select_wifi_text: " + select_wifi_text)

                // console.log("select_zigbee_text: " + select_zigbee_text)


                // 制動器感測器 下拉式選單 不可更改

                $('.select-input').prop('disabled', true);


                // relay 取值

                relay_dict = {};

                for (let i = 1; i < 21; i++) {

                    var relay_text = $("#select_relay_" + i).find(':selected').val();

                    if (relay_text != '') {

                        relay_dict["R" + i] = "R" + i + "_" + relay_text;

                        // console.log("R" + i + " : " + relay_text);

                    } else {

                        // relay_dict["R" + i] = "";

                        // console.log("R" + i + " : ");

                    }

                }


                relay_data = '<optgroup label="制動器狀態">';

                for (let r in relay_dict) {

                    // console.log(r + " : " + relay_dict[r]);

                    relay_data += '<option value="' + relay_dict[r] + '">' + relay_dict[r] + '</option>';

                }

                relay_data += '</optgroup>'

                // console.log("relay_data: " + relay_data)

                
                // sensor 取值 dict

                sensor_dict = {};

                for (let i = 1; i < 20; i++) {

                    var sensor_text = $("#selectSensor_M" + i).find(':selected').text();

                    if (sensor_text != '') {

                        sensor_dict["M" + i] = "M" + i + "_" + sensor_text;

                        // console.log("selectSensor_M" + i);

                        // console.log("M" + i + "_" + sensor_text);

                    } else {

                        // sensor_dict["M" + i] = "";

                        // console.log("selectSensor_M" + i);

                        // console.log("");

                    }

                }

                sensor_data = '<optgroup label="感測器數值">';

                for (let s in sensor_dict) {

                    // console.log(s + " : " + sensor_dict[s])

                    sensor_data += '<option value="' + sensor_dict[s] + '">' + sensor_dict[s] + '</option>';

                }

                sensor_data += '</optgroup>';

                // console.log("sensor_data: " + sensor_data)


                // 賦值條件 a 

                var sectorSelect = document.getElementById("cond_a1_1");

                sectorSelect.innerHTML = '<option value="">制動器 / 感測器</option>' +  relay_data + sensor_data;


                obj_data = '<option value="' + 'sleep' + '">' + 'sleep' + '</option>' + 

                           '<option value="' + 'tankstatus' + '">' + 'tankstatus' + '</option>';


                // 賦值物件 a 

                var sectorSelect = document.getElementById("do_obj1_1");

                sectorSelect.innerHTML = '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' + relay_data + obj_data;


                //  ===== 下方傳值未測試 ====================================================


                // var loader_data = {

                //     "ethernet_list":select_ethernet_text,

                //     "wifi_list":select_wifi_text,

                //     "zigbee_list":select_zigbee_text,


                //     "relay_list":String(relay_list),

                //     "pwm_list":String(pwm_list),

                //     "digital_list":String(digital_list),

                //     "uart_list":String(uart_list),

                //     "i2c_list":String(i2c_list),

                //     "s485_list":String(s485_list),

                //     "ppa_list":String(ppa_list)

                // };


                // $.ajax({

                //     type:"GET",

                //     url:"/loader",

                //     dataType:"JSON",

                //     data:loader_data,

                //     success:function (res) {

                //         alert("getValue loader: " + res.response)

                //     },

                //     error: function (thrownError) {

                //         alert(thrownError)

                //     }


                // })

                
            }


            relay_obj2act = {'vacuum':['on', 'off'],

                             'solenoidvalve':['on', 'off'],

                             'diskvalve':['on', 'off'],

                             'warninglight':['on', 'off'],

                             'camera':['on', 'off'],

                             'heater':['on', 'off'],

                             'pump':['on', 'off'],

                             'sleep':'',

                             'tankstatus':['Waiting', 'InputtingBean', 'InputtingBean_Pause', 'InputtingBean_Finish', 

                                           'Drying', 'OutputtingBean', 'Cleaning', 'Warning']

                            }

            // <option value="vacuum">真空吸料機</option>

            // <option value="solenoidvalve">電磁閥</option>

            // <option value="diskvalve">蝴蝶閥</option>

            // <option value="warninglight">警示燈</option>

            // <option value="camera">攝影機</option>

            // <option value="heater">電熱管</option>

            // <option value="pump">雙核泵</option>


            function renew(obj_num, index) {

                var act_item_value = '';

                var objSelect = document.getElementById("do_obj" + obj_num).value;

                // console.log("objSelect: " + objSelect + " / " + typeof(objSelect));

                var actuatorNameIndex = objSelect.indexOf('_') + 1;

                // console.log("actuatorNameIndex: " + actuatorNameIndex)

                // console.log("objSelect.substring(actuatorNameIndex): " + objSelect.substring(actuatorNameIndex))

                // console.log("relay_obj2act[objSelect.substring(actuatorNameIndex)]: " + relay_obj2act[objSelect.substring(actuatorNameIndex)])

                if (objSelect.substring(actuatorNameIndex) !== undefined) {

                    var act_item = relay_obj2act[objSelect.substring(actuatorNameIndex)]

                    console.log(act_item)

                    if (objSelect.substring(actuatorNameIndex) == 'sleep') {

                        console.log("act_item[i] == 'sleep'")

                        act_item_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>';


                    } else {

                        // 建立 do_act 下拉式選單

                        act_item_value += '<select id="do_act' + obj_num + '">';

                        for (let i = 0; i < act_item.length; i++) {

                            act_item_value += '<option value="' + act_item[i] + '">' + act_item[i] + '</option>'

                        }

                        act_item_value += '</select>';

                    }

                    // 將 do_act 放到 do_action 區塊中

                    var sectorSelect = document.getElementById("do_action" + obj_num);

                    if (sectorSelect != null) {

                        sectorSelect.innerHTML = act_item_value;

                    }

                } else {

                    console.log("=== undefined")

                }

            }


            function showSleepValue(obj_num, value) {

                document.getElementById("sleepValue_text" + obj_num).innerText = value + 's';

            }

        </script>

        <script>

            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


            function test(){

                
                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;

                        if (cond_z_value == '') {

                            alert('if/while 欄位未輸入')

                        } else {

                            Z = Z + 1;

                            set_key.push('cond_z' + Z + '_1');

                            set_value.push(cond_z_value);

                            cond_main += cond_z_value + ' ';

                        }

                    } catch (error) {

                        if (error.name == 'TypeError') {

                        } else {

                            alert("cond_z" + z + "_1: " + error.name)

                        }

                    }


                    // 桶槽號碼 取值

                    try {

                        var cond_tank_value = document.getElementById("cond_tank" + z + "_1").value;

                        if (cond_tank_value == '') {

                            alert('桶槽 欄位未輸入')

                        } else {

                            set_key.push('cond_tank' + Z + '_1');

                            set_value.push(cond_tank_value);

                            cond_main += cond_tank_value + ' ';

                        }

                    } catch (error) {

                        if (error.name == 'TypeError') {

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

                                if (cond_a_value == '') {

                                    alert('主條件 感測器 欄位未輸入')

                                } else {

                                    set_key.push('cond_a' + Z + '_' + X);

                                    set_value.push(cond_a_value);

                                    cond_main += cond_a_value + ' ';

                                }

                            } catch (error) {

                                if (error.name == 'TypeError') {

                                } else {

                                    alert("cond_a" + z + "_" + x + ": " + error.name)

                                }

                            }

                            // 子條件取值 : 條件中 > = <

                            try {

                                var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;

                                if (cond_b_value == '') {

                                    alert('主條件 比較運算子 欄位未輸入')

                                } else {

                                    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') {

                                } else {

                                    alert("cond_b" + z + "_" + x + ": " + error.name)

                                }

                            }

                            // 子條件取值 : 條件右 ON / OFF / 輸入數值

                            try {

                                var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;

                                if (cond_c_value == '') {

                                    alert('主條件 數值 欄位未輸入')

                                } else {

                                    set_key.push('cond_c' + Z + '_' + X);

                                    set_value.push(cond_c_value);

                                    cond_main += cond_c_value;

                                }

                            } catch (error) {

                                if (error.name == 'TypeError') {

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

                                if (cond_d_value == '') {

                                    alert('附加條件 and/or 欄位未輸入')

                                } else {

                                    X = X + 1;

                                    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') {

                                } else {

                                    alert("cond_d" + z + "_" + x + ": " + error.name)

                                }

                            }

                            // 感測器取值 : 

                            try {

                                var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;

                                if (cond_a_value == '') {

                                    alert('附加條件 感測器 欄位未輸入')

                                } else {

                                    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') {

                                } else {

                                    alert("cond_a" + z + "_" + x + ": " + error.name)

                                }

                            }

                            // 子條件取值 : 條件中 > = <

                            try {

                                var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;

                                if (cond_b_value == '') {

                                    alert('附加條件 比較運算子 欄位未輸入')

                                } else {

                                    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') {

                                } else {

                                    alert("cond_b" + z + "_" + x + ": " + error.name)

                                }

                            }

                            // 子條件取值 : 條件右 ON / OFF / 輸入數值

                            try {

                                var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;

                                if (cond_c_value == '') {

                                    alert('附加條件 數值 欄位未輸入')

                                } else {

                                    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') {

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

                        console.log("do_obj" + z + "_" + y + " : " + do_obj_value)

                        if (do_obj_value == '') {

                            alert('物件 欄位未輸入')

                        } else {

                            Y = Y + 1;

                            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') {

                        //     } else {

                        //         alert("do_obj" + z + "_" + y + ": " + error.name)

                        //     }

                        // }

                        // 子物件動作取值 : 動作 do_act1_1

                        // try {

                        var do_act_value = document.getElementById("do_act" + z + "_" + y).value;

                        console.log("do_act" + z + "_" + y + " : " + do_act_value)

                        if (do_act_value == '') {

                            alert('動作 欄位未輸入')

                        } else {

                            set_key.push('do_act' + Z + '_' + Y);

                            if (DRY_CONTAINER_STATUS[do_act_value] != 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 {

                                set_value.push(do_act_value);

                                cond_com_data += do_act_value;

                                cond_com_list.push(cond_com_data);

                            }

                        }

                        // } catch (error) {

                        //     if (error.name == 'TypeError') {

                        //     } 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 + "]")

                    document.getElementById('show_Value').innerText = "cond_item: [" + cond_item + "]";

                }

                // ===== 0324 測試 OK 勿刪 ===================================================

                TT['mainLength'] = Z

                TT['addLength'] = cond_add_list.length

                TT['comLength'] = cond_com_list.length

                // ===== 0324 測試 OK 勿刪 ===================================================


                // 0321 測試 new

                $('#value_test').text("[{" + cond_item.join('}, {') + "}]")


                var SQL_insert = 'INSERT INTO `dry_block_waiting` (' + 

                                '`datetime`, `' + set_key.join("`, `") + '`) VALUES (' + 

                                'current_timestamp(), "' + set_value.join('", "') + '")';


                var sql_data = { "sql":SQL_insert };

                document.getElementById('show_MySQLcommand').innerText = 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")

                    document.getElementById('show_MQTTcommand').innerText = JSON.stringify(res.response);

                }, 'json');

                // ===== 0324 測試 OK 勿刪 ===================================================       

            }

        </script>
        
        
        <!-- 數位 -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            數位 1 :

            <select id="select_digital_1" onchange="select_digital('1')">

                <option></option>

                <option>溫溼度</option>

                <option>水位計</option>

                <option>蝶閥回饋訊號</option>

            </select>

            <br>

        </div> -->
        
        <!-- PWM -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            PWM 1 :

            <select id="select_pwm_1" onchange="select_pwm('1')">

                <option></option>

                <option>馬達</option>

                <option>舵機</option>

            </select>

            <br>

        </div> -->
        
        <!-- UART -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            UART 1 :

            <select id="select_uart_1" onchange="select_uart('1')">

                <option></option>

                <option>EC</option>

            </select>

            <br>

        </div> -->
        
        <!-- I2C -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            I2C:

            <select id="select_i2c_1" onchange="select_i2c('1')">

                <option></option>

                <option>大氣壓力</option>

            </select>

            <br>

        </div> -->
        
        <!-- 485 -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            485:

            <select id="select_485_1" onchange="select_485('1')">

                <option></option>

                <option>土壤三合一</option>

            </select>

            <br>

        </div> -->
        
        <!-- 分壓類比 -->
        <!-- <div style="position: absolute; left: 935px; top: 300px; width: 220px;">

            分壓類比 1:

            <select id="select_ppa_1" onchange="select_ppa('1')">

                <option></option>

                <option>濁度計</option>

                <option>超音波</option>

            </select>

            <br>

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

</html>