PluginProbe ʕ •ᴥ•ʔ
ShareThis Dashboard for Google Analytics / 3.3.2
ShareThis Dashboard for Google Analytics v3.3.2
3.3.2 trunk 1.0.7 2.0.0 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 2.1 2.1.2 2.1.3 2.1.4 2.1.5 2.2.5 2.3.5 2.3.6 2.3.7 2.3.8 2.4.0 2.4.1 2.5.0 2.5.1 2.5.2 2.5.3 2.5.4 2.5.5 3.0.0 3.1.0 3.1.1 3.1.2 3.1.3 3.1.4 3.1.5 3.1.6 3.1.7 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.3.0 3.3.1
googleanalytics / js / googleanalytics_page.js
googleanalytics / js Last commit date
googleanalytics.js 4 years ago googleanalytics_createprop.js 3 years ago googleanalytics_dashboard.js 3 years ago googleanalytics_page.js 2 months ago
googleanalytics_page.js
1183 lines
1 /**
2 * Google Analytics Page script.
3 *
4 * @package GoogleAnalytics
5 */
6
7 const GA_ACCESS_CODE_MODAL_ID = "ga_access_code_modal";
8 const GA_DEBUG_MODAL_ID = "ga_debug_modal";
9 const GA_DEBUG_MODAL_CONTENT_ID = "ga_debug_modal_content";
10 const GA_DEBUG_EMAIL = "ga_debug_email";
11 const GA_DEBUG_DESCRIPTION = "ga_debug_description";
12 const GA_ACCESS_CODE_TMP_ID = "ga_access_code_tmp";
13 const GA_ACCESS_CODE_ID = "ga_access_code";
14 const GA_FORM_ID = "ga_form";
15 const GA_MODAL_CLOSE_ID = 'ga_close';
16 const GA_MODAL_BTN_CLOSE_ID = 'ga_btn_close';
17 const GA_GOOGLE_AUTH_BTN_ID = 'ga_authorize_with_google_button';
18 const GA_SAVE_ACCESS_CODE_BTN_ID = 'ga_save_access_code';
19 const GA_AUTHENTICATION_CODE_ERROR = 'That looks like your Google Analytics Tracking ID. Please enter the authentication token in this space. See here for <a href="https://cl.ly/1y1N1A3h0s1t" target="_blank">a walkthrough</a> of how to do it.';
20
21 ( function( $ ) {
22 ga_popup = {
23 url: '',
24 authorize: function( e, url ) {
25 e.preventDefault();
26 ga_popup.url = url;
27 $( '#' + GA_ACCESS_CODE_MODAL_ID ).appendTo( "body" ).show();
28 ga_popup.open();
29 },
30 open: function() {
31 const p_width = Math.round( screen.width / 2 );
32 const p_height = Math.round( screen.height / 2 );
33 const p_left = Math.round( p_width / 2 );
34 const p_top = 300;
35 window.open(
36 ga_popup.url,
37 'ga_auth_popup',
38 'width=' + p_width + ',height='
39 + p_height + ',top=' + p_top + ',left=' + p_left,
40 );
41 },
42 saveAccessCode: function( e ) {
43 e.preventDefault();
44 e.target.disabled = 'disabled';
45 ga_loader.show();
46 const ac_tmp = $( '#' + GA_ACCESS_CODE_TMP_ID ).val();
47 if ( ga_popup.validateCode( e, ac_tmp ) ) {
48 $( '#' + GA_ACCESS_CODE_ID ).val( ac_tmp );
49 $( '#' + GA_FORM_ID ).submit();
50 }
51 },
52 validateCode: function( e, code ) {
53 if ( ! code ) {
54 ga_loader.hide();
55 $( '#' + GA_SAVE_ACCESS_CODE_BTN_ID ).removeAttr( 'disabled' );
56 return false;
57 } else if ( code.substring( 0, 2 ) == 'UA' ) {
58 $( '#ga_code_error' ).show().html( GA_AUTHENTICATION_CODE_ERROR );
59 ga_loader.hide();
60 $( '#' + GA_SAVE_ACCESS_CODE_BTN_ID ).removeAttr( 'disabled' );
61 return false;
62 }
63 return true;
64 },
65 };
66
67 ga_modal = {
68 hide: function() {
69 $( '#' + GA_ACCESS_CODE_MODAL_ID ).hide();
70 $( '#' + GA_DEBUG_MODAL_ID ).hide();
71 ga_loader.hide();
72 $( '#' + GA_SAVE_ACCESS_CODE_BTN_ID ).removeAttr( 'disabled' );
73 },
74 };
75
76 ga_events = {
77 /**
78 * Tab logic.
79 */
80 tabLogic: function() {
81 const tabs = document.querySelectorAll( '.setting-tabs__tab');
82 const self = this;
83
84 // Setup button in ua.
85 const ga4SetupButton = document.querySelector( '.open-ga4' );
86
87 if ( ga4SetupButton ) {
88 ga4SetupButton.addEventListener( 'click', () => {
89 const ga4Tab = document.querySelector( '.setting-tabs__tab.ga4' );
90 const ga4Settings = document.querySelector( '.ga4-settings-wrap' );
91 const currentSelected = document.querySelector( '.setting-tabs__tab.engage' );
92 const currentSelectedContent = document.querySelector( '.setting-tab-content.engage' );
93
94 if ( currentSelected && currentSelectedContent ) {
95 currentSelected.classList.remove( 'engage' );
96 currentSelectedContent.classList.remove( 'engage' );
97 }
98
99 if ( ga4Settings && ga4Tab ) {
100 ga4Settings.classList.add( 'engage' );
101 ga4Tab.classList.add( 'engage' );
102 }
103 } );
104 }
105
106 if ( tabs ) {
107 tabs.forEach( settingTab => {
108 settingTab.addEventListener( 'click', () => {
109 const currentSelected = document.querySelector( '.setting-tabs__tab.engage' );
110 const currentSelectedContent = document.querySelector( '.setting-tab-content.engage' );
111
112 if ( currentSelected && currentSelectedContent ) {
113 currentSelected.classList.remove( 'engage' );
114 currentSelectedContent.classList.remove( 'engage' );
115 }
116
117 settingTab.classList.add( 'engage' );
118
119 if ( settingTab.classList.contains( 'ga4' ) ) {
120 const ga4Settings = document.querySelector( '.ga4-settings-wrap' );
121
122 if ( ga4Settings ) {
123 ga4Settings.classList.add( 'engage' );
124 }
125 }
126
127 if ( settingTab.classList.contains( 'ua' ) ) {
128 const uaSettings = document.querySelector( '.ua-settings-wrap' );
129
130 if ( uaSettings ) {
131 uaSettings.classList.add( 'engage' );
132 }
133 }
134 } );
135 } );
136 }
137
138 // To step 3.
139 const nextButton = document.getElementById( 'to-step-3' );
140
141 if ( nextButton ) {
142 nextButton.addEventListener( 'click', () => {
143 const propertySelection = document.getElementById( 'ga4-property' );
144 const propError = document.querySelector( '.error.prop-error' );
145
146 if ( propError ) {
147 propError.remove();
148 }
149
150 if ( propertySelection ) {
151 if ( 'Choose Property' === propertySelection.value ) {
152 const propErrorMessage = document.createElement( 'small' );
153 propErrorMessage.className = 'error prop-error';
154 propErrorMessage.textContent = '*You must select a property to continue';
155
156 propertySelection.parentNode.parentNode.insertBefore( propErrorMessage, propertySelection.parentNode.nextSibling );
157 } else {
158 var dataObj = {};
159 dataObj['action'] = "save_ga4_property_selection";
160 dataObj['nonce'] = GA_NONCE;
161 dataObj['property'] = propertySelection.value;
162 dataObj['view_id'] = propertySelection.item(propertySelection.selectedIndex).getAttribute( 'data-view-id' );
163
164 $.ajax(
165 {
166 type: "post",
167 dataType: "json",
168 url: ajaxurl,
169 data: dataObj,
170 success: function ( response ) {
171 const step2 = document.querySelector( '.ga-step-2' );
172 const step3 = document.querySelector( '.ga-step-3' );
173
174 if ( step2 ) {
175 step2.classList.remove( 'engage' );
176 }
177
178 if ( step3 ) {
179 step3.classList.add( 'engage' );
180 }
181 },
182 },
183 );
184 }
185 }
186 } );
187 }
188
189 const enableGdpr = document.getElementById( 'ga4-enable-gdpr' );
190
191 // Final setup.
192 const ga4FinalSetup = document.getElementById( 'complete-ga4-setup' );
193
194 if ( enableGdpr ) {
195 enableGdpr.addEventListener( 'change', (theCheck) => {
196 if (theCheck.target.checked) {
197 if (ga4FinalSetup) {
198 ga4FinalSetup.textContent = 'Complete and go to GDPR configuration';
199 }
200 } else {
201 if (ga4FinalSetup) {
202 ga4FinalSetup.textContent = 'Complete and go to dashboard';
203 }
204 }
205 } );
206 }
207
208 if ( ga4FinalSetup ) {
209 ga4FinalSetup.addEventListener( 'click', ( e ) => {
210 e.stopPropagation();
211 e.preventDefault();
212
213 const finalDataObj = {};
214 const optimize = document.getElementById( 'ga4-google-optimize' );
215 const excludeRoles = document.querySelectorAll( '.ga-exclude-roles input' );
216 const enableDemo = document.getElementById( 'ga4-enable-demo' );
217 const ipAnon = document.getElementById( 'ga4-enable-ip-anon' );
218 const enableGdpr = document.getElementById( 'ga4-enable-gdpr' );
219 let linkUrl = e.target.getAttribute( 'href' );
220 let excludeSelections = '';
221
222 if ( excludeRoles ) {
223 excludeRoles.forEach( ( excludeRole, i ) => {
224 if ( excludeRole.checked ) {
225 excludeSelections += excludeRole.value + ',';
226 }
227 } );
228 }
229
230 finalDataObj['action'] = "save_ga4_final_setup";
231 finalDataObj['optimize'] = optimize ? optimize.value : false;
232 finalDataObj['exclude_roles'] = excludeSelections;
233 finalDataObj['enable_demo'] = enableDemo ? enableDemo.checked : false;
234 finalDataObj['ip_anon'] = ipAnon ? ipAnon.checked : false;
235 finalDataObj['nonce'] = GA_NONCE;
236 finalDataObj['enable_gdpr'] = enableGdpr ? enableGdpr.checked : false;
237
238 $.ajax(
239 {
240 type: "post",
241 dataType: "json",
242 url: ajaxurl,
243 data: finalDataObj,
244 success: function ( response ) {
245
246 if ( enableGdpr.checked ) {
247 self.manualEnableGdpr();
248 }
249
250 if ( enableDemo.checked ) {
251 linkUrl = linkUrl + '&ga_action=demo-ad';
252 }
253
254 window.location.href = linkUrl;
255 },
256 },
257 );
258 } );
259 }
260
261 document.addEventListener( 'submit', () => {
262 const propSelect = document.getElementById( 'ga_account_selector' );
263
264 if ( propSelect ) {
265 const viewIdDataObj = {};
266 const viewID = propSelect.item( propSelect.selectedIndex ).getAttribute( 'data-view-id' );
267
268 viewIdDataObj['action'] = "save_view_id";
269 viewIdDataObj['nonce'] = GA_NONCE;
270 viewIdDataObj['view_id'] = viewID;
271
272 $.ajax(
273 {
274 type: "post",
275 dataType: "json",
276 url: ajaxurl,
277 data: viewIdDataObj
278 },
279 );
280 }
281 } );
282 },
283
284 /**
285 * Send Demographic data.
286 *
287 * @param data
288 */
289 sendDemoData: function( demoData ) {
290 // Send demographic data.
291 $.ajax(
292 {
293 url: 'https://platform-api.sharethis.com/v1.0/property?id=' + ga_property_id + '&secret=' + ga_secret_id,
294 method: 'PUT',
295 async: false,
296 contentType: 'application/json; charset=utf-8',
297 data: JSON.stringify(
298 {
299 "demographics": demoData,
300 },
301 ),
302 },
303 );
304 },
305 /**
306 * Returns gdpr onboarding config values.
307 */
308 setGDPRConfig: function( isGDPR ) {
309
310 /**
311 * Check if ad blocker exists and notify if so.
312 */
313 $( document ).ready(
314 function() {
315 if ( $( "#detectadblock" ).height() > 0 ) {
316 } else {
317 $( '#adblocker-notice' ).show();
318 }
319 },
320 );
321
322 if ( ! isGDPR || undefined === gaGdprConfig ) {
323 return;
324 }
325
326 var config = JSON.parse( gaGdprConfig );
327
328 $( '.gdpr-platform input[name="gdpr-enable"]' ).prop( 'checked', config['enabled'] === 'true' );
329 $( '#sharethis-publisher-name' ).val( config['publisher_name'] );
330 $( '#sharethis-user-type option[value="' + config['display'] + '"]' ).attr( 'selected', true );
331 $( '#sharethis-consent-type option[value="' + config['scope'] + '"]' ).attr( 'selected', true );
332 $( '#sharethis-form-color .color[data-value="' + config['color'] + '"]' ).addClass( 'selected' );
333 $( '#st-language option[value="' + config['language'] + '"]' ).attr( 'selected', true );
334
335 if ( undefined !== config['publisher_purposes'] ) {
336 $( "#publisher-purpose .purpose-item input" ).prop( 'checked', false );
337
338 config['publisher_purposes'].map(
339 ( purpVal ) =>
340 {
341 var legit = 'true' === purpVal['legitimate_interest'] || true === purpVal['legitimate_interest'];
342 var consent = 'false' === purpVal['legitimate_interest'] || false === purpVal['legitimate_interest'];
343
344 $( '#publisher-purpose .purpose-item input[name="purposes[' + purpVal.id + ']"][value="legitimate"]' ).prop( 'checked', legit );
345 $( '#publisher-purpose .purpose-item input[name="purposes[' + purpVal.id + ']"][value="consent"]' ).prop( 'checked', consent );
346 }
347 );
348 }
349
350 if ( undefined !== config['publisher_restrictions'] ) {
351 $( ".vendor-table-cell-wrapper input" ).prop( 'checked', false );
352
353 $.map(
354 config['publisher_restrictions'],
355 function( id, venVal ) {
356 if ( id ) {
357 $( 'input[type="checkbox"][data-id="' + venVal + '"]' ).prop( 'checked', true );
358 }
359 },
360 );
361 }
362 },
363 scrollToAnchor: function( aid ) {
364 var aTag = $( "a[id='" + aid.toLowerCase() + "']" );
365
366 $( '.vendor-table-body' ).animate(
367 {
368 scrollTop: 0,
369 },
370 0,
371 ).animate(
372 {
373 scrollTop: aTag.offset().top - 740,
374 },
375 0,
376 );
377 },
378
379 click: function( selector, callback ) {
380 $( selector ).live( 'click', callback );
381 },
382 codeManuallyCallback: function( features_enabled ) {
383 var checkbox = $( '#ga_enter_code_manually' );
384 if ( features_enabled ) {
385 if ( checkbox.is( ':checked' ) ) {
386 if ( confirm( 'Warning: If you enter your Tracking ID manually, Analytics statistics will not be shown.' ) ) {
387 setTimeout(
388 function() {
389 $( '#ga_authorize_with_google_button' ).attr( 'disabled', 'disabled' ).next().show();
390 $( '#ga_account_selector' ).attr( 'disabled', 'disabled' );
391 $( '#ga_manually_wrapper' ).show();
392 },
393 350,
394 );
395
396 } else {
397 setTimeout(
398 function() {
399 checkbox.removeProp( 'checked' );
400 },
401 350,
402 );
403 }
404 } else {
405 setTimeout(
406 function() {
407 $( '#ga_authorize_with_google_button' ).removeAttr( 'disabled' ).next().hide();
408 $( '#ga_account_selector' ).removeAttr( 'disabled' );
409 $( '#ga_manually_wrapper' ).hide();
410 },
411 350,
412 );
413 }
414 }
415 },
416 initModalEvents: function() {
417 $( 'body' ).on(
418 'click',
419 '#close-review-us',
420 function() {
421 var dataObj = {},
422 self = this;
423 dataObj['action'] = "ga_ajax_hide_review";
424 dataObj[GA_NONCE_FIELD] = GA_NONCE;
425
426 $.ajax(
427 {
428 type: "post",
429 dataType: "json",
430 url: ajaxurl,
431 data: dataObj,
432 success: function( response ) {
433 $( '.ga-review-us' ).fadeOut();
434 },
435 },
436 );
437 },
438 );
439
440 $( '#' + GA_GOOGLE_AUTH_BTN_ID ).on(
441 'click',
442 function() {
443 $( '#' + GA_ACCESS_CODE_TMP_ID ).focus();
444 },
445 );
446
447 $( '#' + GA_MODAL_CLOSE_ID + ', #' + GA_MODAL_BTN_CLOSE_ID + ', #' + GA_DEBUG_MODAL_ID ).on(
448 'click',
449 function() {
450 ga_modal.hide();
451 },
452 );
453
454 $( '#copy-debug' ).on(
455 'click',
456 function() {
457 var copiedText = $( '#ga_debug_info' );
458
459 copiedText.select();
460 document.execCommand( 'copy' );
461 },
462 );
463
464 $( '#' + GA_DEBUG_MODAL_CONTENT_ID ).click(
465 function( event ) {
466 event.stopPropagation();
467 },
468 );
469 },
470
471 getConfig: function() {
472 var config,
473 enabled = $( 'input[name="gdpr-enable"]' ).is( ':checked' ),
474 publisherPurposes = [],
475 display = $( '#sharethis-user-type option:selected' ).val(),
476 name = $( '#sharethis-publisher-name' ).val(),
477 scope = 'publisher',
478 color = $( '#sharethis-form-color .color.selected' ).attr( 'data-value' ),
479 publisherRestrictions = {},
480 language = $( '#st-language' ).val();
481
482 $( '#publisher-purpose input:checked' ).each(
483 function( index, value ) {
484 var theId = $( value ).attr( 'data-id' ),
485 legit = 'consent' !== $( value ).val();
486
487 publisherPurposes.push( { 'id': theId, 'legitimate_interest': legit } );
488 },
489 );
490
491 $( '.vendor-table-cell-wrapper label input:checked' ).each(
492 function( index, value ) {
493 var vendorId = $( value ).attr( 'data-id' );
494 if ( vendorId ) {
495 publisherRestrictions[vendorId] = true;
496 }
497 },
498 );
499
500 config = {
501 enabled: enabled,
502 display: display,
503 publisher_name: name,
504 publisher_purposes: publisherPurposes,
505 publisher_restrictions: publisherRestrictions,
506 language: language,
507 color: color,
508 scope: scope,
509 };
510
511 return config;
512 },
513 manualEnableGdpr: function() {
514 var dataObj = {},
515 self = this,
516 config = ga_events.getConfig();
517
518 if ( $( 'body' ).hasClass( 'google-analytics_page_googleanalytics-settings' ) ) {
519 config = {
520 enabled: true,
521 display: 'eu',
522 publisher_name: '',
523 publisher_purposes: [],
524 language: 'en',
525 color: '',
526 scope: 'global',
527 };
528 }
529
530 theData = JSON.stringify(
531 {
532 'secret': ga_secret_id,
533 'id': ga_property_id,
534 'product': 'gdpr-compliance-tool-v2',
535 'config': config,
536 },
537 );
538
539 // Send new button status value.
540 $.ajax(
541 {
542 url: 'https://platform-api.sharethis.com/v1.0/property/product',
543 method: 'POST',
544 async: false,
545 contentType: 'application/json; charset=utf-8',
546 data: theData,
547 success: function( results ) {
548 },
549 },
550 );
551
552 dataObj['action'] = "ga_ajax_enable_gdpr";
553 dataObj['nonce'] = GA_NONCE;
554 dataObj['config'] = config;
555
556 $.ajax(
557 {
558 type: "post",
559 dataType: "json",
560 url: ajaxurl,
561 data: dataObj,
562 success: function( response ) {
563 window.location.href = siteAdminUrl + 'admin.php?page=googleanalytics%2Fgdpr';
564 },
565 },
566 );
567 },
568
569 enableGdpr: function() {
570 var timer = '';
571 const self = this;
572 this.$gdprContainer = $( '.gdpr-platform' );
573
574 // New color select.
575 this.$gdprContainer.on(
576 'click',
577 "#sharethis-form-color .color",
578 function() {
579 $( '#sharethis-form-color .color' ).removeClass( 'selected' );
580 $( this ).addClass( 'selected' );
581 }
582 );
583
584 // clear or show choices.
585 this.$gdprContainer.on(
586 'click',
587 '#clear-choices',
588 function( e ) {
589 e.preventDefault();
590 e.stopPropagation();
591
592 $( '.purpose-item input' ).prop( 'checked', false );
593 },
594 );
595
596 // clear or show choices.
597 this.$gdprContainer.on(
598 'click',
599 '#see-st-choices',
600 function( e ) {
601 e.preventDefault();
602 e.stopPropagation();
603 $( '.purpose-item input[name="purposes[1]"]' ).prop( 'checked', true );
604 $( '.purpose-item input[name="purposes[3]"][value="consent"]' ).prop( 'checked', true );
605 $( '.purpose-item input[name="purposes[5]"][value="consent"]' ).prop( 'checked', true );
606 $( '.purpose-item input[name="purposes[6]"][value="consent"]' ).prop( 'checked', true );
607 $( '.purpose-item input[name="purposes[9]"][value="legitimate"]' ).prop( 'checked', true );
608 $( '.purpose-item input[name="purposes[10]"][value="legitimate"]' ).prop( 'checked', true );
609 },
610 );
611
612 // Uncheck radio if click on selected box.
613 this.$gdprContainer.on(
614 'click',
615 '.lever',
616 ( e ) =>
617 {
618 e.preventDefault();
619 e.stopPropagation();
620
621 const theInput = $( e.currentTarget ).siblings( 'input' );
622
623 if ( theInput.is( ':checked' ) ) {
624 $( 'input[name="' + theInput.attr( 'name' ) + '"]' ).prop( 'checked', false );
625 } else {
626 theInput.prop( 'checked', true );
627 }
628 },
629 );
630
631 // Toggle button menus when arrows are clicked.
632 $( 'body' ).on(
633 'click',
634 '.accor-wrap .accor-tab',
635 function() {
636 var type = $( this ).find( 'span.accor-arrow' );
637
638 var closestButton = $( type ).parent( '.accor-tab' ).parent( '.accor-wrap' );
639
640 if ( '' === type.html() ) {
641
642 // Show the button configs.
643 closestButton.find( '.accor-content' ).slideDown();
644
645 // Change the icon next to title.
646 closestButton.find( '.accor-arrow' ).html( '&#9660;' );
647 } else {
648
649 // Show the button configs.
650 closestButton.find( '.accor-content' ).slideUp();
651
652 // Change the icon next to title.
653 closestButton.find( '.accor-arrow' ).html( '&#9658;' );
654 }
655 },
656 );
657
658 $( 'body' ).on(
659 'click',
660 '.demo-enable-popup .close-demo-modal',
661 function( e ) {
662 e.preventDefault();
663 e.stopPropagation();
664 $( '.demo-enable-popup' ).removeClass( 'engage' );
665 },
666 );
667
668 $( 'body' ).on(
669 'click',
670 '#demographic-popup',
671 function( e ) {
672 e.preventDefault();
673 e.stopPropagation();
674 $( '.demo-enable-popup' ).addClass( 'engage' );
675 },
676 );
677
678 $( 'body' ).on(
679 'click',
680 '#enable-demographic, #Enable-demographic',
681 function( e ) {
682 e.preventDefault();
683 e.stopPropagation();
684 ga_events.enableDemographic( 'enable' );
685 },
686 );
687
688 $( 'body' ).on(
689 'click',
690 '#Disable-demographic',
691 function( e ) {
692 e.preventDefault();
693 e.stopPropagation();
694 ga_events.enableDemographic( 'disable' );
695 },
696 );
697
698 // Handle account sign-out via Ajax.
699 $( 'body' ).on(
700 'click',
701 '#ga_sign_out',
702 function ( e ) {
703 e.preventDefault();
704 e.stopPropagation();
705
706 $.ajax(
707 {
708 type: 'post',
709 dataType: 'json',
710 url: googleAnalyticsPage.ajaxurl,
711 data: {
712 action: 'ga_ajax_sign_out',
713 nonce: googleAnalyticsPage.nonce,
714 },
715 success: function ( response ) {
716 window.location.href = encodeURI( googleAnalyticsPage.settingsURL )
717 },
718 },
719 );
720 },
721 );
722
723 $( 'body' ).on(
724 'click',
725 '#ga4_sign_out',
726 function ( e ) {
727 e.preventDefault();
728 e.stopPropagation();
729
730 $.ajax(
731 {
732 type: 'post',
733 dataType: 'json',
734 url: googleAnalyticsPage.ajaxurl,
735 data: {
736 action: 'ga4_ajax_sign_out',
737 nonce: googleAnalyticsPage.nonce,
738 },
739 success: function ( response ) {
740 window.location.href = encodeURI( googleAnalyticsPage.settingsURL + '&ga4=1' )
741 },
742 },
743 );
744 },
745 );
746
747 // Enable GDPR tool.
748 $( 'body' ).on(
749 'click',
750 '.gdpr-submit',
751 function( e ) {
752 e.preventDefault();
753 e.stopPropagation();
754
755 self.manualEnableGdpr();
756 },
757 );
758
759 // Enable GDPR tool.
760 $( 'body' ).on(
761 'click',
762 '.gdpr-enable',
763 function( e ) {
764 e.preventDefault();
765 e.stopPropagation();
766
767 self.manualEnableGdpr();
768 },
769 );
770
771 // Scroll to anchor in vendor list.
772 // Send user input to category search AFTER they stop typing.
773 $( 'body' ).on(
774 'keyup',
775 '.vendor-search input',
776 function( e ) {
777 clearTimeout( timer );
778
779 timer = setTimeout(
780 function() {
781 ga_events.scrollToAnchor( $( this ).val() );
782 }
783 .bind( this, ga_events ),
784 500,
785 );
786 },
787 );
788 },
789
790 enableDemographic: function( disable ) {
791 var dataObj = {};
792
793 dataObj['action'] = "ga_ajax_enable_demographic";
794 dataObj['nonce'] = ga_demo_nonce;
795 dataObj['enabled'] = 'disable' === disable ? 'false' : 'true';
796
797 $.ajax(
798 {
799 type: "post",
800 dataType: "json",
801 url: ajaxurl,
802 data: dataObj,
803 success: function( response ) {
804 window.location.href = siteAdminUrl + 'admin.php?page=googleanalytics&ga_action=demo-ad';
805 },
806 },
807 );
808 },
809 };
810
811 /**
812 * Handles "disable all features" switch button
813 *
814 * @type {{init: ga_switcher.init}}
815 */
816 ga_switcher = {
817 init: function( state ) {
818 var checkbox = $( "#ga-disable" );
819
820 if ( state ) {
821 checkbox.prop( 'checked', 'checked' );
822 } else {
823 checkbox.removeProp( 'checked' );
824 }
825 },
826 };
827
828 $( document ).ready(
829 function() {
830 const scrollData = $( '#ga-stats-container' ).attr( 'data-scroll' );
831 const scrollEl = '' !== scrollData ? $( '.' + scrollData ) : '';
832 const theBody = $( 'body' );
833
834 ga_events.initModalEvents();
835 ga_events.enableGdpr();
836 ga_events.tabLogic();
837 ga_events.setGDPRConfig( theBody.hasClass( 'google-analytics_page_googleanalytics-gdpr' ) );
838
839 if ( '' !== scrollData && theBody.hasClass( 'toplevel_page_googleanalytics' ) ) {
840 $( [ document.documentElement, document.body ] ).animate(
841 {
842 scrollTop: scrollEl.offset().top + 450,
843 },
844 500,
845 );
846 }
847 },
848 );
849
850 const offset = 50;
851 const minWidth = 350;
852 const wrapperSelector = '#ga-stats-container';
853 const chartContainer = 'chart_div';
854 const demoChartDeviceContainer = 'demo_chart_device_div';
855 const demoGa4ChartDeviceContainer = 'demo_ga4_chart_device_div';
856 const demoChartGenderContainer = 'demo_chart_gender_div';
857 const demoChartAgeContainer = 'demo_chart_age_div';
858 const demoChartAgeGa4Container = 'ga4_demo_chart_age_div';
859 const demoChartGenderGa4Container = 'ga4_demo_chart_gender_div';
860 const pageSessionChartContainer = 'page_session_chart_div';
861 const userChartContainer = 'user_chart_div';
862
863 ga_charts = {
864 init: function( callback ) {
865 $( document ).ready(
866 function() {
867 google.charts.load(
868 'current',
869 {
870 'packages': [ 'corechart' ],
871 },
872 );
873 ga_loader.show();
874 google.charts.setOnLoadCallback( callback );
875 },
876 );
877 },
878 createTooltip: function( day, pageviews ) {
879 return '<div style="padding:10px;width:100px;"><strong>' + day
880 + '</strong><br>Pageviews:<strong> ' + pageviews
881 + '</strong></div>';
882 },
883 createPageTooltip: function( day, pageviews ) {
884 return '<div style="padding:10px;width:100px;"><strong>' + day
885 + '</strong><br>Page Views:<strong> ' + pageviews
886 + '</strong></div>';
887 },
888 createUserTooltip: function( day, pageviews ) {
889 return '<div style="padding:10px;width:100px;"><strong>' + day
890 + '</strong><br>New Users:<strong> ' + pageviews
891 + '</strong></div>';
892 },
893 events: function( data ) {
894 $( window ).on(
895 'resize',
896 function() {
897 ga_charts.drawChart( data, ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector ) );
898 },
899 );
900 },
901 drawChart: function( data, chartWidth ) {
902
903 if ( typeof chartWidth == 'undefined' ) {
904 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
905 }
906
907 const options = {
908 lineWidth: 5,
909 pointSize: 10,
910 tooltip: {
911 isHtml: true,
912 },
913 legend: {
914 position: ( ga_tools.getCurrentWidth( wrapperSelector ) <= minWidth ? 'top' : 'top' ),
915 maxLines: 5,
916 alignment: 'start',
917 textStyle: {
918 color: '#000',
919 fontSize: 12,
920 },
921 },
922 colors: [ '#4285f4' ],
923 hAxis: {
924 title: 'Day',
925 titleTextStyle: {
926 color: '#333',
927 },
928 },
929 vAxis: {
930 minValue: 0,
931 },
932 width: chartWidth,
933 height: 500,
934 chartArea: {
935 top: 50,
936 left: 50,
937 right: 30,
938 bottom: 100,
939 },
940 };
941
942 var chart = new google.visualization.AreaChart(
943 document.getElementById( chartContainer )
944 );
945 chart.draw( data, options );
946 },
947 drawPageSessionChart: function( data, chartWidth ) {
948 if ( typeof chartWidth == 'undefined' ) {
949 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
950 }
951
952 const options = {
953 lineWidth: 5,
954 pointSize: 10,
955 tooltip: {
956 isHtml: true,
957 },
958 legend: {
959 position: ( ga_tools.getCurrentWidth( wrapperSelector ) <= minWidth ? 'top' : 'top' ),
960 maxLines: 5,
961 alignment: 'start',
962 textStyle: {
963 color: '#000',
964 fontSize: 12,
965 },
966 },
967 colors: [ '#4285f4' ],
968 hAxis: {
969 title: 'Day',
970 titleTextStyle: {
971 color: '#333',
972 },
973 },
974 vAxis: {
975 minValue: 0,
976 },
977 width: chartWidth,
978 height: 500,
979 chartArea: {
980 top: 50,
981 left: 50,
982 right: 30,
983 bottom: 100,
984 },
985 };
986
987 var chart = new google.visualization.AreaChart(
988 document.getElementById( pageSessionChartContainer )
989 );
990 chart.draw( data, options );
991 },
992 drawUserChart: function( data, chartWidth ) {
993 if ( typeof chartWidth == 'undefined' ) {
994 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
995 }
996
997 const options = {
998 lineWidth: 5,
999 pointSize: 10,
1000 tooltip: {
1001 isHtml: true,
1002 },
1003 legend: {
1004 position: ( ga_tools.getCurrentWidth( wrapperSelector ) <= minWidth ? 'top' : 'top' ),
1005 maxLines: 5,
1006 alignment: 'start',
1007 textStyle: {
1008 color: '#000',
1009 fontSize: 12,
1010 },
1011 },
1012 colors: [ '#4285f4' ],
1013 hAxis: {
1014 title: 'Day',
1015 titleTextStyle: {
1016 color: '#333',
1017 },
1018 },
1019 vAxis: {
1020 minValue: 0,
1021 },
1022 width: chartWidth,
1023 height: 500,
1024 chartArea: {
1025 top: 50,
1026 left: 50,
1027 right: 30,
1028 bottom: 100,
1029 },
1030 };
1031
1032 var chart = new google.visualization.AreaChart(
1033 document.getElementById( userChartContainer )
1034 );
1035 chart.draw( data, options );
1036 },
1037 drawDemoGenderChart: function( data, chartWidth ) {
1038 if ( typeof chartWidth == 'undefined' ) {
1039 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1040 }
1041
1042 data = google.visualization.arrayToDataTable( data );
1043
1044 if ( document.getElementById( demoChartGenderContainer ) ) {
1045 var chart = new google.visualization.PieChart( document.getElementById( demoChartGenderContainer ) );
1046 var options = {
1047 title: 'Gender',
1048 };
1049
1050 chart.draw( data, options );
1051 }
1052 },
1053 drawDemoDeviceChart: function( data, chartWidth ) {
1054 if ( typeof chartWidth == 'undefined' ) {
1055 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1056 }
1057
1058 data = google.visualization.arrayToDataTable( data );
1059
1060 if ( document.getElementById( demoChartDeviceContainer ) ) {
1061 var chart = new google.visualization.PieChart( document.getElementById( demoChartDeviceContainer ) );
1062 var options = {
1063 title: 'Device Breakdown',
1064 };
1065
1066 chart.draw( data, options );
1067 }
1068 },
1069
1070 drawGa4DemoDeviceChart: function( data, chartWidth ) {
1071 if ( typeof chartWidth == 'undefined' ) {
1072 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1073 }
1074
1075 data = google.visualization.arrayToDataTable( data );
1076
1077 if ( document.getElementById( demoGa4ChartDeviceContainer ) ) {
1078 var chart = new google.visualization.PieChart( document.getElementById( demoGa4ChartDeviceContainer ) );
1079 var options = {
1080 title: 'Device Breakdown',
1081 };
1082
1083 chart.draw( data, options );
1084 }
1085 },
1086
1087 drawDemoAgeChart: function( data, chartWidth ) {
1088 if ( typeof chartWidth == 'undefined' ) {
1089 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1090 }
1091
1092 data = google.visualization.arrayToDataTable( data );
1093
1094 var options = {
1095 title: 'Age',
1096 chartArea: { width: '50%' },
1097 hAxis: {
1098 minValue: 0,
1099 },
1100 };
1101
1102 if ( document.getElementById( demoChartAgeContainer ) ) {
1103 var chart = new google.visualization.BarChart( document.getElementById( demoChartAgeContainer ) );
1104
1105 chart.draw( data, options );
1106 }
1107 },
1108 drawDemoGenderGa4Chart: function( data, chartWidth ) {
1109 if ( typeof chartWidth == 'undefined' ) {
1110 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1111 }
1112
1113 data = google.visualization.arrayToDataTable( data );
1114
1115 if ( document.getElementById( demoChartGenderGa4Container ) ) {
1116 var chart = new google.visualization.PieChart( document.getElementById( demoChartGenderGa4Container ) );
1117 var options = {
1118 title: 'Gender',
1119 };
1120
1121 chart.draw( data, options );
1122 }
1123 },
1124 drawDemoAgeGa4Chart: function( data, chartWidth ) {
1125 if ( typeof chartWidth == 'undefined' ) {
1126 chartWidth = ga_tools.recomputeChartWidth( minWidth, offset, wrapperSelector );
1127 }
1128
1129 data = google.visualization.arrayToDataTable( data );
1130
1131 var options = {
1132 title: 'Age',
1133 chartArea: { width: '50%' },
1134 hAxis: {
1135 minValue: 0,
1136 },
1137 };
1138
1139 if ( document.getElementById( demoChartAgeGa4Container ) ) {
1140 var chart = new google.visualization.BarChart( document.getElementById( demoChartAgeGa4Container ) );
1141
1142 chart.draw( data, options );
1143 }
1144 },
1145 };
1146 ga_debug = {
1147 url: '',
1148 open_modal: function( e ) {
1149 e.preventDefault();
1150 $( '#' + GA_DEBUG_MODAL_ID ).appendTo( "body" ).show();
1151 $( '#ga-send-debug-email' ).removeAttr( 'disabled' );
1152 $( '#ga_debug_error' ).hide();
1153 $( '#ga_debug_success' ).hide();
1154 },
1155 send_email: function( e ) {
1156 e.preventDefault();
1157 ga_loader.show();
1158 var dataObj = {};
1159 dataObj['action'] = "googleanalytics_send_debug_email";
1160 dataObj['email'] = $( '#' + GA_DEBUG_EMAIL ).val();
1161 dataObj['description'] = $( '#' + GA_DEBUG_DESCRIPTION ).val();
1162 $.ajax(
1163 {
1164 type: "post",
1165 dataType: "json",
1166 url: ajaxurl,
1167 data: dataObj,
1168 success: function( response ) {
1169 ga_loader.hide();
1170 if ( typeof response.error !== "undefined" ) {
1171 $( '#ga_debug_error' ).show().html( response.error );
1172 } else if ( typeof response.success !== "undefined" ) {
1173 $( '#ga_debug_error' ).hide();
1174 $( '#ga-send-debug-email' ).attr( 'disabled', 'disabled' );
1175 $( '#ga_debug_success' ).show().html( response.success );
1176 }
1177 },
1178 },
1179 );
1180 },
1181 };
1182 } )( jQuery );
1183