<%@ Page Language="C#" AutoEventWireup="true" CodeFile="View.aspx.cs" Inherits="Mail_View" meta:resourcekey="Page" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="referrer" content="no-referrer">
    <link rel="stylesheet" href="../libs/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../libs/bootstrap/css/animate.min.css">
    <link rel="stylesheet" href="../libs/fontawesome/css/all.min.css" >
    <script type="text/javascript" src="../libs/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="../libs/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../libs/bootstrap-notify.min.js"></script>
</head>
<body>
    <style type="text/css">
        .cBoxSubject {
            display: flex;
            font-size: 1.25rem;
        }
        .cBoxSubject .last {
            font-size: 1rem;
            margin-left: auto;
            padding-left: 4px;
        }
    </style>
    <script type="text/javascript">
        var darkView = { enabled: false };

        $(document).ready(function () {
            Dialog.setMessage('<asp:Literal runat="server" Text="<%$ Resources:Dialog, Title%>" />', '<asp:Literal runat="server" Text="<%$ Resources:Dialog, OK%>" />', '<asp:Literal runat="server" Text="<%$ Resources:Dialog, Cancel%>" />');
            Dialog.setUseBrowserConfirm(<%=AppSetting.UseBrowserConfirm%>);
            InitFlagModal();
            InitMeetingRequestModal();

            // 다크 모드 여부 확인
            if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) {
                var v = localStorage.getItem("mail_darkview");
                if (v !== null) {
                    darkView = JSON.parse(v);
                } else {
                    darkView = { enabled: true };
                }
                SetDarkView(darkView.enabled);
            } else {
                document.getElementById("toggleDarkView").style.display = "none";
            }
            ShowMailBodyPanel();
        });

        function ShowMailBodyPanel() {
            if (!darkView.enabled)
                ShowToShadowDom("mailBodyPanel", "mailTemplate", true, false);
            else
                ShowToShadowDom4DarkMode("mailBodyPanel", "mailTemplate", true, false);
        }

        function ShowDetailInfo() {
            $("#detailPanel").collapse("toggle");
        }

        function GotoList() {
            location.href = "List.aspx?<%=_listPageParams%>";
        }

        function Reply() {
            location.href = "NewTM.aspx?action=reply&msg=<%=_msgId%>&folder=<%=_folderId.ToString()%>";
        }

        function ReplyAll() {
            location.href = "NewTM.aspx?action=replyall&msg=<%=_msgId%>&folder=<%=_folderId.ToString()%>";
        }

        function Forward() {
            location.href = "NewTM.aspx?action=forward&msg=<%=_msgId%>&folder=<%=_folderId.ToString()%>";
        }

        function ConfirmDelete() {
            var folderType = "<%=_folderType%>";
            $.ajax({
                type: "POST",
                url: "CallAjax.aspx/DeleteMessages",
                data: JSON.stringify({
                    folderType: folderType,
                    msgIDs: ["<%=_msgId%>"]
                }),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var msg = (folderType == "mcTrash" || folderType == "mcSpam") ?
                        '<asp:Literal runat="server" Text="<%$ Resources:Mail, Msg01%>" />' : '<asp:Literal runat="server" Text="<%$ Resources:Mail, Msg02%>" />';
                    mc7_notify(msg, "success");
                    window.setTimeout(function () {
                        GotoList();
                    }, 2000);
                },
                failure: function (response) {
                }
            });
        }

        function GotoPrevious() {
            location.href = "View.aspx?msg=<%=_prevMsgId%>&<%=_listPageParams%>"
        }

        function GotoNext() {
            location.href = "View.aspx?msg=<%=_nextMsgId%>&<%=_listPageParams%>"
        }

        function SpamReport() {
            $("#spamReportOkButton").click(function () {
                $("#spamReportModal").modal("hide");

                var param = {
                    msgId: "<%=_msgId%>",
                    reportAsSpam: $("#reportCheckbox").is(":checked"),
                    blockSender: $("#blockCheckbox").is(":checked"),
                    blockSenderOption: $("input[name='blockMailAddr']:checked").val()
                };
                $.ajax({
                    type: "POST",
                    url: "CallAjax.aspx/SpamReport",
                    data: JSON.stringify(param),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        if (response.d) {
                            mc7_notify('<asp:Literal runat="server" Text="<%$ Resources:, Msg04%>" />', "success");     // 스팸 편지함으로 이동되었습니다.
                            window.setTimeout(function () {
                                GotoList();
                            }, 2000);
                        } else {
                            mc7_notify('<asp:Literal runat="server" Text="<%$ Resources:, Msg05%>" />', "danger");  // 스팸 메일로 신고할 수 없습니다.
                        }
                    },
                    failure: function (response) {
                        Dialog.alert('<asp:Literal runat="server" Text="<%$ Resources:, Msg05%>" />');
                    }
                });
            });

            $("#spamReportModal").modal();
        }

        function UnreadMessage() {
            var param = {
                msgId: "<%=_msgId%>",
                read: false
            };
            $.ajax({
                type: "POST",
                url: "CallAjax.aspx/SetMessageReadStatus",
                data: JSON.stringify(param),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    if (response.d) {
                        mc7_notify('<asp:Literal runat="server" Text="<%$ Resources:, Msg06%>" />', "success");     // 읽지 않음으로 처리되었습니다.
                        window.setTimeout(function () {
                            GotoList();
                        }, 2000);
                    } else {
                        mc7_notify('<asp:Literal runat="server" Text="<%$ Resources:, Msg07%>" />', "danger");  // 메일을 읽지 않음으로 처리할 수 없습니다.
                    }
                },
                failure: function (response) {
                    Dialog.alert('<asp:Literal runat="server" Text="<%$ Resources:, Msg07%>" />');
                }
            });
        }

        function OpenViewEmlWindow(msgfile) {
            var url = "ViewEml.aspx?msgfile=" + msgfile;
            window.open(url, "");
        }

        function InitFlagModal() {
            var flagValue = <%=_msgFlagValue%>;     // 현재 플래그 값
            var flagSpan = $("#<%=FlagIcon.ClientID%>");
            flagSpan.click(function () {
                $("input[name=msgflag][value=" + flagValue + "]").prop("checked", true);
                $("#msgFlagModal").modal();
            });

            // 플래그 선택 모달 대화상자에서 확인 버튼 클릭
            $("#msgflagOKButton").click(function () {
                // 모달 대화상자를 닫는다.
                $("#msgFlagModal").modal("hide");
                var flagMsgId = "<%=_msgId%>";
                flagValue = $("input[name=msgflag]:checked").val();
                // 플래그 변경 ajax 호출
                $.ajax({
                    type: "POST",
                    url: "CallAjax.aspx/SetMsgFlag",
                    data: JSON.stringify({
                        msgId: flagMsgId,
                        flagValue: flagValue
                    }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        // 플래그 이미지 업데이트
                        if (flagValue >= 0 && flagValue <= 6) {
                            var flagColors = ["#CECEC6", "#D3401B", "#638CD6", "#F4DE84", "#94C673", "#F78431", "#B563D6"];
                            flagSpan.removeClass("fa-flag fa-check");
                            flagSpan.addClass("fa-solid fa-flag mc-likeLink");
                            flagSpan.css("color", flagColors[flagValue]);
                        } else {
                            flagSpan.removeClass("fa-flag fa-check");
                            flagSpan.addClass("fa-solid fa-check mc-likeLink");
                            flagSpan.css("color", "#524A52");
                        }
                    },
                    failure: function (response) {
                        Dialog.alert('<asp:Literal runat="server" Text="<%$ Resources:, Msg01%>" />'); // 플래그 변경 작업을 실패했습니다.
                    }
                });
            });
        }

        function InitMeetingRequestModal() {
            if (<%=_showMeetingReq%>) {
                $("#meetingRequestModal").on("shown.bs.modal", function () {                    
                });

                $("#meetingRequestModal").modal();

                var msgId = "<%=_msgId%>";
                $("#mqAcceptButton").click(function () {
                    ProcessMeetingRequest(msgId, "accept");
                });
                $("#mqTentitiveButton").click(function () {
                    ProcessMeetingRequest(msgId, "tentitive");
                });
                $("#mqDeclineButton").click(function () {
                    ProcessMeetingRequest(msgId, "decline");
                });
            }
        }

        function ProcessMeetingRequest(msgId, command) {
            $.ajax({
                type: "POST",
                url: "CallAjax.aspx/MeetingRequest",
                data: JSON.stringify({
                    msgId: msgId,
                    command: command
                }),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    GotoList();
                },
                failure: function (response) {
                    Dialog.alert('<asp:Literal runat="server" Text="<%$ Resources:, Msg03%>" />'); // 모임 요청 처리 작업을 실패했습니다.
                 }
             });
        }

        function ToggleDarkView() {
            darkView.enabled = !darkView.enabled;
            SetDarkView(darkView.enabled);
            ShowMailBodyPanel();
            localStorage.setItem("mail_darkview", JSON.stringify(darkView));
            return false;
        }

        function SetDarkView(toggle) {
            if (toggle) {
                $("#mailBodyPanel").css({
                    "background-color": "rgba(0, 0, 0, 0)",
                    "color": $("body").css("color"),
                });
            } else {
                $("#mailBodyPanel").css({
                    "background-color": "#fff",
                    "color": "#333"
                });
            }
        }
    </script>

    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
            <CompositeScript>
                <Scripts>
                    <asp:ScriptReference Path="~/libs/tabs/common.js" />
                    <asp:ScriptReference Path="~/libs/tabs/dialog.js" />
                    <asp:ScriptReference Path="~/libs/tabs/notify.js" />
                </Scripts>
            </CompositeScript>
        </asp:ScriptManager>

        <div class="container-fluid">
            <div class="row" id="toolBar" data-spy="affix">
                <div class="col-xs-12" style="padding-top:2px;padding-bottom:2px;">
                    <span class="dropdown">
                        <button type="button" id="replyToolButton" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><asp:Localize ID="Localize1" runat="server" meta:resourcekey="Localize1">답장</asp:Localize> <span class="caret"></span></button>
                        <ul class="dropdown-menu">
                            <li><a href="#" onclick="Reply();return false;"><asp:Localize ID="Localize2" runat="server" meta:resourcekey="Localize2">답장</asp:Localize></a></li>
                            <li><a href="#" onclick="ReplyAll();return false;"><asp:Localize ID="Localize3" runat="server" meta:resourcekey="Localize3">전체답장</asp:Localize></a></li>
                            <li><a href="#" onclick="Forward();return false;"><asp:Localize ID="Localize4" runat="server" meta:resourcekey="Localize4">전달</asp:Localize></a></li>
                        </ul>
                    </span>
                    <button type="button" id="deleteToolButton" class="btn btn-primary" onclick="ConfirmDelete()"><span class="fa-solid fa-trash-can"></span></button>
                    <button type="button" id="nextToolButton" runat="server" class="btn btn-primary" onclick="GotoNext()"><span class="fa-solid fa-up-long"></span></button>
                    <button type="button" id="prevToolButton" runat="server" class="btn btn-primary" onclick="GotoPrevious()"><span class="fa-solid fa-down-long"></span></button>
                    <span class="dropdown">
                        <button type="button" id="spamButton" runat="server" class="btn btn-primary" data-toggle="dropdown"><asp:Localize ID="Localize20" runat="server" meta:resourcekey="L20">...</asp:Localize></button>
                        <ul class="dropdown-menu">
                            <li><a href="#" onclick="SpamReport();return false;"><asp:Localize ID="Localize25" runat="server" meta:resourcekey="L25">스팸 신고</asp:Localize></a></li>
                            <li><a href="#" onclick="UnreadMessage();return false;"><asp:Localize ID="Localize26" runat="server" meta:resourcekey="L26">읽지 않음</asp:Localize></a></li>
                        </ul>
                    </span>
                    <span>&nbsp;</span>
                    <button type="button" id="closeToolButton" class="btn btn-primary" onclick="GotoList();"><span class="fa-solid fa-bars"></span></button>
                </div>
            </div>
        </div>
       
        <div class="container-fluid" style="padding-top:40px">
            <asp:Literal ID="SpamLiteral" runat="server"></asp:Literal>
            <asp:Literal ID="SecWarnLiteral" runat="server"></asp:Literal>
            <div class="row">
                <div class="col-xs-12 cBoxSubject">
                    <span><asp:Literal ID="SubjectLabel" runat="server" Mode="Encode" /></span>
                    <span id="toggleDarkView" class="last"><a href="#" onclick="return ToggleDarkView()"><i class="fa-solid fa-circle-half-stroke"></i></a></span>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-10">
                    <small class="text-muted"><asp:Label ID="RecvDateLabel" runat="server" Text=""></asp:Label></small>
                </div>
                <div class="col-xs-2 text-right">
                    <span id="FlagIcon" runat="server"></span>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-8">
                    <small class="text-muted"><asp:Localize ID="Localize5" runat="server" meta:resourcekey="Localize5">보낸 사람</asp:Localize></small> <asp:Label ID="FromAddrLabel" runat="server" CssClass="label label-default" />
                </div>
                <div class="col-xs-4 text-right" >
                    <small class="mc-likeLink" data-toggle="collapse" data-target="#detailPanel"><asp:Localize ID="Localize6" runat="server" meta:resourcekey="Localize6">상세정보</asp:Localize></small>
                </div>
            </div>
            <div id="detailPanel" class="collapse">
                <div class="row">
                    <div class="col-xs-12">
                        <small class="text-muted"><asp:Localize ID="Localize7" runat="server" meta:resourcekey="Localize7">받는 사람</asp:Localize></small> <asp:Literal ID="ToAddrTag" runat="server" />
                    </div>
                </div>
                <div class="row <%=_ccCssClass%>">
                    <div class="col-xs-12">
                        <small class="text-muted"><asp:Localize ID="Localize8" runat="server" meta:resourcekey="Localize8">참조</asp:Localize></small> <asp:Literal ID="CcAddrTag" runat="server" />
                    </div>
                </div>
                <div class="row <%=_bccCssClass%>">
                    <div class="col-xs-12">
                        <small class="text-muted"><asp:Localize ID="Localize9" runat="server" meta:resourcekey="Localize9">숨은 참조</asp:Localize></small> <asp:Literal ID="BccAddrTag" runat="server" />
                    </div>
                </div>
            </div>
            <div id="attachPanel" class="<%=_attachCssClass%>">
                <hr />
                <div class="mc-likeLink" data-toggle="collapse" data-target="#attachList">
                    <div class="row" style="padding-bottom:0.5em">
                        <div class="col-xs-12">
                            <i class="fa-solid fa-paperclip"></i> <asp:Label ID="AttachSummaryLabel" runat="server"></asp:Label>
                        </div>
                    </div>
                </div>
                <div id="attachList" class="list-group collapse">
                    <asp:Literal ID="AttachListTag" runat="server" />
                </div>
            </div>
            <hr />
            <div id="mailBodyPanel" style="min-height: 200px;padding: 5px 10px;overflow:auto"></div>
        </div>
        
        <div style="display:none">
            <asp:LinkButton ID="DeleteButton" runat="server" OnClick="DeleteButton_Click" Text="" /> 
        </div>
    </form>    

    <div class="modal fade" id="msgFlagModal" role="dialog">
        <div class="modal-dialog modal-screen-width">
            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header" style="">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4><asp:Localize ID="Localize10" runat="server" meta:resourcekey="Localize10">플래그 지정</asp:Localize></h4>
                </div>
                <div class="modal-body">
                    <form role="form">
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="0"><span class='fa-solid fa-flag' style="color:#CECEC6"></span> <asp:Literal ID="Literal1" runat="server" Text="<%$ Resources:Mail, Flag8%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="1"><span class='fa-solid fa-flag' style="color:#D3401B"></span> <asp:Literal ID="Literal2" runat="server" Text="<%$ Resources:Mail, Flag1%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="2"><span class='fa-solid fa-flag' style="color:#638CD6"></span> <asp:Literal ID="Literal3" runat="server" Text="<%$ Resources:Mail, Flag2%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="3"><span class='fa-solid fa-flag' style="color:#F4DE84"></span> <asp:Literal ID="Literal4" runat="server" Text="<%$ Resources:Mail, Flag3%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="4"><span class='fa-solid fa-flag' style="color:#94C673"></span> <asp:Literal ID="Literal5" runat="server" Text="<%$ Resources:Mail, Flag4%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="5"><span class='fa-solid fa-flag' style="color:#F78431"></span> <asp:Literal ID="Literal6" runat="server" Text="<%$ Resources:Mail, Flag5%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="6"><span class='fa-solid fa-flag' style="color:#B563D6"></span> <asp:Literal ID="Literal7" runat="server" Text="<%$ Resources:Mail, Flag6%>" /></label>
                        </div>
                        <div class="radio">
                            <label><input type="radio" name="msgflag" value="99"><span class='fa-solid fa-check' style="color:#524A52"></span> <asp:Literal ID="Literal8" runat="server" Text="<%$ Resources:Mail, Flag7%>" /></label>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success btn-block" id="msgflagOKButton"><asp:Localize ID="Localize11" runat="server" meta:resourcekey="Localize11">확인</asp:Localize></button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="meetingRequestModal" role="dialog" data-backdrop="static">
        <div class="modal-dialog modal-screen-width">    
            <div class="modal-content">
                <div class="modal-header" style="">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4><asp:Localize ID="Localize12" runat="server" meta:resourcekey="L12">모임 요청 응답</asp:Localize></h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-xs-12"><h4><asp:Literal ID="MqSubjectLabel" runat="server" Mode="Encode"></asp:Literal></h4></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-3"><asp:Localize ID="Localize13" runat="server" meta:resourcekey="L13">장소</asp:Localize></div>
                        <div class="col-xs-9"><asp:Literal ID="MqPlaceLabel" runat="server" Mode="Encode"></asp:Literal></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-3"><asp:Localize ID="Localize14" runat="server" meta:resourcekey="L14">작성자</asp:Localize></div>
                        <div class="col-xs-9"><asp:Literal ID="MqWriterLabel" runat="server" Mode="Encode"></asp:Literal></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-3"><asp:Localize ID="Localize15" runat="server" meta:resourcekey="L15">시작</asp:Localize></div>
                        <div class="col-xs-9"><asp:Label ID="MqBeginDateLabel" runat="server" Text=""></asp:Label></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-3"><asp:Localize ID="Localize16" runat="server" meta:resourcekey="L16">종료</asp:Localize></div>
                        <div class="col-xs-9"><asp:Label ID="MqEndDateLabel" runat="server" Text=""></asp:Label></div>
                    </div>                    
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" id="mqAcceptButton"><asp:Localize ID="Localize17" runat="server" meta:resourcekey="L17">수락</asp:Localize></button>
                    <button type="button" class="btn btn-success" id="mqTentitiveButton"><asp:Localize ID="Localize18" runat="server" meta:resourcekey="L18">미정</asp:Localize></button>
                    <button type="button" class="btn btn-success" id="mqDeclineButton"><asp:Localize ID="Localize19" runat="server" meta:resourcekey="L19">거절</asp:Localize></button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="spamReportModal" role="dialog" data-backdrop="static">
        <div class="modal-dialog modal-screen-width">
            <div class="modal-content">
                <div class="modal-header" style="">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4><asp:Localize ID="Localize21" runat="server" meta:resourcekey="L21">스팸 메일로 신고</asp:Localize></h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-xs-12"><asp:Label ID="SpamLabel1" runat="server" Text="해당 메일을 탭스랩(주)의 스팸 센터로 신고합니다." meta:resourcekey="SpamLabel1"></asp:Label></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12"><asp:Label ID="SpamLabel2" runat="server" Text="신고된 메일은 스팸 편지함으로 이동됩니다." meta:resourcekey="SpamLabel2"></asp:Label></div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="checkbox">
                                <label><input type="checkbox" id="reportCheckbox" value="" checked>
                                <asp:Localize ID="Localize23" runat="server" meta:resourcekey="L23">스팸 메일로 신고하기</asp:Localize></label></div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="checkbox">
                                <label><input type="checkbox" id="blockCheckbox" value="" checked>
                                    <asp:Localize ID="Localize24" runat="server" meta:resourcekey="L24">앞으로 다음 메일 주소에서 보내는 모든 메시지 차단</asp:Localize></label>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-1"></div>
                        <div class="col-xs-11">
                            <div class="radio">
                                <label><input type="radio" name="blockMailAddr" value="mail" checked><asp:Label ID="BlockMailLabel" runat="server"></asp:Label></label>
                            </div>
                            <div class="radio">
                                <label><input type="radio" name="blockMailAddr" value="domain"><asp:Label ID="BlockDomainLabel" runat="server"></asp:Label></label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success btn-block" id="spamReportOkButton" runat="server"><asp:Localize ID="Localize22" runat="server" meta:resourcekey="L22">확인</asp:Localize></button>
                </div>
            </div>
        </div>
    </div>

    <template id="mailTemplate">
        <asp:PlaceHolder ID="MsgBodyHolder" runat="server" EnableViewState="false"></asp:PlaceHolder>
    </template>
</body>
</html>
