Skip to content

Commit

Permalink
Tag generator v2 logic
Browse files Browse the repository at this point in the history 
rocklobster-in#1464
  • Loading branch information
@takayukister
takayukister committed Aug 10, 2024
1 parent 10bdf49 commit 6023194
Show file tree
Hide file tree
Showing 3 changed files with 137 additions and 31 deletions.
2 changes: 1 addition & 1 deletion admin/includes/js/index.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

101 changes: 101 additions & 0 deletions admin/includes/js/src/tag-generator-v2.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,105 @@
const init = form => {
update( form );

form.querySelectorAll(
'.control-box'
).forEach( box => {
box.addEventListener( 'change', event => {
update( form );
} );
} );
};


const update = form => {
form.querySelectorAll(
'.tag'
).forEach( tag => {
tag.value = compose( form );
} );
};


const compose = form => {
const basetype = form.querySelector(
'[data-tag-part="basetype"]'
)?.value.trim();

if ( ! basetype ) {
return;
}

const scope = form;

let type = basetype;

const typeSuffixField = scope.querySelector(
'[data-tag-part="type-suffix"]'
);

if ( typeSuffixField ) {
if ( [ 'checkbox', 'radio' ].includes( typeSuffixField?.type ) ) {
type += typeSuffixField.checked ? typeSuffixField.value.trim() : '';
} else {
type += typeSuffixField.value.trim();
}
}

const nameField = scope.querySelector( '[data-tag-part="name"]' );

let name = nameField?.value.trim() ?? '';

if ( nameField ) {
name ||= `${ basetype }-${ Math.floor( Math.random() * 1000 ) }`;
nameField.value = name;
}

const options = [];

scope.querySelectorAll(
'[data-tag-part="option"]'
).forEach( field => {
const tagOption = field.dataset.tagOption?.trim();

if ( ! tagOption ) {
return;
}

if ( [ 'checkbox', 'radio' ].includes( field?.type ) && ! field.checked ) {
return;
}

if ( 'class:' === tagOption ) {
field.value?.split( ' ' ).forEach( classTerm => {
classTerm = classTerm.trim();

if ( classTerm ) {
options.push( tagOption + classTerm );
}
} );
} else if ( tagOption.endsWith( ':' ) ) {
let val = field.value?.trim();

if ( val ) {
options.push( tagOption + val );
}
} else {
options.push( tagOption );
}
} );

const values = scope.querySelector( '[data-tag-part="value"]' )?.value
.split( "\n" ).map( line => line.trim() ).filter( line => '' !== line )
.map( line => `"${ line.replace( /["]/g, '"' ) }"` ) ?? [];

const composed = [
type,
name,
options.join( ' ' ),
values.join( ' ' ),
].map( item => item.trim() ).filter( item => '' !== item );

return `[${ composed.join( ' ' ) }]`;
};


Expand Down
65 changes: 35 additions & 30 deletions modules/text.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -218,79 +218,84 @@ function wpcf7_add_tag_generator_text() {
foreach ( $basetypes as $id => $title ) {
$tag_generator->add( $id, $title,
'wpcf7_tag_generator_text',
array( 'version' => '1' )
array( 'version' => '2' )
);
}
}

