| 1 |
<?php |
| 2 |
/** |
| 3 |
* Analytics Page View |
| 4 |
* |
| 5 |
* @package AtomicEdge |
| 6 |
*/ |
| 7 |
|
| 8 |
// Prevent direct access. |
| 9 |
if ( ! defined( 'ABSPATH' ) ) { |
| 10 |
exit; |
| 11 |
} |
| 12 |
|
| 13 |
// Use dev mode for local environments. |
| 14 |
$atomicedge_dev_mode = AtomicEdge_Dev_Mode::is_enabled(); |
| 15 |
?> |
| 16 |
<div class="wrap atomicedge-wrap"> |
| 17 |
<h1><img src="<?php echo esc_url( ATOMICEDGE_PLUGIN_URL . 'admin/images/logo.svg' ); ?>" alt="<?php esc_attr_e( 'Atomic Edge', 'atomic-edge-security' ); ?>" class="atomicedge-logo" /></h1> |
| 18 |
|
| 19 |
<?php |
| 20 |
// Show dev mode notice. |
| 21 |
// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- HTML is escaped in the method. |
| 22 |
echo AtomicEdge_Dev_Mode::get_admin_notice(); |
| 23 |
?> |
| 24 |
|
| 25 |
<div class="atomicedge-analytics"> |
| 26 |
<!-- Period Selector --> |
| 27 |
<div class="atomicedge-period-selector"> |
| 28 |
<label for="atomicedge-period"><?php esc_html_e( 'Time Period:', 'atomic-edge-security' ); ?></label> |
| 29 |
<select id="atomicedge-period"> |
| 30 |
<option value="24h"><?php esc_html_e( 'Last 24 Hours', 'atomic-edge-security' ); ?></option> |
| 31 |
<option value="7d"><?php esc_html_e( 'Last 7 Days', 'atomic-edge-security' ); ?></option> |
| 32 |
<option value="30d"><?php esc_html_e( 'Last 30 Days', 'atomic-edge-security' ); ?></option> |
| 33 |
</select> |
| 34 |
<button type="button" id="atomicedge-refresh-analytics" class="button"> |
| 35 |
<span class="dashicons dashicons-update"></span> |
| 36 |
<?php esc_html_e( 'Refresh', 'atomic-edge-security' ); ?> |
| 37 |
</button> |
| 38 |
</div> |
| 39 |
|
| 40 |
<!-- Summary Stats --> |
| 41 |
<div class="atomicedge-stats-grid" id="atomicedge-stats-grid"> |
| 42 |
<div class="atomicedge-stat-box"> |
| 43 |
<span class="atomicedge-stat-icon dashicons dashicons-visibility"></span> |
| 44 |
<div class="atomicedge-stat-content"> |
| 45 |
<span class="atomicedge-stat-value" id="stat-total-requests">-</span> |
| 46 |
<span class="atomicedge-stat-label"><?php esc_html_e( 'Total Requests', 'atomic-edge-security' ); ?></span> |
| 47 |
</div> |
| 48 |
</div> |
| 49 |
<div class="atomicedge-stat-box"> |
| 50 |
<span class="atomicedge-stat-icon dashicons dashicons-groups"></span> |
| 51 |
<div class="atomicedge-stat-content"> |
| 52 |
<span class="atomicedge-stat-value" id="stat-unique-visitors">-</span> |
| 53 |
<span class="atomicedge-stat-label"><?php esc_html_e( 'Unique Visitors', 'atomic-edge-security' ); ?></span> |
| 54 |
</div> |
| 55 |
</div> |
| 56 |
<div class="atomicedge-stat-box"> |
| 57 |
<span class="atomicedge-stat-icon dashicons dashicons-shield-alt"></span> |
| 58 |
<div class="atomicedge-stat-content"> |
| 59 |
<span class="atomicedge-stat-value" id="stat-blocked-requests">-</span> |
| 60 |
<span class="atomicedge-stat-label"><?php esc_html_e( 'Requests Blocked', 'atomic-edge-security' ); ?></span> |
| 61 |
</div> |
| 62 |
</div> |
| 63 |
<div class="atomicedge-stat-box"> |
| 64 |
<span class="atomicedge-stat-icon dashicons dashicons-chart-line"></span> |
| 65 |
<div class="atomicedge-stat-content"> |
| 66 |
<span class="atomicedge-stat-value" id="stat-block-rate">-</span> |
| 67 |
<span class="atomicedge-stat-label"><?php esc_html_e( 'Block Rate', 'atomic-edge-security' ); ?></span> |
| 68 |
</div> |
| 69 |
</div> |
| 70 |
</div> |
| 71 |
|
| 72 |
<!-- Charts --> |
| 73 |
<div class="atomicedge-charts"> |
| 74 |
<div class="atomicedge-chart-container"> |
| 75 |
<h3><?php esc_html_e( 'Traffic Over Time', 'atomic-edge-security' ); ?></h3> |
| 76 |
<div class="atomicedge-chart-wrapper"> |
| 77 |
<canvas id="atomicedge-traffic-chart"></canvas> |
| 78 |
</div> |
| 79 |
</div> |
| 80 |
|
| 81 |
<div class="atomicedge-chart-container"> |
| 82 |
<h3><?php esc_html_e( 'Blocked Requests Over Time', 'atomic-edge-security' ); ?></h3> |
| 83 |
<div class="atomicedge-chart-wrapper"> |
| 84 |
<canvas id="atomicedge-blocked-chart"></canvas> |
| 85 |
</div> |
| 86 |
</div> |
| 87 |
</div> |
| 88 |
|
| 89 |
<!-- Loading State --> |
| 90 |
<div id="atomicedge-analytics-loading" class="atomicedge-loading" style="display: none;"> |
| 91 |
<span class="spinner is-active"></span> |
| 92 |
<span><?php esc_html_e( 'Loading analytics...', 'atomic-edge-security' ); ?></span> |
| 93 |
</div> |
| 94 |
|
| 95 |
<!-- Error State --> |
| 96 |
<div id="atomicedge-analytics-error" class="atomicedge-error" style="display: none;"> |
| 97 |
<span class="dashicons dashicons-warning"></span> |
| 98 |
<span><?php esc_html_e( 'Failed to load analytics. Please try again.', 'atomic-edge-security' ); ?></span> |
| 99 |
</div> |
| 100 |
</div> |
| 101 |
</div> |
| 102 |
|
