diff options
Diffstat (limited to 'plugins/jetpack/extensions/blocks/repeat-visitor')
8 files changed, 3 insertions, 275 deletions
diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/components/edit.js b/plugins/jetpack/extensions/blocks/repeat-visitor/components/edit.js deleted file mode 100644 index ff954162..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/components/edit.js +++ /dev/null @@ -1,114 +0,0 @@ -/** - * External dependencies - */ -import { __, _n, sprintf } from '@wordpress/i18n'; -import { Notice, TextControl, RadioControl, Placeholder } from '@wordpress/components'; -import { Component } from '@wordpress/element'; -import { InnerBlocks } from '@wordpress/editor'; -import { withSelect } from '@wordpress/data'; -import classNames from 'classnames'; - -/** - * Internal dependencies - */ -import { CRITERIA_AFTER, CRITERIA_BEFORE } from '../constants'; -import { icon } from '../index'; - -const RADIO_OPTIONS = [ - { - value: CRITERIA_AFTER, - label: __( 'Show after threshold', 'jetpack' ), - }, - { - value: CRITERIA_BEFORE, - label: __( 'Show before threshold', 'jetpack' ), - }, -]; - -class RepeatVisitorEdit extends Component { - state = { - isThresholdValid: true, - }; - - setCriteria = criteria => this.props.setAttributes( { criteria } ); - setThreshold = threshold => { - if ( /^\d+$/.test( threshold ) && +threshold > 0 ) { - this.props.setAttributes( { threshold: +threshold } ); - this.setState( { isThresholdValid: true } ); - return; - } - this.setState( { isThresholdValid: false } ); - }; - - getNoticeLabel() { - if ( this.props.attributes.criteria === CRITERIA_AFTER ) { - return sprintf( - _n( - 'This block will only appear to people who have visited this page more than once.', - 'This block will only appear to people who have visited this page more than %d times.', - +this.props.attributes.threshold, - 'jetpack' - ), - this.props.attributes.threshold - ); - } - - return sprintf( - _n( - 'This block will only appear to people who are visiting this page for the first time.', - 'This block will only appear to people who have visited this page at most %d times.', - +this.props.attributes.threshold, - 'jetpack' - ), - this.props.attributes.threshold - ); - } - - render() { - return ( - <div - className={ classNames( this.props.className, { - 'wp-block-jetpack-repeat-visitor--is-unselected': ! this.props.isSelected, - } ) } - > - <Placeholder - icon={ icon } - label={ __( 'Repeat Visitor', 'jetpack' ) } - className="wp-block-jetpack-repeat-visitor-placeholder" - > - <TextControl - className="wp-block-jetpack-repeat-visitor-threshold" - defaultValue={ this.props.attributes.threshold } - help={ - this.state.isThresholdValid ? '' : __( 'Please enter a valid number.', 'jetpack' ) - } - label={ __( 'Visit count threshold', 'jetpack' ) } - min="1" - onChange={ this.setThreshold } - pattern="[0-9]" - type="number" - /> - - <RadioControl - label={ __( 'Visibility', 'jetpack' ) } - selected={ this.props.attributes.criteria } - options={ RADIO_OPTIONS } - onChange={ this.setCriteria } - /> - </Placeholder> - - <Notice status="info" isDismissible={ false }> - { this.getNoticeLabel() } - </Notice> - <InnerBlocks /> - </div> - ); - } -} - -export default withSelect( ( select, ownProps ) => { - const { isBlockSelected, hasSelectedInnerBlock } = select( 'core/editor' ); - return { - isSelected: isBlockSelected( ownProps.clientId ) || hasSelectedInnerBlock( ownProps.clientId ), - }; -} )( RepeatVisitorEdit ); diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/components/save.js b/plugins/jetpack/extensions/blocks/repeat-visitor/components/save.js deleted file mode 100644 index 7484c06d..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/components/save.js +++ /dev/null @@ -1,12 +0,0 @@ -/** - * External dependencies - */ -import { InnerBlocks } from '@wordpress/editor'; - -export default ( { className } ) => { - return ( - <div className={ className }> - <InnerBlocks.Content /> - </div> - ); -}; diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/constants.js b/plugins/jetpack/extensions/blocks/repeat-visitor/constants.js deleted file mode 100644 index 09f459d2..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/constants.js +++ /dev/null @@ -1,5 +0,0 @@ -export const CRITERIA_AFTER = 'after-visits'; -export const CRITERIA_BEFORE = 'before-visits'; -export const DEFAULT_THRESHOLD = 3; -export const COOKIE_NAME = 'jp-visit-counter'; -export const MAX_COOKIE_AGE = 6 * 30 * 24 * 60 * 60; // 6 months diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/editor.js b/plugins/jetpack/extensions/blocks/repeat-visitor/editor.js deleted file mode 100644 index d05f4039..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/editor.js +++ /dev/null @@ -1,7 +0,0 @@ -/** - * Internal dependencies - */ -import registerJetpackBlock from '../../shared/register-jetpack-block'; -import { name, settings } from '.'; - -registerJetpackBlock( name, settings ); diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/editor.scss b/plugins/jetpack/extensions/blocks/repeat-visitor/editor.scss deleted file mode 100644 index 6a4dd9a5..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/editor.scss +++ /dev/null @@ -1,55 +0,0 @@ -.wp-block-jetpack-repeat-visitor { - .components-notice { - margin: 1em 0 0; - } - .components-radio-control__option { - text-align: left; - } - .components-notice__content { - margin: 0.5em 0; - font-size: 0.8em; - - .components-base-control { - display: inline-block; - max-width: 8em; - vertical-align: middle; - - .components-base-control__field { - margin-bottom: 0; - } - } - } -} - -.wp-block-jetpack-repeat-visitor-placeholder { - min-height: inherit; - - .components-placeholder__label svg { - margin-right: 0.5ch; - } - - .components-placeholder__fieldset { - flex-wrap: nowrap; - .components-base-control { - flex-basis: 100%; - } - } - - .components-base-control__help { - color: var( --muriel-hot-red-500 ); - font-size: 13px; - } -} - -.wp-block-jetpack-repeat-visitor--is-unselected .wp-block-jetpack-repeat-visitor-placeholder { - display: none; -} - -.wp-block-jetpack-repeat-visitor-threshold { - margin-right: 20px; - - .components-text-control__input { - width: 5em; - text-align: center; - } -} diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/index.js b/plugins/jetpack/extensions/blocks/repeat-visitor/index.js deleted file mode 100644 index 067c1177..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/index.js +++ /dev/null @@ -1,46 +0,0 @@ -/** - * External dependencies - */ -import { __, _x } from '@wordpress/i18n'; -import { Path } from '@wordpress/components'; - -/** - * Internal dependencies - */ -import renderMaterialIcon from '../../shared/render-material-icon'; -import edit from './components/edit'; -import save from './components/save'; -import { CRITERIA_AFTER, DEFAULT_THRESHOLD } from './constants'; -import './editor.scss'; - -export const name = 'repeat-visitor'; -export const icon = renderMaterialIcon( - <Path d="M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z" /> -); -export const settings = { - attributes: { - criteria: { - type: 'string', - default: CRITERIA_AFTER, - }, - threshold: { - type: 'number', - default: DEFAULT_THRESHOLD, - }, - }, - category: 'jetpack', - description: __( - 'Control block visibility based on how often a visitor has viewed the page.', - 'jetpack' - ), - icon, - keywords: [ - _x( 'return', 'block search term', 'jetpack' ), - _x( 'visitors', 'block search term', 'jetpack' ), - _x( 'visibility', 'block search term', 'jetpack' ), - ], - supports: { html: false }, - title: __( 'Repeat Visitor', 'jetpack' ), - edit, - save, -}; diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/repeat-visitor.php b/plugins/jetpack/extensions/blocks/repeat-visitor/repeat-visitor.php index ccde0648..2facf626 100644 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/repeat-visitor.php +++ b/plugins/jetpack/extensions/blocks/repeat-visitor/repeat-visitor.php @@ -25,6 +25,8 @@ jetpack_register_block( function jetpack_repeat_visitor_block_render( $attributes, $content ) { Jetpack_Gutenberg::load_assets_as_required( 'repeat-visitor' ); + $classes = Jetpack_Gutenberg::block_classes( 'repeat-visitor', $attributes ); + $count = isset( $_COOKIE['jp-visit-counter'] ) ? intval( $_COOKIE['jp-visit-counter'] ) : 0; $criteria = isset( $attributes['criteria'] ) ? $attributes['criteria'] : 'after-visits'; $threshold = isset( $attributes['threshold'] ) ? intval( $attributes['threshold'] ) : 3; @@ -37,5 +39,5 @@ function jetpack_repeat_visitor_block_render( $attributes, $content ) { } // return an empty div so that view script increments the visit counter in the cookie. - return '<div class="wp-block-jetpack-repeat-visitor"></div>'; + return '<div class="' . esc_attr( $classes ) . '"></div>'; } diff --git a/plugins/jetpack/extensions/blocks/repeat-visitor/view.js b/plugins/jetpack/extensions/blocks/repeat-visitor/view.js deleted file mode 100644 index 0273932c..00000000 --- a/plugins/jetpack/extensions/blocks/repeat-visitor/view.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * External dependencies - */ -import cookie from 'cookie'; - -/** - * Internal dependencies - */ -import { COOKIE_NAME, MAX_COOKIE_AGE } from './constants'; - -function getViewCount() { - const cookies = cookie.parse( document.cookie ); - const value = cookies[ COOKIE_NAME ] || 0; - return +value; -} - -function setViewCount( value ) { - document.cookie = cookie.serialize( COOKIE_NAME, value, { - path: window.location.pathname, - maxAge: MAX_COOKIE_AGE, - } ); -} - -function incrementCookieValue() { - const repeatVisitorBlocks = Array.from( - document.querySelectorAll( '.wp-block-jetpack-repeat-visitor' ) - ); - if ( repeatVisitorBlocks.length === 0 ) { - return; - } - - setViewCount( getViewCount() + 1 ); -} - -window && window.addEventListener( 'load', incrementCookieValue ); |