first commit

wp-content/themes/storefront/assets/js/admin/admin.js

@@ -0,0 +1,41 @@
+/* global ajaxurl, storefrontNUX */
+( function ( wp, $ ) {
+	'use strict';
+
+	if ( ! wp ) {
+		return;
+	}
+
+	/*
+	 * Ajax request that will hide the Storefront NUX admin notice or message.
+	 */
+	function dismissNux() {
+		$.ajax( {
+			type: 'POST',
+			url: ajaxurl,
+			data: {
+				nonce: storefrontNUX.nonce,
+				action: 'storefront_dismiss_notice',
+			},
+			dataType: 'json',
+		} );
+	}
+
+	$( function () {
+		// Dismiss notice
+		$( document ).on(
+			'click',
+			'.sf-notice-nux .notice-dismiss',
+			function () {
+				dismissNux();
+			}
+		);
+
+		// Dismiss notice inside theme page.
+		$( document ).on( 'click', '.sf-nux-dismiss-button', function () {
+			dismissNux();
+			$( '.storefront-intro-setup' ).hide();
+			$( '.storefront-intro-message' ).fadeIn( 'slow' );
+		} );
+	} );
+} )( window.wp, jQuery );

wp-content/themes/storefront/assets/js/admin/admin.min.js

@@ -0,0 +1 @@
+!function(n,o){"use strict";function t(){o.ajax({type:"POST",url:ajaxurl,data:{nonce:storefrontNUX.nonce,action:"storefront_dismiss_notice"},dataType:"json"})}n&&o(function(){o(document).on("click",".sf-notice-nux .notice-dismiss",function(){t()}),o(document).on("click",".sf-nux-dismiss-button",function(){t(),o(".storefront-intro-setup").hide(),o(".storefront-intro-message").fadeIn("slow")})})}(window.wp,jQuery);

wp-content/themes/storefront/assets/js/admin/customizer.js

