Feature: Allow publishing from preview

js/customize-snapshots-front.js

@@ -0,0 +1,72 @@
+/* global jQuery, wp */
+/* exported CustomizeSnapshotsFront */
+var CustomizeSnapshotsFront = (function( $ ) {
+	'use strict';
+
+	var component = {
+		data: {
+			confirmationMsg: '',
+			action: '',
+			snapshotsFrontendPublishNonce: '',
+			errorMsg: ''
+		}
+	};
+	/**
+	 * Init.
+	 *
+	 * @param {object} args Args.
+	 * @returns {void}
+	 */
+	component.init = function init( args ) {
+		_.extend( component.data, args );
+
+		$( document ).ready( function() {
+			component.setupPublishButton();
+		} );
+	};
+
+	/**
+	 * Set up snapshot frontend publish button.
+	 *
+	 * @returns {void}
+	 */
+	component.setupPublishButton = function setupPublishButton() {
+		var publishBtn = $( '#wp-admin-bar-publish-customize-snapshot a' );
+
+		if ( ! publishBtn.length ) {
+			return;
+		}
+
+		publishBtn.click( function( e ) {
+			var request,
+				data = {
+					nonce: component.data.snapshotsFrontendPublishNonce,
+					uuid: component.data.uuid
+				};
+			e.preventDefault();
+
+			if ( ! window.confirm( component.data.confirmationMsg ) ) { // eslint-disable-line no-alert
+				return false;
+			}
+			if ( ! wp.customize.settings.theme.active ) {
+				data.stylesheet = wp.customize.settings.theme.stylesheet;
+			}
+			request = wp.ajax.post( component.data.action, data );
+
+			request.done( function( resp ) {
+				if ( resp && resp.success ) {
+					window.location = e.target.href;
+				}
+			} );
+			request.fail( function( resp ) {
+				if ( resp && resp.errorMsg ) {
+					window.alert( resp.errorMsg ); // eslint-disable-line no-alert
+				}
+			} );
+
+			return true;
+		} );
+	};
+
+	return component;
+})( jQuery );

php/class-customize-snapshot-manager.php

