[widgets] vanilla JS: Milestone

Automattic · Mar 6, 2020 · 6e50664 · 6e50664
1 parent 9991511
commit 6e50664
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 11 deletions.
diff --git a/modules/widgets/milestone/milestone.js b/modules/widgets/milestone/milestone.js
@@ -1,19 +1,26 @@
 /* global MilestoneConfig */
 
-var Milestone = ( function( $ ) {
+var Milestone = ( function() {
 	var Milestone = function( args ) {
-		var $widget = $( '#' + args.id ),
+		var widget = document.getElementById( args.id ),
 			id = args.id,
 			refresh = args.refresh * 1000;
 
 		this.timer = function() {
 			var instance = this;
+			var xhr = new XMLHttpRequest();
 
-			$.ajax( {
-				url: MilestoneConfig.api_root + 'jetpack/v4/widgets/' + id,
-				success: function( result ) {
-					$widget.find( '.milestone-countdown' ).replaceWith( result.message );
-					refresh = result.refresh * 1000;
+			xhr.onload = function() {
+				var response = JSON.parse( xhr.responseText ),
+					httpCheck = xhr.status >= 200 && xhr.status < 300,
+					responseCheck =
+						'undefined' !== typeof response.message && 'undefined' !== typeof response.refresh;
+
+				if ( httpCheck && responseCheck ) {
+					var countdownElement = widget.querySelector( '.milestone-countdown' );
+
+					countdownElement.outerHTML = response.message;
+					refresh = response.refresh * 1000;
 
 					if ( ! refresh ) {
 						return;
@@ -22,8 +29,11 @@ var Milestone = ( function( $ ) {
 					setTimeout( function() {
 						instance.timer();
 					}, refresh );
-				},
-			} );
+				}
+			};
+
+			xhr.open( 'GET', MilestoneConfig.api_root + 'jetpack/v4/widgets/' + id );
+			xhr.send();
 		};
 
 		if ( refresh > 0 ) {
@@ -33,7 +43,7 @@ var Milestone = ( function( $ ) {
 	return function( args ) {
 		return new Milestone( args );
 	};
-} )( jQuery );
+} )();
 
 ( function() {
 	var i,

diff --git a/modules/widgets/milestone/milestone.php b/modules/widgets/milestone/milestone.php
@@ -86,7 +86,7 @@ public static function enqueue_template() {
 				'_inc/build/widgets/milestone/milestone.min.js',
 				'modules/widgets/milestone/milestone.js'
 			),
-			array( 'jquery' ),
+			array(),
 			'20160520',
 			true
 		);