fix modal scrolling issue and html input validations

This commit is contained in:
Evan Mullins 2021-03-23 16:52:31 -04:00
parent 6a7c40555b
commit 24ab13d16a
3 changed files with 119 additions and 54 deletions

View file

@ -771,12 +771,11 @@ function wasmo_user_profile_set_og_image( $image ) {
/**
* Replace links in text with html links
*
* @param string $text
* @return string
* @param string $text Text to add links to
* @return string Text with links added
*/
function auto_link_text( $text )
{
// $pattern = '#\b(([\w-]+://?|www[.])[^\s()<>]+(?:\([\w\d]+\)|([^[:punct:]\s]|/)))#';
$pattern = "#\b((?:https?:(?:/{1,3}|[a-z0-9%])|[a-z0-9.\-]+[.](?:com|net|org|edu|gov|mil|aero|asia|biz|cat|coop|info|int|jobs|mobi|museum|name|post|pro|tel|travel|xxx|ac|ad|ae|af|ag|ai|al|am|an|ao|aq|ar|as|at|au|aw|ax|az|ba|bb|bd|be|bf|bg|bh|bi|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|cr|cs|cu|cv|cx|cy|cz|dd|de|dj|dk|dm|do|dz|ec|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gg|gh|gi|gl|gm|gn|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|im|in|io|iq|ir|is|it|je|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|me|mg|mh|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|mv|mw|mx|my|mz|na|nc|ne|nf|ng|ni|nl|no|np|nr|nu|nz|om|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|ps|pt|pw|py|qa|re|ro|rs|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|Ja|sk|sl|sm|sn|so|sr|ss|st|su|sv|sx|sy|sz|tc|td|tf|tg|th|tj|tk|tl|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)/)(?:[^\s()<>{}\[\]]+|\([^\s()]*?\([^\s()]+\)[^\s()]*?\)|\([^\s]+?\))+(?:\([^\s()]*?\([^\s()]+\)[^\s()]*?\)|\([^\s]+?\)|[^\s`!()\[\]{};:'.,<>?«»“”‘’])|(?:(?<!@)[a-z0-9]+(?:[.\-][a-z0-9]+)*[.](?:com|net|org|edu|gov|mil|aero|asia|biz|cat|coop|info|int|jobs|mobi|museum|name|post|pro|tel|travel|xxx|ac|ad|ae|af|ag|ai|al|am|an|ao|aq|ar|as|at|au|aw|ax|az|ba|bb|bd|be|bf|bg|bh|bi|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|cr|cs|cu|cv|cx|cy|cz|dd|de|dj|dk|dm|do|dz|ec|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gg|gh|gi|gl|gm|gn|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|im|in|io|iq|ir|is|it|je|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|me|mg|mh|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|mv|mw|mx|my|mz|na|nc|ne|nf|ng|ni|nl|no|np|nr|nu|nz|om|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|ps|pt|pw|py|qa|re|ro|rs|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|Ja|sk|sl|sm|sn|so|sr|ss|st|su|sv|sx|sy|sz|tc|td|tf|tg|th|tj|tk|tl|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)\b/?(?!@)))#";
return preg_replace_callback( $pattern, function( $matches ) {
$url = array_shift( $matches );
@ -798,6 +797,7 @@ function auto_link_text($text)
$text = substr( $text, 0, $last ) . "&hellip;";
}
// update
return sprintf(
'<a rel="nowfollow" target="_blank" href="%s">%s</a>',
$url,
@ -806,10 +806,32 @@ function auto_link_text($text)
}, $text );
}
// Function to check string starting
// with given substring
/**
* Check strings for starting match
*
* @param string $string String to check.
* @param string $startString Startin string to match.
* @return boolean Wether string begins with startString.
*/
function startsWith( $string, $startString )
{
$len = strlen($startString);
return (substr($string, 0, $len) === $startString);
}
function wasmo_before_signup() {
?>
<div class="site-content entry">
<div class="entry-content">
<h1>Register</h1>
<p>Choose a username (lowercase letters and numbers only) and enter your email address.</p>
<?php
}
add_action( 'before_signup_form', 'wasmo_before_signup', 10 );
function wasmo_after_signup() {
echo '</div></div>';
}
add_action( 'after_signup_form', 'wasmo_after_signup', 10 );

View file

@ -7,12 +7,32 @@ jQuery(document).ready(function($) {
e.preventDefault();
// open login modal
$('.lwa-links-modal').trigger('click');
$('.lwa-form').show();
$('.lwa-register').hide();
$('.lwa-links-register-inline-cancel').show();
}
$('.register').on('click', function(e){
e.preventDefault();
console.log('register link clicked');
// open register modal
$('.lwa-links-register').trigger('click');
$('.lwa-links-modal').trigger('click');
$('.lwa-form').hide();
$('.lwa-register').show();
$('.lwa-links-register-inline-cancel').hide();
// $('.lwa-links-register').trigger('click');
} );
// html validation for register form - give better hints on error too.
$('.lwa-modal #user_login').attr({
pattern: '[a-z0-9.]{4,}',
title: 'Only lowercase letters and numbers. Minimum 4 characters.',
required: true
});
$('.lwa-modal #user_email').attr({
type: 'email',
required: true
})
});

View file

@ -5,7 +5,7 @@
Author: Evan Mullins
Author URI: https://circlecube.com
Template: twentynineteen
Version: 1.9.6
Version: 1.9.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wasmo
@ -630,26 +630,30 @@ cite span {
/* footer widget / lwa modal */
.lwa-modal {
left: 50%;
max-width: 500px;
margin-left: 0;
min-width: 350px;
padding: 10px 30px;
position: fixed;
margin: 50px auto 0;
max-width: 94%;
transform: translate(-50%, 0);
width: 50%;
}
@media only screen and (max-width: 767px) {
.lwa-modal {
top: 0 !important;
.lwa-modal tr,
.lwa-default tr {
display: flex;
flex-direction: column;
width: 100%;
}
.lwa-modal input[type="submit"],
.lwa-default input[type="submit"] {
margin-bottom: 1.5rem;
}
.lwa-modal .lwa-modal-close {
font-size: 40px;
right: 16px;
}
.lwa-modal br {
display: none;
.lwa-modal .lwa-status {
line-height: 1.2em;
}
.lwa-modal .lwa-links-register-inline-cancel,
.lwa-modal .lwa-links-remember-cancel {
display: block;
}
.lwa-register-tip {
font-size: 0.75em;
@ -679,6 +683,18 @@ cite span {
color: var(--color-white);
}
.lwa-links,
.lwa-submit-links {
display: flex;
flex-direction: column-reverse;
}
.lwa-links input,
.lwa-links label,
.lwa-submit-links input,
.lwa-submit-links label {
display: none;
}
.the-questions {
margin-top: 0;
}
@ -773,3 +789,10 @@ cite span {
#acf-form .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 2.4rem;
}
.entry-content .mu_register {
width: 100%;
}
.entry-content .mu_register h2 {
font-size: 24px;
}