cdn.js
3.35 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
/* global WP_Smush */
/* global ajaxurl */
/**
* CDN functionality.
*
* @since 3.0
*/
( function() {
'use strict';
WP_Smush.CDN = {
cdnEnableButton: document.getElementById( 'smush-enable-cdn' ),
cdnDisableButton: document.getElementById( 'smush-cancel-cdn' ),
cdnStatsBox: document.querySelector( '.smush-cdn-stats' ),
init() {
/**
* Handle "Get Started" button click on disabled CDN page.
*/
if ( this.cdnEnableButton ) {
this.cdnEnableButton.addEventListener( 'click', ( e ) => {
e.preventDefault();
e.currentTarget.classList.add( 'sui-button-onload' );
this.toggle_cdn( true );
} );
}
/**
* Handle "Deactivate' button click on CDN page.
*/
if ( this.cdnDisableButton ) {
this.cdnDisableButton.addEventListener( 'click', ( e ) => {
e.preventDefault();
e.currentTarget.classList.add( 'sui-button-onload' );
this.toggle_cdn( false );
} );
}
this.updateStatsBox();
},
/**
* Toggle CDN.
*
* @since 3.0
*
* @param {boolean} enable
*/
toggle_cdn( enable ) {
const nonceField = document.getElementsByName(
'wp_smush_options_nonce'
);
const xhr = new XMLHttpRequest();
xhr.open( 'POST', ajaxurl + '?action=smush_toggle_cdn', true );
xhr.setRequestHeader(
'Content-type',
'application/x-www-form-urlencoded'
);
xhr.onload = () => {
if ( 200 === xhr.status ) {
const res = JSON.parse( xhr.response );
if ( 'undefined' !== typeof res.success && res.success ) {
window.location.search = 'page=smush-cdn';
} else if ( 'undefined' !== typeof res.data.message ) {
WP_Smush.helpers.showErrorNotice( res.data.message );
}
} else {
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
}
};
xhr.send(
'param=' + enable + '&_ajax_nonce=' + nonceField[ 0 ].value
);
},
/**
* Update the CDN stats box in summary meta box. Only fetch new data when on CDN page.
*
* @since 3.0
*/
updateStatsBox() {
if (
'undefined' === typeof this.cdnStatsBox ||
! this.cdnStatsBox
) {
return;
}
// Only fetch the new stats, when user is on CDN page.
if ( ! window.location.search.includes( 'page=smush-cdn' ) ) {
return;
}
this.toggleElements();
const xhr = new XMLHttpRequest();
xhr.open( 'POST', ajaxurl + '?action=get_cdn_stats', true );
xhr.onload = () => {
if ( 200 === xhr.status ) {
const res = JSON.parse( xhr.response );
if ( 'undefined' !== typeof res.success && res.success ) {
this.toggleElements();
} else if ( 'undefined' !== typeof res.data.message ) {
WP_Smush.helpers.showErrorNotice( res.data.message );
}
} else {
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
}
};
xhr.send();
},
/**
* Show/hide elements during status update in the updateStatsBox()
*
* @since 3.1 Moved out from updateStatsBox()
*/
toggleElements() {
const spinner = this.cdnStatsBox.querySelector(
'.sui-icon-loader'
);
const elements = this.cdnStatsBox.querySelectorAll(
'.wp-smush-stats > :not(.sui-icon-loader)'
);
for ( let i = 0; i < elements.length; i++ ) {
elements[ i ].classList.toggle( 'sui-hidden' );
}
spinner.classList.toggle( 'sui-hidden' );
},
};
WP_Smush.CDN.init();
} )();