Merge pull request #93 from cloudinary/uat

V2.1.1 version release

Author: pereirinha

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/cloudinary.php

@@ -3,7 +3,7 @@
  * Plugin Name: Cloudinary
  * Plugin URI: https://cloudinary.com/documentation/wordpress_integration
  * Description: With the Cloudinary plugin, you can upload and manage your media assets in the cloud, then deliver them to your users through a fast content delivery network, improving your website’s loading speed and overall user experience. Apply multiple transformations and take advantage of a full digital asset management solution without leaving WordPress.
- * Version: 2.0.3
+ * Version: 2.1.1
  * Author:  Cloudinary Ltd., XWP
  * Author URI: https://cloudinary.com/
  * License: GPLv2+

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css

@@ -1,95 +1,109 @@
 @font-face {
-	font-family: 'cloudinary';
-	src: url('fonts/cloudinary.eot?fj77m5');
-	src: url('fonts/cloudinary.eot?fj77m5#iefix') format('embedded-opentype'),
+	font-family : 'cloudinary';
+	src         : url('fonts/cloudinary.eot?fj77m5');
+	src         : url('fonts/cloudinary.eot?fj77m5#iefix') format('embedded-opentype'),
 	url('fonts/cloudinary.ttf?fj77m5') format('truetype'),
 	url('fonts/cloudinary.woff?fj77m5') format('woff'),
 	url('fonts/cloudinary.svg?fj77m5#cloudinary') format('svg');
-	font-weight: normal;
-	font-style: normal;
+	font-weight : normal;
+	font-style  : normal;
 }
 
 .dashicons {
 	&-cloudinary {
 		/* use !important to prevent issues with browser extensions that change fonts */
-		speak: none;
-		font-style: normal;
-		font-weight: normal;
-		font-variant: normal;
-		text-transform: none;
-		line-height: 1;
+		speak                   : none;
+		font-style              : normal;
+		font-weight             : normal;
+		font-variant            : normal;
+		text-transform          : none;
+		line-height             : 1;
 
 		/* Better Font Rendering =========== */
-		-webkit-font-smoothing: antialiased;
-		-moz-osx-font-smoothing: grayscale;
+		-webkit-font-smoothing  : antialiased;
+		-moz-osx-font-smoothing : grayscale;
 
 		&:before {
-			font-family: 'cloudinary' !important;
-			content: '\e900';
+			font-family : 'cloudinary' !important;
+			content     : '\e900';
 		}
 
 		&.success {
-			color: $color-green;
+			color : $color-green;
 		}
 
 		&.error {
-			color: $color-red;
+			color : $color-red;
 
 			&:before {
-				content: '\e901';
+				content : '\e901';
 			}
 		}
 
 		&.warning {
-			color: $color-orange;
+			color : $color-orange;
 
 			&:before {
-				content: '\e902';
+				content : '\e902';
 			}
 		}
 
 		&.warning {
-			color: $color-orange;
+			color : $color-orange;
 		}
 
 		&.warning {
-			color: $color-orange;
+			color : $color-orange;
 		}
 	}
 }
 
 .column-cld_status {
-	width: 5.5em;
+	width : 5.5em;
 
 	.dashicons {
 		&-cloudinary {
-			display: inline-block;
+			display : inline-block;
 
 			&:before {
-				font-size: 1.8rem;
+				font-size : 1.8rem;
 			}
 		}
 	}
 }
 
 .form-field, .form-table {
 	.error-notice {
-		display: none;
-		color: $color-red;
+		display : none;
+		color   : $color-red;
 	}
 
 	input.cld-field:invalid {
-		border-color: $color-red;
+		border-color : $color-red;
 
 		+ .error-notice {
-			display: inline-block;
+			display : inline-block;
 		}
 	}
 }
 
