From 9c052901070e643849a297a477337e1a4bffd703 Mon Sep 17 00:00:00 2001
From: Satrya <margasatrya@gmail.com>
Date: Sat, 23 Jan 2016 12:30:14 +0700
Subject: [PATCH 1/2] Encode the `|` character to fix HTML5 validation

---
 extensions/fonts.php | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/extensions/fonts.php b/extensions/fonts.php
index 3c92d14..53353e6 100755
--- a/extensions/fonts.php
+++ b/extensions/fonts.php
@@ -82,7 +82,7 @@ function customizer_library_get_google_font_uri( $fonts ) {
 	if ( empty( $family ) ) {
 		return '';
 	} else {
-		$request = '//fonts.googleapis.com/css?family=' . implode( '|', $family );
+		$request = '//fonts.googleapis.com/css?family=' . implode( '%7C', $family );
 	}
 
 	// Load the font subset
@@ -7230,4 +7230,4 @@ function customizer_library_get_google_fonts() {
 		),
 	) );
 }
-endif;
\ No newline at end of file
+endif;

From 04ec1d2e2be1ab2cf443bfb872d3a7412e2c51ad Mon Sep 17 00:00:00 2001
From: Satrya <margasatrya@gmail.com>
Date: Sat, 23 Jan 2016 13:03:16 +0700
Subject: [PATCH 2/2] Introduce 2 new Customizer media controls
 `WP_Customize_Media_Control` and `WP_Customize_Cropped_Image_Control`

---
 README.md                | 33 ++++++++++++++++++-
 extensions/interface.php | 68 +++++++++++++++++++++++++++++++++++++++-
 2 files changed, 99 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 0a5b54f..a510358 100755
--- a/README.md
+++ b/README.md
@@ -254,6 +254,35 @@ $options['example-content'] = array(
 );
 ~~~
 
+### Media
+
+~~~php
+$options['example-media'] = array(
+	'id'        => 'example-media',
+	'label'     => __( 'Image Media', 'textdomain' ),
+	'section'   => $section,
+	'type'      => 'media',
+	'default'   => '',
+	'mime_type' => 'image'
+);
+~~~
+
+### Crop
+
+~~~php
+$options['example-crop'] = array(
+	'id'          => 'example-crop',
+	'label'       => __( 'Custom Header', 'textdomain' ),
+	'section'     => $section,
+	'type'        => 'crop',
+	'default'     => '',
+	'flex_width'  => true,
+	'flex_height' => true,
+	'width'       => 200,
+	'height'      => 200
+);
+~~~
+
 ### Pass $options to Customizer Library
 
 After all the options and sections are defined, load them with the Customizer Library:
@@ -363,6 +392,8 @@ Development
 ===
 
 * Enhancement: Content option (for help text, HTML output, etc.)
+* Bugfix: Encode `|` character to fix html5 validation error
+* Introduce 2 new Customizer media controls `WP_Customize_Media_Control` and `WP_Customize_Cropped_Image_Control`
 
 1.3.0
 ===
@@ -390,4 +421,4 @@ Development
 1.0.0
 ===
 
-* Public Release
\ No newline at end of file
+* Public Release
diff --git a/extensions/interface.php b/extensions/interface.php
index fb42a43..a088c4f 100755
--- a/extensions/interface.php
+++ b/extensions/interface.php
@@ -61,6 +61,31 @@ function customizer_library_register( $wp_customize ) {
 					$option['active_callback'] = '';
 				}
 
+				// Set default mime_type to image.
+				if ( ! isset( $option['mime_type'] ) ) {
+					$option['mime_type'] = 'image';
+				}
+
+				// Set default flex_width to true.
+				if ( ! isset( $option['flex_width'] ) ) {
+					$option['flex_width'] = true;
+				}
+
+				// Set default flex_height to true.
+				if ( ! isset( $option['flex_height'] ) ) {
+					$option['flex_height'] = true;
+				}
+
+				// Set blank width if one isn't set
+				if ( ! isset( $option['width'] ) ) {
+					$option['width'] = '';
+				}
+
+				// Set blank height if one isn't set
+				if ( ! isset( $option['height'] ) ) {
+					$option['height'] = '';
+				}
+
 				// Add the setting
 				customizer_library_add_setting( $option, $wp_customize );
 
@@ -132,6 +157,47 @@ function customizer_library_register( $wp_customize ) {
 
 						break;
 
+					case 'media':
+
+						$wp_customize->add_control(
+							new WP_Customize_Media_Control(
+								$wp_customize,
+								$option['id'], array(
+									'label'             => $option['label'],
+									'section'           => $option['section'],
+									'sanitize_callback' => $option['sanitize_callback'],
+									'priority'          => $option['priority'],
+									'active_callback'   => $option['active_callback'],
+									'description'       => $option['description'],
+									'mime_type'         => $option['mime_type']
+								)
+							)
+						);
+
+						break;
+
+					case 'crop':
+
+						$wp_customize->add_control(
+							new WP_Customize_Cropped_Image_Control(
+								$wp_customize,
+								$option['id'], array(
+									'label'             => $option['label'],
+									'section'           => $option['section'],
+									'sanitize_callback' => $option['sanitize_callback'],
+									'priority'          => $option['priority'],
+									'active_callback'   => $option['active_callback'],
+									'description'       => $option['description'],
+									'flex_width'        => $option['flex_width'],
+									'flex_height'       => $option['flex_height'],
+									'width'             => $option['width'],
+									'height'            => $option['height'],
+								)
+							)
+						);
+
+						break;
+
 					case 'textarea':
 
 						// Custom control required before WordPress 4.0
@@ -300,7 +366,7 @@ function customizer_library_get_sanitization( $type ) {
 		return 'customizer_library_sanitize_range';
 	}
 
-	if ( 'dropdown-pages' == $type ) {
+	if ( 'dropdown-pages' == $type || 'media' == $type || 'crop' == $type ) {
 		return 'absint';
 	}