@@ -76,6 +76,14 @@ class Customize_Snapshot_Manager {
 	 */
 	public $original_stylesheet;
 
+	/**
+	 * New active theme.
+	 *
+	 * @access public
+	 * @var string
+	 */
+	public $stylesheet;
+
 	/**
 	 * Constructor.
 	 *
@@ -97,6 +105,8 @@ function hooks() {
 		add_action( 'init', array( $this->post_type, 'init' ) );
 		add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_controls_scripts' ) );
 		add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_admin_scripts' ) );
+		add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_frontend_scripts' ) );
+		add_action( 'wp_ajax_customize_snapshots_frontend_publish', array( $this, 'ajax_snapshot_frontend_publish' ) );
 
 		add_action( 'customize_controls_init', array( $this, 'add_snapshot_uuid_to_return_url' ) );
 		add_action( 'customize_controls_print_footer_scripts', array( $this, 'render_templates' ) );
@@ -186,15 +196,20 @@ public function doing_customize_save_ajax() {
 	 */
 	public function ensure_customize_manager() {
 		global $wp_customize;
+
+		$args = array();
 		if ( empty( $wp_customize ) || ! ( $wp_customize instanceof \WP_Customize_Manager ) ) {
 			require_once( ABSPATH . WPINC . '/class-wp-customize-manager.php' );
+
 			if ( null !== $this->current_snapshot_uuid ) {
-				$wp_customize = new \WP_Customize_Manager( array(
-					'changeset_uuid' => $this->current_snapshot_uuid,
-				) ); // WPCS: override ok.
-			} else {
-				$wp_customize = new \WP_Customize_Manager(); // WPCS: override ok.
+				$args['changeset_uuid'] = $this->current_snapshot_uuid;
 			}
+
+			if ( null !== $this->stylesheet ) {
+				$args['theme'] = $this->stylesheet;
+			}
+
+			$wp_customize = new \WP_Customize_Manager( $args ); // WPCS: override ok.
 		}
 
 		$this->customize_manager = $wp_customize;
@@ -342,6 +357,31 @@ public function enqueue_admin_scripts( $hook ) {
 		}
 	}
 
+	/**
+	 * Enqueue frontend scripts.
+	 *
+	 * These files control the behavior frontend.
+	 */
+	public function enqueue_frontend_scripts() {
+		if ( ! $this->snapshot || ! current_user_can( get_post_type_object( 'customize_changeset' )->cap->publish_posts ) ) {
+			return;
+		}
+
+		$handle = 'customize-snapshots-front';
+		wp_enqueue_script( $handle );
+		$exports = array(
+			'confirmationMsg' => __( 'Are you sure that you want to publish the Changeset?', 'customize-snapshots' ),
+			'snapshotsFrontendPublishNonce' => wp_create_nonce( 'customize-snapshots-frontend-publish' ),
+			'action' => 'customize_snapshots_frontend_publish',
+			'uuid' => $this->snapshot->uuid(),
+		);
+		wp_add_inline_script(
+			$handle,
+			sprintf( 'CustomizeSnapshotsFront.init( %s )', wp_json_encode( $exports ) ),
+			'after'
+		);
+	}
+
 	/**
 	 * Get the Customize_Snapshot instance.
 	 *
@@ -476,6 +516,7 @@ public function customize_menu( $wp_admin_bar ) {
 		$this->replace_customize_link( $wp_admin_bar );
 		$this->add_resume_snapshot_link( $wp_admin_bar );
 		$this->add_post_edit_screen_link( $wp_admin_bar );
+		$this->add_publish_snapshot_link( $wp_admin_bar );
 		$this->add_snapshot_exit_link( $wp_admin_bar );
 	}
 
@@ -497,6 +538,10 @@ public function print_admin_bar_styles() {
 				content: "\f179";
 				top: 2px;
 			}
+			#wpadminbar #wp-admin-bar-publish-customize-snapshot > .ab-item:before {
+				content: "\f147";
+				top: 2px;
+			}
 			#wpadminbar #wp-admin-bar-exit-customize-snapshot > .ab-item:before {
 				content: "\f158";
 				top: 2px;
@@ -592,6 +637,33 @@ public function add_post_edit_screen_link( $wp_admin_bar ) {
 		) );
 	}
 
+	/**
+	 * Adds a "Publish Changeset" link to the Toolbar when in Snapshot mode.
+	 *
+	 * @param \WP_Admin_Bar $wp_admin_bar WP_Admin_Bar instance.
+	 */
+	public function add_publish_snapshot_link( $wp_admin_bar ) {
+		if ( ! $this->snapshot ) {
+			return;
+		}
+		$post = $this->snapshot->post();
+		if ( ! $post ) {
+			return;
+		}
+		$wp_admin_bar->add_menu( array(
+			'id' => 'publish-customize-snapshot',
+			'title' => __( 'Publish Changeset', 'customize-snapshots' ),
+			'href' => remove_query_arg( array(
+				$this->get_front_uuid_param(),
+				'theme',
+				$this->get_customize_uuid_param(),
+			) ),
+			'meta' => array(
+				'class' => 'ab-item ab-customize-snapshots-item',
+			),
+		) );
+	}
+
 	/**
 	 * Adds an "Exit Snapshot" link to the Toolbar when in Snapshot mode.
 	 *
@@ -620,7 +692,12 @@ public function remove_all_non_snapshot_admin_bar_links( $wp_admin_bar ) {
 		if ( empty( $this->snapshot ) ) {
 			return;
 		}
-		$snapshot_admin_bar_node_ids = array( 'customize', 'exit-customize-snapshot', 'inspect-customize-snapshot' );
+		$snapshot_admin_bar_node_ids = array(
+			'customize',
+			'exit-customize-snapshot',
+			'inspect-customize-snapshot',
+			'publish-customize-snapshot',
+		);
 		foreach ( $wp_admin_bar->get_nodes() as $node ) {
 			if ( in_array( $node->id, $snapshot_admin_bar_node_ids, true ) || '#' === substr( $node->href, 0, 1 ) ) {
 				continue;
@@ -952,6 +1029,42 @@ public function get_customize_uuid_param() {
 		return constant( get_class( $this->post_type ) . '::CUSTOMIZE_UUID_PARAM_NAME' );
 	}
 
+	/**
+	 * Publishes changeset from frontend.
+	 */
+	public function ajax_snapshot_frontend_publish() {
+		if ( ! check_ajax_referer( 'customize-snapshots-frontend-publish', 'nonce' ) ) {
+			status_header( 400 );
+			wp_send_json_error( 'bad_nonce' );
+		}
+
+		if ( ! current_user_can( get_post_type_object( 'customize_changeset' )->cap->publish_posts ) ) {
+			status_header( 403 );
+			wp_send_json_error( 'insufficient_post_permissions' );
+		}
+
+		if ( ! isset( $_POST['uuid'] ) ) {
+			wp_send_json_error();
+		}
+
+		$this->current_snapshot_uuid = sanitize_key( wp_unslash( $_POST['uuid'] ) );
+		if ( isset( $_POST['stylesheet'] ) ) {
+			$this->stylesheet = sanitize_text_field( wp_unslash( $_POST['stylesheet'] ) );
+		}
+		$this->ensure_customize_manager();
+		$r = $this->customize_manager->save_changeset_post( array(
+			'status' => 'publish',
+		) );
+
+		if ( is_wp_error( $r ) ) {
+			$msg = __( 'Publishing failed: ', 'customize-snapshots' );
+			$msg .= join( '; ', array_keys( $r->errors ) );
+			wp_send_json_error( array( 'errorMsg' => $msg ) );
+		} else {
+			wp_send_json_success( array( 'success' => true ) );
+		}
+	}
+
 	/**
 	 * Save the preview url query vars in changeset meta.
 	 *

php/class-plugin.php

@@ -129,6 +129,11 @@ public function register_scripts( \WP_Scripts $wp_scripts ) {
 		$src = $this->dir_url . 'js/customize-snapshots-admin' . $min . '.js';
 		$deps = array( 'jquery', 'underscore' );
 		$wp_scripts->add( $handle, $src, $deps );
+
+		$handle = 'customize-snapshots-front';
+		$src = $this->dir_url . 'js/customize-snapshots-front' . $min . '.js';
+		$deps = array( 'jquery', 'wp-backbone', 'underscore' );
+		$wp_scripts->add( $handle, $src, $deps );
 	}
 
 	/**