-.cloudinary-welcome {
-	background-image: url("logo.svg");
-	background-repeat: no-repeat;
-	background-size: 153px;
-	background-position: top 12px right 20px;
+.cloudinary {
+	&-welcome {
+		background-image    : url("logo.svg");
+		background-repeat   : no-repeat;
+		background-size     : 153px;
+		background-position : top 12px right 20px;
+	}
+	&-stats{
+		display: inline-block;
+		margin-left: 25px;
+	}
+	&-stat{
+		cursor: help;
+	}
+	&-percent {
+		font-size      : 0.8em;
+		vertical-align : top;
+		color          : $color-blue;
+	}
 }

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/loading.svg

@@ -70,5 +70,19 @@
 		max-width : 300px;
 		display   : none;
 	}
+
+	&-status {
+		&-disabled {
+			color : $color-red;
+		}
+
+		&-enabled {
+			color : $color-green;
+		}
+
+		&-button.button {
+			vertical-align : baseline;
+		}
+	}
 }
 

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/src/components/_brand.scss

@@ -0,0 +1,9 @@
+// Frontend video styles.
+.cld {
+	&-video {
+		&-player {
+			max-width: 100%;
+		}
+	}
+}
+

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/src/components/_sync.scss

@@ -0,0 +1 @@
+.cld-video-player{max-width:100%}

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/src/video.scss

@@ -50,7 +50,7 @@
 				let field = $(this),
 					value = field.val();
 
-				let reg = new RegExp(/^(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g );
+				let reg = new RegExp(/^(?:CLOUDINARY_URL=)?(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g );
 				if( reg.test( value ) ){
 					field.addClass( 'settings-valid-field' );
 					field.removeClass( 'settings-invalid-field' );

cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/video.css

@@ -4,11 +4,10 @@ const Sync = {
 	progress: document.getElementById( 'progress-wrapper' ),
 	submitButton: document.getElementById( 'submit' ),
 	stopButton: document.getElementById( 'stop-sync' ),
-	progressCount: document.getElementById( 'sync-progress' ),
-	barSyncCount: document.getElementById( 'sync-total' ),
 	completed: document.getElementById( 'completed-notice' ),
 	show: 'inline-block',
 	hide: 'none',
+	isRunning: false,
 	getStatus: function getStatus() {
 		var self = this,
 			resourceType = [],
@@ -22,8 +21,9 @@ const Sync = {
 				request.setRequestHeader( 'X-WP-Nonce', cloudinaryApi.nonce );
 			},
 		} ).done( function( data ) {
-			if ( data.done < data.total ) {
-				setTimeout( Sync.getStatus, 2000 );
+			Sync.isRunning = data.is_running;
+			if ( Sync.isRunning ) {
+				setTimeout( Sync.getStatus, 10000 );
 			}
 			Sync._updateUI( data );
 		} );
@@ -32,6 +32,8 @@ const Sync = {
 		var self = this,
 			url = cloudinaryApi.restUrl + 'cloudinary/v1/sync';
 
+		Sync.isRunning = false;
+
 		wp.ajax.send( {
 			url: url,
 			data: {
@@ -48,11 +50,16 @@ const Sync = {
 		var self = this,
 			url = cloudinaryApi.restUrl + 'cloudinary/v1/sync';
 
+		Sync.isRunning = true;
+		Sync.progress.style.display = Sync.show;
+
 		wp.ajax.send( {
 			url: url,
 			beforeSend: function( request ) {
 				request.setRequestHeader( 'X-WP-Nonce', cloudinaryApi.nonce );
 			},
+		} ).done( function ( data ) {
+			setTimeout( Sync.getStatus, 10000 );
 		} );
 	},
 	_updateUI: function _updateUI( data ) {
@@ -75,13 +82,14 @@ const Sync = {
 			this.stopButton.style.display = this.hide;
 		}
 
-		if ( data.percent < 100 ) {
-			this.barSyncCount.innerText = data.total;
-			this.progressCount.innerText = data.done;
+		if ( data.percent === 100 ) {
+			this.completed.style.display = this.show;
+		}
+
+		if ( this.isRunning ) {
 			this.progress.style.display = this.show;
 		}
 		else {
-			this.completed.style.display = this.show;
 			this.progress.style.display = this.hide;
 		}
 	},