<style>
    .lms-ui-indicator {
        display: none;
    }
    #indicator-critical {
        color: red;
    }
    #indicator-urgent {
        color: orangered;
    }
    #indicator-unread {
        color: blue;
    }
    #indicator-expired {
        color: red;
    }
    #indicator-outdated {
        color: orange;
    }
    #indicator-verify {
        color: green;
    }
    #indicator-watching {
        color: darkred;
    }
    #indicator-left {
        color: black;
    }
    #indicator-overdue {
        color: red;
    }
    #indicator-events {
        color: blue;
    }
</style>

{block name=indicatorcontents}
{if ConfigHelper::CheckPrivilege('helpdesk_administration') || ConfigHelper::CheckPrivilege('helpdesk_operation')}
<a href="?m=indicators&action=critical" class="lms-ui-indicator" title="{trans("Critical tickets")}"
    id="indicator-critical">
    <i class="fa-2x lms-ui-indicator-icon lms-ui-icon-critical"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=urgent" class="lms-ui-indicator" title="{trans("Urgent tickets")}"
    id="indicator-urgent">
    <i class="lms-ui-indicator-icon lms-ui-icon-urgent"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=unread" class="lms-ui-indicator" title="{trans("Unread tickets")}"
    id="indicator-unread">
    <i class="lms-ui-indicator-icon lms-ui-icon-unread"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=expired" class="lms-ui-indicator" title="{trans("<!rt>Expired tickets owned by You")}"
    id="indicator-expired">
    <i class="lms-ui-indicator-icon lms-ui-icon-deadline"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=outdated" class="lms-ui-indicator" title="{trans("<!rt>Outdated tickets owned by You")}"
    id="indicator-outdated">
    <i class="lms-ui-indicator-icon lms-ui-icon-sticky-note"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=verify" class="lms-ui-indicator" title="{trans("<!rt>Tickets waiting for my verification")}"
    id="indicator-verify">
    <i class="lms-ui-indicator-icon lms-ui-icon-verifier"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=watching" class="lms-ui-indicator" title="{trans("Watched tickets")}"
    id="indicator-watching">
    <i class="lms-ui-indicator-icon lms-ui-icon-watch"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=left" class="lms-ui-indicator" title="{trans("<!rt>Tickets left")}"
    id="indicator-left">
    <i class="lms-ui-indicator-icon lms-ui-icon-helpdesk"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
{/if}
{if ConfigHelper::CheckPrivilege('timetable_management')}
<a href="?m=indicators&action=events" class="lms-ui-indicator" title="{trans("Today's events assigned to You")}"
    id="indicator-events">
    <i class="lms-ui-indicator-icon lms-ui-icon-timetable"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>
<a href="?m=indicators&action=overdue" class="lms-ui-indicator" title="{trans("Overdue events assigned to You")}"
    id="indicator-overdue">
    <i class="lms-ui-indicator-icon lms-ui-icon-timetable"></i>
    <span class="lms-ui-indicator-counter">0</span>
</a>

{/if}
{if Auth::GetCurrentUser()}
<script>

    function getIndicatorStats() {
		$.ajax('?m=indicators&ajax=1&api=1', {
				method: "POST",
				dataType: "json"
			}
		).done(function (data) {
			$.each(data, function (idx, value) {
				if (parseInt(value))
                    $('#indicator-' + idx).show();
				else
					$('#indicator-' + idx).hide();
				$('#indicator-' + idx + ' .lms-ui-indicator-counter').html(value);
			});
		});
	}

    getIndicatorStats();

    setInterval(function() {
    	    getIndicatorStats();
        }, {ConfigHelper::getConfig('phpui.indicator_refresh_interval', 120)} * 1000);

</script>
{/if}
{/block}
