imagify / views / page-bulk.php

page-bulk.php in Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF trunk, at views/page-bulk.php

193 lines 7.0 KB

Raw Download Zip

1	<?php
2	defined( 'ABSPATH' ) \|\| exit;
3	?>
4	<div class="wrap imagify-settings imagify-bulk">
5
6	<?php $this->print_template( 'part-bulk-optimization-header' ); ?>
7
8	<div class="imagify-settings-section">
9
10	<div class="imagify-columns">
11	<div class="imagify-col col-overview">
12	<h2 class="imagify-h2-like">
13	<span class="dashicons dashicons-chart-line"></span>
14	<?php esc_html_e( 'Overview', 'imagify' ); ?>
15	</h2>
16
17	<div class="imagify-columns">
18	<div class="imagify-col col-statistics">
19	<h3 class="screen-reader-text"><?php esc_html_e( 'Statistics', 'imagify' ); ?></h3>
20
21	<div class="imagify-number-you-optimized">
22	<p>
23	<span id="imagify-total-optimized-attachments" class="number"><?php echo esc_html( $data['already_optimized_attachments'] ); ?></span>
24	<span class="text">
25	<?php
26	printf(
27	/* translators: you can use %s to include a line break. */
28	esc_html__( 'that\'s the number of original images%s you optimized with Imagify', 'imagify' ),
29	'<br>'
30	);
31	?>
32	</span>
33	</p>
34	</div>
35
36	<div class="imagify-bars">
37	<p><?php esc_html_e( 'Original size', 'imagify' ); ?></p>
38	<div class="imagify-bar-negative base-transparent right-outside-number">
39	<div id="imagify-original-bar" class="imagify-progress" style="width: 100%"><span class="imagify-barnb"><?php echo esc_html( $data['original_human'] ); ?></span></div>
40	</div>
41
42	<p><?php esc_html_e( 'Optimized size', 'imagify' ); ?></p>
43	<div class="imagify-bar-primary base-transparent right-outside-number">
44	<div id="imagify-optimized-bar" class="imagify-progress" style="width: <?php echo esc_attr( max( 100 - $data['optimized_percent'], 0 ) ); ?>%"><span class="imagify-barnb"><?php echo esc_html( $data['optimized_human'] ); ?></span></div>
45	</div>
46
47	</div>
48
49	<div class="imagify-number-you-optimized">
50	<p>
51	<span id="imagify-total-optimized-attachments-pct" class="number"><?php echo esc_html( number_format_i18n( $data['optimized_percent'] ) ); ?>%</span>
52	<span class="text">
53	<?php
54	printf(
55	/* translators: %s is a line break. */
56	esc_html__( 'that\'s the size you saved %sby using Imagify', 'imagify' ),
57	'<br>'
58	);
59	?>
60	</span>
61	</p>
62	</div>
63	</div><!-- .imagify-col.col-statistics -->
64
65	<div class="imagify-col col-chart">
66	<div class="imagify-chart-container imagify-overview-chart-container">
67	<canvas id="imagify-overview-chart" width="180" height="180" data-unoptimized="<?php echo esc_attr( $data['unoptimized_attachments'] ); ?>" data-optimized="<?php echo esc_attr( $data['optimized_attachments'] ); ?>" data-errors="<?php echo esc_attr( $data['errors_attachments'] ); ?>"></canvas>
68	<div id="imagify-overview-chart-percent" class="imagify-chart-percent"><?php echo esc_html( min( $data['optimized_attachments_percent'], 100 ) ); ?><span>%</span></div>
69	</div>
70	<div id="imagify-overview-chart-legend"></div>
71
72	<p class="imagify-global-optim-phrase imagify-clear">
73	<?php
74	printf(
75	/* translators: %s is a percentage. */
76	esc_html__( 'You optimized %s of your website\'s images', 'imagify' ),
77	'<span class="imagify-total-percent">' . esc_html( min( $data['optimized_attachments_percent'], 100 ) ) . '%</span>'
78	);
79	?>
80	</p>
81	</div><!-- .imagify-col -->
82	</div>
83	</div><!-- .imagify-col.col-overview -->
84
85	<div class="imagify-col imagify-account-info-col">
86
87	<?php
88	if (
89	( ! defined( 'IMAGIFY_HIDDEN_ACCOUNT' ) \|\| ! IMAGIFY_HIDDEN_ACCOUNT )
90	&&
91	Imagify_Requirements::is_api_key_valid()
92	) {
93	?>
94	<div class="imagify-options-title">
95	<div class="imagify-th-titles imagify-flex imagify-vcenter">
96	<span class="dashicons dashicons-admin-users"></span>
97	<p class="imagify-meteo-title">
98	<?php esc_html_e( 'Your Account', 'imagify' ); ?>
99	</p>
100	</div>
101	<a href="<?php echo esc_url( imagify_get_external_url( 'subscription' ) ); ?>" target="_blank"><?php esc_html_e( 'View your profile', 'imagify' ); ?></a>
102	</div>
103	<?php $this->print_template( 'part-upsell' ); ?>
104	<?php } ?>
105
106	</div><!-- .imagify-account-info-col -->
107
108	</div><!-- .imagify-columns -->
109
110	<?php
111	$this->print_template( 'part-bulk-optimization-success' );
112
113	$this->print_template( 'part-bulk-optimization-table', $data );
114
115	if ( ! empty( $data['no-custom-folders'] ) ) {
116	$this->print_template( 'part-bulk-optimization-newbie' );
117	}
118	?>
119
120	<div class="imagify-bulk-submit imagify-flex imagify-vcenter">
121	<div class="imagify-pr2">
122	<p>
123	<?php wp_nonce_field( 'imagify-bulk-optimize', 'imagifybulkuploadnonce' ); ?>
124	<?php
125	$disabled = '';
126	$class = '';
127	$stop_hidden = 'hidden';
128
129	if (
130	false !== get_transient( 'imagify_wp_optimize_running' )
131	\|\|
132	false !== get_transient( 'imagify_custom-folders_optimize_running' )
133	) {
134	$disabled = 'disabled="disabled"';
135	$class = 'rotate';
136	$stop_hidden = '';
137	}
138
139	?>
140	<button id="imagify-bulk-action" type="button" class="button button-primary" <?php echo $disabled; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>>
141	<span class="dashicons dashicons-admin-generic <?php echo esc_attr( $class ); ?>"></span>
142	<span class="button-text"><?php esc_html_e( 'Imagif’em all', 'imagify' ); ?></span>
143	</button>
144	<button id="imagify-bulk-stop" type="button" class="button button-primary <?php echo esc_attr( $stop_hidden ); ?>" aria-hidden="<?php echo esc_attr( $stop_hidden ? 'true' : 'false' ); ?>">
145	<span class="dashicons dashicons-no-alt"></span>
146	<span class="button-text"><?php esc_html_e( 'Stop the optimization', 'imagify' ); ?></span>
147	</button>
148	</p>
149	</div>
150	<?php if ( ! is_wp_error( get_imagify_max_image_size() ) ) { ?>
151	<p>
152	<?php
153	printf(
154	/* translators: %s is a file size. */
155	esc_html__( 'All images greater than %s (after resizing, if any) will be optimized when using a paid plan.', 'imagify' ),
156	esc_html( imagify_size_format( get_imagify_max_image_size() ) )
157	);
158	?>
159	</p>
160	<?php } ?>
161	</div><!-- .imagify-bulk-submit -->
162	</div><!-- .imagify-settings-section -->
163
164	<?php
165	if ( Imagify_Requirements::is_api_key_valid() ) {
166	$display_infos = get_transient( 'imagify_bulk_optimization_infos' );
167
168	?>
169	<script type="text/html" id="tmpl-imagify-overquota-alert">
170	<?php $this->print_template( 'part-bulk-optimization-overquota-alert' ); ?>
171	</script>
172	<?php
173
174	if ( ! $display_infos ) {
175	?>
176	<script type="text/html" id="tmpl-imagify-bulk-infos">
177	<?php
178	$this->print_template(
179	'part-bulk-optimization-infos',
180	[
181	'quota' => $data['unconsumed_quota'],
182	'quota_class' => $data['quota_class'],
183	'library' => ! empty( $data['groups']['library'] ),
184	]
185	);
186	?>
187	</script>
188	<?php
189	}
190	}
191	?>
192	</div>
193