about word counter

First topic message reminder :

About this code:
https://help.forumotion.com/t131882-just-one-last-change-at-the-word-counter#885030

Code:

  $(function(){$(function(){

               var MinNumberOfChars = 50;
               var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
               var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";  
          
          if($("#text_editor_textarea").length != 0){
                  $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");      
                  $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");
                  
                  var sceditor = $("#text_editor_textarea").sceditor("instance");                
                  var str = sceditor.val().replace(/ |\n|\s+|\[img\].*?\[\/img\]|\[.*?\]|\[\/.*?\]|:.*?:/gi,'');
                  var str_len = str.length;
                  
                  if(str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
                  
                  sceditor.keyUp(function(e) {
                     str = sceditor.val().replace(/ |\n|\s+|\[img\].*?\[\/img\]|\[.*?\]|\[\/.*?\]|:.*?:/gi,'');
                     str_len = str.length;
                     if(str_len >= MinNumberOfChars) {
                        $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl  + "' />");  
                    $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
                     }else{
                        $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl  + "' />");
                        $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
                     }
                  });
               }
            })});

the code works fine. but ...
It doesn't work when i copy/paste any text (of course more than 50 characters) without pressing any key on the keyboard.

After searching in Google, I tested this ...
sceditor.on('keyup change', function(e){
instead of
sceditor.keyUp(function(e) {

But it doesn't work too. Any ideas?

I think this is going the be the closest I can get it.

Code:

 $(function(){$(function(){

            var MinNumberOfChars = 50;
            var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
            var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if($("#text_editor_textarea").length != 0){
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
                $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");
 
                var sceditor = $("#text_editor_textarea").sceditor("instance");
                var str = sceditor.val().replace(/ |\n|\s+|\[img\].*?\[\/img\]|\[.*?\]|\[\/.*?\]|:.*?:/gi,'');
                var str_len = str.length;
 
                if(str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
 
                $('.sceditor-container iframe').contents().on('input', function() { getLen() });
                $('.sceditor-container textarea').on('input', function() { getLen() });
                sceditor.keyUp(function() { getLen() });
            }
            function getLen() {
              str = sceditor.val().replace(/\n/g,' ').replace(/(\[quote=".*?"\]|\[quote\]).*?\[\/quote\]/gi,'').replace(/.*?(?=\[\/quote\])/gi,'').replace(/(:.*?:|\W)/gi,'');
                  str_len = str.length;
                  if(str_len >= MinNumberOfChars) {
                      $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl  + "' />");
                  $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
                  }else{
                      $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl  + "' />");
                      $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
                  }
            }
          })});

This one doesn't work at all, even with the default multiquote mode (without any text).

Ahmed.K wrote:
Finally, Ange, the code now understand the multiquote system in the default mode (without any text) like this:

Code:

[quote="Admin"][quote="User"][quote="User1"][/quote][/quote][/quote]

but still there one problem.
the code works well and doesn't count the text in the first quote, like this (text1):

Code:

[quote="Admin"][quote="User"][quote="User1"]   text1   [/quote][/quote][/quote]

but it count the text in the second and third quote, like this (text2 and text3):

Code:

[quote="Admin"][quote="User"][quote="User1"]   text1   [/quote]   text2   [/quote]   text3   [/quote]

@Ahmed.K
Hello!

This is only an issue of regex pattern where to eliminate all bbcode and html tags should be like this:
</?[a-z][a-z0-9]*[^\[\]]*>|\[/?[a-z][a-z0-9]*[^\[\]]*\]

Test with the code below:

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
            // var str = sceditor.val().replace(/ |\n|\s+|\[img\].*?\[\/img\]|\[.*?\]|\[\/.*?\]|:.*?:/gi, '');
         var str = $('.sceditor-container iframe').contents().find('body').text();
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
            str = sceditor.val().replace(/\n/g, '').replace(/<\/?[a-z][a-z0-9]*[^\[\]]*>|\[\/?[a-z][a-z0-9]*[^\[\]]*\]/gi, '');
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


See others patterns:

Delete repeated words:
Find any word that occurs twice or more in a row. Delete all occurrences except the first.
\b(\w+)(?:\s+\1\b)+

Duplicate lines:
This regex matches two or more lines, each identical to the first line.
^(.*)(\r?\n\1)+$

Delete blank lines:
Regex match includes line break after the line.
^[ \t]*$\r?\n

JS

Hello JScript. No, doesn't work, still the same problem...
the code doesn't understand the multiquote system.
It count the text in this quote, example (text1 - text2 - text3):

Code:

[quote="Admin"][quote="User"][quote="User1"]   text1   [/quote]   text2   [/quote]   text3   [/quote]

@Ahmed.K
Hello, I'm sorry but I got it wrong!

So you do not really want to anything quote or multiquote be "captured" and interpreted as character, is it?

In this case I will change the regex, do some tests and then post the result here ok?

---

Edit:

Test this other code:

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
         var str = sceditor.val().replace(/^[ \t]*$\r?\n|\[\/?[^.]*\]/gi, '');
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
         str = sceditor.val().replace(/^[ \t]*$\r?\n|\[\/?[^.]*\]/gi, '');
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


JS

JScript wrote:So you do not really want to anything quote or multiquote be "captured" and interpreted as character, is it?

Yes!

Still doesn't work. here is an example, doesn't work with this quote, try it:

Spoiler:

Ok, try this other;

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
         str = sceditor.val().replace(/^[ \t]*$\r?\n|^[ \t]+|[ \t]+$|\b(\w+)(?:\s+\1\b)+|\[\/?[^*]*\]/img, "$1");
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
         str = sceditor.val().replace(/^[ \t]*$\r?\n|^[ \t]+|[ \t]+$|\b(\w+)(?:\s+\1\b)+|\[\/?[^*]*\]/img, "$1");
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


JS

Good work, JScript. It works good now with the multiquote system.

But there is one problem with your code (it was working fine with the Ange code)...
It counting spaces and these characters #, $ , . , ! , ...
I want just count Letters and numbers and in english not any language else.

O...k...a...y..., no problem!!!

Try this other:

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
         str = sceditor.val().replace(/^[ \t]*$\r?\n|\[\/?[^*]*\]|\b(\w+)(?:\s+\1\b)+|(:.*?:|\W)/img, "$1");
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
         str = sceditor.val().replace(/^[ \t]*$\r?\n|\[\/?[^*]*\]|\b(\w+)(?:\s+\1\b)+|(:.*?:|\W)/img, "$1");
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


JS

It works great now!

Thanks JScript!

Thanks Ange!

There is still a problem with the code...
It doesn't count such post, don't know why.

Code:


[size=18][b][u]text[/u][/b][/size]

[img]http://img560.imageshack.us/img560/7411/togaii.png[/img]

[img]http://s26.postimg.org/hygj21xo5/Disaster_Area.png[/img]

@Ahmed.K

Okay, then let's continue!

I'll do some tests with a new regex and I post the result as soon as possible ok?

JS

Ok. Waiting for the solution.

Ahmed.K wrote:Ok. Waiting for the solution.

Try this:

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
         str = sceditor.val().replace(/\[quote.*[^]+\[\/quote\]|(:.*?:|\W)/ig, "");
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
         str = sceditor.val().replace(/\[quote.*[^]+\[\/quote\]|(:.*?:|\W)/ig, "");
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


JS

There is a problem with another example...

When you write this:

Code:

[code] . [/code]

It says "You've written 8 character(s).", I think it counting the "code" word.
code + code = 8 characters

@Ahmed.K
Wow, I'm sorry friend because I forgot to add the other regex!!!

Try this now:

Code:


$(function() {
    $(function() {

        var MinNumberOfChars = 50;
        var ico_compl = "http://i73.servimg.com/u/f73/18/10/89/49/ok-gre10.png";
        var ico_incompl = "http://i73.servimg.com/u/f73/18/10/89/49/exclam10.png";

        if ($("#text_editor_textarea").length != 0) {
            $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            $(".sceditor-container").after("<br/><div id='div_minchars' align='center'><div id='div_minchars_header'> Minimum characters to send a message: " + MinNumberOfChars + " </div><div id='div_minchars_info'></div></div>");

            var sceditor = $("#text_editor_textarea").sceditor("instance");
         str = sceditor.val().replace(/\[quote.*[^]+\[\/quote\]|\[\/?[a-z][a-z0-9]*[^\[\]]*\]|(:.*?:|\W)/ig, "");
            var str_len = str.length;

            if (str_len >= MinNumberOfChars) $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");

            $('.sceditor-container iframe').contents().on('input', function() {
                getLen()
            });
            $('.sceditor-container textarea').on('input', function() {
                getLen()
            });
            sceditor.keyUp(function() {
                getLen()
            });
        }

        function getLen() {
         str = sceditor.val().replace(/\[quote.*[^]+\[\/quote\]|\[\/?[a-z][a-z0-9]*[^\[\]]*\]|(:.*?:|\W)/ig, "");
            str_len = str.length;
            if (str_len >= MinNumberOfChars) {
                $("#div_minchars_info").html("You've written <span style='color:green'>" + str_len + "</span> character(s). You can now send the message <img src='" + ico_compl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", false).css("opacity", "1");
            } else {
                $("#div_minchars_info").html("You've written <span style='color:red'>" + str_len + "</span> character(s). You need " + (MinNumberOfChars - str_len) + " character(s) to send this message <img src='" + ico_incompl + "' />");
                $("input[type='submit'][name='post']").attr("disabled", true).css("opacity", "0.5");
            }
        }
    })
});


See:


JS

JScript, is there detect for the live changes?

Because when MinNumberOfChars = 3;
And i write, for example "Hi JScript"... you can now send the message and the "Send" button is enabled, right? Ok. now when i add with this text a quote, like this:

Code:

[quote]Hi JScript[/quote]

I see the "Send" button is still enabled, and i should make refresh to disable the "Send" button because i have now a quote message.

@Ahmed.K
Hello!

I'm still testing another regex ok?

JS

Ok, JScript.

Ahmed.K wrote:Ok, JScript.

I'm just facing a unique problem: Detect when you manually enter the same content as the quote tag.

The code is still in testing ok?

JS

Ok, JScript.