New sync status

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

@@ -3,5 +3,5 @@ $color-green : #558b2f;
 $color-red : #dd2c00;
 $color-light-grey : #e5e5e5;
 $color-white : #ffffff;
-$color-blue : #0078ff;
+$color-blue : #0071ba;
 $color-orange : #fd9d2c;

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

@@ -1,10 +1,10 @@
 @font-face {
 	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');
+	src         : url('fonts/cloudinary.eot?xr4567gh');
+	src         : url('fonts/cloudinary.eot?xr4567gh#iefix') format('embedded-opentype'),
+	url('fonts/cloudinary.ttf?xr4567gh') format('truetype'),
+	url('fonts/cloudinary.woff?xr4567gh') format('woff'),
+	url('fonts/cloudinary.svg?xr4567gh#cloudinary') format('svg');
 	font-weight : normal;
 	font-style  : normal;
 }
@@ -48,12 +48,20 @@
 			}
 		}
 
-		&.warning {
-			color : $color-orange;
+		&.info {
+			color : $color-blue;
 		}
 
-		&.warning {
-			color : $color-orange;
+		&.downloading {
+			&:before {
+				content: '\e903';
+			}
+		}
+
+		&.syncing {
+			&:before {
+				content: '\e904';
+			}
 		}
 	}
 }

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

@@ -1096,6 +1096,7 @@ public function media_column_value( $column_name, $attachment_id ) {
 					'state' => 'inactive',
 					'note'  => esc_html__( 'Not Synced', 'cloudinary' ),
 				);
+				add_filter( 'cloudinary_flag_sync', '__return_true' );
 				if ( false === $this->cloudinary_id( $attachment_id ) ) {
 					// If false, lets check why by seeing if the file size is too large.
 					$file     = get_attached_file( $attachment_id ); // Get the file size to make sure it can exist in cloudinary.
@@ -1112,6 +1113,7 @@ public function media_column_value( $column_name, $attachment_id ) {
 						'note'  => esc_html__( 'Synced', 'cloudinary' ),
 					);
 				}
+				remove_filter( 'cloudinary_flag_sync', '__return_true' );
 				// filter status.
 				$status = apply_filters( 'cloudinary_media_status', $status, $attachment_id );
 				?>

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

