<%@ Control Language="VB" AutoEventWireup="false" CodeFile="uc_ReplyForm.ascx.vb" Inherits="uc_ReplyForm" %>
    <script type="text/javascript">

    $(document).ready(function () {        

        //送信ボタン、キャンセルボタンの活性制御
        $(".reply-content").each(function () {
            var controlId = $(this).data("control-id");
            setButtonProp(controlId);
            $(this).on("keyup", function () {
                setButtonProp(controlId);
            });
        });

        // サーバー側から設定された最大ファイルサイズを取得
        const maxSize = <%= ConfigSettings.MaxFileSize %>;
        const maxSizeInMB = <%= ConfigSettings.MaxFileSizeInMB %>;

        $(".file-upload").each(function () {
            var controlId = $(this).data("control-id");
            $(this).on("change", function () {
                validateFileSize(this, maxSize, maxSizeInMB);
                validateFileName(this)
                showDeleteButton(controlId);
            });
        });
    });

        function setButtonProp(controlId) {
            var $textBox = $(`[data-control-id="${controlId}"][id$="txt_返信内容"]`);
            var $button = $(`[data-control-id="${controlId}"][id$="btn_送信"]`);

            var txtValueLength = $textBox.val().replace(/[\n\s　]/g, "").length;

            if (txtValueLength > 0) {
                $button.prop('disabled', false)
                    .removeClass("buttonBig FontColorBlack")
                    .addClass("buttonBig buttonBig-red");
            } else {
                $button.prop('disabled', true)
                    .removeClass("buttonBig buttonBig-red")
                    .addClass("buttonBig FontColorBlack");
            }
        }

        function validateFileSize(input, maxSize, maxSizeInMB) {
            if (input.files && input.files[0]) {
                const file = input.files[0];
                if (file.size > maxSize) {
                    alert("ファイルサイズが大きすぎます。" + maxSizeInMB + "MB以下のファイルを選択してください。");
                    input.value = "";
                    return false;
                }
            } else {
                return true;
            }
            return true;
        }
        function validateFileSize(input, maxSize, maxSizeInMB) {
            if (input.files && input.files[0]) {
                const file = input.files[0];
                if (file.size > maxSize) {
                    alert("ファイルサイズが大きすぎます。" + maxSizeInMB + "MB以下のファイルを選択してください。");
                    input.value = "";
                    return false;
                }
                var prohibitedChars = getProhibitedCharactersFromCSV();
                var prohibitedCheck = checkProhibitedCharacters(file.name, prohibitedChars);
                if (!prohibitedCheck.isValid) {
                    alert("ファイル名に「" + prohibitedCheck.message + "」は使用できません。\n別の文字を使用してください。");
                    input.value = "";
                    return false;
                }
            } else {
                return true;
            }
            return true;
        }

        // カンマ区切り文字列から禁止文字配列を取得
        function getProhibitedCharactersFromCSV() {
            var hiddenField = document.querySelector('[id*="hf_禁止文字リスト"]');
            if (hiddenField && hiddenField.value) {
                var csvString = hiddenField.value;
                if (csvString.length > 0) {
                    return csvString.split(',').map(function (char) {
                        return unescapeSpecialChar(char.trim());
                    });
                }
            }

            // デフォルト禁止文字(ファイル名で使えない)
            return ['<', '>', ':', '"', '|', '?', '*', '\\', '/', '&', '%'];
        }


        function validateAndConfirm() {
            return confirm("内容を送信します。よろしいですか？");
        }

        function closeModal() {
            // 親ページにある closeModalFromChild を呼び出す
            if (typeof window.parent.closeModalFromChild === 'function') {
                window.parent.closeModalFromChild();
            }
        }

        function showDeleteButton(controlId) {
            var fileUpload = document.querySelector(`[data-control-id="${controlId}"][id$="fu_問合せ資料"]`);
            var deleteButton = document.querySelector(`[data-control-id="${controlId}"][id$="btnFileDelete"]`);

            if (fileUpload.value != '') {
                deleteButton.style.display = 'inline-block';
                fileNameLabel.innerText = fileUpload.files[0].name;
            } else {
                deleteButton.style.display = 'none';
                fileNameLabel.innerText = '';
            }
        }  

        function clearFileUpload(button) {

            var controlId = button.getAttribute('data-control-id');
            var fileUpload = document.querySelector(`[data-control-id="${controlId}"][id$="fu_問合せ資料"]`);
            var deleteButton = document.querySelector(`[data-control-id="${controlId}"][id$="btnFileDelete"]`);

            fileUpload.value = '';  // ファイル選択をクリア
            fileUpload.innerHTML = '';
            deleteButton.style.display = 'none';
            fileNameLabel.innerText = '';
            return false;  // ポストバックを防ぐ
        }
        function clearFileInput(fileInput) {
            fileInput.value = '';
            var deleteBtn = fileInput.parentNode.parentNode.querySelector('[id*="btnFileDelete"]');
            if (deleteBtn) {
                deleteBtn.style.display = 'none';
            }
        }
        function unescapeSpecialChar(char) {
            switch (char) {
                case '&lt;': return '<';
                case '&gt;': return '>';
                case '&quot;': return '"';
                case '&amp;': return '&';
                default: return char;
            }
        }
        function checkProhibitedCharacters(fileName, prohibitedChars) {
            if (!prohibitedChars || prohibitedChars.length === 0) {
                return { isValid: true, message: '' };
            }
            for (var i = 0; i < prohibitedChars.length; i++) {
                if (fileName.indexOf(prohibitedChars[i]) !== -1) {
                    return {
                        isValid: false,
                        message: prohibitedChars[i]
                    };
                }
            }

            return { isValid: true, message: '' };
        }

    </script>

