PluginProbe
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF / 1.7
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF v1.7
2.3.4 2.3.3 2.3.2 2.3.1 2.3.0 2.2.9 2.2.8 trunk 1.10 1.3.3 1.3.4 1.3.5 1.3.5.1 1.3.5.2 1.3.6 1.3.6.1 1.4 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.5 All 103 releases
imagify / views / modal-payment.php

modal-payment.php in Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF 1.7, at views/modal-payment.php

434 lines 19.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 defined( 'ABSPATH' ) || die( 'Cheatin\' uh?' );
3
4 ?>
5 <div id="imagify-pricing-modal" class="imagify-modal imagify-payment-modal hide-if-no-js" aria-hidden="false" role="dialog">
6 <div class="imagify-modal-content">
7 <div class="imagify-modal-main">
8 <div class="imagify-modal-views imagify-pre-checkout-view" id="imagify-pre-checkout-view" aria-hidden="false">
9
10 <?php
11 $attachments_number = imagify_count_attachments() + Imagify_Files_Stats::count_all_files();
12 $total_size = Imagify_Data::get_instance()->get( 'total_size_images_library' );
13 $per_month = Imagify_Data::get_instance()->get( 'average_size_images_per_month' );
14 ?>
15
16 <div class="imagify-modal-section section-gray imagify-estimation-block<?php echo false === $total_size ? ' imagify-analyzing' : ''; ?>">
17 <p class="imagify-modal-title">
18 <span class="imagify-numbers-calc"><?php esc_html_e( 'We analysed your images', 'imagify' ); ?></span>
19 <span class="imagify-numbers-notcalc"><?php esc_html_e( 'We are analysing your images', 'imagify' ); ?></span>
20 </p>
21
22 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>loader-balls.svg" width="77" height="48" alt="<?php esc_attr_e( 'Analyzing', 'imagify' ); ?>" class="imagify-loader">
23
24 <div class="imagify-modal-cols">
25 <div class="imagify-col">
26 <p>
27 <span class="imagify-border-styled">
28 <?php
29 printf(
30 /* translators: %s is a formatted number (don't use %d). */
31 _n( 'You have %s original image', 'You have %s original images', $attachments_number, 'imagify' ),
32 '</span><span class="imagify-big-number">' . number_format_i18n( $attachments_number ) . '</span><span class="imagify-border-styled">'
33 );
34 ?>
35 </span>
36 </p>
37 </div>
38 <div class="imagify-col">
39 <p class="imagify-iconed">
40 <i class="dashicons dashicons-images-alt2" aria-hidden="true"></i>
41 <?php
42 printf(
43 /* translators: %s is a formatted file size. */
44 esc_html__( 'You currently have %s of images in your library and folders.', 'imagify' ),
45 '<strong class="imagify-dark total-library-size">' . ( is_float( $total_size ) ? imagify_size_format( $total_size ) : '' ) . '</strong>'
46 );
47 ?>
48 </p>
49 <p class="imagify-iconed">
50 <i class="dashicons dashicons-cloud" aria-hidden="true"></i>
51 <?php
52 printf(
53 /* translators: %s is a formatted file size. */
54 esc_html__( 'You upload around %s of images per month.', 'imagify' ),
55 '<strong class="imagify-dark average-month-size">' . ( is_float( $per_month ) ? imagify_size_format( $per_month ) : '' ) . '</strong>'
56 );
57 ?>
58 </p>
59 </div>
60 </div>
61 </div><!-- .imagify-modal-section -->
62
63 <?php $this->print_template( 'part-discount-banner' ); ?>
64
65 <div class="imagify-modal-section imagify-pre-checkout-offers">
66 <p class="imagify-modal-title">
67 <span class="imagify-not-enough-title"><?php esc_html_e( 'We recommend you this plan', 'imagify' ); ?></span>
68 <span class="imagify-enough-title"><?php esc_html_e( 'The free plan is enough to optimize your images', 'imagify' ); ?></span>
69
70 </p>
71
72 <div class="imagify-offer-line imagify-offer-monthly imagify-offer-selected imagify-month-selected" data-offer='{"lite":{"id":3,"name":"Lite","data":1073741824,"dataf":"1 GB","imgs":5000,"prices":{"monthly":4.99,"yearly":4.16,"add":4}}}'>
73 <div class="imagify-offer-header">
74 <p class="imagify-offer-title imagify-switch-my">
75 <span aria-hidden="false" class="imagify-monthly"><?php esc_html_e( 'Subscribe a monthly plan', 'imagify' ); ?></span>
76 <span aria-hidden="true" class="imagify-yearly"><?php esc_html_e( 'Subscribe a yearly plan', 'imagify' ); ?></span>
77 </p>
78 <div class="imagify-inline-options imagify-radio-line">
79 <input id="imagify-subscription-monthly" type="radio" value="monthly" name="plan-subscription" checked="checked">
80 <label for="imagify-subscription-monthly"><?php esc_html_e( 'Monthly' , 'imagify' ); ?></label>
81
82 <input id="imagify-subscription-yearly" type="radio" value="yearly" name="plan-subscription">
83 <label for="imagify-subscription-yearly"><?php esc_html_e( 'Yearly' , 'imagify' ); ?><span class="imagify-2-free"><?php esc_html_e( '2 months free', 'imagify' ); ?></span></label>
84 </div><!-- .imagify-radio-line -->
85 </div><!-- .imagify-offer-header -->
86
87 <div class="imagify-offer-content imagify-flex-table">
88
89 <div class="imagify-col-checkbox">
90 <input type="checkbox" name="imagify-offer" id="imagify-offer-1gb" value="1Gb" checked="checked" class="imagify-checkbox medium">
91 <label for="imagify-offer-1gb">
92 <span class="imagify-the-offer">
93 <span class="imagify-offer-size">1 GB</span>
94 <span class="imagify-offer-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
95 </span>
96 <span class="imagify-approx">
97 <?php
98 printf(
99 /* translators: %s is a formatted number (don't use %d). */
100 esc_html__( 'approx: %s images', 'imagify' ),
101 '<span class="imagify-approx-nb">' . number_format_i18n( 5000 ) . '</span>'
102 );
103 ?>
104 </span>
105 </label>
106 </div>
107 <div class="imagify-col-price imagify-flex-table">
108 <span class="imagify-price-block">
109 <span class="imagify-dollars">$</span>
110 <span class="imagify-number-block">
111 <span class="imagify-switch-my">
112 <span class="imagify-monthly" aria-hidden="false">
113 <span class="imagify-price-big">3</span>
114 <span class="imagify-price-mini">.99</span>
115 </span>
116 <span class="imagify-yearly" aria-hidden="true">
117 <span class="imagify-price-big">3</span>
118 <span class="imagify-price-mini">.16</span>
119 </span>
120 </span>
121 <span class="imagify-price-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
122 </span>
123 </span>
124
125 <p class="imagify-price-complement">
126 <?php
127 printf(
128 /* translators: %s is a formatted price. */
129 __( '%s per<br>additionnal Gb', 'imagify' ),
130 '<span class="imagify-price-add-data"></span>'
131 );
132 ?>
133 </p>
134
135 </div>
136 <div class="imagify-col-other-actions">
137 <a href="#imagify-plans-selection-view" class="imagify-choose-another-plan" data-imagify-choose="plan"><?php esc_html_e( 'Choose another plan', 'imagify' ); ?></a>
138 </div>
139
140 </div><!-- .imagify-offer-content -->
141
142 </div><!-- .imagify-offer-line -->
143
144 <div class="imagify-offer-line imagify-offer-onetime" data-offer='{"recommended":{"id":999,"name":"Customized","data":3000001337,"dataf":"3 GB","imgs":54634,"price":28.98}}'>
145 <div class="imagify-offer-header">
146 <p class="imagify-offer-title">
147 <?php esc_html_e( 'Optimize the images you already have, buy a One Time plan', 'imagify' ); ?>
148 </p>
149 </div><!-- .imagify-offer-header -->
150
151 <div class="imagify-offer-content imagify-flex-table">
152
153 <div class="imagify-col-checkbox">
154 <input type="checkbox" name="imagify-offer" id="imagify-offer-custom" value="1Gb" checked="checked" class="imagify-checkbox medium">
155 <label for="imagify-offer-custom">
156 <span class="imagify-the-offer">
157 <span class="imagify-offer-size">3 GB</span>
158 </span>
159 <span class="imagify-approx">
160 <?php
161 printf(
162 /* translators: %s is a formatted number (don't use %d). */
163 esc_html__( 'approx: %s images', 'imagify' ),
164 '<span class="imagify-approx-nb">' . number_format_i18n( 54000 ) . '</span>'
165 );
166 ?>
167 </span>
168 </label>
169 </div>
170 <div class="imagify-col-price imagify-flex-table">
171 <span class="imagify-price-block">
172 <span class="imagify-dollars">$</span>
173 <span class="imagify-number-block">
174 <span class="imagify-price-big"></span>
175 <span class="imagify-price-mini"></span>
176 </span>
177 </span>
178 </div>
179 <div class="imagify-col-other-actions">
180 <a href="#imagify-plans-selection-view" class="imagify-choose-another-plan" data-imagify-choose="onetime"><?php esc_html_e( 'Choose another plan', 'imagify' ); ?></a>
181 </div>
182
183 </div><!-- .imagify-offer-content -->
184
185 </div><!-- .imagify-offer-line -->
186
187
188 <div class="imagify-submit-line">
189 <div class="imagify-coupon-section">
190 <p class="imagify-coupon-text">
191
192 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>loader-balls.svg" width="60" height="36" alt="<?php esc_attr_e( 'Checking Coupon', 'imagify' ); ?>" class="imagify-coupon-loader">
193
194 <label for="imagify-coupon-code"><?php _e( 'If you have a <strong>coupon code</strong><br> use it there:', 'imagify' ); ?></label>
195 </p>
196 <p class="imagify-coupon-input">
197 <input type="text" class="imagify-coupon-code" name="imagify-coupon-code" id="imagify-coupon-code" value="" placeholder="<?php _e( 'Coupon Code', 'imagify' ); ?>" autocomplete="off">
198 <button type="button" class="button button-secondary imagify-button-secondary" id="imagify-coupon-validate"><?php _e( 'OK' ); ?></button>
199 </p>
200 </div>
201 <div class="imagify-submit-section">
202 <button type="button" class="button button-secondary imagify-button-secondary" id="imagify-modal-checkout-btn">
203 <i class="dashicons dashicons-cart" aria-hidden="true"></i>
204 <?php _e( 'Checkout', 'imagify' ); ?>
205 </button>
206 </div>
207 </div>
208
209 <p class="imagify-footer-lines"><?php esc_html_e( 'Monthly plans come with credits which is renewed every months. The billing happens automatically each month or year depending the billing period you choose.', 'imagify' ); ?></p>
210 </div>
211 </div><!-- .imagify-pre-checkout-view -->
212
213 <?php
214 /**
215 * SECOND MODAL VIEW.
216 */
217 ?>
218
219 <div class="imagify-modal-views imagify-plans-selection-view" id="imagify-plans-selection-view" aria-hidden="true">
220 <p class="imagify-modal-title"><?php _e( 'Choose a plan', 'imagify' ); ?></p>
221 <ul class="imagify-tabs" role="tablist">
222 <li class="imagify-tab imagify-current">
223 <a href="#imagify-pricing-tab-monthly" role="tab" aria-controls="imagify-pricing-tab-monthly" aria-selected="true">
224 <?php esc_html_e( 'Monthly Plans', 'imagify' ); ?>
225 </a>
226 </li>
227 <li class="imagify-tab">
228 <a href="#imagify-pricing-tab-onetime" role="tab" aria-controls="imagify-pricing-tab-onetime" aria-selected="false">
229 <?php esc_html_e( 'One Time Plans', 'imagify' ); ?>
230 </a>
231 </li>
232 </ul><!-- .imagify-tabs -->
233
234 <div class="imagify-tabs-contents">
235
236 <div class="imagify-tab-content imagify-current" id="imagify-pricing-tab-monthly" role="tabpanel">
237
238 <div class="imagify-modal-section section-gray">
239 <p><?php esc_html_e( 'Monthly plans come with credits which is renewed every months. The billing happens automatically each month or year depending the billing period you choose.', 'imagify' ); ?></p>
240 </div>
241
242 <?php $this->print_template( 'part-settings-discount-banner' ); ?>
243
244 <div class="imagify-inline-options imagify-small-options imagify-radio-line">
245 <input id="imagify-pricing-montly" type="radio" value="monthly" name="plan-pricing" checked="checked">
246 <label for="imagify-pricing-montly"><?php esc_html_e( 'Monthly' , 'imagify' ); ?></label>
247
248 <input id="imagify-pricing-yearly" type="radio" value="yearly" name="plan-pricing">
249 <label for="imagify-pricing-yearly"><?php esc_html_e( 'Yearly' , 'imagify' ); ?><span class="imagify-2-free imagify-b-right"><?php esc_html_e( '2 months free', 'imagify' ); ?></span></label>
250 </div><!-- .imagify-radio-line -->
251
252
253 <div class="imagify-pricing-table imagify-month-selected">
254
255 <script type="text/template" id="imagify-offer-monthly-template"><div class="imagify-offer-line imagify-offer-monthlies imagify-flex-table">
256 <div class="imagify-col-details">
257 <p class="imagify-label">
258 <span class="imagify-the-offer">
259 <span class="imagify-offer-size"></span>
260 <span class="imagify-offer-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
261 </span>
262 <span class="imagify-approx">
263 <?php
264 printf(
265 /* translators: %s is a formatted number (don't use %d). */
266 __( 'approx: %s images', 'imagify' ),
267 '<span class="imagify-approx-nb"></span>'
268 );
269 ?>
270 </span>
271 </p>
272 </div>
273 <div class="imagify-col-price imagify-flex-table">
274 <span class="imagify-price-block">
275 <span class="imagify-dollars">$</span>
276 <span class="imagify-number-block">
277 <span class="imagify-switch-my"></span>
278 <span class="imagify-price-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
279 </span>
280 </span>
281
282 <span class="imagify-recommend" aria-hidden="true"><?php esc_html_e( 'we recommend for you', 'imagify' ); ?></span>
283
284 <p class="imagify-price-complement">
285 <?php
286 printf(
287 /* translators: %s is a formatted price. */
288 __( '%s per<br>additionnal Gb', 'imagify' ),
289 '<span class="imagify-price-add-data"></span>'
290 );
291 ?>
292 </p>
293
294 </div><!-- .imagify-col-price -->
295
296 <div class="imagify-col-other-actions">
297 <button type="button" class="button imagify-button-secondary mini imagify-payment-btn-select-plan"><?php esc_html_e( 'Choose plan', 'imagify' ); ?></button>
298 </div>
299 </div><!-- .imagify-offer-line --></script>
300 </div><!-- .imagify-pricing-table -->
301
302 <div class="imagify-cols">
303 <div class="imagify-col imagify-txt-start">
304 <p class="imagify-special-needs">
305 <strong><?php esc_html_e( 'Need more?', 'imagify' ); ?></strong>
306 <span><?php esc_html_e( 'for special needs', 'imagify' ); ?></span>
307 </p>
308 </div>
309 <div class="imagify-col imagify-txt-end">
310 <p><a class="button imagify-button-ghost imagify-button-medium imagify-mt1 imagify-mb1 imagify-mr1" href="<?php echo esc_html( imagify_get_external_url( 'contact' ) ); ?>" target="_blank"><i class="dashicons dashicons-email" aria-hidden="true"></i>&nbsp;<?php esc_html_e( 'Contact Us', 'imagify' ); ?></a></p>
311 </div>
312 </div>
313
314 </div><!-- .imagify-tab-content -->
315 <div class="imagify-tab-content" id="imagify-pricing-tab-onetime" role="tabpanel">
316 <div class="imagify-modal-section section-gray">
317 <p><?php esc_html_e( 'One Time plans are useful if you have a lots of existing images which need to be optimized. You can use it for bulk optimizing all your past images. You will pay only once.', 'imagify' ); ?></p>
318 </div>
319
320 <div class="imagify-pricing-table imagify-month-selected">
321 <script type="text/template" id="imagify-offer-onetime-template"><div class="imagify-offer-line imagify-flex-table imagify-offer-onetimes">
322 <div class="imagify-col-details">
323 <p class="imagify-label">
324 <span class="imagify-the-offer">
325 <span class="imagify-offer-size"></span>
326 </span>
327 <span class="imagify-approx">
328 <?php
329 printf(
330 /* translators: %s is a formatted number (don't use %d). */
331 __( 'approx: %s images', 'imagify' ),
332 '<span class="imagify-approx-nb"></span>'
333 );
334 ?>
335 </span>
336 </p>
337 </div>
338 <div class="imagify-col-price">
339 <span class="imagify-price-block">
340 <span class="imagify-dollars">$</span>
341 <span class="imagify-number-block"></span>
342 </span>
343 <span class="imagify-recommend"><?php esc_html_e( 'we recommend for you', 'imagify' ); ?></span>
344 </div><!-- .imagify-col-price -->
345
346 <div class="imagify-col-other-actions">
347 <button type="button" class="button imagify-button-secondary mini imagify-payment-btn-select-plan"><?php esc_html_e( 'Choose plan', 'imagify' ); ?></button>
348 </div>
349 </div><!-- .imagify-offer-line --></script>
350 </div><!-- .imagify-pricing-table -->
351
352 </div><!-- .imagify-tab-content -->
353
354 </div><!-- .imagify-tabs-contents -->
355 </div><!-- .imagify-plans-selection-view -->
356
357
358 <?php
359 /**
360 * THIRD MODAL VIEW.
361 */
362 ?>
363
364 <div class="imagify-modal-views imagify-payment-process-view" id="imagify-payment-process-view" aria-hidden="true">
365
366 <iframe data-imagify-api="<?php echo esc_attr( get_imagify_option( 'api_key' ) ); ?>" id="imagify-payment-iframe" data-src="<?php echo esc_url( imagify_get_external_url( 'payment' ) ); ?>" name="imagify-payment-iframe"></iframe>
367
368 </div><!-- .imagify-modal-views -->
369
370 <?php
371 /**
372 * SUCCESS VIEW.
373 */
374 ?>
375
376 <div class="imagify-modal-views imagify-success-view" id="imagify-success-view" aria-hidden="true">
377 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>big-blue-check.png" width="113" height="109" alt="">
378 <p><?php esc_html_e( 'Thank you for being awesome!', 'imagify' ); ?></p>
379 </div><!-- .imagify-modal-views -->
380
381 <button class="close-btn" type="button">
382 <i aria-hidden="true" class="dashicons dashicons-no-alt"></i>
383 <span class="screen-reader-text"><?php esc_html_e( 'Close', 'imagify' ); ?></span>
384 </button>
385
386 </div><!-- .imagify-modal-main -->
387
388 <div class="imagify-modal-sidebar">
389 <div class="imagify-modal-sidebar-content imagify-txt-start">
390 <p class="imagify-modal-sidebar-title"><?php esc_html_e( 'What do our user think about Imagify', 'imagify' ); ?></p>
391
392 <div class="imagify-modal-testimony">
393 <div class="imagify-modal-testimony-person">
394 <span class="imagify-modal-avatar">
395 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>pic-srhdesign.jpg" alt="">
396 </span>
397 <p class="imagify-modal-identity">
398 <a href="https://twitter.com/SRHDesign" target="_blank">@SRHDesign</a>
399 <a href="https://twitter.com/SRHDesign/status/686486119249260544" target="_blank"><time datetime="2016-01-11">11 jan. 2016 @ 17:40</time></a>
400 </p>
401 </div>
402 <div class="imagify-modal-testimony-content">
403 <p>@imagify is an awesome tool that is powerful &amp; easy to use. It's fast, rivals and surpasses other established plugins/software. Awesome!</p>
404 </div>
405 </div>
406
407 <div class="imagify-modal-testimony">
408 <div class="imagify-modal-testimony-person">
409 <span class="imagify-modal-avatar">
410 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>pic-ericwaltr.jpg" alt="">
411 </span>
412 <p class="imagify-modal-identity">
413 <a href="https://twitter.com/EricWaltr" target="_blank">@EricWaltr</a>
414 <a href="https://twitter.com/EricWaltR/status/679053496382038016" target="_blank"><time datetime="2016-01-11">21 dec. 2015 @ 22:39</time></a>
415 </p>
416 </div>
417 <div class="imagify-modal-testimony-content">
418 <p>Clearly @imagify is the most awesome tool to compress images on your website! A must try</p>
419 </div>
420 </div>
421
422 <div class="imagify-modal-sidebar-trust imagify-txt-center">
423 <p class="imagify-secondary">
424 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>icon-lock.png" srcset="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>icon-lock.svg 2x" width="16" height="19" alt="">&nbsp;<?php esc_html_e( 'Secure Credit Card Payment', 'imagify' ); ?></p>
425 <p><?php esc_html_e( 'This is secure 128-bits SSL encrypted payment', 'imagify' ); ?></p>
426 </div>
427 </div>
428 </div><!-- .imagify-modal-sidebar -->
429
430 <div class="imagify-modal-loader"></div>
431 </div><!-- .imagify-modal-content-->
432 </div><!-- .imagify-payment-modal -->
433 <?php
434