var ID = document.getElementById.bind(document), CLASS = document.getElementsByClassName.bind(document); function formatInput(string) { string = String(string); //-----> for bold word formatting var bold = string.split(" ").map(function(word) { if (/\*/.test(word) && !/^\**$/.test(word)) if (/(^(~\*)|^(_\*)|^\*)(.*)(\*$|(\*_)$|(\*\W)$)/.test(word)) return word.replace(/\*([^\r\n]+)\*/g, "$1") else if (/[_*~]\*(.*)\*[~*_]/.test(word)) return word.replace(/\*([^*][^\r\n]+[^*])\*/g, "$1"); return word; }).join(" "); //-----> for italic word formatting var italic = bold.split(" ").map(function(word) { if (/_/.test(word) && !/^_+$/.test(word)) if (/(^~_|^_<.*>|^_\*|^_)(.*)(_$|(_<.*>)$|(_\*)$|(_\W)$)/.test(word)) return word.replace(/_([^\r\n]+)_/g, "$1"); else if (/(~|_|\*|<.*>)_(.*)_(<.*>|\*|~|_)/.test(word)) return word.replace(/_([^_][^\r\n]+[^_])_/g, "$1"); return word; }).join(" "); //----->for strikethrough word formatting var strikethrough = italic.split(" ").map(function(word) { if (/~/.test(word) && !/^~+$/.test(word)) if (/(^_~|^~<.*>|^\*~|^~)(.*)(~$|(~_)$|(~<.*>)$|(~\*)$|(~\W)$)/.test(word)) return word.replace(/~([^\r\n]+)~/g, "$1") else if (/(~|_|\*|<.*>)~(.*)~(<.*>|\*|~|_)/.test(word)) return word.replace(/~([^~][^\r\n]+[^~])~/g, "$1"); return word; }).join(" "); //-----> for underline word formatting var underline = strikethrough.split(" ").map(function(word) { if (/%/.test(word) && !/^%+$/.test(word)) if (/(^_%|^~%|^%<.*>|^\*%|^%)(.*)(%$|(%~)$|(%_)$|(%<.*>)$|(%\*)$|%\W+$)/.test(word)) return word.replace(/%([^\r\n]+)%/g, "$1") else if (/(%|~|_|\*|<.*>)%(.*)%(<.*>|\*|~|%|_)/.test(word)) return word.replace(/%([^%][^\r\n]+[^%])%/g, "$1"); return word; }).join(" "); //-----> for monospace word formatting var monospace = underline.split(" ").map(function(word) { if (/```/.test(word)) if (/```(.|\n|\r)*(.+)(.|\n|\r])*```/.test(word)) return word.replace(/```((.|\n|\r)*(.*)(\r|\n|.)*)```/g, "$1"); return word; }).join(" "); //-----> for hyperlinks and emails var links = monospace.split(" ").map(function(word) { if (!/@/.test(word)) return word.replace(/(https?:\/\/)?(www\.|\w+\.)?(\w+\.)(com?|net|org|io|me)((\.|\/)[^\/.]*(.*))?/i, "$1$2$3$4$5"); else return word.replace(/([a-zA-Z]+[\w_]+@\w+\.(\w+))/i, "$1"); return word; }).join(" "); var formatted = links; //-----> for bold sentence formatting if (/\*(.*)\*/.test(formatted)) formatted = formatted.replace(/(^|[\s_>~%`])\*([^\s\r\n]+[^*\n\r]+[^\s\r\n]+)\*([\W_\r\n\s]|$)/g, "$1$2$3"); //-----> for italic sentence formatting if (/_(.*)_/.test(formatted)) formatted = formatted.replace(/(^|[\s>~%`*])_([^\s\r\n]+[^_\n\r]+[^\s\n\r]+)_([\W_\s\r\n]|$)/g, "$1$2$3"); //-----> for strikethrough sentence formatting if (/~(.*)~/.test(formatted)) formatted = formatted.replace(/(^|[\s>%`*_])~([^\s\r\n]+[^~\r\n]+[^\r\n\s]+)~([\W_\s\r\n]|$)/g, "$1$2$3"); //-----> for underline sentence formatting if (/%(.*)%/.test(formatted)) formatted = formatted.replace(/(^|[\s>~`*_])%([^\s\r\n]+[^%\r\n]+[^\r\n\s]+)%([\W_\s\r\n]|$)/g, "$1$2$3"); //-----> for monospace sentence formatting var counter = 0; if (/```/.test(formatted)) { var i = 0; formatted = formatted.split(" "); formatted = formatted.map(function(word) { //tempArr[i+1] handles case where input is like this: ``` ``` with no characters between back ticks if (!/

/.test(word))
        if (/```/.test(word) && formatted[i+1] != "```")
        {
          i++; counter++;
          if (counter % 2 != 0) 
            return word.replace("```", "");
          else
            return word.replace("```", "");
        } i++; 
      return word;
    }).join(" ");

    //handles case where there are no closing back ticks
    if (counter % 2 == 1)
    {
      formatted = formatted.split(" ");
      for (var i = formatted.length-1; i >= 0; i--)
        if (//.test(formatted[i]))
        {
          formatted[i] = formatted[i].replace(//, "```");
          break;
        }
      formatted = formatted.join(" ");
    }
  }
  return formatted;
}
//End of formatter