@@ -49,6 +49,8 @@ class Sync implements Setup, Assets {
 		'sync_error'     => '_sync_error',
 		'cloudinary'     => '_cloudinary_v2',
 		'folder_sync'    => '_folder_sync',
+		'syncing'        => '_cloudinary_syncing',
+		'downloading'    => '_cloudinary_downloading',
 	);
 
 	/**
@@ -100,14 +102,18 @@ public function is_active() {
 	 * @return bool
 	 */
 	public function is_synced( $post_id ) {
-		$return    = false;
 		$signature = $this->get_signature( $post_id );
 		$expecting = $this->generate_signature( $post_id );
+
 		if ( ! empty( $signature ) && ! empty( $expecting ) && $expecting === $signature ) {
-			$return = $signature;
+			return true;
 		}
 
-		return $return;
+		if ( apply_filters( 'cloudinary_flag_sync', '__return_false' ) ) {
+			update_post_meta( $post_id, Sync::META_KEYS['syncing'], true );
+		}
+
+		return false;
 	}
 
 	/**

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

@@ -96,6 +96,29 @@ public function check_cloudinary_version( $cloudinary_id, $attachment_id ) {
 		return $cloudinary_id;
 	}
 
+	/**
+	 * Checks the status of the media item.
+	 *
+	 * @param array $status        Array of state and note.
+	 * @param int   $attachment_id The attachment id.
+	 *
+	 * @return array
+	 */
+	public function filter_status( $status, $attachment_id ) {
+
+		if ( get_post_meta( $attachment_id, Sync::META_KEYS['downloading'] ) ) {
+			$status['state'] = 'info downloading';
+			$status['note']  = __( 'Downloading', 'cloudinary' );
+		}
+
+		if ( get_post_meta( $attachment_id, Sync::META_KEYS['syncing'] ) ) {
+			$status['state'] = 'info syncing';
+			$status['note']  = __( 'Syncing metadata', 'cloudinary' );
+		}
+
+		return $status;
+	}
+
 	/**
 	 * Convert an image post that was created from Cloudinary v1.
 	 *
@@ -139,6 +162,10 @@ function ( $val ) use ( $media ) {
 		$path      = pathinfo( $public_id );
 		$public_id = strstr( $public_id, '.' . $path['extension'], true );
 		$this->media->update_post_meta( $attachment_id, Sync::META_KEYS['public_id'], $public_id );
+
+		// Flag the download
+		update_post_meta( $attachment_id, Sync::META_KEYS['downloading'], true );
+
 		if ( ! defined( 'DOING_BULK_SYNC' ) ) {
 			$this->sync->managers['upload']->add_to_sync( $attachment_id ); // Auto sync if upgrading outside of bulk sync.
 		}
@@ -152,6 +179,9 @@ function ( $val ) use ( $media ) {
 	public function setup_hooks() {
 		add_filter( 'validate_cloudinary_id', array( $this, 'check_cloudinary_version' ), 10, 2 ); // Priority 10, to allow prep_on_demand_upload.
 
+		// Show sync status.
+		add_filter( 'cloudinary_media_status', array( $this, 'filter_status' ), 20, 2 );
+
 		// Add a redirection to the new plugin settings, from the old plugin.
 		if ( is_admin() ) {
 			add_action( 'admin_menu', function () {

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

@@ -391,6 +391,10 @@ public function prepare_upload( $post, $down_sync = false ) {
 				$error = sprintf( __( 'File size exceeds the maximum of %s. This media asset will be served from WordPress.', 'cloudinary' ), $max_size_hr );
 				$media->delete_post_meta( $post->ID, Sync::META_KEYS['pending'] ); // Remove Flag.
 
+				// Cleanup flags
+				delete_post_meta( $post->ID, Sync::META_KEYS['syncing'] );
+				delete_post_meta( $post->ID, Sync::META_KEYS['downloading'] );
+
 				return new \WP_Error( 'upload_error', $error );
 			}
 
@@ -629,6 +633,11 @@ public function push_attachments( $attachments ) {
 					$meta_data[ Sync::META_KEYS['version'] ] = $result['version'];
 				}
 				$media->delete_post_meta( $attachment->ID, Sync::META_KEYS['pending'] );
+
+				// Cleanup flags
+				delete_post_meta( $attachment->ID, Sync::META_KEYS['downloading'] );
+				delete_post_meta( $attachment->ID, Sync::META_KEYS['syncing'] );
+
 				$media->delete_post_meta( $attachment->ID, Sync::META_KEYS['sync_error'], false );
 				if ( ! empty( $this->plugin->config['settings']['global_transformations']['enable_breakpoints'] ) ) {
 					if ( ! empty( $result['responsive_breakpoints'] ) ) { // Images only.

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

@@ -145,6 +145,8 @@ public function handle_bulk_actions( $location, $action, $post_ids ) {
 					delete_post_meta( $post_id, Sync::META_KEYS['sync_error'] );
 					delete_post_meta( $post_id, Sync::META_KEYS['public_id'] );
 					delete_post_meta( $post_id, Sync::META_KEYS['pending'] );
+					delete_post_meta( $post_id, Sync::META_KEYS['downloading'] );
+					delete_post_meta( $post_id, Sync::META_KEYS['syncing'] );
 					$file = get_attached_file( $post_id );
 					wp_generate_attachment_metadata( $post_id, $file );
 					$this->prep_upload( $post_id );
@@ -304,14 +306,14 @@ public function filter_status( $status, $attachment_id ) {
 
 		if ( $this->is_pending( $attachment_id ) ) {
 			$status['state'] = 'warning';
-			$status['note']  = esc_html__( 'Upload sync pending', 'cloudinary' );
+			$status['note']  = __( 'Upload sync pending', 'cloudinary' );
 		}
 
 		// Check if there's an error.
 		$has_error = $this->plugin->components['media']->get_post_meta( $attachment_id, Sync::META_KEYS['sync_error'], true );
 		if ( ! empty( $has_error ) ) {
-			$status['note']  = $has_error;
 			$status['state'] = 'error';
+			$status['note']  = $has_error;
 		}
 
 		return $status;