@@ -0,0 +1,300 @@
+/* global _wpCustomizeSFGuidedTourSteps */
+( function ( wp, $ ) {
+	'use strict';
+
+	if ( ! wp || ! wp.customize ) {
+		return;
+	}
+
+	// Set up our namespace.
+	const api = wp.customize;
+
+	api.SFGuidedTourSteps = [];
+
+	if ( typeof _wpCustomizeSFGuidedTourSteps !== 'undefined' ) {
+		$.extend( api.SFGuidedTourSteps, _wpCustomizeSFGuidedTourSteps );
+	}
+
+	/**
+	 * wp.customize.SFGuidedTour
+	 *
+	 */
+	api.SFGuidedTour = {
+		$container: null,
+		currentStep: -1,
+
+		init() {
+			this._setupUI();
+		},
+
+		_setupUI() {
+			const self = this,
+				$wpCustomize = $( 'body.wp-customizer .wp-full-overlay' );
+
+			this.$container = $( '<div/>' ).addClass( 'sf-guided-tour' );
+
+			// Add guided tour div
+			$wpCustomize.prepend( this.$container );
+
+			// Add listeners
+			this._addListeners();
+
+			// Initial position
+			this.$container
+				.css(
+					! $( 'body' ).hasClass( 'rtl' ) ? 'left' : 'right',
+					$( '#customize-controls' ).width() + 10 + 'px'
+				)
+				.on( 'transitionend', function () {
+					self.$container.addClass( 'sf-loaded' );
+				} );
+
+			// Show first step
+			this._showNextStep();
+
+			$( document ).on(
+				'click',
+				'.sf-guided-tour-step .sf-nux-button',
+				function () {
+					self._showNextStep();
+					return false;
+				}
+			);
+
+			$( document ).on(
+				'click',
+				'.sf-guided-tour-step .sf-guided-tour-skip',
+				function () {
+					if ( self.currentStep === 0 ) {
+						self._hideTour( true );
+					} else {
+						self._showNextStep();
+					}
+
+					return false;
+				}
+			);
+		},
+
+		_addListeners() {
+			const self = this;
+
+			api.state( 'expandedSection' ).bind( function () {
+				self._adjustPosition();
+			} );
+
+			api.state( 'expandedPanel' ).bind( function () {
+				self._adjustPosition();
+			} );
+		},
+
+		_adjustPosition() {
+			const step = this._getCurrentStep();
+
+			if ( ! step ) {
+				return;
+			}
+
+			this.$container.removeClass( 'sf-inside-section' );
+
+			const expandedSection = api.state( 'expandedSection' ).get();
+			const expandedPanel = api.state( 'expandedPanel' ).get();
+
+			if ( expandedSection && step.section === expandedSection.id ) {
+				this._moveContainer(
+					$( expandedSection.container[ 1 ] ).find(
+						'.customize-section-title'
+					)
+				);
+				this.$container.addClass( 'sf-inside-section' );
+			} else if ( expandedSection === false && expandedPanel === false ) {
+				if ( this._isTourHidden() ) {
+					this._revealTour();
+				} else {
+					const selector = this._getSelector( step.section );
+					this._moveContainer( selector );
+				}
+			} else {
+				this._hideTour();
+			}
+		},
+
+		_hideTour( remove ) {
+			const self = this;
+
+			// Already hidden?
+			if ( this._isTourHidden() ) {
+				return;
+			}
+
+			const containerOffset = this.$container.offset();
+
+			this.$container.css( {
+				transform: '',
+				top: containerOffset.top,
+			} );
+
+			$( 'body' )
+				.addClass( 'sf-exiting' )
+				.on(
+					'animationend.storefront webkitAnimationEnd.storefront',
+					function () {
+						$( this )
+							.removeClass( 'sf-exiting' )
+							.off(
+								'animationend.storefront webkitAnimationEnd.storefront'
+							)
+							.addClass( 'sf-hidden' );
+						self.$container.hide();
+
+						if (
+							typeof remove !== 'undefined' &&
+							remove === true
+						) {
+							self._removeTour();
+						}
+					}
+				);
+		},
+
+		_revealTour() {
+			const self = this;
+
+			$( 'body' ).removeClass( 'sf-hidden' );
+
+			self.$container.show();
+
+			const containerOffset = this.$container.offset();
+			const offsetTop = parseInt( containerOffset.top, 10 );
+
+			$( 'body' )
+				.addClass( 'sf-entering' )
+				.on(
+					'animationend.storefront webkitAnimationEnd.storefront',
+					function () {
+						$( this )
+							.removeClass( 'sf-entering' )
+							.off(
+								'animationend.storefront webkitAnimationEnd.storefront'
+							);
+
+						self.$container.css( {
+							top: 'auto',
+							transform: 'translateY(' + offsetTop + 'px)',
+						} );
+					}
+				);
+		},
+
+		_removeTour() {
+			this.$container.remove();
+		},
+
+		_closeAllSections() {
+			api.section.each( function ( section ) {
+				section.collapse( { duration: 0 } );
+			} );
+
+			api.panel.each( function ( panel ) {
+				panel.collapse( { duration: 0 } );
+			} );
+		},
+
+		_showNextStep() {
+			if ( this._isLastStep() ) {
+				this._hideTour( true );
+				return;
+			}
+
+			this._closeAllSections();
+
+			// Get next step
+			const step = this._getNextStep();
+
+			// Convert line breaks to paragraphs
+			step.message = this._lineBreaksToParagraphs( step.message );
+
+			// Load template
+			const template = wp.template( 'sf-guided-tour-step' );
+
+			this.$container.removeClass( 'sf-first-step' );
+
+			if ( this.currentStep === 0 ) {
+				step.first_step = true;
+				this.$container.addClass( 'sf-first-step' );
+			}
+
+			if ( this._isLastStep() ) {
+				step.last_step = true;
+				this.$container.addClass( 'sf-last-step' );
+			}
+
+			this._moveContainer( this._getSelector( step.section ) );
+
+			this.$container.html( template( step ) );
+		},
+
+		_moveContainer( $selector ) {
+			const self = this;
+
+			if ( ! $selector ) {
+				return;
+			}
+
+			const position =
+				parseInt( $selector.offset().top, 10 ) +
+				$selector.height() / 2 -
+				44;
+
+			this.$container
+				.addClass( 'sf-moving' )
+				.css( {
+					transform: 'translateY(' + position + 'px)',
+				} )
+				.on( 'transitionend.storefront', function () {
+					self.$container.removeClass( 'sf-moving' );
+					self.$container.off( 'transitionend.storefront' );
+				} );
+		},
+
+		_getSelector( pointTo ) {
+			const sectionOrPanel = api.section( pointTo )
+				? api.section( pointTo )
+				: api.panel( pointTo );
+
+			// Check whether this is a section, panel, or a regular selector
+			if ( typeof sectionOrPanel !== 'undefined' ) {
+				return $( sectionOrPanel.container[ 0 ] );
+			}
+
+			return $( pointTo );
+		},
+
+		_getCurrentStep() {
+			return api.SFGuidedTourSteps[ this.currentStep ];
+		},
+
+		_getNextStep() {
+			this.currentStep = this.currentStep + 1;
+			return api.SFGuidedTourSteps[ this.currentStep ];
+		},
+
+		_isTourHidden() {
+			return $( 'body' ).hasClass( 'sf-hidden' ) ? true : false;
+		},
+
+		_isLastStep() {
+			return this.currentStep + 1 < api.SFGuidedTourSteps.length
+				? false
+				: true;
+		},
+
+		_lineBreaksToParagraphs( message ) {
+			return '<p>' + message.replace( '\n\n', '</p><p>' ) + '</p>';
+		},
+	};
+
+	$( document ).ready( function () {
+		api.SFGuidedTour.init();
+	} );
+} )( window.wp, jQuery );

