Merge branch 'dashboard_widget'

Author: Evertrotshuizen

readme.txt

@@ -110,6 +110,9 @@ A: Yes! After installing the plugin, go to *Media > Bulk Optimization*, and clic
 
 == Changelog ==
 
+= 2.2.0 =
+* New dashboard widget that shows your media library savings.
+
 = 2.1.0 =
 * Compression of retina images generated by WP Retina 2x.
 * Solved a bug which caused the API key to be cleared on the settings page.

src/class-tiny-plugin.php

@@ -17,9 +17,8 @@
 * with this program; if not, write to the Free Software Foundation, Inc., 51
 * Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
 */
-
 class Tiny_Plugin extends Tiny_WP_Base {
-	const VERSION = '2.1.0';
+	const VERSION = '2.2.0';
 	const MEDIA_COLUMN = self::NAME;
 	const DATETIME_FORMAT = 'Y-m-d G:i:s';
 
@@ -34,7 +33,7 @@ public static function jpeg_quality() {
 
 	public static function version() {
 		/* Avoid using get_plugin_data() because it is not loaded early enough
-		   in xmlrpc.php. */
+			 in xmlrpc.php. */
 		return self::VERSION;
 	}
 
@@ -68,6 +67,10 @@ public function init() {
 	}
 
 	public function admin_init() {
+		add_action('wp_dashboard_setup',
+			$this->get_method( 'add_dashboard_widget' )
+		);
+
 		add_action( 'admin_enqueue_scripts',
 			$this->get_method( 'enqueue_scripts' )
 		);
@@ -169,6 +172,11 @@ public function enqueue_scripts( $hook ) {
 			array(), self::version()
 		);
 
+		wp_enqueue_style( self::NAME . '_chart',
+			plugins_url( '/css/chart.css', __FILE__ ),
+			array(), self::version()
+		);
+
 		wp_register_script( self::NAME . '_admin',
 			plugins_url( '/js/admin.js', __FILE__ ),
 			array(), self::version(), true
@@ -208,6 +216,11 @@ public function enqueue_scripts( $hook ) {
 				array(), self::version()
 			);
 
+			wp_enqueue_style( self::NAME .'_chart',
+				plugins_url( '/css/chart.css', __FILE__ ),
+				array(), self::version()
+			);
+
 			wp_register_script(
 				self::NAME . '_tiny_bulk_optimization',
 				plugins_url( '/js/bulk-optimization.js', __FILE__ ),
@@ -431,6 +444,34 @@ public function render_bulk_optimization_page() {
 		include( dirname( __FILE__ ) . '/views/bulk-optimization.php' );
 	}
 
+	public function add_dashboard_widget() {
+		wp_enqueue_style( self::NAME .'_chart',
+			plugins_url( '/css/chart.css', __FILE__ ),
+			array(), self::version()
+		);
+
+		wp_enqueue_style( self::NAME .'_dashboard_widget',
+			plugins_url( '/css/dashboard-widget.css', __FILE__ ),
+			array(), self::version()
+		);
+		wp_register_script( self::NAME .'_dashboard_widget',
+			plugins_url( '/js/dashboard-widget.js', __FILE__ ),
+			array(), self::version(), true
+		);
+
+		wp_enqueue_script( self::NAME .'_dashboard_widget' );
+
+		wp_add_dashboard_widget(
+			$this->get_prefixed_name( 'dashboard_widget' ),
+			esc_html__( 'Compress JPEG & PNG images', 'tiny-compress-images' ),
+			$this->get_method( 'add_widget_view' )
+		);
+	}
+
+	function add_widget_view() {
+		include( dirname( __FILE__ ) . '/views/dashboard-widget.php' );
+	}
+
 	private static function retrieve_admin_colors() {
 		global $_wp_admin_css_colors;
 		$admin_colour_scheme = get_user_option( 'admin_color', get_current_user_id() );
@@ -475,8 +516,8 @@ private function get_ids_to_compress() {
 		global $wpdb;
 		return $wpdb->get_results(
 			"SELECT ID, post_title FROM $wpdb->posts
-             WHERE post_type = 'attachment' $condition
-             AND (post_mime_type = 'image/jpeg' OR post_mime_type = 'image/png')
-             ORDER BY ID DESC", ARRAY_A);
+						 WHERE post_type = 'attachment' $condition
+						 AND (post_mime_type = 'image/jpeg' OR post_mime_type = 'image/png')
+						 ORDER BY ID DESC", ARRAY_A);
 	}
 }

src/css/bulk-optimization.css

@@ -139,52 +139,11 @@ div.tiny-bulk-optimization div.savings div.legend {
 	margin-left: 50%;
 }
 
-div.tiny-bulk-optimization div.savings div.chart {
-	float: left;
-	position: relative;
-	width: 50%;
-	text-align: center;
-}
-
-div.tiny-bulk-optimization div.savings div.chart svg circle.main {
-	fill: #ebebeb;
-	animation: shwoosh 2s ease;
-	transition: stroke-dasharray 1s ease;
-}
-
-div.tiny-bulk-optimization div.savings div.chart svg circle.inner {
-	fill: #fff;
-}
-
-div.tiny-bulk-optimization div.savings div.chart div.value {
-	position: absolute;
-	top: 0;
-	left: 0;
-	width: 100%;
-	color: #7acb44;
-	text-align: center;
-}
 
-div.tiny-bulk-optimization div.savings div.chart div.value div.percentage {
-	width: 50%;
-	margin-left: auto;
-	margin-right: auto;
-	margin-top: 65px;
-	font-size: 2.4em;
-	line-height: 1em;
-}
-
-div.tiny-bulk-optimization div.savings div.chart div.value div.label {
-	width: 50%;
-	margin-left: auto;
-	margin-right: auto;
-	font-size: 1.4em;
-	line-height: 1.2em;
-}
 
 div.tiny-bulk-optimization div.savings div.legend {
 	/* margin-left defined inline */
-	padding: 30px 0;
+	padding: 22px 0;
 }
 
 div.tiny-bulk-optimization div.savings table {
@@ -207,13 +166,6 @@ div.tiny-bulk-optimization div.savings table td.description {
 	color: #bbb;
 }
 
-@media only screen and (max-width: 400px) {
-	div.tiny-bulk-optimization div.savings div.chart {
-		float: none;
-		width: 100%;
-	}
-}
-
 @media only screen and (max-width: 400px) {
 	div.tiny-bulk-optimization div.savings div.legend {
 		margin-left: 0 !important;

src/css/chart.css

@@ -0,0 +1,53 @@
+#optimization-chart {
+	float: left;
+	position: relative;
+	width: 50%;
+	text-align: center;
+}
+
+.ie8 #optimization-chart {
+	margin: 0;
+}
+
+#optimization-chart svg circle.main {
+	fill: #ebebeb;
+	animation: shwoosh 2s ease;
+	transition: stroke-dasharray 1s ease;
+}
+
+#optimization-chart svg circle.inner {
+	fill: #fff;
+}
+
+#optimization-chart div.value {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	color: #7acb44;
+	text-align: center;
+}
+
+#optimization-chart div.value div.percentage {
+	width: 50%;
+	margin-left: auto;
+	margin-right: auto;
+	margin-top: 56px;
+	font-size: 2.1em;
+	line-height: 1em;
+}
+
+#optimization-chart div.value div.label {
+	width: 50%;
+	margin-left: auto;
+	margin-right: auto;
+	font-size: 1.4em;
+	line-height: 1.2em;
+}
+
+@media only screen and (max-width: 400px) {
+	#optimization-chart {
+		float: none;
+		width: 100%;
+	}
+}