<footer class="main-footer printHide">
        <div class="pull-right hidden-xs">
            <b>Version</b> 1.0.0
        </div>
        <strong>Powered by &copy; 2017 <a href="http://www.salihin.com.my" target="blank"><img src="<?php echo base_url() ?>img/logos/salihin.png" width="70px" style="padding-bottom:8px"/></a>.</strong> All rights reserved.
</footer>
</div><!-- ./wrapper -->

<!-- SlimScroll -->
<script src="<?php echo base_url(); ?>plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="<?php echo base_url(); ?>plugins/fastclick/fastclick.min.js"></script>
<!-- AdminLTE App -->
<script src="<?php echo base_url(); ?>dist/js/app.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="<?php echo base_url(); ?>dist/js/demo.js"></script>


<script type="text/javascript" src="<?php echo base_url(); ?>plugins/pnotify/js/jquery.pnotify.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>plugins/pnotify/js/pnotify.buttons.js"></script>


<script>
    var check_session_start;
    $(document).ready(function () {
        $('#user_chatting_msg_box').keydown(function (e) {
            if (e.keyCode == 13) {
                if ($("#user_chatting_msg_box").val() !== "") {
                    user_format_and_display('s');
                }
                return false;
            }
        });
    });

    function show_chatting_chat_box() {
        $("#user_chatting_chat_box").removeClass("hide");
    }


    function user_format_and_display(option, handler) {
        if (option == "s") {
            var msg = '<div class="direct-chat-msg right">\
                        <div class="direct-chat-info clearfix">\
                            <span class="direct-chat-name pull-right">Me</span>\
                            <span class="direct-chat-timestamp pull-left">' + date_format('now') + '</span>\
                        </div>\
                        <img alt="(-_-)" src="' + $("#user_login_profile_pic").attr("src") + '" class="direct-chat-img">\
                        <div class="direct-chat-text">\
                            ' + $("#user_chatting_msg_box").val() + '\
                        </div>\
                    </div>';
            $('#user_msg_contenair').append(msg);


            if ($("#user_chatting_msg_box").attr("data-session_status") !== "started") {
                $("#user_chatting_msg_box").attr("disabled", "disabled");
                var msg = '<div class="direct-chat-msg">\
                            <div class="direct-chat-info clearfix">\
                                <span class="direct-chat-name pull-left">Admin</span>\
                                <span class="direct-chat-timestamp pull-right">' + date_format('now') + '</span>\
                            </div>\
                            <img alt="(-_-)" src="<?php echo base_url(); ?>dist/img/logo.png" class="direct-chat-img">\
                            <div class="direct-chat-text">\
<?php echo $this->lang->line('do_wait_for_awhile'); ?>  \
                            </div>\
                        </div>';
                $('#user_msg_contenair').append(msg);
                user_send_question_and_start_chatting($("#user_chatting_msg_box").val());
            } else {
                user_send_message($("#user_chatting_msg_box").val());
                ajax_load_admin_reply();
            }
            $("#user_chatting_msg_box").val("");
            var d = $('#user_msg_contenair');
            d.scrollTop(d.prop("scrollHeight"));
        } else {
            var msg = '<div class="direct-chat-msg">\
                            <div class="direct-chat-info clearfix">\
                                <span class="direct-chat-name pull-left">Admin</span>\
                                <span class="direct-chat-timestamp pull-right">' + date_format('now') + '</span>\
                            </div>\
                            <img alt="(-_-)" src="<?php echo base_url(); ?>dist/img/logo.png" class="direct-chat-img">\
                            <div class="direct-chat-text">\
                             <span id="_message_' + handler.messageID + '">' + handler.message + '</span> \
                            </div>\
                        </div>';
            $('#user_msg_contenair').append(msg);
            var d = $('#user_msg_contenair');
            d.scrollTop(d.prop("scrollHeight"));
            $("#user_chatting_msg_box").attr("data-last_message", handler.messageID);
            //user_set_msg_to_read(handler.messageID);

            //need to be handle later [ should be call once
            $("#user_chatting_msg_box").attr("data-session_status", "started")
            $("#user_chatting_msg_box").removeAttr("disabled");
        }
    }


    function chatting_submit_msg() {
        if ($("#user_chatting_msg_box").val() !== "") {
            user_format_and_display('s');
        }
    }


    function ajax_load_admin_reply() {
        $.ajax({
            type: "POST",
            data: {
                session: $("#user_chatting_msg_box").attr("data-sessionID"),
                last_message: $("#user_chatting_msg_box").attr("data-last_message")
            },
            url: "<?php echo base_url() ?>chatting/load_admin_reply",
            success: function (data) {
                var result = isjson(data);
                if (result && result.status == "success") {
                    var n = result.records.length, i = 0;
                    for (i = 0; i < n; i++) {
                        user_format_and_display('r', result.records[i]);
                    }
                }
            }
        });
    }

    function user_set_msg_to_read(msgID) {
        if (!$("#_message_" + msgID).length) {
            return 0;
        }

        $.ajax({
            type: "POST",
            data: {
                msgID: msgID
            },
            url: "<?php echo base_url() ?>chatting/set_msg_to_read",
            success: function (data) {

            }});
    }

    function user_send_question_and_start_chatting(question) {
        var postData = {
            question: question
        };

        $.ajax({
            type: "POST",
            url: "<?php echo base_url() ?>chatting/user_send_question",
            data: postData,
            success: function (data) {
                var result = isjson(data);
                if (result && $.trim(result.status) == "success") {
                    $("#user_chatting_msg_box").attr("data-sessionID", result.sessionID);
                    check_session_start = setInterval(function () {
                        ajax_load_admin_reply();
                    }, 2000);
                    $("#user_chatting_msg_box").attr("data-last_message", result.messageID);
                    //$("#user_chatting_msg_box").removeAttr("disabled");
                } else {
                    notify("Fail to send your question", 'Tekun ...', 'error');
                }
            }
        });
    }

    function user_send_message(message) {
        var postData = {
            message: message,
            session: $("#user_chatting_msg_box").attr("data-sessionID")
        };

        $.ajax({
            type: "POST",
            url: "<?php echo base_url() ?>chatting/user_send_message",
            data: postData,
            success: function (data) {
                var result = isjson(data);
                if (result && $.trim(result.status) == "success") {

                } else {
                    notify('Serveur encounter some issues', 'Message not sent', 'error');
                }
            }
        });
    }


    function close_chatting() {
        clearInterval(check_session_start);
        $("#user_chatting_chat_box").collapse().remove();
    }