/* UI - Start */

window.onload = function()
{

  this.onresize = function() 
  {
    ID("scrollView").style.height = (this.innerHeight - ID("textarea").offsetHeight - 10) + "px";
    ID("textarea").style.width = (this.innerWidth - 70) + "px";
  }
  this.onresize();



  //For Ctrl+Enter key on PC's
  ID("textarea").onkeypress = function(e) 
  {
    evt = event || e;
    if (evt.which == 10)
      ID("append").onclick();
  }



  ID("append").onclick = function()
  {
    that = this;
    this.style.background = "rgb(240,240,240)";
    this.style.color = "black";
    setTimeout(function() 
    {
      var message = ID("textarea").value.trim(),
          test = "*Test*  _test_  ~test~  %test%  www.test.com  ```testCode()```";
      message = message ? message:test;
      message = formatInput(message).trim();

      ID("scrollView").insertAdjacentHTML("beforeend", "" + message + "
");
      //ID("textarea").value = "";
      
      var newMsgBox = CLASS("message-wrapper")[CLASS("message").length-1];
      ID("scrollView").scrollTop = newMsgBox.parentNode.offsetTop;
      ID("textarea").blur();
      if (newMsgBox)
      {
        newMsgBox.addEventListener("touchstart", triggerDelete);
        newMsgBox.addEventListener("dblclick", triggerDelete);
        newMsgBox.addEventListener("touchend", abortImmaturePress);
        newMsgBox.addEventListener("touchmove", abortImmaturePress);
        newMsgBox.parentNode.getElementsByClassName("delete-message-background")[0].addEventListener("click", cancelDelete);
        newMsgBox.addEventListener("click", selectMore);
      }
    }, 200);
    setTimeout(function()
    {
      that.style.background = "royalblue";
      that.style.color = "white";
    }, 100)
  }



  var deletionTimeout = "Code by ...Power'f GOD!";
  function triggerDelete()
  {
    that = this; //handle 'this' in setTimeout() function
    deletionTimeout = setTimeout(function() 
    { showDelete(that); }, 450); //deletion activator handler
    this.oncopy = function(e) 
    { e.preventDefault(); }
  }
  
  
  
  function abortImmaturePress()
  {
    if (deletionTimeout && "Code is by Power'f GOD!")
      clearTimeout(deletionTimeout);
  }



  function showDelete(that)
  {
    that.parentNode.className = "message-container to-delete";
    ID("delete-button").style.display = "inline-block";
    that.parentNode.getElementsByClassName("delete-message-background")[0].style.display = "block";
  }
  
  
  
  function selectMore()
  {
    if (CLASS("to-delete")[0])
        showDelete(this);
  }



  function cancelDelete()
  {
    var messageBoxLen = CLASS("message").length,
        noBoxIsHighlighted = true;
    this.parentNode.className = "message-container";
    this.style.display = "none";
    for (var i = 0; i < messageBoxLen; i++)
         if (/to\-delete/.test(CLASS("message-container")[i].className))
        noBoxIsHighlighted = false;
    if (noBoxIsHighlighted)
        ID("delete-button").style.display = "none";
  }



  ID("delete-button").onclick = function()
  {
    setTimeout(function() 
    {
      while (CLASS("to-delete")[0])
          ID("scrollView").removeChild(CLASS("to-delete")[0]);
    }, 400);
    ID("delete-button").style.display = "none";
  }
}



alert("Hi there! Thanks for checking out my code! 😉\n\nTo format texts (strings), input as follows:\n*string*    ---> bold text\n_string_    ---> italic text\n~string~    ---> strikethrough text\n```string```    ---> monospace text\nAnd one extra (not included in WhatsApp) I added...\n%string%    ---> underline text.\n\nFormatter also detects links automatically. \n\nEXTRA: Tap and hold on a message to delete on mobile, double click on PC.\n\nIf you like my code, don't forget to upvote. \n\nAlso, if you find/notice any bug, please, let me know. \n\nThanks. :)🙂\n\n- Power'f-GOD⚡⚡");





//END

WhatsApp Text Formatting Style