Kita-Yen_4chan.user.js

   1 // ==UserScript==
   2 // @name Kita-Yen 4Chan
   3 // @description Add kita to your post with ctr+"k" and Yen with ctr+"\"
   4 // @version 2.3
   5 // @match *://boards.4chan.org/*
   6 // @grant none
   7 // @namespace https://greasyfork.org/users/125336
   8 // @updateURL    https://github.com/ECHibiki/4chan-UserScripts/raw/master/Kita-Yen_4chan.user.js
   9 // @downloadURL  https://github.com/ECHibiki/4chan-UserScripts/raw/master/Kita-Yen_4chan.user.js
  10
  11 // ==/UserScript==
  12
  13
  14
  15
  16
  17 //injection
  18 colorCharacters(document.body);
  19 addStyle();
  20
  21 new MutationObserver(function(mutations){
  22         //send a MutationRecord for each mutation
  23     mutations.forEach(function(mutation){
  24                 //For this mutation record access the addedNode property and call a function on it.
  25                 /* forEach passes on the element, index and array insance       */
  26         mutation.addedNodes.forEach(colorCharacters);
  27     });
  28 }).observe(document.body, {childList: true, subtree: true});
  29
  30
  31
  32
  33 //insertion logic
  34 function colorCharacters(root){
  35     if(root.nodeType !== Node.ELEMENT_NODE){
  36         return;
  37     }
  38
  39     var nodes = Array.from(root.getElementsByClassName('postMessage'));
  40     if(root.classList.contains('postmessage')){
  41                 //insert above nodes, the root.
  42         nodes.unshift(root);
  43     }
  44
  45     nodes.forEach(function(node){
  46         if(node.textContent.indexOf('\xa5') <= -1 && node.textContent.indexOf("ｷﾀ━━━(ﾟ∀ﾟ)━━━!!") <= -1){
  47             return;
  48         }
  49         var txtItterator = document.createNodeIterator(node, NodeFilter.SHOW_TEXT);
  50         var text_node;
  51         while((text_node = txtItterator.nextNode())){
  52                         //disregard text inside of A tag links and already colored text
  53                         if(text_node.parentNode.tagName == "A" || /the_[a-z]_word/g.test(text_node.parentNode.className)) continue;
  54                         setColor(text_node, txtItterator);
  55         }
  56     });
  57 }
  58
  59 //give color to text inside of nodes.
  60 // first scan for yen symbols and then check the front of the text for not nested kita.
  61 function setColor(text_node, txtItterator){
  62         var start_text_node = text_node;
  63
  64         var yen_node = searchYen(text_node);
  65         if(yen_node != false){
  66                 //jump to internal node
  67                 text_node = txtItterator.nextNode();
  68                 //scan for nested kita
  69                 do{
  70                         var result = searchKita(text_node);
  71                         if(result != false){
  72                                 //jump foreward to point after kita inserted
  73                                 text_node = txtItterator.nextNode();
  74                                 text_node = txtItterator.nextNode();
  75                         }
  76                 }while(result != false);
  77         }
  78
  79         //scan for outside kita from start
  80         do{
  81                 var result = searchKita(start_text_node);
  82                 start_text_node = result.nextSibling;
  83         }while(result != false && start_text_node !== undefined);
  84
  85 }
  86
  87 //find the location of a yen, split the text from above that position, create a span element and place split into this span.
  88 //Then take the initial text node and insert into it from after the text node.
  89 function searchYen (text_node){
  90     var yenIndex = text_node.textContent.indexOf('\xa5');
  91     if(yenIndex > -1){
  92         var splitNode = text_node.splitText(yenIndex);
  93
  94         var span = document.createElement('span');
  95         span.className = "the_m_word";
  96
  97         span.appendChild(splitNode);
  98         text_node.parentNode.insertBefore(span, text_node.nextSibling);
  99
 100         return span;
 101     }
 102     return false;
 103 };
 104
 105 //find the location of a kita, isolate it by splitting from the point where the kita ends and the point where it begins.
 106 //Now that there are 3 text nodes, take the middle one from the start position index split, add the text which goes to the point of the rightmost split,
 107 //then refer back to the parent and place it after the leftmost string.
 108 function searchKita (text_node){
 109     var kIndex = text_node.textContent.indexOf("ｷﾀ━━━(ﾟ∀ﾟ)━━━!!");
 110     if(kIndex > -1){
 111         var far_split_note =  text_node.splitText(kIndex + "ｷﾀ━━━(ﾟ∀ﾟ)━━━!!".length);
 112         var splitNode = text_node.splitText(kIndex);
 113
 114         var span = document.createElement('span');
 115         span.className = "the_k_word";
 116
 117         span.appendChild(splitNode);
 118         text_node.parentNode.insertBefore(span, text_node.nextSibling);
 119         return span;
 120     }
 121     return false;
 122 };
 123
 124 //color styling
 125 function addStyle(){
 126     var style = document.createElement("STYLE");
 127     style.innerHTML = ".the_m_word{color:#9370DB} \n.the_k_word{color:#555555}";
 128     document.head.appendChild(style);
 129 };
 130
 131 //hotkeys for kita and yen
 132 var listener_obj = {};
 133 window.addEventListener("keydown", function(e){
 134     listener_obj[e.keyCode] = true;
 135
 136     var node = document.activeElement;
 137     if (listener_obj[17] && listener_obj[75]){
 138         e.preventDefault();
 139         insertAtPos(node, 'ｷﾀ━━━(ﾟ∀ﾟ)━━━!!');
 140     }
 141     if (listener_obj[17] && listener_obj[220]){
 142         e.preventDefault();
 143         insertAtPos(node, '\xa5');
 144     }
 145 }, {passive:false, capture:false, once:false});
 146
 147 window.addEventListener("keyup", function(e){
 148     listener_obj[e.keyCode] = false;
 149 }, {passive:false, capture:false, once:false});
 150
 151 function insertAtPos(node, buzzwords){
 152     var sel_start = node.selectionStart;
 153     var sel_end = node.selectionEnd;
 154
 155     n_tc = node.value;
 156     node.value = n_tc.substr(0, sel_start) + buzzwords + n_tc.substr(sel_end);
 157
 158         node.selectionStart = sel_start + buzzwords.length;
 159         node.selectionEnd = sel_end + buzzwords.length;
 160 };
 161
 162