Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Tadjiev Codes
Tadjiev Codes
9,626 Points

How to set the characters limit in JavaScript?

How to set the characters limit in JavaScript?

// Global variable containing our string
        var myNextChar = "The nefarious thing about performance bugs is that the user may never know they are there - the program appears to work correctly, carrying out the correct operations, showing the right thing on the screen or printing the right text. It just does it a bit more slowly than it should have. It takes an experienced programmer, with a reasonably accurate mental model of the problem and the correct solution, to know how fast the operation should have been performed, and hence if the program is running slower than it should be";

        // event handler will be called when the user clicks the button
        function printString() {

            // "flag" variable is used to determine when loop will stop
            // "dummy" and "count" are used to simulate processing work
            var done = false;
            //var count = 0;
            var lx = 0;

            // the inner function is used to simulate the "while" loop

            function innerLoop() {

                //var myNextChar = "The nefarious thing about performance bugs is that the user may never know they are there - the program appears to work correctly, carrying out the correct operations, showing the right thing on the screen or printing the right text. It just does it a bit more slowly than it should have. It takes an experienced programmer, with a reasonably accurate mental model of the problem and the correct solution, to know how fast the operation should have been performed, and hence if the program is running slower than it should be";

                // document.getElementById("outDiv").innerHTML += myNextChar;

                /*
                var wordIndex = 0;
                var letterIndex = 0;
                var word = myNextChar[wordIndex];

                var letter = word.charAt(letterIndex);
                */
                // why does this work?
                // we're able to use the "setTimeout" to recursively call
                // innerLoop every 5 milliseconds
                // while the JavaScript system is waiting the 5 ms, it will
                // process all UI events

                var result = document.getElementById("outDiv");

                document.getElementById("outDiv").innerHTML += myNextChar[lx++];
                //result = '';

                /*
                if (myNextChar.length >= 100) {
                    document.getElementById("outDiv").innerHTML += "\n";
                }
                   */

                if (lx >= myNextChar.length) done = true;


                /*

                if (myNextChar.charAt(99) == true) {
                    result += '\n';
                }


                if (myNextChar.length > 100) {
                    result += myNextChar.substring(0, 100) + '\n';
                    myNextChar = myNextChar.substring(100);
                }

                 */



                if (!done)
                    setTimeout(innerLoop, 10);




                //var newStr = myNextChar.replace(/.{100}/g, "$0\n")






                //Break the string after every 200 characters, add a newline, and repeat this process with the remaining string:
                /*
                function addNewlines(str) {
                    result = '';
                    while (str.length > 0) {
                        result += str.substring(0, 100) + '\n';
                        str = str.substring(100);
                    }
                    return result;
                }
*/




            }

            // this starts the "loop" running by
            // calling innerLoop the first time

            //setTimeout(innerLoop, 10);
            innerLoop();

        }


        var result = document.getElementById("outDiv");



        function addNewlines(str) {
            result = '';
            while (str.length > 0) {
                result += str.substring(0, 100) + '\n';
                str = str.substring(100);
            }
            return result;
        }

        addNewlines(myNextChar);
    </script>
</head>

<body>

    <input type="button" id="btnPrint" value="Print" onclick="printString();" />

    <div id="outDiv"></div>

</body>

</html>

I can't understand how to let it start from the new line when it reaches the 100 characters. I tried many ways, but this thing doesn't seem to work.
What am I doing wrong? Thanks in advance folks