function wpcf7_tag_generator_text( $contact_form, $args = '' ) {
$args = wp_parse_args( $args, array() );
$type = $args['id'];
function wpcf7_tag_generator_text( $contact_form, $options ) {
$basetype = $options['id'];
$tg_key = $options['content'];

if ( ! in_array( $type, array( 'email', 'url', 'tel' ) ) ) {
$type = 'text';
if ( ! in_array( $basetype, array( 'email', 'url', 'tel' ) ) ) {
$basetype = 'text';
}

if ( 'text' == $type ) {
if ( 'text' === $basetype ) {
$description = __( "Generate a form-tag for a single-line plain text input field. For more details, see %s.", 'contact-form-7' );
} elseif ( 'email' == $type ) {
} elseif ( 'email' === $basetype ) {
$description = __( "Generate a form-tag for a single-line email address input field. For more details, see %s.", 'contact-form-7' );
} elseif ( 'url' == $type ) {
} elseif ( 'url' === $basetype ) {
$description = __( "Generate a form-tag for a single-line URL input field. For more details, see %s.", 'contact-form-7' );
} elseif ( 'tel' == $type ) {
} elseif ( 'tel' === $basetype ) {
$description = __( "Generate a form-tag for a single-line telephone number input field. For more details, see %s.", 'contact-form-7' );
}

$desc_link = wpcf7_link( __( 'https://contactform7.com/text-fields/', 'contact-form-7' ), __( 'Text fields', 'contact-form-7' ) );
$desc_link = wpcf7_link(
__( 'https://contactform7.com/text-fields/', 'contact-form-7' ),
__( 'Text fields', 'contact-form-7' )
);

?>
<div class="control-box">
<fieldset>
<legend><?php echo sprintf( esc_html( $description ), $desc_link ); ?></legend>

<input type="hidden" data-tag-part="basetype" value="<?php echo esc_attr( $basetype ); ?>" />

<table class="form-table">
<tbody>
<tr>
<th scope="row"><?php echo esc_html( __( 'Field type', 'contact-form-7' ) ); ?></th>
<td>
<fieldset>
<legend class="screen-reader-text"><?php echo esc_html( __( 'Field type', 'contact-form-7' ) ); ?></legend>
<label><input type="checkbox" name="required" /> <?php echo esc_html( __( 'Required field', 'contact-form-7' ) ); ?></label>
<label><input type="checkbox" name="required" data-tag-part="type-suffix" value="*" /> <?php echo esc_html( __( 'Required field', 'contact-form-7' ) ); ?></label>
</fieldset>
</td>
</tr>

<tr>
<th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-name' ); ?>"><?php echo esc_html( __( 'Name', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="name" class="tg-name oneline" id="<?php echo esc_attr( $args['content'] . '-name' ); ?>" /></td>
<th scope="row"><label for="<?php echo esc_attr( $tg_key . '-name' ); ?>"><?php echo esc_html( __( 'Name', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="name" class="tg-name oneline" id="<?php echo esc_attr( $tg_key . '-name' ); ?>" data-tag-part="name" /></td>
</tr>

<tr>
<th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-values' ); ?>"><?php echo esc_html( __( 'Default value', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="values" class="oneline" id="<?php echo esc_attr( $args['content'] . '-values' ); ?>" /><br />
<label><input type="checkbox" name="placeholder" class="option" /> <?php echo esc_html( __( 'Use this text as the placeholder of the field', 'contact-form-7' ) ); ?></label></td>
<th scope="row"><label for="<?php echo esc_attr( $tg_key . '-values' ); ?>"><?php echo esc_html( __( 'Default value', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="values" class="oneline" id="<?php echo esc_attr( $tg_key . '-values' ); ?>" data-tag-part="value" /><br />
<label><input type="checkbox" name="placeholder" class="option" data-tag-part="option" data-tag-option="placeholder" /> <?php echo esc_html( __( 'Use this text as the placeholder of the field', 'contact-form-7' ) ); ?></label></td>
</tr>

<?php if ( in_array( $type, array( 'text', 'email', 'url' ) ) ) : ?>
<?php if ( in_array( $basetype, array( 'text', 'email', 'url' ) ) ) : ?>
<tr>
<th scope="row"><?php echo esc_html( __( 'Akismet', 'contact-form-7' ) ); ?></th>
<td>
<fieldset>
<legend class="screen-reader-text"><?php echo esc_html( __( 'Akismet', 'contact-form-7' ) ); ?></legend>

<?php if ( 'text' == $type ) : ?>
<?php if ( 'text' === $basetype ) : ?>
<label>
<input type="checkbox" name="akismet:author" class="option" />
<input type="checkbox" name="akismet:author" class="option" data-tag-part="option" data-tag-option="akismet:author" />
<?php echo esc_html( __( "This field requires author's name", 'contact-form-7' ) ); ?>
</label>
<?php elseif ( 'email' == $type ) : ?>
<?php elseif ( 'email' === $basetype ) : ?>
<label>
<input type="checkbox" name="akismet:author_email" class="option" />
<input type="checkbox" name="akismet:author_email" class="option" data-tag-part="option" data-tag-option="akismet:author_email" />
<?php echo esc_html( __( "This field requires author's email address", 'contact-form-7' ) ); ?>
</label>
<?php elseif ( 'url' == $type ) : ?>
<?php elseif ( 'url' === $basetype ) : ?>
<label>
<input type="checkbox" name="akismet:author_url" class="option" />
<input type="checkbox" name="akismet:author_url" class="option" data-tag-part="option" data-tag-option="akismet:author_url" />
<?php echo esc_html( __( "This field requires author's URL", 'contact-form-7' ) ); ?>
</label>
<?php endif; ?>
Expand All @@ -301,13 +306,13 @@ function wpcf7_tag_generator_text( $contact_form, $args = '' ) {
<?php endif; ?>

<tr>
<th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-id' ); ?>"><?php echo esc_html( __( 'Id attribute', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="id" class="idvalue oneline option" id="<?php echo esc_attr( $args['content'] . '-id' ); ?>" /></td>
<th scope="row"><label for="<?php echo esc_attr( $tg_key . '-id' ); ?>"><?php echo esc_html( __( 'Id attribute', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="id" class="idvalue oneline option" id="<?php echo esc_attr( $tg_key . '-id' ); ?>" data-tag-part="option" data-tag-option="id:" /></td>
</tr>

<tr>
<th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-class' ); ?>"><?php echo esc_html( __( 'Class attribute', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="class" class="classvalue oneline option" id="<?php echo esc_attr( $args['content'] . '-class' ); ?>" /></td>
<th scope="row"><label for="<?php echo esc_attr( $tg_key . '-class' ); ?>"><?php echo esc_html( __( 'Class attribute', 'contact-form-7' ) ); ?></label></th>
<td><input type="text" name="class" class="classvalue oneline option" id="<?php echo esc_attr( $tg_key . '-class' ); ?>" data-tag-part="option" data-tag-option="class:" /></td>
</tr>

</tbody>
Expand All @@ -316,15 +321,15 @@ function wpcf7_tag_generator_text( $contact_form, $args = '' ) {
</div>

<div class="insert-box">
<input type="text" name="<?php echo $type; ?>" class="tag code" readonly="readonly" onfocus="this.select()" />
<input type="text" name="<?php echo $basetype; ?>" class="tag code" readonly="readonly" onfocus="this.select()" />

<div class="submitbox">
<input type="button" class="button button-primary insert-tag" value="<?php echo esc_attr( __( 'Insert Tag', 'contact-form-7' ) ); ?>" />
</div>

<br class="clear" />

<p class="description mail-tag"><label for="<?php echo esc_attr( $args['content'] . '-mailtag' ); ?>"><?php echo sprintf( esc_html( __( "To use the value input through this field in a mail field, you need to insert the corresponding mail-tag (%s) into the field on the Mail tab.", 'contact-form-7' ) ), '<strong><span class="mail-tag"></span></strong>' ); ?><input type="text" class="mail-tag code hidden" readonly="readonly" id="<?php echo esc_attr( $args['content'] . '-mailtag' ); ?>" /></label></p>
<p class="description mail-tag"><label for="<?php echo esc_attr( $tg_key . '-mailtag' ); ?>"><?php echo sprintf( esc_html( __( "To use the value input through this field in a mail field, you need to insert the corresponding mail-tag (%s) into the field on the Mail tab.", 'contact-form-7' ) ), '<strong><span class="mail-tag"></span></strong>' ); ?><input type="text" class="mail-tag code hidden" readonly="readonly" id="<?php echo esc_attr( $tg_key . '-mailtag' ); ?>" /></label></p>
</div>
<?php
}

0 comments on commit 6023194

Please sign in to comment.