</script>


<style>
    .chat-box{
        position:fixed;
        bottom:-20px;
        float:right;
        right: 10px;
        width: 400px;
        z-index: 2000;
    }
</style>

<div id="chatting_chat_box" class="chatbox hide">

</div>

<div id="user_chatting_chat_box" class="chat-box hide">
    <div id="user_chatting_msg_contenair" class=" box box-danger direct-chat direct-chat-danger">
        <div class="box-header with-border">
            <h3 class="box-title">Direct Chat</h3>
            <div class="box-tools pull-right">
                <button data-widget="collapse" class="btn btn-box-tool"><i class="fa fa-minus"></i></button>
                <button data-widget="chat-pane-toggle" title="Contacts" data-toggle="tooltip" class="btn btn-box-tool"><i class="fa fa-comments"></i></button>
                <button onclick="close_chatting(this)" class="btn btn-box-tool"><i class="fa fa-times"></i></button>
            </div>
        </div><!-- /.box-header -->
        <div class="box-body">
            <div id="user_msg_contenair" class="direct-chat-messages">
                <!-- Message. Default to the left -->
                <div class="direct-chat-msg">
                    <div class="direct-chat-info clearfix">
                        <span class="direct-chat-name pull-left">Admin</span>
                        <span class="direct-chat-timestamp pull-right"><?php echo date("d-m-Y H:s"); ?></span>
                    </div><!-- /.direct-chat-info -->
                    <img alt="(-_-)" src="<?php echo base_url(); ?>dist/img/logo.png" class="direct-chat-img"><!-- /.direct-chat-img -->
                    <div class="direct-chat-text">
                        <?php echo $this->lang->line('please_ask_question'); ?>
                    </div><!-- /.direct-chat-text -->
                </div><!-- /.direct-chat-msg -->
            </div>

        </div>
        <div class="box-footer">
            <div class="input-group">
                <input  id="user_chatting_msg_box" type="text" class="form-control" placeholder="Type Message ..." name="message">
                <span class="input-group-btn">
                    <button onclick="chatting_submit_msg(this)" class="btn btn-danger btn-flat" type="button">Send</button>
                </span>
            </div>
        </div><!-- /.box-footer-->
    </div>
</div>



<!--Start of Tawk.to Script-->
<script type="text/javascript">
/*var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/56809c8180b3f6b235f98d15/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();

Tawk_API = Tawk_API || {};
Tawk_API.visitor = {
	name  : '<?php  //echo element('username', $this->session->userdata('logged_in')); ?>',
	email : '<?php  //echo element('email', $this->session->userdata('logged_in')); ?>'
};

setTimeout(function(){
    $("#tawkchat-maximized-iframe-element").contents().find("#changeNameOption").remove();
    }, 3000);

*/
</script>
<!--End of Tawk.to Script-->

	<div id="_popup_modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
		    <div id="_popup_container" class="modal-dialog">
		        <div class="modal-content">
		            <div class="modal-header" style="min-height:50px;">
						<button type="button" class="close pull-right" data-dismiss="modal">&times;</button>
						<h4 class="modal-title pull-left">SPS Lite Accounting</h4>
		            </div>
		            <div id="_popup_body" class="modal-body" style="min-height:100px;">...</div>
		            <div id="_popup_footer" class="modal-footer">...</div>
		        </div>
		    </div>
		</div>
	</body>
</html>
