Split text into multiple parts JavaScript

Question

I've adapted a PHP script lifted from another project to use in JavaScript, this script works great for shortening text to a set limit. I would like to use it to also split it to multiple parts if it is over the set limit.

The current code which shortens once is here: http://jsfiddle.net/WilliamIsted/P5jxK/

Here's what I have so far: http://jsfiddle.net/WilliamIsted/UkhXL/ (I'm pretty sure I'm not doing it right)

I have gotten stuck in loops a few to many times, I'm not sure how to proceed with it.

function strTruncate($string, $your_desired_width) {

    arr = [];

    if (typeof($last_part)) {
        $last_part = 0;
    }

    $parts = $string.split(/([\s\n\r]+)/);
    $parts_count = $parts.length;

    $length = 0;
    $last_part = 0;
    for (; $last_part < $parts_count; ++$last_part) {
        $length += $parts[$last_part].length;
        if ($length > $your_desired_width) {
            break;
        }
    }

    $start_part = 0;

    return $parts.slice($start_part, $last_part).join('');

}

Shorten Once Result:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer malesuada, est ut interdum ullamcorper, metus lorem interdum ipsum, vitae

New Expected Result:

array[0] = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer malesuada, est ut interdum ullamcorper, metus lorem interdum ipsum, vitae",
array[1] = "vulputate ante quam ut augue. Praesent sit amet varius lorem. Aliquam odio nunc, mattis in mollis vitae, laoreet non velit. Curabitur"
array[2] = "adipiscing, nisl tincidunt consequat ornare, ligula mauris sed."

Please post your code here, not on some unrelated page. An additional demo is nice, but the relevant code belongs to the question. — Bergi
– Bergi, Commented Nov 21, 2012 at 19:36
Please, replace all uses of .count() with .length. It hurts :-) — Bergi
– Bergi, Commented Nov 21, 2012 at 19:37
@Bergi Good call, I tried .length() before, obviously that didn't work. — William Isted
– William Isted, Commented Nov 21, 2012 at 19:40

Aleksandr Belkin · Accepted Answer · 2012-11-21 20:03:50Z

4

Your code is a bit messy, it can be rewritten to something like this

function strTruncate(string, width) { // your original function
    string = string.replace(/[\s\r\n]+/, ' ');
    if(string.length >= width) {
        return string[width-1] === ' ' ? string.substr(0, width - 1) : string.substr(0, string.substr(0, width).lastIndexOf(' '));
    }
    return string;
}
function strTruncateWhole(string, width) { // function that stores result(s) in array
    arr = [];
    string = string.replace(/[\s\r\n]+/, ' ');
    var b = 0;
    while(b < string.length) {
        arr.push(strTruncate(string.substring(b), width));
        b += arr[arr.length-1].length;
    }
    return arr;
}

answered Nov 21, 2012 at 20:03

Aleksandr Belkin

4425 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aerodynamika Over a year ago

This function is not so good as it sometimes splits words. A better one is stackoverflow.com/a/7624821/712347

nybbler · Accepted Answer · 2012-11-21 19:53:13Z

I believe what you're looking for is a script like this:

function strSplitOnLength(data, your_desired_width) {
    if(data.length <= 0)
        return [];  // return an empty array

    var splitData = data.split(/([\s\n\r]+)/);
    var arr = [];
    var cnt = 0;
    for (var i = 0; i < splitData.length; ++i) {
        if (!arr[cnt]) arr[cnt] = '';  //Instantiate array entry to empty string if null or undefined

        if (your_desired_width < (splitData[i].length + arr[cnt].length))
            cnt++;

        arr[cnt] += splitData[i];
    }

    return arr;
}

strSplitOnLength('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer malesuada, est ut interdum ullamcorper, metus lorem interdum ipsum, vitae vulputate ante quam ut augue. Praesent sit amet varius lorem. Aliquam odio nunc, mattis in mollis vitae, laoreet non velit. Curabitur adipiscing, nisl tincidunt consequat ornare, ligula mauris sed.', 140);

Bergi · Accepted Answer · 2012-11-21 19:53:41Z

1

Just go on with the loop. Instead of breaking and returning the parts from start to last only, splice them out of the array, reset your width count and push them on a result array.

Also notice that other than in PHP you need to declare all local variables with var; and also there is no boolean typeof function but a keyword that returns the string "undefined" (not sure what you wanted to do there anyway).

function strTruncate(str, maxWidth) { // not sure whether that's the best name
    var resultArr = [];
    var parts = str.split(/([\s\n\r]+)/);
    var count = parts.length;
    var width = 0;
    var start = 0;
    for (var i=0; i<count; ++i) {
        width += parts[i].length;
        if (width > maxWidth) {
            resultArr.push( parts.slice(start, i).join('') );
            start = i;
            width = 0;
        }
    }
    return resultArr;
}

edited Nov 21, 2012 at 19:53

answered Nov 21, 2012 at 19:45

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

2 Comments

nybbler Over a year ago

You're returning resultArr but never populating it

William Isted Over a year ago

This is great, but it's only returning 2 arrays, is it possible to return more?

dazzafact · Accepted Answer · 2022-04-24 17:00:10Z

0

var str='Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer malesuada, est ut interdum ullamcorper, metus lorem interdum ipsum, vitae.';
var parts=4
console.log(divideText(str,parts))

function divideText(text, parts) {
   var split=/[\s\n\r]/g
  return text.split(split).reduce((arr, el, i) => {
    const index = Math.floor(i * parts / text.split(split).length);
    arr[index] = arr[index] ? arr[index] + " " + el : el;
    return arr;
  }, []);
}

answered Apr 24, 2022 at 17:00

dazzafact

2,9043 gold badges35 silver badges51 bronze badges

Collectives™ on Stack Overflow

Split text into multiple parts JavaScript

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related