src/character-inserter.ts

   1 class CharacterInserter extends FeatureInterface{
   2
   3         use_kita:boolean;
   4         use_yen:boolean;
   5
   6                 kita_character:string = "ｷﾀ━━━(ﾟ∀ﾟ)━━━!!";
   7 kita_hash_color:string = "#444444"
   8                 yen_character:string = "¥";
   9 yen_hash_color:string = "#9370DB";
  10         constructor(use_kita:boolean, use_yen:boolean){
  11                 super();
  12                 this.use_yen = use_yen;
  13                 this.use_kita = use_kita;
  14
  15                 this.retrieveStates();
  16                 this.init();
  17                 this.activate();
  18         }
  19
  20         init():void{
  21                 this.addStyle();
  22                 this.hotkeyListeners();
  23         }
  24         activate():void{
  25                 console.log("4F-FSE: CharacterInserter Active - " + (this.use_kita ? "Character Coloring+" : "") + (this.use_yen ?" Line Coloring" : ""));
  26         }
  27         decideAction(node:any):void{
  28                 if(node.tagName == "BLOCKQUOTE")
  29                         this.colorCharacters(node);
  30         }
  31         retrieveStates():void{
  32 if (localStorage.getItem("Yen_Character") === undefined || localStorage.getItem("Yen_Character") === null) this.yen_character = "¥";
  33 else this.yen_character = localStorage.getItem("Yen_Character");
  34         if (localStorage.getItem("Yen_Color") === undefined || localStorage.getItem("Yen_Color")  === null) this.yen_hash_color = "#9370DB";
  35 else this.yen_hash_color = localStorage.getItem("Yen_Color");
  36         if (localStorage.getItem("Kita_Character") === undefined || localStorage.getItem("Kita_Character") === null) this.kita_character = "ｷﾀ━━━(ﾟ∀ﾟ)━━━!!";
  37 else this.kita_character = localStorage.getItem("Kita_Character");
  38         if (localStorage.getItem("Kita_Color") === undefined || localStorage.getItem("Kita_Color") === null)this.kita_hash_color = "#444444";
  39 else this.kita_hash_color = localStorage.getItem("Kita_Color");
  40
  41         }
  42         storeStates(...items:any[]):void{}
  43
  44
  45         //color styling
  46         addStyle():void{
  47                 var style = document.createElement("STYLE");
  48                 style.innerHTML = ".the_m_word{color:" + this.yen_hash_color + "} \n.the_k_word{color:" + this.kita_hash_color + "}";
  49                 document.head.appendChild(style);
  50         }
  51
  52         //hotkeys for kita and yen
  53          hotkeyListeners():void{
  54                 var listener_obj = {};
  55
  56                 window.addEventListener("keydown", (e)=>{
  57                         listener_obj[e.keyCode] = true;
  58
  59                         var node = document.activeElement;
  60                         if ((listener_obj[17] || listener_obj[91]) && listener_obj[75]){
  61                                 e.preventDefault();
  62                                 this.insertAtPos(node, this.kita_character);
  63                         }
  64                         if ((listener_obj[17] || listener_obj[91]) && listener_obj[220]){
  65                                 e.preventDefault();
  66                                 this.insertAtPos(node, this.yen_character);
  67                         }
  68                 }, {passive:false, capture:false, once:false});
  69
  70                 window.addEventListener("keyup", (e) => {
  71                         listener_obj[e.keyCode] = false;
  72                 }, {passive:false, capture:false, once:false});
  73         }
  74
  75         insertAtPos(node, buzzwords):void{
  76                 var sel_start = node.selectionStart;
  77                 var sel_end = node.selectionEnd;
  78
  79                 var node_text = node.value;
  80                 node.value = node_text.substr(0, sel_start) + buzzwords + node_text.substr(sel_end);
  81
  82                 node.selectionStart = sel_start + buzzwords.length;
  83                 node.selectionEnd = sel_end + buzzwords.length;
  84         }
  85
  86 //insertion logic
  87         colorCharacters(root){
  88                 if(root.nodeType !== Node.ELEMENT_NODE){
  89                         return;
  90                 }
  91
  92                         if(root.textContent.indexOf(this.yen_character) <= -1 && root.textContent.indexOf(this.kita_character) <= -1){
  93                                 return;
  94                         }
  95                         var txtItterator = document.createNodeIterator(root, NodeFilter.SHOW_TEXT);
  96                         var text_node;
  97                         while((text_node = txtItterator.nextNode())){
  98                                 //disregard text inside of A tag links and already colored text
  99                                 if(text_node.parentNode.tagName == "A" || /the_[a-z]_word/g.test(text_node.parentNode.className)) continue;
 100                                 this.setColor(text_node, txtItterator);
 101                         }
 102         }
 103
 104         //give color to text inside of nodes.
 105         // first scan for yen symbols and then check the front of the text for not nested kita.
 106         setColor(text_node, txtItterator):void{
 107                 var start_text_node = text_node;
 108                 var result;
 109                 var yen_node:boolean = this.use_kita ? this.searchYen(text_node) : false;
 110                 if(yen_node != false){
 111                         //jump to internal node
 112                         text_node = txtItterator.nextNode();
 113                         //scan for nested kita
 114                         do{
 115                                 result = this.use_kita ? this.searchKita(text_node) : false;
 116                                 if(result != false){
 117                                         //jump foreward to point after kita inserted
 118                                         text_node = txtItterator.nextNode();
 119                                         text_node = txtItterator.nextNode();
 120                                 }
 121                         } while(result != false);
 122                 }
 123                 //scan for outside kita from start
 124                 do{
 125                         result = this.use_kita ? this.searchKita(start_text_node) : false;
 126                         start_text_node = result.nextSibling;
 127                 }while(result != false && start_text_node !== undefined);
 128
 129         }
 130
 131         //find the location of a yen, split the text from above that position, create a span element and place split into this span.
 132         //Then take the initial text node and insert into it from after the text node.
 133         searchYen (text_node):any{
 134                 var yenIndex = text_node.textContent.indexOf(this.yen_character);
 135                 if(yenIndex > -1){
 136                         var splitNode = text_node.splitText(yenIndex);
 137
 138                         var span = document.createElement('span');
 139                         span.className = "the_m_word";
 140
 141                         span.appendChild(splitNode);
 142                         text_node.parentNode.insertBefore(span, text_node.nextSibling);
 143
 144                         return span;
 145                 }
 146                 return false;
 147         }
 148
 149         //find the location of a kita, isolate it by splitting from the point where the kita ends and the point where it begins.
 150         //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,
 151         //then refer back to the parent and place it after the leftmost string.
 152         searchKita (text_node):any{
 153                 var kIndex = text_node.textContent.indexOf(this.kita_character);
 154                 if(kIndex > -1){
 155                         var far_split_note =  text_node.splitText(kIndex + this.kita_character.length);
 156                         var splitNode = text_node.splitText(kIndex);
 157
 158                         var span = document.createElement('span');
 159                         span.className = "the_k_word";
 160
 161                         span.appendChild(splitNode);
 162                         text_node.parentNode.insertBefore(span, text_node.nextSibling);
 163                         return span;
 164                 }
 165                 return false;
 166         }
 167 }