diff --git a/assets/js/admin-autoshare-for-twitter-classic-editor.js b/assets/js/admin-autoshare-for-twitter-classic-editor.js index cb7843c3..cfb778d4 100644 --- a/assets/js/admin-autoshare-for-twitter-classic-editor.js +++ b/assets/js/admin-autoshare-for-twitter-classic-editor.js @@ -125,15 +125,41 @@ } /** - * Updates the counter + * Calculates the permalink length */ - function updateRemainingField() { + function getPermalinkLength() { let permalinkLength = 0; if ( $('#sample-permalink').length ) { - permalinkLength = $('#sample-permalink').text().length + if (adminAutoshareForTwitter.twitterURLLength) { + // according to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length + permalinkLength = adminAutoshareForTwitter.twitterURLLength; + } else { + // The #sample-permalink > a tag seems like the only convenient place to get the correct path for the post, + // without doing an AJAX call. We're using this technique to isolate the path (remove the ): + // https://stackoverflow.com/a/74517817 + let slug = $("#editable-post-name-full").text(); + + // get the hypothetical path + let aTagContents = $("#sample-permalink > a")[0].innerHTML; + let workingDiv = document.createElement("span"); + workingDiv.innerHTML = aTagContents; + let fakeSlugSpan = workingDiv.querySelector('span'); + workingDiv.removeChild(fakeSlugSpan); + let permalinkPrefix = workingDiv.innerText; + let permalink = permalinkPrefix + slug + '/'; + permalinkLength = permalink.length; + } } // +5 because of the space between body and URL and the ellipsis. permalinkLength += 5; + return permalinkLength; + } + + /** + * Updates the counter + */ + function updateRemainingField() { + const permalinkLength = getPermalinkLength(); var count = $tweetText.val().length + permalinkLength; $tweetText.attr('maxlength', limit - permalinkLength); diff --git a/autoshare-for-twitter.php b/autoshare-for-twitter.php index ca4fa110..0a8cf414 100644 --- a/autoshare-for-twitter.php +++ b/autoshare-for-twitter.php @@ -26,6 +26,7 @@ define( 'AUTOSHARE_FOR_TWITTER_URL', plugin_dir_url( __FILE__ ) ); define( 'AUTOSHARE_FOR_TWITTER_PATH', plugin_dir_path( __FILE__ ) ); define( 'AUTOSHARE_FOR_TWITTER_INC', AUTOSHARE_FOR_TWITTER_PATH . 'includes/' ); +define( 'AUTOSHARE_FOR_TWITTER_URL_LENGTH', 23 ); /** * Get the minimum version of PHP required by this plugin. diff --git a/includes/admin/assets.php b/includes/admin/assets.php index b2d1994c..ebaf9622 100644 --- a/includes/admin/assets.php +++ b/includes/admin/assets.php @@ -211,6 +211,7 @@ function localize_data( $handle = SCRIPT_HANDLE ) { 'tweetAccounts' => $tweet_accounts, 'tweetAccountsKey' => TWEET_ACCOUNTS_KEY, 'connectedAccounts' => $accounts ?? [], + 'twitterURLLength' => AUTOSHARE_FOR_TWITTER_URL_LENGTH, ]; wp_localize_script( $handle, 'adminAutoshareForTwitter', $localization ); diff --git a/includes/utils.php b/includes/utils.php index 7e465723..c469491a 100644 --- a/includes/utils.php +++ b/includes/utils.php @@ -214,7 +214,9 @@ function compose_tweet_body( \WP_Post $post ) { $url = apply_filters( 'autoshare_for_twitter_post_url', get_the_permalink( $post->ID ), $post ); $url = esc_url( $url ); - $body_max_length = 275 - strlen( $url ); // 275 instead of 280 because of the space between body and URL and the ellipsis. + // According to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length. + $url_length = AUTOSHARE_FOR_TWITTER_URL_LENGTH ? AUTOSHARE_FOR_TWITTER_URL_LENGTH : strlen( $url ); + $body_max_length = 275 - $url_length; // 275 instead of 280 because of the space between body and URL and the ellipsis. $tweet_body = sanitize_text_field( $tweet_body ); $tweet_body = html_entity_decode( $tweet_body, ENT_QUOTES, get_bloginfo( 'charset' ) ); $tweet_body_length = strlen( $tweet_body ); diff --git a/src/js/components/TweetTextField.js b/src/js/components/TweetTextField.js index a852ecef..9de6b8b4 100644 --- a/src/js/components/TweetTextField.js +++ b/src/js/components/TweetTextField.js @@ -3,10 +3,15 @@ import { useSelect } from '@wordpress/data'; import { __, sprintf } from '@wordpress/i18n'; import { useTweetText } from '../hooks'; import { useEffect, useState } from '@wordpress/element'; -const { siteUrl } = adminAutoshareForTwitter; +const { siteUrl, twitterURLLength } = adminAutoshareForTwitter; export function TweetTextField() { const getPermalinkLength = ( select ) => { + if ( twitterURLLength ) { + // according to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length + return twitterURLLength; + } + const permalink = select( 'core/editor' ).getPermalink(); if ( permalink ) {