WebBuild/wwwroot/platform/timeline/components/timeline.js

var Unibase;
(function (Unibase) {
    let Platform;
    (function (Platform) {
        let TimeLine;
        (function (TimeLine_1) {
            let Components;
            (function (Components) {
                class TimeLine extends Platform.Core.BaseComponent {
                    constructor() {
                        super(...arguments);
                        this.isFilterApplied = false;
                        this.Followers = [];
                        this.Comments = [];
                        this.stageReasons = '';
                        this.recordId = 0;
                    }
                    cssFiles() {
                        return [];
                    }
                    jsFiles() {
                        return ["platform/automation/enums/eventtype.js", "platform/forms/managers/formmanager.js", "platform/automation/components/actions/externalfollowers.js", "platform/apps/managers/stagemanager.js", 'platform/automation/managers/commentmanager.js', 'platform/automation/infos/comment.js', 'platform/automation/requests/comment.js', 'platform/automation/enums/commenttype.js'];
                    }
                    html(id, containerid) {
                        return null;
                    }
                    load(id, containerid, callback) {
                    }
                    init(containerid) {
                        const instance = this;
                        instance.containerid = containerid;
                        instance.render(containerid);
                        instance.loadJsFiles();
                        let versionguid = "";
                        if (Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.length > 0) {
                            for (let obj of Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters) {
                                if (obj.Key === "hf_" + Unibase.Themes.Providers.DetailHelper.installedAppId + "_versionguid") {
                                    versionguid = obj.Value.toString();
                                }
                            }
                        }
                        instance.loadDataComments(versionguid, containerid);
                        $(`#toggleCommentInputBtn_${containerid}`).click(function () {
                            $(this).addClass('d-none');
                            $(`#timelineHeaderRight_${containerid}`).removeClass('d-flex').addClass('d-none');
                            $(`#timelineCommentInputWrap_${containerid}`).removeClass('d-none').addClass('d-flex');
                        });
                        $(`#closeCommentSearchBtn_${containerid}`).click(function () {
                            $(`#toggleCommentInputBtn_${containerid}`).removeClass('d-none');
                            $(`#timelineHeaderRight_${containerid}`).removeClass('d-none').addClass('d-flex');
                            $(`#timelineCommentInputWrap_${containerid}`).removeClass('d-flex').addClass('d-none');
                        });
                        $(`#timelineCommentForm_${containerid}`).submit(function (e) {
                            e.preventDefault();
                            instance.saveComment(versionguid, containerid);
                        });
                        $(`#timelineCommentInput_${containerid}`).on('input', function (e) {
                            const enteredComment = $(this).val().toString().trim();
                            if (enteredComment) {
                                $(`#saveCommentBtn_${containerid}`).removeClass('d-none');
                            }
                            else {
                                $(`#saveCommentBtn_${containerid}`).addClass('d-none');
                            }
                        });
                    }
                    loadJsFiles() {
                        var jsfiles = this.jsFiles();
                        Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFiles(jsfiles, function () {
                            Unibase.Platform.TimeLine.Components.TimeLine.Instance().getFollowers();
                        });
                    }
                    getFollowers() {
                        var hiddenvalues = Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.find(x => x.Key == "hf_" + Unibase.Themes.Providers.DetailHelper.installedAppId + "_recordid");
                        if (hiddenvalues != undefined) {
                            this.recordId = Number(hiddenvalues.Value);
                            Unibase.Platform.Automation.Managers.RuleManager.Instance().GetFollwersByPkid(this.recordId).then(function (response) {
                                if (response.result != null) {
                                    TimeLine.Instance().Followers = response.result.filter(x => x.UserId != Unibase.Platform.Membership.Infos.Identity.currentUser.userId);
                                }
                            });
                        }
                    }
                    render(containerid) {
                        $("#" + containerid).empty();
                        var versionguid = Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.find(x => x.Key == "hf_" + Unibase.Themes.Providers.DetailHelper.installedAppId + "_versionguid").Value;
                        let html = `<div id="timeLineWrap_${containerid}" class="timeline-wrap card d-flex flex-column r-gap-15 pa-10">
                                    <div class="flex-between-center position-relative text-dark c-gap-5 c-gap-sm-10 timeline-header"><div class="timeline-header-left flex-grow-1"><a href="javascript:;" class="btn btn-outline-primary btn-sm d-md-none" id="toggleCommentInputBtn_${containerid}">Comment</a><div id="timelineCommentInputWrap_${containerid}" class="d-none d-md-flex align-items-center c-gap-10 flex-grow-1"><div class="d-flex position-relative c-gap-10 flex-grow-1"><form id="timelineCommentForm_${containerid}" method="post" class="w-100"><input type="text" id="timelineCommentInput_${containerid}" class="form-control timeline-comment-input pr-40 shadow-none" data-parentcommentid="0" placeholder="Type Comments here...." />
                                    <div class="d-flex align-items-center c-gap-5 absolute-top-center r-5"><a href="javascript:;" class="btn btn-flush-biz-theme btn-icon btn-file btn-rounded btn-sm flush-soft-hover d-30 d-none" data-tooltip="true" title="Upload file"><span class="btn-icon-wrap"><i class="las la-file-upload font-20"></i></i></span><input type="file" name="comment-file-upload"></a><button type="submit" id="saveCommentBtn_${containerid}" class="btn btn-flush-biz-theme btn-icon btn-rounded btn-sm flush-soft-hover d-30 save-comment-btn d-none" data-tooltip="true" title="Save"><span class="btn-icon-wrap"><i class="las la-paper-plane font-20"></i></span></button></div></form></div><a href="javascript:;" id="closeCommentSearchBtn_${containerid}" class="btn btn-icon btn-icon-circle btn-outline-danger btn-sm d-md-none"><span class="btn-icon-wrap"><i class="las la-times font-20"></i></span></a></div>
                                    </div>
                                    <div class="timeline-header-right d-flex align-items-center justify-content-end gap-5 c-gap-sm-10 flex-wrap" id="timelineHeaderRight_${containerid}">
                                    <a href="javascript:;" class="btn btn-icon btn-icon-circle btn-outline-primary btn-sm" data-tooltip="true" title="Call" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadform(3)"><span class="btn-icon-wrap"><i class="las la-phone font-20"></i></span></a><a href="javascript:;" class="btn btn-icon btn-icon-circle btn-outline-primary btn-sm" data-tooltip="true" title="Mail" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadform(0)"><span class="btn-icon-wrap"><i class="las la-envelope font-20"></i></span></a><a href="javascript:;" class="btn btn-icon btn-icon-circle btn-outline-primary btn-sm" data-tooltip="true" title="To Do" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadform(1)"><span class="btn-icon-wrap"><i class="las la-list font-20"></i></span></a>
                            <a href="javascript:;" class="btn btn-icon btn-icon-circle btn-outline-primary btn-sm" data-tooltip="true" title="Sms" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadform(2)"><span class="btn-icon-wrap"><i class="las la-comment font-20"></i></span></a>
                           <a href="javascript:;" class="btn btn-icon btn-icon-circle btn-outline-primary btn-sm" data-tooltip="true" title="Meetings" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadform(4)"><span class="btn-icon-wrap"><i class="las la-users font-20"></i></span></a><div class="timeline-filter-dropdown" id="timelineFilterDropdown_${containerid}">
                                    <a class="btn btn-icon btn-icon btn-icon-circle btn-outline-primary btn-sm" href="javascript:;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-tooltip="true" title="Filter">
                                    <span class="btn-icon-wrap"><i class="las la-filter font-20"></i></span>
                                    </a>              
                                    <div class="dropdown-menu timeline_dropdown_menu biz-custom-dropdown" id="timelineFilterDropdownMenu_${containerid}" onclick="event.stopPropagation();">
                                    <div class="row biz-select2-wrap">
                                    <div class="col-sm-6">
                                        <select class="form-control mr-4 event_filter" id="eventFilterSelect_${containerid}" data-placeholder="Select Event Type">
                                        </select>
                                    </div>
                                    <div class="col-sm-6">
                                    <select class="form-control custom-select time_filter" id="dateFilterSelect_${containerid}" data-placeholder="Select Date">
                                    </select>
                                    </div>
                                    </div>
                                    <div class="filter_footer d-flex justify-content-between align-items-center gap-10 mt-10">
                                    <a href="javascript:;" class="btn btn-outline-danger btn-sm Filterbuttons" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().clearTimelineFilters('${containerid}');">Clear</a>
                                    <a href="javascript:;" class="btn btn-outline-primary btn-sm Filterbuttons" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().applyTimelineFilters('${containerid}');">Apply</a>
                                    </div>
                                    </div></div>
                                    </div><div class="Isprimaryswitch mt-2 d-none"><label class="switch"><input type="checkbox" class="chk_primarylog switch" checked onchange="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadDataComments('${versionguid}','${containerid}')"><span></span></label><span class="Primary_Label" style="position:absolute;right:3px;top:40px">Primary</span></div>
                                    </div>
                                    <div class="timeline-body px-10 d-none" id="timelineBody_${containerid}">
                                        <div class="text-danger text-center d-none" id="noTimelineDataMsg_${containerid}">No Data found!</div>
                                        <ul class="timeline d-flex flex-column r-gap-15" id="timeLineList_${containerid}"></ul>
                                    </div>
                                    <div class="form-error-message ml-0 r-0" id="timeLineErrMsg_${containerid}"></div>
                                  </div>`;
                        $("#" + containerid).append(html);
                    }
                    setTimelineAvatar(timeline) {
                        let avatarHtml = '';
                        const { UserName, UserPhotoPath } = timeline;
                        if (UserPhotoPath) {
                            avatarHtml = `<img src="${UserPhotoPath}" class="avatar-img rounded-circle">`;
                        }
                        else if (UserName) {
                            let avatarTxt = "";
                            const headingTxt = UserName;
                            let matches = headingTxt.match(/\b(\w)/g);
                            if (matches.length == 1) {
                                avatarTxt = $.trim(headingTxt).substr(0, 1).toUpperCase() + $.trim(headingTxt).substr(1, 1);
                            }
                            else {
                                avatarTxt = matches.join('').slice(0, 2).toUpperCase();
                            }
                            avatarHtml = `<span class="avatar-text avatar-text-primary rounded-circle text-uppercase"><span class="initial-wrap"><span>${avatarTxt}</span></span></span>`;
                        }
                        return avatarHtml;
                    }
                    removeDuplicateFilterOptions(containerid) {
                        const seen = {};
                        $(`#dateFilterSelect_${containerid} option,#eventFilterSelect_${containerid} option`).each(function () {
                            var txt = $(this).text();
                            if (seen.hasOwnProperty(txt)) {
                                $(this).closest("option").remove();
                            }
                            else {
                                seen[txt] = true;
                            }
                        });
                        $(`#eventFilterSelect_${containerid},#dateFilterSelect_${containerid}`).select2({
                            allowClear: true
                        });
                        $(`#eventFilterSelect_${containerid},#dateFilterSelect_${containerid}`).val('').trigger('change');
                    }
                    applyTimelineFilters(containerid) {
                        const instance = this;
                        const eventFilterVal = $(`#eventFilterSelect_${containerid}`).val();
                        const dateFilterVal = $(`#dateFilterSelect_${containerid}`).val();
                        if (eventFilterVal || dateFilterVal) {
                            const timelineListEl = $(`#timeLineList_${containerid}`);
                            timelineListEl.find('.timeline-by-date-item,.timeline-item').addClass('d-none');
                            let timelineItems = $();
                            if (eventFilterVal) {
                                timelineItems = timelineListEl.find(`.timeline-item[data-filtertype="${eventFilterVal}"]`);
                            }
                            else {
                                timelineItems = timelineListEl.find(`.timeline-item[data-filterdate="${dateFilterVal}"]`);
                            }
                            if (eventFilterVal && dateFilterVal) {
                                timelineItems = timelineListEl.find(`.timeline-item[data-filterdate="${dateFilterVal}"][data-filtertype="${eventFilterVal}"]`);
                            }
                            timelineItems.slice(0, 10).removeClass('d-none').parents('.timeline-by-date-item').removeClass('d-none');
                            if (timelineItems.not(':visible').length) {
                                $(`#loadMoreTimelineBtn_${containerid}`).removeClass('d-none');
                            }
                            else {
                                $(`#loadMoreTimelineBtn_${containerid}`).addClass('d-none');
                            }
                            if (!timelineItems.length) {
                                $(`#noTimelineDataMsg_${containerid}`).removeClass('d-none');
                            }
                            else {
                                $(`#noTimelineDataMsg_${containerid}`).addClass('d-none');
                            }
                            $(`#timelineFilterDropdownMenu_${containerid}`).removeClass('show');
                            instance.isFilterApplied = true;
                        }
                    }
                    clearTimelineFilters(containerid) {
                        if (this.isFilterApplied) {
                            const timelineListEl = $(`#timeLineList_${containerid}`);
                            $(`#eventFilterSelect_${containerid},#dateFilterSelect_${containerid}`).val('').trigger('change');
                            timelineListEl.find('.timeline-item').addClass('d-none');
                            timelineListEl.find('.timeline-by-date-item,.timeline-item:lt(10)').removeClass("d-none");
                            timelineListEl.find('.timeline-by-date-item').each(function (i, e) {
                                if (!$(e).find('.timeline-item:visible').length) {
                                    $(e).addClass('d-none');
                                }
                                else {
                                    $(e).removeClass('d-none');
                                }
                            });
                            if (timelineListEl.find('.timeline-item').length > 10) {
                                $(`#loadMoreTimelineBtn_${containerid}`).removeClass('d-none');
                            }
                            $(`#timelineFilterDropdownMenu_${containerid}`).removeClass('show');
                            this.isFilterApplied = false;
                        }
                    }
                    loadMoreTimeline(containerid) {
                        const instance = this;
                        const timelineListEl = $(`#timeLineList_${containerid}`);
                        if (!instance.isFilterApplied) {
                            timelineListEl.find('.timeline-item:hidden:lt(10)').removeClass("d-none").parents('.timeline-by-date-item').removeClass('d-none');
                            if (!timelineListEl.find('.timeline-item:hidden').length) {
                                $(`#loadMoreTimelineBtn_${containerid}`).addClass('d-none');
                            }
                        }
                        else {
                            const eventFilterVal = $(`#eventFilterSelect_${containerid}`).val();
                            const dateFilterVal = $(`#dateFilterSelect_${containerid}`).val();
                            if (eventFilterVal || dateFilterVal) {
                                let timelineItems = $();
                                if (eventFilterVal) {
                                    timelineItems = timelineListEl.find(`.timeline-item[data-filtertype="${eventFilterVal}"]`);
                                }
                                else {
                                    timelineItems = timelineListEl.find(`.timeline-item[data-filterdate="${dateFilterVal}"]`);
                                }
                                if (eventFilterVal && dateFilterVal) {
                                    timelineItems = timelineListEl.find(`.timeline-item[data-filterdate="${dateFilterVal}"][data-filtertype="${eventFilterVal}"]`);
                                }
                                timelineItems.not(':visible').slice(0, 10).removeClass('d-none').parents('.timeline-by-date-item').removeClass('d-none');
                                if (timelineItems.not(':visible').length) {
                                    $(`#loadMoreTimelineBtn_${containerid}`).removeClass('d-none');
                                }
                                else {
                                    $(`#loadMoreTimelineBtn_${containerid}`).addClass('d-none');
                                }
                            }
                        }
                    }
                    timelineTxtTrim(containerid) {
                        const timelineListEl = $(`#timeLineList_${containerid}`);
                        timelineListEl.find(".timelineContainer").each(function (i, e) {
                            let containerHeight = $(e).outerHeight(true);
                            if (containerHeight > 40) {
                                $(e).addClass('timeline-data-hide');
                                const firstTimelineEl = $(e).find('.timeline_data').first();
                                const firstElOuterHeight = firstTimelineEl.outerHeight(true);
                                if (firstElOuterHeight > 18 && firstElOuterHeight < 40) {
                                    firstTimelineEl.append('<a href="javascript:;" class="font-13 font-weight-600 timeline-more text-dark text-underline ml-10">More</a>');
                                }
                                else if (firstElOuterHeight > 40) {
                                    firstTimelineEl.addClass('d-flex align-items-end').append('<a href="javascript:;" class="font-13 font-weight-600 timeline-more text-dark text-underline ml-10">More</a>').find('.timeline-note').addClass('timeline-data-hide-single');
                                }
                                else {
                                    $(e).find('.timeline_data').eq(1).addClass('d-flex').append('<a href="javascript:;" class="font-13 font-weight-600 timeline-more text-dark text-underline ml-10">More</a>').find('.timeline-note').addClass('text-truncate');
                                }
                            }
                        });
                        timelineListEl.find('.timeline-more').on('click', function () {
                            $(this).parents('.timelineContainer').removeClass('timeline-data-hide');
                            $(this).parent().removeClass('d-flex').find('.timeline-note').removeClass('timeline-data-hide-single text-truncate');
                            $(this).remove();
                        });
                    }
                    StageChangeReasons(commentid) {
                        var reason = "NA";
                        var description = "NA";
                        Unibase.Platform.Apps.Managers.StageManager.Instance().getStageChangesByCommentId(commentid).then(function (response) {
                            if (response.result != null && response.result != "") {
                                reason = response.result.Reason == null ? "NA" : response.result.Reason;
                                description = response.result.Description == null ? "NA" : response.result.Description;
                            }
                            var html = '<table class="stagereason_table w-100"><tbody style="height:100px"><tr class="mb-2"><th class="text-dark" style="font-size:16px;">Reason</th><th class="text-dark" style="font-size:16px;">Description</th></tr><tr><td>' + reason + '</td><td>' + description + '</td></tr></tbody></table>';
                            bootbox.dialog({
                                message: html
                            });
                        });
                    }
                    loadform(formtype) {
                        var formuniqueid = "Unibase_Platform_Communications_mails_App_mails_CreateForm_Duplicate";
                        switch (formtype) {
                            case 1:
                                formuniqueid = "Bizgaze_Extension_Communication_Tasks_App_Tasks_CreateForm_Duplicate";
                                break;
                            case 2:
                                formuniqueid = "Unibase_Platform_Communications_SMS_App_SMS_CreateForm_Duplicate";
                                break;
                            case 3:
                                formuniqueid = "Bizgaze_Platform_Crm_Calls_App_Calls_CreateForm_Duplicate";
                                break;
                            case 4:
                                formuniqueid = "Bizgaze_Platform_Communication_Meetings_App_Meetings_CreateForm_Duplicate";
                                break;
                        }
                        Unibase.Platform.Forms.Managers.FormManager.Instance().getFormbyUniqueId(formuniqueid).then(function (response) {
                            if (response.result != null) {
                                Unibase.Platform.Helpers.NavigationHelper.Instance().loadForm(response.result.FormId, 0, 0, 0, function (response) { });
                            }
                        });
                    }
                    loadDataComments(versionguid, containerid) {
                        if (versionguid != "" && versionguid != undefined) {
                            var instance = this;
                            var installedappid = Unibase.Themes.Providers.DetailHelper.installedAppId;
                            this.fileCacheHelper.loadJsFile('platform/automation/managers/rulemanager.js', function () {
                                var priority = $('.chk_primarylog').is(":checked");
                                (priority == true) ? $('.Primary_Label').text('Primary') : $('.Primary_Label').text('Secondary');
                                Unibase.Platform.Automation.Managers.RuleManager.Instance().getTimeLineLogs(versionguid, installedappid, priority).then(function (response) {
                                    let html = "";
                                    if (response.result == null || response.result.length == 0) {
                                        $(`#timelineFilterDropdown_${containerid}`).addClass('d-none');
                                        if (!$(`#timeLineWrap_${containerid}`).find('.alert').length) {
                                            html = '<div class="alert alert-primary alert_nodata text-center mb-0 border-0 w-100" style="border-radius:0">No data available</div>';
                                            $(`#timeLineWrap_${containerid}`).append(html);
                                        }
                                    }
                                    else if (response.result != null) {
                                        instance.Comments = response.result.filter(x => x.EventLogId == 0);
                                        response.result = response.result.filter(x => x.ParentCommentId == 0);
                                        const timelineListEl = $(`#timeLineList_${containerid}`);
                                        timelineListEl.html('');
                                        $(`#timelineBody_${containerid}`).removeClass('d-none');
                                        for (var i = 0; i < response.result.length; i++) {
                                            html = "";
                                            let username = response.result[i].UserName;
                                            var id = username + "_" + moment(response.result[i].CreatedDate).format("DDMMYYYYHHmm");
                                            id = id.replace(/\s/g, '');
                                            const timeLineDate = moment(response.result[i].CreatedDate).format("DD-MM-YYYY");
                                            html = Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadCommentsAndTimeLineLogs(response.result[i], id);
                                            if (html == '') {
                                                continue;
                                            }
                                            id = id + "_" + instance.EventType;
                                            var formatdate = moment(response.result[i].CreatedDate).format("DD MMM YYYY");
                                            if ($(timelineListEl).find('.timeLineByDate_' + timeLineDate).length == 0) {
                                                timelineListEl.append(`<li id="timeLineByDate_${timeLineDate} " class="timeline-by-date-item timeLineByDate_${timeLineDate}" data-date="${timeLineDate}"><div style="width: 100%; height: 15px; border-bottom: 1px solid black; text-align: center; margin-bottom:30px;">
  <span style="font-size:15px;background-color:white;padding: 0 5px;">
    ${formatdate}
  </span>
</div><ul id="timeLineByDateList_${timeLineDate}" class="timeline-by-date-list d-flex flex-column r-gap-10"></ul></li>`);
                                            }
                                            if (instance.EventType == "Comment" || $('#timelineItem_' + id).length == 0) {
                                                timelineListEl.find(`#timeLineByDateList_${timeLineDate}`).append(html);
                                            }
                                            else {
                                                timelineListEl.find(`#timelineItem_${id}`).find('.ul_' + id).append(`<li class="timeline_data"><span class="timeline-note">${instance.EventNote}</span></li>`);
                                            }
                                        }
                                        timelineListEl.find('.timeline-item:gt(10)').addClass("d-none");
                                        timelineListEl.find('.timeline-by-date-item').each(function (i, e) {
                                            if (!$(e).find('.timeline-item:visible').length) {
                                                $(e).addClass('d-none');
                                            }
                                        });
                                        if (timelineListEl.find('.timeline-item').length > 10) {
                                            timelineListEl.append(`<div id="loadMoreTimelineBtn_${containerid}" class="btn btn-sm btn-outline-primary mx-auto" onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadMoreTimeline('${containerid}');">Load more</div>`);
                                        }
                                        instance.removeDuplicateFilterOptions(containerid);
                                        instance.timelineTxtTrim(containerid);
                                    }
                                });
                            });
                        }
                    }
                    saveComment(versionguid, containerid) {
                        const instance = this;
                        const commentInputEl = $(`#timelineCommentInput_${containerid}`);
                        const enteredComment = commentInputEl.val().toString().trim();
                        var parentCommentId = Number($(commentInputEl).attr("data-parentcommentid"));
                        if (!enteredComment) {
                            MessageHelper.Instance().showError("Please Enter Something...", `timeLineErrMsg_${containerid}`);
                            return false;
                        }
                        const postData = {
                            CommentId: 0,
                            RefGuid: versionguid,
                            CommentSubject: enteredComment,
                            CommentType: Unibase.Platform.Automation.Enums.CommentType.Comment,
                            Followers: null,
                            InstallPageId: Unibase.Themes.Providers.DetailHelper.installedAppId,
                            ParentId: parentCommentId
                        };
                        Unibase.Platform.Automation.Managers.CommentManager.Instance().saveComment(postData).then(function (response) {
                            if (response.status == Unibase.Data.Status.Error) {
                                MessageHelper.Instance().showError(response.message, `timeLineErrMsg_${containerid}`);
                                return false;
                            }
                            if (response.result) {
                                var element = $(`#timeLineList_${instance.containerid}`);
                                var obj = {
                                    EventLogId: 0,
                                    EventId: 0,
                                    CreatedDate: response.result.CreatedDate,
                                    EventTypeId: 10,
                                    UserName: response.result.FromUserName,
                                    UserPhotoPath: response.result.FromUserPhotoUrl,
                                    EventTemplateNote: null,
                                    SecondaryTemplateNote: null,
                                    CommentId: response.result.CommentId,
                                    ParentCommentId: response.result.ParentId,
                                    ParentUserId: 0,
                                    CommentSubject: response.result.CommentSubject,
                                    CreatedBy: Unibase.Platform.Membership.Infos.Identity.currentUser.userId
                                };
                                instance.Comments.push(obj);
                                var id = response.result.FromUserName + "_" + moment(obj.CreatedDate).format("DDMMYYYYHHmm") + "_Comment";
                                id = id.replace(/\s/g, '');
                                const timeLineDate = moment(obj.CreatedDate).format("DD-MM-YYYY");
                                var html = instance.loadCommentsAndTimeLineLogs(obj, id);
                                if (parentCommentId != 0) {
                                    $(element).find('.childwithparent_' + parentCommentId).append(html);
                                    var count = Number($(element).find('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).attr('data-childcount')) + 1;
                                    $(element).find('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).attr('data-childcount', count);
                                    $(element).find('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).text('Replies (' + count + ')');
                                }
                                else {
                                    var formatdate = moment(obj.CreatedDate).format("DD MMM YYYY");
                                    if ($(element).find('.timeLineByDate_' + timeLineDate).length == 0) {
                                        element.prepend(`<li id="timeLineByDate_${timeLineDate} " class="timeline-by-date-item timeLineByDate_${timeLineDate}" data-date="${timeLineDate}"><div style="width: 100%; height: 15px; border-bottom: 1px solid black; text-align: center; margin-bottom:30px;">
  <span style="font-size:15px;background-color:white;padding: 0 5px;">
    ${formatdate}
  </span>
</div><ul id="timeLineByDateList_${timeLineDate}" class="timeline-by-date-list d-flex flex-column r-gap-10"></ul></li>`);
                                    }
                                    if ($(element).find('.timeLineByDate_' + timeLineDate).find('.timeline-item').length == 0) {
                                        $(element).find('.timeLineByDate_' + timeLineDate).append(html);
                                    }
                                    else {
                                        $(element).find('.timeLineByDate_' + timeLineDate).find('.timeline-item:eq(0)').before(html);
                                    }
                                }
                                commentInputEl.val('');
                                $('.timeline-body').removeClass('d-none');
                                $('.alert_nodata').addClass('d-none');
                                $(`#saveCommentBtn_${containerid}`).addClass('d-none');
                                MessageHelper.Instance().showSuccess("Comment Saved Successfully", "");
                                instance.removeDuplicateFilterOptions(containerid);
                            }
                            $(commentInputEl).attr("data-parentcommentid", 0);
                        });
                    }
                    replyComments(CommentId) {
                        var instance = this;
                        var element = $(`#timeLineList_${instance.containerid}`);
                        var ChildComments = instance.Comments.filter(x => x.ParentCommentId == CommentId);
                        if (ChildComments.length > 0 && $(element).find('.childwithparent_' + CommentId).find('li').length == 0) {
                            for (let i = 0; i < ChildComments.length; i++) {
                                var randomid = `${Date.now()}_${moment().unix()}`;
                                var html = Unibase.Platform.TimeLine.Components.TimeLine.Instance().loadCommentsAndTimeLineLogs(ChildComments[i], randomid);
                                $(element).find('.childwithparent_' + CommentId).append(html);
                                instance.removeDuplicateFilterOptions(instance.containerid);
                            }
                        }
                        else {
                            var result = instance.Comments.find(x => x.CommentId = CommentId);
                            var text = "@" + result.UserName;
                            $(`#timelineCommentInput_${instance.containerid}`).val(text);
                            $(`#timelineCommentInput_${instance.containerid}`).attr("data-parentcommentid", CommentId);
                            $('.save-comment-btn').removeClass('d-none');
                        }
                    }
                    loadCommentsAndTimeLineLogs(response, randIDGen) {
                        var html = "", instance = this, icon = "", filterType = "", deleteIcon = "", commentClass = "";
                        const timeLineDate = moment(response.CreatedDate).format("DD-MM-YYYY");
                        var localdate = Unibase.Platform.Helpers.DateTimeHelper.Instance().formatLocalDate(response.CreatedDate);
                        var datewithT = Unibase.Platform.Helpers.DateTimeHelper.Instance().formatLocalDateTimeWithT(response.CreatedDate);
                        const timeLineTime = datewithT.replace(localdate, '');
                        instance.stageReasons = "";
                        const eventTypeId = response.EventTypeId;
                        if (eventTypeId == Number(Unibase.Platform.Automation.Enums.EventType.Created)) {
                            icon = 'fa fa-plus', filterType = 'Create';
                        }
                        else if (eventTypeId == Number(Unibase.Platform.Automation.Enums.EventType.Updated)) {
                            icon = 'fa fa-pencil', filterType = 'Updated';
                        }
                        else if (eventTypeId == Number(Unibase.Platform.Automation.Enums.EventType.Deleted)) {
                            icon = 'fa fa-trash', filterType = 'Deleted';
                        }
                        else if (eventTypeId == Number(Unibase.Platform.Automation.Enums.EventType.Comment)) {
                            icon = 'fa fa-comment', filterType = 'Comment', deleteIcon = Unibase.Platform.Membership.Infos.Identity.currentUser.userId == response.CreatedBy ? `<i class='fa fa-trash-o text-danger font-16 'onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().deleteComment(${response.CommentId})"></i>` : "", commentClass = "Commentli_" + response.CommentId;
                        }
                        else if (eventTypeId == Number(Unibase.Platform.Automation.Enums.EventType.StageEvent)) {
                            icon = 'fa fa-cogs', filterType = 'Changed';
                            instance.stageReasons = '<span class="reason_div"><a  onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().StageChangeReasons(' + response.CommentId + ')"><span class="biz-highlight-bg-color font-12">Reasons</span></a></span>';
                        }
                        else {
                            icon = '', filterType = 'Result Action';
                        }
                        instance.EventType = filterType;
                        let username = response.UserName;
                        const avatartHtml = instance.setTimelineAvatar(response);
                        var primarynote = response.EventTemplateNote;
                        var secondarynote = JSON.parse(response.SecondaryTemplateNote);
                        var eventtemplate = primarynote == null ? secondarynote : primarynote;
                        var Event = "", EventNote = "";
                        if (response.EventId != 0 && eventtemplate == null) {
                            return html = '';
                        }
                        if (eventtemplate != null) {
                            Event = eventtemplate.EventName.split("_");
                            instance.EventType = Event[Event.length - 1];
                            Event = Event[Event.length - 2] + " " + Event[Event.length - 1];
                            EventNote = eventtemplate.NotesText.toLowerCase();
                            var OldValue = response.OldValue;
                            var NewValue = response.NewValue;
                            if (response.Keys != "{}" && response.Keys != null) {
                                let Keys = JSON.parse(response.Keys);
                                var objectprop = Object.getOwnPropertyNames(Keys);
                                for (let k = 0; k < objectprop.length; k++) {
                                    EventNote = EventNote.replaceAll('{{' + objectprop[k].toLowerCase() + '}}', Keys[objectprop[k]]);
                                }
                            }
                            if (EventNote.indexOf("{{oldvalue}}") != -1) {
                                EventNote = EventNote.replace("{{oldvalue}}", OldValue);
                            }
                            if (EventNote.indexOf("{{newvalue}}") != -1) {
                                EventNote = EventNote.replace("{{newvalue}}", NewValue);
                            }
                            if (EventNote.match('{{.*}}')) {
                                EventNote = EventNote.replaceAll('{{', '').replaceAll('}}', '');
                            }
                            if (eventtemplate.EventAliasName != '') {
                                Event = eventtemplate.EventAliasName;
                            }
                            instance.EventNote = EventNote;
                        }
                        else if (eventtemplate == null && response.EventLogId == 0) {
                            instance.EventType = "Comment";
                            var childtext = "Reply";
                            var childcount = instance.Comments.filter(x => x.ParentCommentId == response.CommentId).length;
                            if (childcount > 0) {
                                childtext = "Replies (" + childcount + ")";
                            }
                            EventNote = `<b>${response.CommentSubject}</b><div class="replaycomment"><a class="rplybtn_${response.CommentId}" data-childcount=${childcount} href="javascript:(0)" data-parentcommentid='${response.CommentId}' onclick="Unibase.Platform.TimeLine.Components.TimeLine.Instance().replyComments(${response.CommentId})">${childtext}</a><ul class="childwithparent_${response.CommentId}"></ul></div>`;
                        }
                        randIDGen = randIDGen + "_" + instance.EventType;
                        html += `<li id="timelineItem_${randIDGen}" class="filtersearch pb-2 timelineItem_${randIDGen} timeline-item ${commentClass}  my-1 my-md-0 mb-2 filterLi ${filterType} ${timeLineDate}" data-filterType="${filterType}" data-filterdate="${timeLineDate}"><div class="d-flex c-gap-10"><div class="avatar avatar-sm flex-shrink-0 timeline-avatar" data-tooltip="true" title="${username}">${avatartHtml}<span class="btn btn-icon btn-icon-circle btn-primary btn-xs d-20 timeline_icon_wrap" data-tooltip="true" title="${filterType}"><span class="btn-icon-wrap"><i class="${icon} font-10"></i></span></span></div><div class="d-flex flex-grow-1 c-gap-10 mnw-0"><div class="timeline_desc  text-dark w-100 mnw-0 d-flex flex-column r-gap-5 font-12"><h6 class="text-capitalize font-14 time_title">${Event}</h6><ul class="timelineContainer text-light-80  ul_${randIDGen}"><li class="timeline_data"><span class="timeline-note">${EventNote}</span></li></ul>${instance.stageReasons}${response.ParentUserId ? `<span class="logged-from-div biz-highlight-bg-color font-12">logged from ${response.ParentUserName} to ${username}</span>` : ''}</div>${deleteIcon}<span class="timeline_date flex-shrink-0">${timeLineTime}</span></div></div></li>`;
                        var eventfilterhtml = `<option value='${filterType}'>${filterType}</option>`;
                        var timefilterhtml = `<option value='${timeLineDate}'>${timeLineDate}</option>`;
                        $(`#eventFilterSelect_${instance.containerid}`).append(eventfilterhtml);
                        $(`#dateFilterSelect_${instance.containerid}`).append(timefilterhtml);
                        return html;
                    }
                    deleteComment(CommentId) {
                        var instance = this;
                        Unibase.Platform.Automation.Managers.CommentManager.Instance().deleteComment(CommentId).then(function (response) {
                            if (response.status == Unibase.Data.Status.Success) {
                                var parentCommentId = instance.Comments.find(x => x.CommentId == CommentId)["ParentCommentId"];
                                var date = $('.Commentli_' + CommentId).attr('data-filterdate');
                                $('.Commentli_' + CommentId).remove();
                                if ($('.timeLineByDate_' + date).find('.timeline-item').length == 0) {
                                    $('.timeLineByDate_' + date).remove();
                                }
                                if (parentCommentId != 0) {
                                    var count = Number($('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).attr('data-childcount')) - 1;
                                    var text = "Reply";
                                    if (count > 0) {
                                        text = "Replies (" + count + ")";
                                    }
                                    $('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).attr('data-childcount', count);
                                    $('.childwithparent_' + parentCommentId).parent().find('.rplybtn_' + parentCommentId).text(text);
                                }
                                instance.Comments = instance.Comments.filter(x => x.CommentId != CommentId && x.ParentCommentId != CommentId);
                                MessageHelper.Instance().showSuccess("Successfully comment deleted", "");
                            }
                            else {
                                alert("Failed To Delete Comment");
                            }
                        });
                    }
                    static Instance() {
                        if (this.instance === undefined) {
                            this.instance = new TimeLine();
                        }
                        return this.instance;
                    }
                }
                Components.TimeLine = TimeLine;
            })(Components = TimeLine_1.Components || (TimeLine_1.Components = {}));
        })(TimeLine = Platform.TimeLine || (Platform.TimeLine = {}));
    })(Platform = Unibase.Platform || (Unibase.Platform = {}));
})(Unibase || (Unibase = {}));