wp-content/themes/storefront/assets/js/admin/customizer.min.js

@@ -0,0 +1 @@
+!function(s,n){"use strict";if(s&&s.customize){const i=s.customize;i.SFGuidedTourSteps=[],"undefined"!=typeof _wpCustomizeSFGuidedTourSteps&&n.extend(i.SFGuidedTourSteps,_wpCustomizeSFGuidedTourSteps),i.SFGuidedTour={$container:null,currentStep:-1,init(){this._setupUI()},_setupUI(){const t=this,e=n("body.wp-customizer .wp-full-overlay");this.$container=n("<div/>").addClass("sf-guided-tour"),e.prepend(this.$container),this._addListeners(),this.$container.css(n("body").hasClass("rtl")?"right":"left",n("#customize-controls").width()+10+"px").on("transitionend",function(){t.$container.addClass("sf-loaded")}),this._showNextStep(),n(document).on("click",".sf-guided-tour-step .sf-nux-button",function(){return t._showNextStep(),!1}),n(document).on("click",".sf-guided-tour-step .sf-guided-tour-skip",function(){return 0===t.currentStep?t._hideTour(!0):t._showNextStep(),!1})},_addListeners(){const t=this;i.state("expandedSection").bind(function(){t._adjustPosition()}),i.state("expandedPanel").bind(function(){t._adjustPosition()})},_adjustPosition(){var t,e,s=this._getCurrentStep();s&&(this.$container.removeClass("sf-inside-section"),e=i.state("expandedSection").get(),t=i.state("expandedPanel").get(),e&&s.section===e.id?(this._moveContainer(n(e.container[1]).find(".customize-section-title")),this.$container.addClass("sf-inside-section")):!1===e&&!1===t?this._isTourHidden()?this._revealTour():(e=this._getSelector(s.section),this._moveContainer(e)):this._hideTour())},_hideTour(t){const e=this;var s;this._isTourHidden()||(s=this.$container.offset(),this.$container.css({transform:"",top:s.top}),n("body").addClass("sf-exiting").on("animationend.storefront webkitAnimationEnd.storefront",function(){n(this).removeClass("sf-exiting").off("animationend.storefront webkitAnimationEnd.storefront").addClass("sf-hidden"),e.$container.hide(),void 0!==t&&!0===t&&e._removeTour()}))},_revealTour(){const t=this;n("body").removeClass("sf-hidden"),t.$container.show();var e=this.$container.offset();const s=parseInt(e.top,10);n("body").addClass("sf-entering").on("animationend.storefront webkitAnimationEnd.storefront",function(){n(this).removeClass("sf-entering").off("animationend.storefront webkitAnimationEnd.storefront"),t.$container.css({top:"auto",transform:"translateY("+s+"px)"})})},_removeTour(){this.$container.remove()},_closeAllSections(){i.section.each(function(t){t.collapse({duration:0})}),i.panel.each(function(t){t.collapse({duration:0})})},_showNextStep(){if(this._isLastStep())this._hideTour(!0);else{this._closeAllSections();const t=this._getNextStep(),e=(t.message=this._lineBreaksToParagraphs(t.message),s.template("sf-guided-tour-step"));this.$container.removeClass("sf-first-step"),0===this.currentStep&&(t.first_step=!0,this.$container.addClass("sf-first-step")),this._isLastStep()&&(t.last_step=!0,this.$container.addClass("sf-last-step")),this._moveContainer(this._getSelector(t.section)),this.$container.html(e(t))}},_moveContainer(t){const e=this;t&&(t=parseInt(t.offset().top,10)+t.height()/2-44,this.$container.addClass("sf-moving").css({transform:"translateY("+t+"px)"}).on("transitionend.storefront",function(){e.$container.removeClass("sf-moving"),e.$container.off("transitionend.storefront")}))},_getSelector(t){var e=i.section(t)?i.section(t):i.panel(t);return n(void 0!==e?e.container[0]:t)},_getCurrentStep(){return i.SFGuidedTourSteps[this.currentStep]},_getNextStep(){return this.currentStep=this.currentStep+1,i.SFGuidedTourSteps[this.currentStep]},_isTourHidden(){return!!n("body").hasClass("sf-hidden")},_isLastStep(){return!(this.currentStep+1<i.SFGuidedTourSteps.length)},_lineBreaksToParagraphs(t){return"<p>"+t.replace("\n\n","</p><p>")+"</p>"}},n(document).ready(function(){i.SFGuidedTour.init()})}}(window.wp,jQuery);

