<link href="<?php echo base_url() ?>resource_library/css/clndr.css" rel="stylesheet">
<script>
    $(document).ready(function () {
        $(".cal1").click(function () {
            var base_url = '<?php echo base_url(); ?>';
            var ttImg = base_url + '/image/calendar_select_date.png';
            var SelectedClass = document.getElementById("TTDateClassValue").value;
            $(".day").css("background", "none");
            $(SelectedClass).css("background", "url(" + ttImg + ") no-repeat center");
        });
    });

</script>

<style>
    .day{padding: 10px}

    .clndr-controls{
        background-color: red;
        padding: 10px;
        color: #FFF !important;
        font-weight: bold;
        border-radius: 20px 20px 0 0;
    }
    .month{
        color: #FFF !important;
        font-weight: bold;
    }
    .clndr-table{
        margin-top: -10px !important;
        padding: 10px !important;
    }
    .clndr{
        width: 100% !important;
        margin: 0px auto !important;
    }
    .day-contents{
        padding-left: 0 !important;
        text-align: center !important;
    }
    .deep_green{
        background: #d3edb0;
    }
    .light_green{
        background: #e8f6d5;
    }
</style>
<?php
$person_id = $this->session->userdata('person_id');
?>
<div class="col-sm-8" id="main_div">
    <div class="row gray_ttc col-sm-12">
        <div class="col-sm-10 col-sm-offset-1" style="margin-top: 20px;">
            <span class="col-sm-8 col-sm-offset-1 text-center"><h3>All Notification</h3></span>
            <span class="col-sm-3 text-center" style="padding-top: 20px;">
                <a href="<?php echo base_url('user/view-notification-by-mark'); ?>">Mark all as read</a>
            </span>
        </div>
        <input type="hidden" name="TTDateValue" id="TTDateValue" value="">
        <input type="hidden" name="TTDateClassValue" id="TTDateClassValue" value="">
        <input type="hidden" id="basUrl" value="<?php echo base_url(); ?>">
        <div class="col-sm-12 padding-zero">
            <div class="padding-zero col-sm-12" >
                <div class="cal1 col-sm-8 col-sm-offset-2  padding-zero"></div>
            </div>
            <div class="col-sm-12 form-group"><br></div>
            <div id="notification_view">
                <?php
                if ($all_notification) {
                    foreach ($all_notification as $notification_value) {
                        ?>
                        <div class="media col-sm-10 col-sm-offset-1 <?php echo ($notification_seen_info[$notification_value->notification_id] == 2) ? 'deep_green' : '' ?>" id="viewSinglednotification<?php echo $notification_value->notification_id ?>" style="cursor: pointer;">
                            <div class="media-left">
                                <?php
                                if (in_array($notify_by_info[$notification_value->notification_id]->person_role, Array(1, 2, 6, 8, 9))) {
                                    ?>
                                    <img class="media-object " src="<?php echo base_url() ?>images/logo-50.png" alt="logo">
                                    <?php
                                } else {
                                    if ($notify_by_info[$notification_value->notification_id]->person_image) {
                                        ?>
                                        <img class="media-object " height="45" width="45"
                                             src="<?php echo base_url() . 'content-library/' . $notify_by_info[$notification_value->notification_id]->url . '/' . $notify_by_info[$notification_value->notification_id]->person_image ?>" alt="logo">
                                             <?php
                                         } else {
                                             ?>
                                        <img class="media-object " src="<?php echo base_url() ?>images/logo-50.png" alt="logo">
                                        <?php
                                    }
                                }
                                ?>
                            </div>
                            <div class="media-body" style="padding-left: 20px !important; text-align: left !important">
                                <span class="text-justify" style="">
                                    <?php
                                    echo $notification_message[$notification_value->notification_id];
                                    ?>
                                </span>
                                <div class="media-bottom">
                                    <p style="color: #999999">
                                        <?php echo $notification_date_time[$notification_value->notification_id] ?>
                                    </p>
                                </div>
                            </div>
                            <div class="modal fade" style="" id="viewDeleteWorkFile" tabindex="-1" role="dialog" aria-labelledby="changeRole" aria-hidden="true">
                                <?php
                                $message1 = '<span style="text-align:center">There is no content in this notification?</span>';
                                $this->cf->view_single_modal('notification', $message1);
                                ?>
                            </div>
                            <div class="modal fade" style="" id="headerViewDeleteWorkFile" tabindex="-1" role="dialog" aria-labelledby="changeRole" aria-hidden="true">
                                <?php
                                $message2 = '<span style="text-align:center">There is no content in this notification?</span>';
                                $this->cf->view_single_modal('headerNotification', $message2);
                                ?>
                            </div>
                        </div>
                        <?php
                    }
                } else {
                    echo '<span style="margin-left:350px">There is no notification</span>';
                }
                ?>
            </div>
        </div><!-- /.row gray -->
    </div>
</div>
<script src="<?php echo base_url() ?>resource_library/js/calender.js"></script>
<script src="<?php echo base_url() ?>resource_library/js/clndr.js"></script>
<script src="<?php echo base_url() ?>resource_library/js/underscore-min.js"></script>
