{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
    GNU General Public License for more details.

    Edwiser RemUI
    @package theme_remui
    @copyright (c) 2023 WisdmLabs (https://wisdmlabs.com/)
    @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later

}}
{{!
    @template theme_remui/dashboard_stats
}}
{{#isdashboardstatsshow}}

<div id="wdm_dashboard-stats" class="edw-stats-wrapper">
	<div class="stat-block">
		<div class="inner">
			<div class="icon-container">
				<span class="edw-icon edw-icon-Course-enrolled_24"></span>
			</div>
			<div class="info-container d-flex flex-column p-mb-d5">
				<span class="h-exbold-2 dashboard-stats-coursesenrolled"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
				<span class="h-semibold-6" title="{{#str}}coursesenrolled, theme_remui{{/str}}">{{#str}}coursesenrolled, theme_remui{{/str}}</span>
			</div>
		</div>
	</div>
	<div class="stat-block">
		<div class="inner">
			<div class="icon-container">
				<span class="edw-icon edw-icon-Completed-course"></span>
			</div>
			<div class="info-container d-flex flex-column p-mb-d5">
				<span class="h-exbold-2 dashboard-stats-coursescompleted"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
				<span class="h-semibold-6" title="{{#str}}coursescompleted, theme_remui{{/str}}">{{#str}}coursescompleted, theme_remui{{/str}}</span>
			</div>
		</div>
	</div>
	<div class="stat-block">
		<div class="inner">
			<div class="icon-container">
				<span class="edw-icon edw-icon-Activity-completed"></span>
			</div>
			<div class="info-container d-flex flex-column p-mb-d5">
				<span class="h-exbold-2 dashboard-stats-activitiescompleted"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
				<span class="h-semibold-6" title="{{#str}}activitiescompleted, theme_remui{{/str}}">{{#str}}activitiescompleted, theme_remui{{/str}}</span>
			</div>
		</div>
	</div>
	<div class="stat-block">
		<div class="inner">
			<div class="icon-container">
				<span class="edw-icon edw-icon-Due-acitvities"></span>
			</div>
			<div class="info-container d-flex flex-column p-mb-d5">
				<span class="h-exbold-2 dashboard-stats-activitiesdue"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
				<span class="h-semibold-6" title="{{#str}}activitiesdue, theme_remui{{/str}}">{{#str}}activitiesdue, theme_remui{{/str}}</span>
			</div>
		</div>
	</div>

	<div class="stats-mb-devices">
		<div class="stat-block">
			<div class="inner">
				<div class="icon-container">
					<span class="edw-icon edw-icon-Course-enrolled_24"></span>
				</div>
				<div class="info-container d-flex flex-column p-mb-d5">
					<span class="h-exbold-2 dashboard-stats-coursesenrolled"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
					<span class="h-semibold-6" title="{{#str}}coursesenrolled, theme_remui{{/str}}">{{#str}}coursesenrolled, theme_remui{{/str}}</span>
				</div>
			</div>
		</div>
		<div class="stat-block">
			<div class="inner">
				<div class="icon-container">
					<span class="edw-icon edw-icon-Activity-completed"></span>
				</div>
				<div class="info-container d-flex flex-column p-mb-d5">
					<span class="h-exbold-2 dashboard-stats-activitiescompleted"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
					<span class="h-semibold-6" title="{{#str}}activitiescompleted, theme_remui{{/str}}">{{#str}}activitiescompleted, theme_remui{{/str}}</span>
				</div>
			</div>
		</div>
	</div>
	<div class="stats-mb-devices">
		<div class="stat-block">
			<div class="inner">
				<div class="icon-container">
					<span class="edw-icon edw-icon-Completed-course"></span>
				</div>
				<div class="info-container d-flex flex-column p-mb-d5">
					<span class="h-exbold-2 dashboard-stats-coursescompleted">0</span>
					<span class="h-semibold-6" title="{{#str}}coursescompleted, theme_remui{{/str}}">{{#str}}coursescompleted, theme_remui{{/str}}</span>
				</div>
			</div>
		</div>
		<div class="stat-block">
			<div class="inner">
				<div class="icon-container">
					<span class="edw-icon edw-icon-Due-acitvities"></span>
				</div>
				<div class="info-container d-flex flex-column p-mb-d5">
					<span class="h-exbold-2 dashboard-stats-activitiesdue"><img src="{{siteinnerloader}}" alt="loader image"  height="30" width="30"></span>
					<span class="h-semibold-6" title="{{#str}}activitiesdue, theme_remui{{/str}}">{{#str}}activitiesdue, theme_remui{{/str}}</span>
				</div>
			</div>
		</div>
	</div>
</div>

{{#js}}
	require(['jquery', 'core/ajax'], function($, Ajax) {
		$(document).ready(function(){
			let service_name = 'theme_remui_get_dashboard_stats';
			let cstats = Ajax.call([
			    {
			        methodname: service_name,
			        args: {}
			    }
			]);
			cstats[0].done(function(response) {
			    // When course stats block is ready then render the respose value.
			    $('.stats').ready(function() {
			        $.each(response, function(index, value) {
			            var statsDiv = '#wdm_dashboard-stats .dashboard-stats-' + index;
			            $(statsDiv).text(value);
			        })
			    });
			});
		});
	});
{{/js}}

{{/isdashboardstatsshow}}