Add post date control and preview

css/customize-posts.css

@@ -106,7 +106,7 @@
 	transition: all 0.2s;
 	visibility: hidden;
 }
- 
+
 body.customize-posts-content-editor-pane-resize #customize-preview,
 body.customize-posts-content-editor-pane-resize #customize-posts-content-editor-pane {
 	-webkit-transition: none;
@@ -220,3 +220,54 @@ body.customize-posts-content-editor-pane-resize #customize-preview:before {
 	width: auto;
 	vertical-align: middle;
 }
+
+.customize-control-post_date .customize-control-description {
+	font-style: normal;
+	display: block;
+	margin-bottom: 0;
+	margin-top: -28px;
+}
+.customize-control-post_date .customize-control-description summary {
+	font-size: 14px;
+	line-height: 24px;
+	margin-bottom: 4px;
+	display: block;
+	float: right;
+	cursor: pointer;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+.customize-control-post_date .customize-control-description[open] {
+	margin-bottom: 5px;
+}
+.customize-control-post_date .customize-control-description .time-details {
+	clear: both;
+}
+.customize-control-post_date .date-inputs {
+	clear: both;
+}
+
+.customize-control-post_date select,
+.customize-control-post_date input.date-input {
+	min-width: 10%;
+	width: auto;
+}
+.customize-control-post_date input.date-input {
+	-moz-appearance: textfield;
+}
+.customize-control-post_date input.date-input::-webkit-outer-spin-button,
+.customize-control-post_date input.date-input::-webkit-inner-spin-button {
+	-webkit-appearance: none;
+	margin: 0;
+}
+.wrap-reset-time {
+	font-weight: normal;
+	font-size: 75%;
+}
+.customize-control-post_date .reset-time {
+	cursor: pointer;
+	margin-left: 0.25ex;
+	margin-right: 0.25ex;
+}

js/customize-controls-patched-36521.js

@@ -9,6 +9,7 @@
 	 * @see FeaturedImage.updateSelection()
 	 *
 	 * @link https://core.trac.wordpress.org/ticket/36521
+	 * @returns {void}
 	 */
 	api.MediaControl.prototype.ready = function() {
 		var control = this;
@@ -47,6 +48,7 @@
 		 * attachmentData before calling the renderContent method.
 		 *
 		 * @param {number|string} value Attachment
+		 * @returns {void}
 		 */
 		function setAttachmentDataAndRenderContent( value ) {
 			var hasAttachmentData = $.Deferred(), attachmentId = value;

js/customize-deferred-partial.js

@@ -0,0 +1,97 @@
+/* global wp */
+/* eslint consistent-this: [ "error", "partial" ] */
+/* eslint-disable no-magic-numbers */
+
+(function( api ) {
+	'use strict';
+
+	/**
+	 * A deferred partial for settings that created at runtime.
+	 *
+	 * @class
+	 * @augments wp.customize.selectiveRefresh.Partial
+	 * @augments wp.customize.Class
+	 */
+	api.selectiveRefresh.partialConstructor.deferred = api.selectiveRefresh.Partial.extend({
+
+		/**
+		 * Handle fail to render partial.
+		 *
+		 * {@inheritdoc}
+		 *
+		 * @this {wp.customize.selectiveRefresh.Partial}
+		 * @returns {void}
+		 */
+		fallback: function deferredPartialFallback() {
+			var partial = this, hasInvalidSettings = false;
+
+			// Prevent infinite selective refresh reloading for partials that have fallbackRefresh.
+			_.each( partial.settings(), function checkSettingValidity( settingId ) {
+				var validityState = api.settingValidities( settingId );
+				if ( validityState && true !== validityState.get() ) {
+					hasInvalidSettings = true;
+				}
+			} );
+			if ( hasInvalidSettings ) {
+				return;
+			}
+			api.selectiveRefresh.Partial.prototype.fallback.call( partial );
+		},
+
+		/**
+		 * Return whether the setting is related to the partial.
+		 *
+		 * This is needed because selective refresh has the behavior of calling
+		 * `handleSettingChange` when a setting is added, but since we are deferring
+		 * to create settings until they are needed, we need to prevent created
+		 * settings from triggering a partial refresh.
+		 *
+		 * @param {wp.customize.Value|string} setting  ID or object for setting.
+		 * @param {*}                         newValue New value.
+		 * @param {*}                         oldValue Old value.
+		 * @return {boolean} Whether the setting is related to the partial.
+		 */
+		isRelatedSetting: function( setting, newValue, oldValue ) {
+			var isSettingCreated = null === oldValue;
+			if ( isSettingCreated ) {
+				return false;
+			} else {
+				return api.selectiveRefresh.Partial.prototype.isRelatedSetting.call( this, setting, newValue, oldValue );
+			}
+		},
+
+		/**
+		 * Request the new partial and render it into the placements.
+		 *
+		 * @return {jQuery.Promise} Refresh promise.
+		 */
+		refresh: function() {
+			var partial = this, refreshPromise;
+
+			refreshPromise = api.selectiveRefresh.Partial.prototype.refresh.call( partial );
+
+			refreshPromise.done( function() {
+				var hasInvalidSettings = false;
+				_.each( partial.settings(), function( settingId ) {
+					var validityState = api.settingValidities( settingId );
+					if ( validityState && true !== validityState.get() ) {
+						hasInvalidSettings = true;
+					}
+				} );
+
+				/*
+				 * Leave partial placements in a loading state after they get
+				 * refreshed but have invalid settings (and thus revert to original values).
+				 */
+				if ( hasInvalidSettings ) {
+					_.each( partial.placements(), function( placement ) {
+						partial.preparePlacement( placement );
+					} );
+				}
+			} );
+
+			return refreshPromise;
+		}
+	});
+
+})( wp.customize );

js/customize-dynamic-control.js

@@ -38,6 +38,7 @@
 		 * should be changed in Core to be applied once the control is embedded.
 		 *
 		 * @private
+		 * @returns {void}
 		 */
 		_setUpSettingRootLinks: function() {
 			var control, nodes, radios;
@@ -73,6 +74,7 @@
 		 * Add bidirectional data binding links between inputs and the setting properties.
 		 *
 		 * @private
+		 * @returns {void}
 		 */
 		_setUpSettingPropertyLinks: function() {
 			var control = this, nodes, radios;
@@ -141,6 +143,8 @@
 		 * Override the embed() method to do nothing,
 		 * so that the control isn't embedded on load,
 		 * unless the containing section is already expanded.
+		 *
+		 * @returns {void}
 		 */
 		embed: function() {
 			var control = this,
@@ -166,6 +170,8 @@
 		 *
 		 * This function is called in Section.onChangeExpanded() so the control
 		 * will only get embedded when the Section is first expanded.
+		 *
+		 * @returns {void}
 		 */
 		actuallyEmbed: function() {
 			var control = this;
@@ -179,7 +185,8 @@
 		/**
 		 * This is not working with autofocus.
 		 *
-		 * @param args
+		 * @param {object} [args] Args.
+		 * @returns {void}
 		 */
 		focus: function( args ) {
 			var control = this;

js/customize-page-template.js

@@ -94,7 +94,7 @@ var CustomizePageTemplate = (function( api ) {
 		/**
 		 * Make sure that control only appears if there are page templates (other than 'default').
 		 *
-		 * @returns {boolean}
+		 * @returns {boolean} Is active.
 		 */
 		isActiveCallback = function() {
 			var defaultSize = 1;