☰

MAL counter for Profile and Blog

Adds counter while editing profile or blog that shows how many characters are left to the limit

  1. // ==UserScript==
  2. // @name        MAL counter for Profile and Blog
  3. // @namespace   MAL
  4. // @include     http://myanimelist.net/editprofile.php
  5. // @include     http://myanimelist.net/myblog.php*
  6. // @include     https://myanimelist.net/editprofile.php
  7. // @include     https://myanimelist.net/myblog.php*
  8. // @description Adds counter while editing profile or blog that shows how many characters are left to the limit
  9. // @version     1.0.2
  10. // ==/UserScript==
  11.  
  12. function xpath(query, object) {
  13.     if(!object) var object = document;
  14.     return document.evaluate(query, object, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
  15. }
  16.  
  17. var warningText = "Characters left: ";
  18. var charactersLimit = 65535;
  19. var noteText = "Please be aware that letters such as ä, ý, ø, û, ş etc. take 8 characters each. This counter does <u>not</u> take that into account, so the actual amount you have left may be lower";
  20.  
  21. var allElements = xpath("//textarea[@name='entry_text'][@class='textarea'] | " + "//textarea[@class='textarea'][@name='profile_aboutme']");
  22. if(allElements.snapshotLength > 0) {
  23.     textarea = allElements.snapshotItem(0);
  24.  
  25.     var div1 = document.createElement("div");
  26.     div1.style="margin: 0px; margin-top:10px; margin-bottom:5px";
  27.     div1.align ="Left";
  28.     div1.id = "characterLimit";
  29.     div1.textContent = warningText + (charactersLimit - textarea.value.length) + ". ";
  30.     div1.style.display = "block";
  31.  
  32.     textarea.parentNode.insertBefore(div1, textarea.nextSibling);
  33.     if (div1.nextSibling.tagName == "BR") {
  34.         div1.nextSibling.style.display = "none";
  35.     }
  36.  
  37.     textarea.addEventListener('keyup', function(e) {
  38.         div1.textContent = warningText + (charactersLimit - textarea.value.length) + ". ";
  39.     }, true);
  40.  
  41.     var span2 = document.createElement("span");
  42.     span2.id = "characterNote";
  43.     span2.textContent = "Note";
  44.     span2.style.color = "rgb(29, 67, 155)";
  45.     //span2.onmouseover = function(){span2.style.textDecoration = 'underline'};
  46.     //span2.onmouseout = function(){span2.style.textDecoration = ''};
  47.     div1.appendChild(span2);
  48.  
  49.     var span3 = document.createElement("span");
  50.     span3.id = "characterNoteTooltip";
  51.     span3.innerHTML = noteText;
  52.     span3.style.color = "black";
  53.     span2.appendChild(span3);
  54.     GM_addStyle("#characterNoteTooltip {display: none; background: #C8C8C8; padding: 5px; position: absolute; width: 420px; height: auto;}");
  55.     GM_addStyle("#characterNote:hover #characterNoteTooltip {display: block;}");
  56. }