CODEWITHSUNDEEP
javascript
anas
anas

Reputation: 175

How to insert line break after every 80 characters

I have a very long string.

I want to append <br/> after every 80 characters so it can displayed nicely in the inner HTML.

Is there any easy way?

Upvotes: 17

Views: 18593

Answers (6)

Oritm
Oritm

Reputation: 2121

TypeScript variant of jahroy answer:

export class FrameworkUtil {

    public static foldText(text: string, charCount: number, buildArray: string[] = []) {
        if (text.length <= charCount) {
            buildArray.push(text);
            return buildArray;
        }
        let line = text.substring(0, charCount);
        const lastSpaceRgx = /\s(?!.*\s)/;
        const idx = line.search(lastSpaceRgx);
        let nextIdx = charCount;
        if (idx > 0) {
            line = line.substring(0, idx);
            nextIdx = idx;
        }
        buildArray.push(line);
        return FrameworkUtil.foldText(text.substring(nextIdx), charCount, buildArray);
    }
}

Upvotes: 0

slartidan
slartidan

Reputation: 21586

If you want a fast solution, you can use this algorithm:

function textFold(input, lineSize) {
  const output = []
  let outputCharCount = 0
  let outputCharsInCurrentLine = 0
  for (var i = 0; i < input.length; i++) {
    const inputChar = input[i]
    output[outputCharCount++] = inputChar
    if (inputChar === '\n') {
      outputCharsInCurrentLine = 0
    } else if (outputCharsInCurrentLine > lineSize-2) {
      output[outputCharCount++] = '\n'
      outputCharsInCurrentLine = 0
    } else {
      outputCharsInCurrentLine++
    }
  }
  return output.join('')
}

document.getElementsByTagName('pre')[0].innerHTML = textFold('0123456789abcdefghijklmnopqrstuvwxyz', 10)
<pre></pre>

Input:

0123456789abcdefghijklmnopqrstuvwxyz

Output:

0123456789
abcdefghij
klmnopqrst
uvwxyz

Upvotes: 0

jahroy
jahroy

Reputation: 22692

Here's the academic edition (it's also faster than regex):

function fold(input, lineSize, lineArray) {
    lineArray = lineArray || [];
    if (input.length <= lineSize) {
        lineArray.push(input);
        return lineArray;
    }
    lineArray.push(input.substring(0, lineSize));
    var tail = input.substring(lineSize);
    return fold(tail, lineSize, lineArray);
}

Usage: 

var arrayOfLines = fold(longString, 80);
var foldedString = arrayOfLines.join('<br/>');

Another thing that's cool about this approach: you can easily wrap at whitespace.

Here's a fiddle that does that.

Upvotes: 13

tckmn
tckmn

Reputation: 59283

Try something like:

yourString = yourString.replace(/(.{1,80})/g, '$1<br/>')

You could also just set the width of the containing element of the text to be 80em. (it won't fit exactly 80 characters since an em is the width of the letter m, so you might want to set it a bit lower)

Upvotes: 4

Arun Killu
Arun Killu

Reputation: 14233

replace 0,1 with 0,80 and join('is') with '<br />'

console.log("google is very fast".match(new RegExp(".{0,1}", "g")).join('is'));

Upvotes: 1

chris-l
chris-l

Reputation: 2841

Do it with long_string.replace(/(.{80})/g, "$1<br>");

Check it here: http://jsfiddle.net/x2YJp/

Upvotes: 18

Related Questions