<%-- 問合せ返信入力フォーム Start --%>
<div id="divReplyForm" style="border:solid 1px #999999; background-color:white;">
    <asp:Label ID="lbl_errMes" runat="server" Text="" Visible="false"></asp:Label>
    <table style="width:100%; font-size:10pt;">
        <colgroup>
            <col style="width:20%;"/>
            <col style="width:80%;"/>
        </colgroup>
        <tr>
            <td>From:</td>
            <td>
                <asp:Label ID="lbl_FromCD" runat="server" Text=""></asp:Label>&nbsp;
                <asp:Label ID="lbl_From氏名" runat="server" Text=""></asp:Label>
                <asp:Label ID="lbl_From区分" runat="server" Visible="false"></asp:Label>
                <asp:Label ID="lbl_問合せID" runat="server" Visible="false"></asp:Label>                
            </td>
        </tr>
        <tr>
            <td>To:</td>
            <td>
                <asp:Label ID="lbl_ToCD" runat="server" Text=""></asp:Label>&nbsp;
                <asp:Label ID="lbl_ToCDs" runat="server" Visible="false"></asp:Label>
                <asp:Label ID="lbl_To氏名" runat="server" Text=""></asp:Label>
                <asp:Label ID="lbl_To区分" runat="server" Visible="false"></asp:Label>
                <asp:Label ID="lbl_CcCD" runat="server" Visible="false"></asp:Label>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <asp:TextBox ID="txt_返信内容" runat="server" TextMode="MultiLine" Rows="5" Width="98%" cssclass="input reply-content" data-control-id='<%# Container.ClientID %>' />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <asp:UpdatePanel runat="server">
                    <ContentTemplate>
                        <div style="display: flex; justify-content: space-between; align-items: center;">
                            <div style="width:100%;">
                                <asp:FileUpload ID="fu_問合せ資料" runat="server" CssClass="file-upload" data-control-id='<%# Container.ClientID %>' onchange="showDeleteButton(this)" />
                            </div>
                            <div>
                                <asp:Button ID="btnFileDelete" runat="server" Text="ファイルを削除" OnClientClick="return clearFileUpload(this)" UseSubmitBehavior="false" style="display:none;" data-control-id='<%# Container.ClientID %>' />
                            </div>
                        </div>
                        <!-- 禁止文字リスト保持用 -->
                        <asp:HiddenField ID="hf_禁止文字リスト" runat="server" />
                    </ContentTemplate>
                 </asp:UpdatePanel>
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align:right;">
                <asp:Button ID="btn_送信" runat="server" Text="送信" data-control-id='<%# Container.ClientID %>'
                        OnClientClick='return validateAndConfirm();'                                                                                   
                        Width="90px" Height="25px" CssClass="buttonBig FontColorBlack" />
                <asp:Button ID="btn_Cancel" runat="server" Text="キャンセル" OnClientClick="closeModal();" data-control-id='<%# Container.ClientID %>'
                    ClientIDMode="Static" Width="90px" Height="25px" CssClass="buttonBig buttonBig-blue" />
            </td>
        </tr>
    </table>
</div>
<%-- 問合せ返信入力フォーム End --%>