Divide text by letter count, but take care of splitted words - javascript

I have this function that divides given article by given letter count but it also split the words at the end of the lines, I would like to at hypen at the end of the line if the word is not completed/splitted.
var text = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.`
function divideTextByLetterCount(text, letterCount) {
let dividedText = "";
let currentLetterCount = 0;
for (let i = 0; i < text.length; i++) {
dividedText += text[i];
currentLetterCount++;
if (currentLetterCount === letterCount) {
if (dividedText.slice(-1) == ' ') {
dividedText = dividedText.slice(0, -1)
}
dividedText += "\n";
currentLetterCount = 0;
}
}
let dividedTextArr = dividedText.split('\n');
dividedTextArr.forEach((val, i) => {
if (val.slice(0, 1) == ' ') {
dividedTextArr[i] = val.slice(1);
}
});
return dividedTextArr.join('\n');
}
console.log(divideTextByLetterCount(text, 20));
So the output is,
Lorem Ipsum is simpl
y dummy text of the
printing and typeset
ting industry. Lorem
Ipsum has been the
industry's standard
dummy text ever sinc
e the 1500s, when an
unknown printer too
k a galley of type a
nd scrambled it to m
ake a type specimen
book. It has survive
d not only five cent
uries, but also the
leap into electronic
typesetting, remain
ing essentially unch
anged. It was popula
rised in the 1960s w
ith the release of L
etraset sheets conta
ining Lorem Ipsum pa
ssages, and more rec
ently with desktop p
ublishing software l
ike Aldus PageMaker
including versions o
f Lorem Ipsum.
But it should add hypen at the end of the lines which ends with uncompleted words like, simpl must be simpl- or sinc must be sinc-, how do I create that logic? thanks.

A much quicker and readable approach that also accomplishes the functionality you're looking for would be to use a regular expression. Match up to 20 characters, and put an optional capture group for a single non-space character in lookahead after the last character. If the capture group captures anything, you're in the middle of a word, and can add a -.
const text = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.`
function divideTextByLetterCount(text, letterCount) {
const pattern = new RegExp(`.{0,${letterCount}}(?=(\\S)?)`, 'g');
return text
.replace(
pattern,
(match, nextChar) => match.trim() + (!match.endsWith(' ') && nextChar ? '-' : '') + '\n'
);
}
console.log(divideTextByLetterCount(text, 20));
Example with 50 instead of 20:
const text = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.`
function divideTextByLetterCount(text, letterCount) {
const pattern = new RegExp(`.{0,${letterCount}}(?=(\\S)?)`, 'g');
return text
.replace(
pattern,
(match, nextChar) => match.trim() + (!match.endsWith(' ') && nextChar ? '-' : '') + '\n'
);
}
console.log(divideTextByLetterCount(text, 50));

Related

PHP wordwrap array to Javascript returns in error

I'm getting a console error when running the follow code:
<?php
$str = "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.";
$str = wordwrap($str,30,'\n');
?>
document.write('test' + '\n');
document.write( '<?php echo $str;?>' + '\n' );
</script>
Console error: Uncaught SyntaxError: missing ) after argument list.
Where is the problem?
As #u_mulder noted you must escape quote sign ' as:
<?php
$str = "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.";
$str = str_replace("'", "\'", wordwrap($str,30,'\n'));
?>
<script>
document.write('test' + '\n');
document.write( '<?php echo $str;?>' + '\n' );
</script>
Look PHP fiddle

Add linebreak after specific character in jquery/js

I have string, for example
var string = 'This is my string. Lorem ipsum. Lorem ipsum.'.
This text, however, may be different.
My question is how, using JavaScript/jQuery, could I make a new line after every dot in this string so that each sentence starts in a new line ?
Thanks for help.
string.split(".").join(".\n")
Probably.
Using regex:
var string = 'This is my string. Lorem ipsum. Lorem ipsum.'
console.log(string.replace(/\./g, '.\n'))
var string = 'This is my string. Lorem ipsum. Lorem ipsum.';
string.split(".").join("<br>");
this what you mean ?

Complicated split of string

I have a group of similarly structured strings that I'm trying to break up into separate pieces via JavaScript.
Sample string:
Jr. Kevin Hooks, Irene Cara, Moses Gunn, Robert Hooks, Ernestine Jackson, José Feliciano. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ullamcorper sodales nulla id hendrerit.
Ideal output:
[
"Jr. Kevin Hooks","Irene Cara",…
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
ullamcorper sodales nulla id hendrerit."
]
My first thought was to do a split at '. ' to separate the names from the block of text towards the end, then split the group of names at ', ', but because some names are like 'Jr. Kevin Hooks' and the block of text also contains '. ' that approach fails. Using ', ' as the key also fails because the block of text contains ', '.
Any suggestions on how to accomplish this?
Many thanks!
If we can assume that:
There is no text coming before the first name occurrence
A point in a name only occurs at the end of a word of at most 3 letters
If the last occurring name ends with such an abbreviation, then it still needs to be followed by a point to end the list (e.g. "Abram Lincoln, John Johnsen Jr.. Lorem ipsum dolor"), as otherwise there is no way to know whether the next word belongs to the name or not.
Then you could use this regular expression:
/([a-z]{1,3}\.|[^\s,.]+)(\s+([a-z]{1,3}\.|[^\s,.]+))*(?=[,.])|\..*$/ig
var text = 'Jr. Kevin Hooks, Irene Cara, Moses Gunn, Robert Hooks, Ernestine Jackson, José Feliciano. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ullamcorper sodales nulla id hendrerit.'
var result = text.match(/([a-z]{1,3}\.|[^\s,.]+)(\s+([a-z]{1,3}\.|[^\s,.]+))*(?=[,.])|\..*$/ig);
// Optionally remove the point at the start of the last match:
if (result) result.push(result.pop().replace(/^\.\s*/, ''));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Explanation:
[a-z]{1,3}\. matches one to three Latin characters, followed by a point
[^\s,.]+) matches one to many characters that are not white-space, comma or point
( | ): either must match: the above two patterns are combined in this way, meaning that a word in a name must be either up to three Latin letters followed by a point, or any number of non white-space, not including comma nor point.
(\s+([a-z]{1,3}\.|[^\s,.]+))*: optionally (*) allow for more words like that: match one or more white spaces, and repeat the pattern as at the start.
(?=[,.]) that series of words must end with a comma or a point, which is not grabbed (look ahead only): by not grabbing the point, we know for sure that the pattern at the start cannot match anymore, and that is when the next pattern will do the job:
\..*$ matches a literal point and then any characters up to the end of the string ($)
The point preceding the final text block is also included in the last match, so you may want to remove it separately (see snippet).

Javascript regular expression to extract text from string

Let's say I have the following string:
[lorem]{lorem;ipsum;solor;sit;amet}[ipsum]<i>Lorem</i> ipsum <b>dolor</b> sit amet
What I want is an object that contains the following:
{lorem: "{lorem;ipsum;solor;sit;amet}", ipsum: "<i>Lorem</i> ipsum <b>dolor</b> sit amet"}
How would my regular expression look? Is there any way to get the inverse of this?
/\[\w+\]/g
Thanks...
Instead of creating the inverse of /\[\w+\]/g, just use .split():
var string = '[lorem]{lorem;ipsum;solor;sit;amet}[ipsum]<i>Lorem</i> ipsum <b>dolor</b> sit amet'
console.log(string.split(/\[\w+\]/));
Demo

Find specific word from paragraph

I am finding a specific word from a paragraph and want to make it bold. I have done below code but it's not working.
var text = /Lorem/ig;
$('div')
.filter(function() {
return text.test($(this).text())
}).wrap('<strong></strong>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing
software like Aldus PageMaker including versions of Lorem Ipsum.</div>
Fiddle Demo
There is lil' plugin created by elclanrs
$.fn.wrapInTag = function(opts) {
var tag = opts.tag || 'strong'
, words = opts.words || []
, regex = RegExp(words.join('|'), 'gi') // case insensitive
, replacement = '<'+ tag +'>Lorem</'+ tag +'>';
return this.html(function() {
return $(this).text().replace(regex, replacement);
});};
// Usage
$('div').wrapInTag({
tag: 'strong',
words: ['Lorem'] //can be comma seprated like ['Lorem','ipsum']
});
Working Demo
You can use regex backreference:
var text=new RegExp('(Lorem)','ig');
$('div').html($('div').html().replace(text, "<strong>$1</strong>"));

Categories

Resources