src/settings-window.ts

   1 class SettingsWindow  extends FeatureInterface{
   2         background_div:any = document.createElement('DIV');
   3         settings_div:any = document.createElement('DIV');
   4         close_div:any = document.createElement('DIV');
   5         contents_div = document.createElement('DIV');
   6         ul_selection_start:any = document.createElement('UL');
   7
   8         close_link:any = document.createElement('A');
   9         title_para:any = document.createElement('P');
  10         title_text:any = document.createTextNode('4F-FSE Settings');
  11         end_para:any = document.createElement('P');
  12         end_text:any = document.createTextNode('Refresh to view changes');
  13
  14         settings_style:any = document.createElement('STYLE');
  15
  16                 //to change order change, this AND...*
  17         list_items:any[] =
  18         [
  19                 {Text : " | View 『Image Hiding』 Settings", ListenerFunc :                               (a_id) => {
  20                         this.clearContainer();
  21                         (<Element>this.contents_div).innerHTML =
  22                                 `
  23                                 <div id="disposable_container">
  24                                                                  <label>Non-MD5 Expiration Time(hours): </label>
  25                                                                  <input id="Expiration_Time">
  26                                                                  <hr>
  27                                                                  <label>MD5 Filters:</label>
  28                                                                  <br>
  29                                                                  <textarea style="width:98%;height:217px" placeholder="Enter MD5 like on 4chanX...
  30                                                                 /abc123/
  31                                                                 /def890/" id="MD5_List_FSE"></textarea>
  32                                                                 <hr>
  33                                 </div>
  34                                 `;
  35                                 (<HTMLInputElement>document.getElementById("Expiration_Time")).value = "" + (this.setting_items.image_hiding_settings.Expiration_Time / Constants.MILLISECONDS_TO_THE_HOUR);
  36                                 (<HTMLInputElement>document.getElementById("MD5_List_FSE")).value = this.setting_items.image_hiding_settings.MD5_List_FSE;
  37                                 var set_button = document.createElement('INPUT');
  38                                 document.getElementById("disposable_container").appendChild(set_button);
  39                                 set_button.setAttribute('VALUE', "Set Image Settings");
  40                                 set_button.addEventListener("click", (evt) => {
  41                                         this.storeStates();
  42                                         this.clearContainer();
  43                                         this.rebuildContainer();
  44                                 });
  45                                 set_button.setAttribute('TYPE', 'button');
  46                         }
  47
  48                                                                                                                                                                                 },
  49                 {Text : " | View 『Word Replacement』 Settings", ListenerFunc :                   (a_id) => {
  50                         this.clearContainer();
  51
  52                         var disposable_container:any = document.createElement("DIV");
  53                         disposable_container.setAttribute("ID", "disposable_container");
  54                         this.contents_div.appendChild(disposable_container);
  55                         this.filterWindow(disposable_container);
  56                         this.filterSetTable();
  57                 }
  58                                                                                                                                                                                 },
  59                 {Text : " | View 『Danbooru Image Adder』 Settings", ListenerFunc :               (a_id) => {
  60                         this.clearContainer();
  61
  62                         var disposable_container:Element = document.createElement("DIV");
  63                         disposable_container.setAttribute("id", "disposable_container");
  64                         this.contents_div.appendChild(disposable_container);
  65                         disposable_container.innerHTML = `
  66                         <table style="text-align:center;margin-left:5px">
  67                                 <tr>
  68                                         <td>
  69                                                 <label>Very Large: </label>
  70                                         </td>
  71                                         <td>
  72                                                 <input id="v_large_DIA" name="preivew-size" style="display:inline" type="radio">
  73                                         </td>
  74                                 </tr>
  75                                 <tr>
  76                                         <td>
  77                                                 <label>Large: </label>
  78                                         </td>
  79                                         <td>
  80                                                 <input id="large_DIA" name="preivew-size" style="display:inline" type="radio">
  81                                         </td>
  82                                 </tr>
  83                                 <tr>
  84                                         <td>
  85                                                 <label>Medium: </label>
  86                                         </td>
  87                                         <td>
  88                                                 <input id="medium_DIA" name="preivew-size" style="display:inline" type="radio">
  89                                         </td>
  90                                 </tr>
  91                                 <tr>
  92                                         <td>
  93                                                 <label>Very Large: </label>
  94                                         </td>
  95                                         <td>
  96                                                 <input id="small_DIA" name="preivew-size" style="display:inline" type="radio">
  97                                         </td>
  98                                 </tr>
  99                                 <tr>
 100                                         <td>
 101                                                 <label>Width: </label>
 102                                         </td>
 103                                         <td>
 104                                                 <input id="width_DIA" name="preivew-size" style="width:20%"  type="text">
 105                                         </td>
 106                                 </tr>
 107                                 <tr>
 108                                         <td>
 109                                                 <label>Height: </label>
 110                                         </td>
 111                                         <td>
 112                                                 <input id="height_DIA" name="preivew-size" style="width:20%"  type="text">
 113                                         </td>
 114                                 </tr>
 115                         </table>
 116
 117                         <hr>
 118
 119                         <label>Quick Reply Min Width: </label>
 120                         <input id="qr_width_DIA" name="preivew-size" style="width:20%" type="text">
 121
 122                         <hr>
 123
 124                         <input id="SetImageAdderProperties" value="Set Preview Size" type="button">
 125                         `;
 126                 this.setImageAdderFields();
 127                 this.setImageAdderEventListeners();
 128                 }
 129                                                                                                                                                                                 },
 130                 {Text : " | View 『Thread Rebuilder』 Settings", ListenerFunc :                   (a_id) => {
 131                         this.clearContainer();
 132
 133                         var disposable_container = document.createElement("DIV");
 134                         disposable_container.setAttribute("id", "disposable_container");
 135                         this.contents_div.appendChild(disposable_container);
 136                         disposable_container.innerHTML =
 137                         `
 138                                 <label>Use 4chan Archives: </label>
 139                                 <input name="ArchiveSettings" id="OnsiteArchive" type="radio">
 140                                 <br>
 141                                 <label>Use Offsite Archives: </label>
 142                                 <input name="ArchiveSettings" id="OffsiteArchive" type="radio">
 143                                 <br>
 144                                 <input id="setArchive" value="Set Archive" type="button">
 145                         `;
 146
 147                         (document.getElementById("setArchive")).addEventListener("click", () => {
 148                                 this.storeStates();
 149                                 this.clearContainer();
 150                                 this.rebuildContainer();
 151                         });
 152                         if(this.setting_items.thread_rebuild_settings.Archive_Type === "0") (<HTMLInputElement>document.getElementById("OffsiteArchive")).checked = true;
 153                         else if(this.setting_items.thread_rebuild_settings.Archive_Type === "1") (<HTMLInputElement>document.getElementById("OnsiteArchive")).checked = true;
 154         }
 155                                                                                                                                                                                 },
 156                 {Text : " | View 『¥ Text』 Settings [Customizable]", ListenerFunc :      (a_id) => {
 157                         this.clearContainer();
 158
 159                         var disposable_container = document.createElement("DIV");
 160                         disposable_container.setAttribute("id", "disposable_container");
 161                         this.contents_div.appendChild(disposable_container);
 162                         disposable_container.innerHTML =
 163                         `
 164                                 <label>¥Quote Character: </label>
 165                                 <input name="quoteCharacter" id="quoteCharacter" type="text" value="¥">
 166                                 <br>
 167                                 <label>RGB Hex Color: </label>
 168                                 <input name="HexColorYen" id="HexColorYen_text" type="text">
 169                                 <input name="HexColorYen" id="SelectColorYen" type="color">
 170                                 <br>
 171                                 <input id="setQuote" value="Set Quote Settings" type="button">
 172                         `;
 173                         document.getElementById("SelectColorYen").addEventListener("input", (evt) => {
 174                                 (<HTMLInputElement>document.getElementById("HexColorYen_text")).value =
 175                                         ((<HTMLInputElement>document.getElementById("SelectColorYen")).value);
 176                         });
 177                         document.getElementById("setQuote").addEventListener("click", (e) => {
 178                                         this.storeStates();
 179                                         this.clearContainer();
 180                                         this.rebuildContainer();
 181 });
 182                         if(this.setting_items.character_inserter_settings.Yen_Character !== undefined)
 183                                 (<HTMLInputElement>document.getElementById("quoteCharacter")).value = this.setting_items.character_inserter_settings.Yen_Character;
 184                         if(this.setting_items.character_inserter_settings.Yen_Color !== undefined)
 185                                 (<HTMLInputElement>document.getElementById("HexColorYen_text")).value = this.setting_items.character_inserter_settings.Yen_Color;
 186
 187 (<HTMLInputElement>document.getElementById("SelectColorYen")).value = this.setting_items.character_inserter_settings.Yen_Color;
 188                 }
 189                                                                                                                                                                                 },
 190                 {Text : " | View 『Kita』 Settings [Customizable]", ListenerFunc :                (a_id) => {
 191                         this.clearContainer();
 192
 193                         var disposable_container = document.createElement("DIV");
 194                         disposable_container.setAttribute("id", "disposable_container");
 195                         this.contents_div.appendChild(disposable_container);
 196                         disposable_container.innerHTML =
 197                         `
 198                                 <script src="http://jscolor.js"></script>
 199                                 <label>Kita Characters: </label>
 200                                 <input name="selectiveCharacter" id="selectiveCharacters" type="text" value="ｷﾀ━━━(ﾟ∀ﾟ)━━━!!">
 201                                 <br>
 202                                 <label>RGB Hex Color: </label>
 203                                 <input name="HexColorKita" id="HexColorKita_text" type="text">
 204                                 <input name="HexColorKita" id="SelectColorKita" type="color">
 205                                 <br>
 206                                 <input id="setCharacter" value="Set Character Settings" type="button">
 207                         `;
 208                         document.getElementById("SelectColorKita").addEventListener("input", (evt) => {
 209                                 (<HTMLInputElement>document.getElementById("HexColorKita_text")).value =
 210                                         ((<HTMLInputElement>document.getElementById("SelectColorKita")).value);
 211                                 });
 212                         document.getElementById("setCharacter").addEventListener("click", (e) =>{
 213                                         this.storeStates();
 214                                         this.clearContainer();
 215                                         this.rebuildContainer();
 216
 217 });
 218                         if(this.setting_items.character_inserter_settings.Kita_Character !== undefined)
 219                                 (<HTMLInputElement>document.getElementById("selectiveCharacters")).value = this.setting_items.character_inserter_settings.Kita_Character;
 220                         if(this.setting_items.character_inserter_settings.Kita_Color !== undefined)
 221                                 (<HTMLInputElement>document.getElementById("HexColorKita_text")).value = this.setting_items.character_inserter_settings.Kita_Color;
 222                         (<HTMLInputElement>document.getElementById("SelectColorKita")).value = this.setting_items.character_inserter_settings.Kita_Color;
 223                 }
 224                                                                                                                                                                                 },
 225                 {Text : " | Set 『Visible Password』", ListenerFunc :                             (input_id) => {
 226                         var input = document.getElementById(input_id);
 227                         var is_check:boolean = !(<HTMLInputElement>input).checked;
 228                         (<HTMLInputElement>document.getElementById(input_id)).checked = is_check;
 229                         this.storeStates();
 230                 }                                                                                                                                                                       },
 231         ]
 232
 233         setting_items:any = {};
 234
 235         constructor(){
 236                 super();
 237                 this.retrieveStates();
 238                 this.init();
 239                 this.activate();
 240         }
 241
 242         setImageAdderFields(){
 243                 (<HTMLInputElement>document.getElementById("width_DIA")).value = this.setting_items.image_adder_settings.Width;
 244                 (<HTMLInputElement>document.getElementById("height_DIA")).value = this.setting_items.image_adder_settings.Height;
 245                 (<HTMLInputElement>document.getElementById("qr_width_DIA")).value = this.setting_items.image_adder_settings.QR_Width;
 246
 247                 if              ((<HTMLInputElement>document.getElementById("width_DIA")).value == "489") (<HTMLInputElement>document.getElementById("v_large_DIA")).checked = true;
 248                 else if((<HTMLInputElement>document.getElementById("width_DIA")).value == "400") (<HTMLInputElement>document.getElementById("large_DIA")).checked = true;
 249                 else if((<HTMLInputElement>document.getElementById("width_DIA")).value == "300") (<HTMLInputElement>document.getElementById("medium_DIA")).checked = true;
 250                 else if((<HTMLInputElement>document.getElementById("width_DIA")).value == "200") (<HTMLInputElement>document.getElementById("small_DIA")).checked = true;
 251         }
 252
 253         setImageAdderEventListeners():void{
 254                 (<HTMLInputElement>document.getElementById("v_large_DIA")).addEventListener("click", function(){
 255                         (<HTMLInputElement>document.getElementById("width_DIA")).value = "489";
 256                         (<HTMLInputElement>document.getElementById("height_DIA")).value = "489";
 257                 });
 258
 259                 (<HTMLInputElement>document.getElementById("large_DIA")).addEventListener("click", function(){
 260                         (<HTMLInputElement>document.getElementById("width_DIA")).value = "400";
 261                         (<HTMLInputElement>document.getElementById("height_DIA")).value = "400";
 262                 });
 263
 264                 (<HTMLInputElement>document.getElementById("medium_DIA")).addEventListener("click", function(){
 265                         (<HTMLInputElement>document.getElementById("width_DIA")).value = "300";
 266                         (<HTMLInputElement>document.getElementById("height_DIA")).value = "300";
 267                 });
 268
 269
 270                 (<HTMLInputElement>document.getElementById("small_DIA")).addEventListener("click", function(){
 271                         (<HTMLInputElement>document.getElementById("width_DIA")).value = "200";
 272                         (<HTMLInputElement>document.getElementById("height_DIA")).value = "200";
 273                 });
 274
 275
 276                 (<HTMLInputElement>document.getElementById("SetImageAdderProperties")).addEventListener("click", (evt) => {
 277                         this.storeStates();
 278                         this.clearContainer();
 279                         this.rebuildContainer();
 280                 });
 281
 282
 283
 284         }
 285
 286                 //*...THIS
 287         retrieveStates():void{
 288                 //values used to fill out data fields
 289                 this.setting_items.image_hiding_settings  = {Expiration_Time: localStorage.getItem("Expiration_Time"), MD5_List_FSE: localStorage.getItem("MD5_List_FSE"), Active: localStorage.getItem("ImageHidingActive")};
 290                 this.retrieveWordReplaceStates();
 291                 this.retrieveImageAdderStates();
 292                 this.retrieveRebuildStates();
 293                 this.retrieveCharacterInsertingStates();
 294                 this.setting_items.password_settings=(localStorage.getItem("PasswordActive"));
 295         }
 296
 297         retrieveActiveToggles():void{
 298                 if(localStorage.getItem("ImageHidingActive")  == null || localStorage.getItem("ImageHidingActive") === undefined){
 299                         (<HTMLInputElement>document.getElementById("check-settings0")).checked = true;
 300                         (<HTMLInputElement>document.getElementById("check-settings1")).checked = false;
 301                         (<HTMLInputElement>document.getElementById("check-settings2")).checked = false;
 302                         (<HTMLInputElement>document.getElementById("check-settings3")).checked = false;
 303                         (<HTMLInputElement>document.getElementById("check-settings4")).checked = true;
 304                         (<HTMLInputElement>document.getElementById("check-settings5")).checked = true;
 305                         (<HTMLInputElement>document.getElementById("check-settings6")).checked = true;
 306                         this.displayWindow();
 307                         return;
 308                 }
 309                 (<HTMLInputElement>document.getElementById("check-settings0")).checked = localStorage.getItem("ImageHidingActive") === 'true';
 310                 (<HTMLInputElement>document.getElementById("check-settings1")).checked = localStorage.getItem("TextReplaceActive") === 'true';
 311                 (<HTMLInputElement>document.getElementById("check-settings2")).checked = localStorage.getItem("ImageAdderActive") === 'true';
 312                 (<HTMLInputElement>document.getElementById("check-settings3")).checked = localStorage.getItem("ThreadRebuilderActive") === 'true';
 313                 (<HTMLInputElement>document.getElementById("check-settings4")).checked = localStorage.getItem("YenActive") === 'true';
 314                 (<HTMLInputElement>document.getElementById("check-settings5")).checked = localStorage.getItem("KitaActive") === 'true';
 315                 (<HTMLInputElement>document.getElementById("check-settings6")).checked = localStorage.getItem("PasswordActive") === 'true';
 316         }
 317
 318         retrieveWordReplaceStates():void{
 319                 //acquire text filter representation
 320                 var storage_index:number = 0;
 321                 var JSON_storage:any = {};
 322                 var storage_key:string;
 323                 var text_filters:any[] = [];
 324                 var local_store_len = window.localStorage.length;
 325                 while(storage_index < local_store_len) {
 326                         storage_key = window.localStorage.key(storage_index);
 327                         JSON_storage[storage_key] = window.localStorage.getItem(storage_key);
 328                         storage_index++;
 329                 }
 330                 var filters:string[] = Generics.getJSONPropertiesByKeyName(JSON_storage,"[0-9]+FLT");
 331                 filters.sort();
 332                 filters.forEach((filter) => {
 333                         text_filters.push(TextReplacer.formatFilterSettings(JSON_storage[filter]));
 334                 });
 335
 336                 this.setting_items.word_replace_settings = {Number_of_filters: localStorage.getItem("filter_quantity"), Text_Filter_List: text_filters, Active:localStorage.getItem("TextReplaceActive")};
 337         }
 338
 339         retrieveImageAdderStates():void{
 340                 this.setting_items.image_adder_settings =  {Width: localStorage.getItem("width_DIA"),
 341                                                                                                         Height: localStorage.getItem("height_DIA"),
 342                                                                                                         QR_Width: localStorage.getItem("qr_width_DIA"),
 343                                                                                                         Active:localStorage.getItem("ImageAdderActive")};
 344
 345                 if(this.setting_items.image_adder_settings.Height === null) this.setting_items.image_adder_settings.Height = 400;
 346                 if(this.setting_items.image_adder_settings.Width === null) this.setting_items.image_adder_settings.Width = 400;
 347                 if(this.setting_items.image_adder_settings.QR_Width === null) this.setting_items.image_adder_settings.QR_Width = 480;
 348
 349                 (<HTMLInputElement>document.getElementById("fourchanx-css")).textContent += ".qr-preview { height:" +  this.setting_items.image_adder_settings.Height + "px; width: " + this.setting_items.image_adder_settings.Width +  "px; left:8%;background-size: cover;}";
 350                 (<HTMLInputElement>document.getElementById("fourchanx-css")).textContent += "#dump-list { min-height: " + (this.setting_items.image_adder_settings.Width - 20) +  "px; width: " + (this.setting_items.image_adder_settings.QR_Width) + "px;}";
 351
 352         }
 353
 354         retrieveRebuildStates():void{
 355                 if(localStorage.getItem("ArchiveType_FSE") !== "1" && localStorage.getItem("ArchiveType_FSE") !== "0") localStorage.setItem("ArchiveType_FSE", "1");
 356                 this.setting_items.thread_rebuild_settings = {Archive_Type: localStorage.getItem("ArchiveType_FSE"), Active:localStorage.getItem("ThreadRebuilderActive")};
 357         }
 358
 359         retrieveCharacterInsertingStates():void{
 360         if (localStorage.getItem("Yen_Character") === undefined || localStorage.getItem("Yen_Character") === null) localStorage.setItem("Yen_Character", "¥");
 361         if (localStorage.getItem("Yen_Color") === undefined || localStorage.getItem("Yen_Color")  === null) localStorage.setItem("Yen_Color", "#9370DB");
 362         if (localStorage.getItem("Kita_Character") === undefined || localStorage.getItem("Kita_Character") === null) localStorage.setItem("Kita_Character", "ｷﾀ━━━(ﾟ∀ﾟ)━━━!!");
 363         if (localStorage.getItem("Kita_Color") === undefined || localStorage.getItem("Kita_Color") === null)localStorage.setItem("Kita_Color", "#444444");
 364
 365                 this.setting_items.character_inserter_settings = {Yen_Active: localStorage.getItem("YenActive") == 'true', Yen_Character: localStorage.getItem("Yen_Character"), Yen_Color: localStorage.getItem("Yen_Color"),
 366                                                                                                         Kita_Active: localStorage.getItem("KitaActive") == 'true', Kita_Character:localStorage.getItem("Kita_Character"), Kita_Color: localStorage.getItem("Kita_Color")};
 367
 368                                                                         console.log(this.setting_items.character_inserter_settings );
 369         }
 370
 371         storeStates():void{
 372                 //image settings
 373                 this.storeImageFilterStates();
 374                 //Text replace settings
 375                 this.storeTextFilterStates();
 376                 //Image Adder settings
 377                 this.storeImageAdderStates();
 378                 //Thread rebuild settings
 379                 this.storeRebuildStates();
 380                 //character inserter
 381                 this.storeCharacterInserterStates();
 382                 //Password replace settings
 383                 this.storePasswordStates()
 384
 385                 this.retrieveStates();
 386         }
 387
 388         storeActiveToggles():void{
 389                 console.log("tog");
 390                 localStorage.setItem("ImageHidingActive", ((<HTMLInputElement>document.getElementById("check-settings0")).checked.toString()));
 391                 localStorage.setItem("TextReplaceActive", ((<HTMLInputElement>document.getElementById("check-settings1")).checked.toString()));
 392                 localStorage.setItem("ImageAdderActive", ((<HTMLInputElement>document.getElementById("check-settings2")).checked.toString()));
 393                 localStorage.setItem("ThreadRebuilderActive", ((<HTMLInputElement>document.getElementById("check-settings3")).checked.toString()));
 394                 localStorage.setItem("YenActive", ((<HTMLInputElement>document.getElementById("check-settings4")).checked.toString()));
 395                 localStorage.setItem("KitaActive", ((<HTMLInputElement>document.getElementById("check-settings5")).checked.toString()));
 396                 localStorage.setItem("PasswordActive", ((<HTMLInputElement>document.getElementById("check-settings6")).checked.toString()));
 397         }
 398
 399         storeImageFilterStates():void{
 400                 if(document.getElementById("Expiration_Time") !== null){
 401                         var time:any = document.getElementById("Expiration_Time");
 402                         var millisecond_time:number = parseInt((<HTMLInputElement>time).value) * Constants.MILLISECONDS_TO_THE_HOUR;
 403                         if (millisecond_time == 0 || millisecond_time === null || millisecond_time === undefined) millisecond_time = Constants.DEFAULT_HIDE_EXPIRATION_TIME;
 404                         localStorage.setItem("Expiration_Time", millisecond_time.toString());
 405                         var md5_filters = (<HTMLInputElement>document.getElementById("MD5_List_FSE")).value;
 406                         localStorage.setItem("MD5_List_FSE", md5_filters);
 407                         Generics.alert4ChanX("Image Settings Saved", "success", 3);
 408                 }
 409
 410         }
 411
 412         storeTextFilterStates():void{
 413                 if(document.getElementById("FilterRow0") !== null){
 414                         var f_row_moving:any = document.getElementById("FilterRow0");
 415                         var number_of_filters:number = 0;
 416                         var number_of_filters_actual:number = 0;
 417                         while(f_row_moving.nextSibling !== null){
 418                                 if((<HTMLInputElement>document.getElementById("Pattern" + number_of_filters)).value !== "") number_of_filters_actual++;
 419                                 number_of_filters++;
 420                                 f_row_moving = f_row_moving.nextSibling;
 421                         }
 422                         window.localStorage.setItem("filter_quantity", number_of_filters_actual.toString());
 423
 424                         for (var pattern_input:number = 0 ; pattern_input < number_of_filters; pattern_input++){
 425                                 var pattern_to_store:string = (<HTMLInputElement>document.getElementById("Pattern"+pattern_input)).value;
 426                                 var replacement_to_store:string = (<HTMLInputElement>document.getElementById("Replacement"+pattern_input)).value;
 427                                 var setting:string = 'g';
 428                                 try{
 429                                         if(pattern_to_store === "") {
 430                                                 localStorage.removeItem(pattern_input + "FLT");
 431                                                 continue;
 432                                         }
 433                                         else if(new RegExp("^\/.*\/\\D+$").test(pattern_to_store)){}
 434                                         else if (new RegExp("^\/.*\/$").test(pattern_to_store)){
 435                                                 pattern_to_store = pattern_to_store + setting;
 436                                         }
 437                                         else if(!new RegExp("^/.*\/\\D$").test(pattern_to_store)){
 438                                                 pattern_to_store = "/" + pattern_to_store + "/" + setting;
 439                                         }
 440                                          //test for breakages, try to cause error
 441                                          var error_test:any = new RegExp(
 442                                                                 pattern_to_store.substring(0, pattern_to_store.lastIndexOf("/") + 1),
 443                                                                 pattern_to_store.substring(pattern_to_store.lastIndexOf("/") + 1)
 444                                                                 );
 445                                  }
 446                                  catch(e){
 447                                         Generics.alert4ChanX("Unrecoverable Regex error on pattern " + pattern_input + " for " + pattern_to_store, "error", undefined);
 448                                         continue;
 449                                  }
 450                                 pattern_to_store = encodeURIComponent(pattern_to_store);
 451                                 var save_string:string = (<HTMLInputElement>document.getElementById("Active"+pattern_input)).checked + '=' + pattern_to_store + '=' + replacement_to_store;
 452                                 window.localStorage.setItem(pattern_input + "FLT", save_string);
 453                         }
 454                         Generics.alert4ChanX("Wordfilters Updated!", "success", 3);
 455                 }
 456         }
 457
 458         storeImageAdderStates():void{
 459 if(document.getElementById("SetImageAdderProperties") !== null){
 460                 var width:string = (<HTMLInputElement>document.getElementById("width_DIA")).value;
 461                 localStorage.setItem("width_DIA", width);
 462
 463                 var height:string = (<HTMLInputElement>document.getElementById("height_DIA")).value;
 464                 localStorage.setItem("height_DIA", height);
 465
 466                 var qr_width:string = (<HTMLInputElement>document.getElementById("qr_width_DIA")).value;
 467                 localStorage.setItem("qr_width_DIA", qr_width);
 468
 469 }
 470         }
 471
 472         storeRebuildStates():void{
 473                 if(document.getElementById("setArchive") !== null){
 474                         localStorage.setItem("ArchiveType_FSE", (<HTMLInputElement>document.getElementById("OffsiteArchive")).checked === true ? "0" : "1");
 475                 }
 476         }
 477
 478         storeCharacterInserterStates():void{
 479                 if(document.getElementById("setCharacter") !== null){
 480                         localStorage.setItem("Kita_Character", (<HTMLInputElement>document.getElementById("selectiveCharacters")).value);
 481                         localStorage.setItem("Kita_Color", (<HTMLInputElement>document.getElementById("HexColorKita_text")).value);
 482                 }
 483                 else if(document.getElementById("setQuote") !== null){
 484                         localStorage.setItem("Yen_Character", (<HTMLInputElement>document.getElementById("quoteCharacter")).value);
 485                         localStorage.setItem("Yen_Color", (<HTMLInputElement>document.getElementById("HexColorYen_text")).value);
 486                 }
 487         }
 488
 489         storePasswordStates():void{
 490                         //password view settings
 491                 if(document.getElementById("check-settings6") !== null)
 492                 localStorage.setItem("PasswordActive", `${(<HTMLInputElement>document.getElementById("check-settings6")).checked}`);
 493         }
 494
 495         clearContainer():void{
 496                 var disposable = document.getElementById("disposable_container");
 497                 if(disposable !== null) this.contents_div.removeChild(disposable);
 498                 else this.contents_div.removeChild(this.ul_selection_start);
 499         }
 500
 501         rebuildContainer(){
 502                 this.contents_div.appendChild(this.ul_selection_start);
 503         }
 504
 505         init(){
 506                 this.settings_style.innerHTML = `.inputs{
 507                                                                                         background-color:rgb(200,200,200);margin:5px 7px;width:100px;
 508                                                                                 }
 509                                                                                 .SettingsBackground{
 510                                                                                         position:fixed;width:100%;height:100%;background-color:rgba(200,200,200,0.3);top:0;left:0; z-index:9
 511                                                                                 }
 512                                                                                 .settingsItem{
 513                                                                                         font-size:18px;list-style:katakana-iroha outside;padding:2px;color:#2e2345;
 514                                                                                 }
 515                                                                                 .settingsItem input{
 516                                                                                         transform: scale(1.2);
 517                                                                                 }
 518                                                                                 .settingsMain{
 519                                                                                         border:solid 1px black;position:fixed;background-color:rgb(200,200,200);left:40%;top:20%;margin-bottom:0; z-index:10
 520                                                                                 }
 521                                                                                 .closeIcon{
 522                                                                                         border:solid 1px black;position:absolute;width:25px;height:25px;background-color:rgba(255,100,90,0.9); right:3px;top:3px; z-index:10
 523                                                                                 }
 524                                                                                 .titleStyle{
 525                                                                                         font-size: 20px;padding: 12px 0px 9px 22px
 526                                                                                 }
 527                                                                                 .tooltip-4F{
 528                                                                                         z-index:9;padding:5px;border:1px solid black;background-color:white;word-wrap:break-word;display:none;position:absolute;
 529                                                                                 }
 530                                                                                 .help_icon{
 531                                                                                         height:22.5px;margin:-4px 10px
 532                                                                                 }
 533                                                                                 .footerStyle{
 534                                                                                         padding-left: 12px;
 535                                                                                 }
 536                                                                                 .contentStyle{
 537                                                                                         background-color:white;margin:0 0;padding:5px 25px;
 538                                                                                 }`;
 539
 540                 this.background_div.setAttribute('class', 'SettingsBackground');
 541                 this.background_div.setAttribute('id', 'SettingsBackground');
 542                 this.background_div.setAttribute('style','display:none');
 543
 544                 this.settings_div.setAttribute('class', 'settingsMain');
 545                 this.settings_div.setAttribute('id', 'settingsWindow');
 546                 this.settings_div.setAttribute('style', 'display:none;width:500px');
 547
 548                 this.close_link.setAttribute('href','javascript:void(0)');
 549
 550                 this.close_div.setAttribute('class', 'closeIcon');
 551                 this.close_div.addEventListener('click', evt => this.hideWindow());
 552
 553                 this.title_para.setAttribute('class', 'titleStyle');
 554
 555                 this.contents_div.setAttribute('class','contentStyle');
 556
 557                 this.end_para.setAttribute('class', 'footerStyle');
 558
 559                 this.ul_selection_start.setAttribute("ID", "selection_list");
 560                 this.generateList(this.contents_div);
 561         }
 562
 563         generateList(head_node:any):void{
 564                 this.list_items.forEach((list_item, index) => {
 565                         var li = document.createElement('LI');
 566                         li.setAttribute('class', 'settingsItem');
 567                         if(list_item.Text.indexOf('View') > -1){
 568                                 var input:any = document.createElement('INPUT');
 569                                 var input_id:string = 'check-settings' + index;
 570                                 input.setAttribute('TYPE','checkbox');
 571                                 input.setAttribute('ID', 'check-settings' + index);
 572                                 li.appendChild(input);
 573                                 input.addEventListener('click', (evt) => this.storeActiveToggles());
 574
 575                                 var a:any =  document.createElement('A');
 576                 a.setAttribute('href','javascript:void(0)');
 577                                 a.textContent = list_item.Text;
 578                                 var a_id = 'tab-settings' + index;
 579                                 a.setAttribute('ID', 'tab-settings' + index);
 580                                 var setup_func =(_a_id) => {
 581                                         a.addEventListener('click', (evt) => list_item.ListenerFunc(_a_id ));
 582                                         li.appendChild(a);
 583                                         this.ul_selection_start.appendChild(li);
 584                                 }
 585                                 setup_func(a_id);
 586                         }
 587                         else{
 588                                 var input:any = document.createElement('INPUT');
 589                                 var input_id:string = 'check-settings' + index;
 590                                 input.setAttribute('TYPE','checkbox');
 591                                 input.setAttribute('ID', 'check-settings' + index);
 592                                 input.addEventListener('click', (evt) => this.storeActiveToggles());
 593                                 li.appendChild(input);
 594
 595                                 var label:any =  document.createElement('LABEL');
 596                                 label.textContent = list_item.Text;
 597
 598                                 li.appendChild(label);
 599                                 this.ul_selection_start.appendChild(li);
 600
 601                                 (<HTMLInputElement>input).checked = this.setting_items.password_settings == 'true';
 602                                 var setup_func = (input_id) => {
 603                                         label.addEventListener('click',(evt) => list_item.ListenerFunc(input_id));
 604                                 };
 605                                 setup_func(input_id);
 606                         }
 607                 });
 608         }
 609
 610         activate():void{
 611                 document.body.appendChild(this.settings_style);
 612                 this.background_div.addEventListener('click', evt => this.hideWindow());
 613                 document.body.appendChild(this.background_div);
 614                 this.settings_div.appendChild(this.close_link);
 615                 this.close_link.appendChild(this.close_div);
 616                 this.title_para.appendChild(this.title_text);
 617                 this.settings_div.appendChild(this.title_para);
 618                 this.settings_div.appendChild(this.contents_div);
 619                 this.contents_div.appendChild(this.ul_selection_start);
 620                 this.end_para.appendChild(this.end_text);
 621                 this.settings_div.appendChild(this.end_para);
 622                 document.body.appendChild(this.settings_div);
 623                 this.retrieveActiveToggles();
 624         }
 625         decideAction(node:any):void{}
 626
 627         getSettingsArr():Object{
 628                 return this.setting_items;
 629         }
 630
 631         displayWindow():void{
 632                 this.background_div.style.display = 'block';
 633                 this.settings_div.style.display = 'block';
 634                 this.rebuildContainer();
 635         }
 636
 637         hideWindow():void{
 638                 this.background_div.style.display = 'none';
 639                 this.settings_div.style.display = 'none';
 640                 this.clearContainer();
 641         }
 642
 643         filterWindow(disposable_container:any):void{
 644                 var filter_table:any = document.createElement("table");
 645                 filter_table.setAttribute("style", "text-align:center;");
 646                 filter_table.setAttribute("id", "filter_table");
 647                 disposable_container.appendChild(filter_table);
 648
 649                 var table_head_active:any =  document.createElement("th");
 650                 var head_text_active:any = document.createTextNode("Active");
 651                 table_head_active.appendChild(head_text_active);
 652                 filter_table.appendChild(table_head_active);
 653                 var table_head_pattern:any =  document.createElement("th");
 654                 var headTextPattern:any = document.createTextNode("Pattern");
 655                 table_head_pattern.appendChild(headTextPattern);
 656                 filter_table.appendChild(table_head_pattern);
 657                 var table_head_replacement:any =  document.createElement("th");
 658                 var head_text_replacement:any = document.createTextNode("Replacement");
 659                 table_head_replacement.appendChild(head_text_replacement);
 660                 filter_table.appendChild(table_head_replacement);
 661
 662                 //Create the pattern table
 663                 //loop to create rows
 664                 var number_of_filters:number = parseInt(this.setting_items.word_replace_settings.number_of_filters);
 665                 if (number_of_filters === 0 || isNaN(number_of_filters)) number_of_filters = 6;
 666                 for (var i = 0; i <  number_of_filters ; i++){
 667                         var table_row_contents:any = document.createElement("tr");
 668                         table_row_contents.setAttribute("id", "FilterRow" + i);
 669
 670                         var table_data_active:any =  document.createElement("td");
 671                         var table_checkbox_active:any = document.createElement("input");
 672                         table_checkbox_active.setAttribute("type", "checkbox");
 673                         table_checkbox_active.setAttribute("id", "Active" + i);
 674                         table_data_active.appendChild(table_checkbox_active);
 675                         table_row_contents.appendChild(table_data_active);
 676
 677                         var table_data_pattern:any =  document.createElement("td");
 678                         var table_input_pattern:any = document.createElement("input");
 679                         table_input_pattern.setAttribute("class", "inputs");
 680                         table_input_pattern.setAttribute("id", "Pattern" + i);
 681                         table_data_pattern.appendChild(table_input_pattern);
 682                         table_row_contents.appendChild(table_data_pattern);
 683
 684                         var table_data_replacement:any =  document.createElement("td");
 685                         var table_input_replacement:any =  document.createElement("input");
 686                         table_input_replacement.setAttribute("class", "inputs");
 687                         table_input_replacement.setAttribute("id", "Replacement" + i);
 688                         table_data_replacement.appendChild(table_input_replacement);
 689                         table_row_contents.appendChild(table_data_replacement);
 690
 691                         filter_table.appendChild(table_row_contents);
 692                 }
 693
 694                 var table_last_contents:any = document.createElement("tr");
 695
 696                 var table_add_collumn:any =  document.createElement("td");
 697                 var table_add_row_button:any = document.createElement("input");
 698                 var table_subtract_row_button:any = document.createElement("input");
 699                 table_subtract_row_button.setAttribute("type", "button");
 700                 table_subtract_row_button.setAttribute("value", "-");
 701                 table_subtract_row_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 702                 table_add_collumn.appendChild(table_subtract_row_button);
 703                 table_subtract_row_button.addEventListener("click", (evt) => this.filterRemoveRow());
 704                 table_add_row_button.setAttribute("type", "button");
 705                 table_add_row_button.setAttribute("value", "+");
 706                 table_add_row_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 707                 table_add_collumn.appendChild(table_add_row_button);
 708                 table_add_row_button.addEventListener("click", (evt) => this.filterAddRow());
 709
 710                 table_last_contents.appendChild(table_add_collumn);
 711
 712                 var table_set_collumn:any =  document.createElement("td");
 713                 var table_confirm_button:any = document.createElement("input");
 714                 table_confirm_button.setAttribute("type", "button");
 715                 table_confirm_button.setAttribute("id", "table_confirm_button");
 716                 table_confirm_button.setAttribute("value", "Set Replacements");
 717                 table_confirm_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 718
 719                 //event listeners
 720                 table_confirm_button.addEventListener("click", (evt) => {
 721                         this.storeStates();
 722                         this.clearContainer();
 723                         this.rebuildContainer();
 724                 });
 725
 726                 table_set_collumn.appendChild(table_confirm_button);
 727                 table_last_contents.appendChild(table_set_collumn);
 728
 729                 var table_close_collumn:any = document.createElement("td");
 730                 var table_close_button:any = document.createElement("input");
 731                 table_close_button.setAttribute("type", "button");
 732                 table_close_button.setAttribute("value", "Close Without Saving");
 733                 table_close_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 734                 table_close_button.addEventListener("click", (evt) => {
 735                         this.clearContainer();
 736                         this.rebuildContainer();
 737                 });
 738                 table_close_collumn.appendChild(table_close_button);
 739                 table_last_contents.appendChild(table_close_collumn);
 740
 741                 filter_table.appendChild(table_last_contents);
 742         }
 743
 744         filterAddRow():void{
 745                 var number_of_filters:number = parseInt(this.setting_items.word_replace_settings.number_of_filters);
 746
 747                 var filter_table:any = document.getElementById("filter_table");
 748                 filter_table.deleteRow(number_of_filters + 1);
 749
 750                 var table_row_contents:any = document.createElement("tr");
 751                 table_row_contents.setAttribute("id", "FilterRow" +  (number_of_filters));
 752
 753                 var table_data_active:any =  document.createElement("td");
 754                 var table_checkbox_active:any = document.createElement("input");
 755                 table_checkbox_active.setAttribute("type", "checkbox");
 756                 table_checkbox_active.setAttribute("id", "Active" + (number_of_filters));
 757                 table_data_active.appendChild(table_checkbox_active);
 758                 table_row_contents.appendChild(table_data_active);
 759
 760                 var table_data_pattern:any =  document.createElement("td");
 761                 var table_input_pattern:any = document.createElement("input");
 762                 table_input_pattern.setAttribute("class", "inputs");
 763                 table_input_pattern.setAttribute("id", "Pattern" + (number_of_filters));
 764                 table_data_pattern.appendChild(table_input_pattern);
 765                 table_row_contents.appendChild(table_data_pattern);
 766
 767                 var table_data_replacement:any =  document.createElement("td");
 768                 var table_input_replacement:any =  document.createElement("input");
 769                 table_input_replacement.setAttribute("class", "inputs");
 770                 table_input_replacement.setAttribute("id", "Replacement" + (number_of_filters));
 771                 table_data_replacement.appendChild(table_input_replacement);
 772                 table_row_contents.appendChild(table_data_replacement);
 773
 774                 filter_table.appendChild(table_row_contents);
 775
 776                 var table_last_contents:any = document.createElement("tr");
 777
 778                 var table_add_collumn:any =  document.createElement("td");
 779                 var table_add_row_button:any = document.createElement("input");
 780                 var table_subtract_row_button:any = document.createElement("input");
 781                 table_subtract_row_button.setAttribute("type", "button");
 782                 table_subtract_row_button.setAttribute("value", "-");
 783                 table_subtract_row_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 784                 table_add_collumn.appendChild(table_subtract_row_button);
 785                 table_subtract_row_button.addEventListener("click", (evt) => this.filterRemoveRow());
 786                 table_add_row_button.setAttribute("type", "button");
 787                 table_add_row_button.setAttribute("value", "+");
 788                 table_add_row_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 789                 table_add_collumn.appendChild(table_add_row_button);
 790                 table_add_row_button.addEventListener("click", (evt) => this.filterAddRow());
 791
 792                 table_last_contents.appendChild(table_add_collumn);
 793
 794                 var table_set_collumn:any =  document.createElement("td");
 795                 var table_confirm_button:any = document.createElement("input");
 796                 table_confirm_button.setAttribute("type", "button");
 797                 table_confirm_button.setAttribute("id", "table_confirm_button");
 798                 table_confirm_button.setAttribute("value", "Set Replacements");
 799                 table_confirm_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 800                 //event listeners
 801                 table_confirm_button.addEventListener("click", (evt) => {
 802                         this.storeStates();
 803                         this.clearContainer();
 804                         this.rebuildContainer();
 805                 });
 806
 807                 table_set_collumn.appendChild(table_confirm_button);
 808                 table_last_contents.appendChild(table_set_collumn);
 809
 810                 var table_close_collumn:any = document.createElement("td");
 811                 var table_close_button:any = document.createElement("input");
 812                 table_close_button.setAttribute("type", "button");
 813                 table_close_button.setAttribute("value", "Close Without Saving");
 814                 table_close_button.setAttribute("style", "padding: 7px 0; margin:5px 0;");
 815                 table_close_button.addEventListener("click", (evt) => {
 816                         this.clearContainer();
 817                         this.rebuildContainer();
 818                 });
 819                 table_close_collumn.appendChild(table_close_button);
 820                 table_last_contents.appendChild(table_close_collumn);
 821
 822                 filter_table.appendChild(table_last_contents);
 823         }
 824
 825         filterRemoveRow():void{
 826                 var number_of_filters:number = parseInt(this.setting_items.word_replace_settings.number_of_filters);
 827
 828                 var filter_table:any = document.getElementById("filter_table");
 829                 if(number_of_filters != 0){
 830                         filter_table.deleteRow(number_of_filters);
 831                         number_of_filters--;
 832                 }
 833         }
 834
 835         filterSetTable():void{
 836                 var filter_length = this.setting_items.word_replace_settings.Text_Filter_List.length;
 837                 for (var filter_count:number = 0 ; filter_count < filter_length ; filter_count++){
 838                         if(
 839                                 this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Active === null ||
 840                                 this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Regex === null ||
 841                                 this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Replacement === null) return;
 842
 843                         if(this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Active === "true"){
 844                                 (<HTMLInputElement>document.getElementById("Active"+filter_count)).checked = true;
 845                         }
 846                         else{
 847                                 (<HTMLInputElement>document.getElementById("Active"+filter_count)).checked = false;
 848                         }
 849                         (<HTMLInputElement>document.getElementById("Pattern"+filter_count)).value =
 850                                                                                         this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Regex;
 851                         (<HTMLInputElement>document.getElementById("Replacement"+filter_count)).value =
 852                                                                                         this.setting_items.word_replace_settings.Text_Filter_List[filter_count].Replacement;
 853                 }
 854         }
 855
 856 }