wp-content/themes/storefront/assets/js/admin/plugin-install.js

@@ -0,0 +1,47 @@
+( function ( wp, $ ) {
+	'use strict';
+
+	if ( ! wp ) {
+		return;
+	}
+
+	$( function () {
+		$( document ).on( 'click', '.sf-install-now', function ( event ) {
+			const $button = $( event.target );
+
+			if ( $button.hasClass( 'activate-now' ) ) {
+				return true;
+			}
+
+			event.preventDefault();
+
+			if (
+				$button.hasClass( 'updating-message' ) ||
+				$button.hasClass( 'button-disabled' )
+			) {
+				return;
+			}
+
+			if (
+				wp.updates.shouldRequestFilesystemCredentials &&
+				! wp.updates.ajaxLocked
+			) {
+				wp.updates.requestFilesystemCredentials( event );
+
+				$( document ).on( 'credential-modal-cancel', function () {
+					const $message = $( '.sf-install-now.updating-message' );
+
+					$message
+						.removeClass( 'updating-message' )
+						.text( wp.updates.l10n.installNow );
+
+					wp.a11y.speak( wp.updates.l10n.updateCancel, 'polite' );
+				} );
+			}
+
+			wp.updates.installPlugin( {
+				slug: $button.data( 'slug' ),
+			} );
+		} );
+	} );
+} )( window.wp, jQuery );

wp-content/themes/storefront/assets/js/admin/plugin-install.min.js

@@ -0,0 +1 @@
+!function(t,a){"use strict";t&&a(function(){a(document).on("click",".sf-install-now",function(e){const s=a(e.target);if(s.hasClass("activate-now"))return!0;e.preventDefault(),s.hasClass("updating-message")||s.hasClass("button-disabled")||(t.updates.shouldRequestFilesystemCredentials&&!t.updates.ajaxLocked&&(t.updates.requestFilesystemCredentials(e),a(document).on("credential-modal-cancel",function(){const e=a(".sf-install-now.updating-message");e.removeClass("updating-message").text(t.updates.l10n.installNow),t.a11y.speak(t.updates.l10n.updateCancel,"polite")})),t.updates.installPlugin({slug:s.data("slug")}))})})}(window.wp,jQuery);