☰

Block_Obj

BLOCK_OBJ

当前为 2020-07-22 提交的版本，查看 最新版本。

此脚本不应直接安装。它是供其他脚本使用的外部库，要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/407543/829361/Block_Obj.js 

  1. // ==UserScript==
  2. // @name         Block_Obj
  3. // @namespace    https://greasyfork.org/zh-CN/users/193133-pana
  4. // @homepage     https://www.sailboatweb.com
  5. // @version      1.0.0
  6. // @description  BLOCK_OBJ
  7. // @author       pana
  8. // @license      GNU General Public License v3.0 or later
  9. // ==/UserScript==
  10.  
  11. const BLOCK_STYLE = `
  12.     .block_obj_wrap_div {
  13.         background-color: #222222;
  14.         border-radius: 3px;
  15.         border: 1px solid #282A36;
  16.         bottom: 6vh;
  17.         box-shadow: 0 0 5px #282A36;
  18.         color: #D3D3D3;
  19.         font-size: 13px;
  20.         margin: 0px;
  21.         padding: 0px;
  22.         position: fixed;
  23.         text-align: left;
  24.         transition: 0.8s;
  25.         width: 480px;
  26.         z-index: 99999;
  27.     }
  28.     .block_obj_show_wrap {
  29.         display: block;
  30.         right: 0;
  31.     }
  32.     .block_obj_hidden_wrap {
  33.         right: -490px;
  34.     }
  35.     .block_obj_main_fieldset {
  36.         border-radius: 3px;
  37.         border: 3px groove #00A1D6;
  38.         height: auto;
  39.         margin: 8px;
  40.         min-width: 300px;
  41.         padding: 4px 9px 6px 9px;
  42.         width: auto;
  43.     }
  44.     .block_obj_ul_node {
  45.         list-style: none;
  46.         padding-left: 0;
  47.     }
  48.     .block_obj_checkbox_li {
  49.         display: inline-block;
  50.         margin-top: 5px;
  51.     }
  52.     .block_obj_checkbox_input {
  53.         clip: rect(0, 0, 0, 0);
  54.         position: absolute;
  55.     }
  56.     .block_obj_checkbox_label {
  57.         cursor: pointer;
  58.         vertical-align: middle;
  59.     }
  60.     .block_obj_checkbox_input + label::before {
  61.         background-color: silver;
  62.         border-radius: 0.1em;
  63.         color: #FFF;
  64.         content: "\\a0";
  65.         display: inline-block;
  66.         height: 1em;
  67.         line-height: 85%;
  68.         margin-right: 0.5em;
  69.         text-align: center;
  70.         vertical-align: 0.2em;
  71.         width: 1em;
  72.     }
  73.     .block_obj_checkbox_input:checked + label::before {
  74.         background-color: #00A1D6;
  75.         content: "\\2713";
  76.     }
  77.     .block_obj_separator_text {
  78.         color: #FFB86C;
  79.         margin-bottom: 2px;
  80.         margin-top: 2px;
  81.     }
  82.     .block_obj_separator_symbol {
  83.         background-color: #303030;
  84.         height: 2px;
  85.         margin-bottom: 5px;
  86.         margin-top: 5px;
  87.         min-width: 400px;
  88.     }
  89.     .block_obj_input_div {
  90.         margin-top: 5px;
  91.     }
  92.     .block_obj_input {
  93.         background-color: #C0C0C0;
  94.         border: 1px solid #C0C0C0;
  95.         color: #000;
  96.         font-size: 13px;
  97.         min-height: 15px;
  98.         margin-left: 5px;
  99.         margin-right: 5px;
  100.         padding-left: 4px;
  101.     }
  102.     .block_obj_keyword_input {
  103.         width: 150px;
  104.     }
  105.     .block_obj_input_btn {
  106.         background-color: #3da9cc;
  107.         border-radius: 3px;
  108.         border: 1px solid #73C9E5;
  109.         box-shadow: 0 0 4px #73C9E5;
  110.         color: #FFF;
  111.         cursor: pointer;
  112.         display: inline-block;
  113.         min-height: 15px;
  114.         line-height: normal;
  115.         margin-left: 5px;
  116.         text-align: center;
  117.         vertical-align: bottom;
  118.         white-space: nowrap;
  119.         width: 30px;
  120.     }
  121.     .block_obj_list_div {
  122.         margin-top: 5px;
  123.     }
  124.     .block_obj_list_textarea_div {
  125.         border: 1px dotted #00A1D6;
  126.         margin-top: 3px;
  127.         max-height: 60px;
  128.         min-height: 3px;
  129.         overflow: auto;
  130.     }
  131.     .block_obj_list_textarea_div::-webkit-scrollbar {
  132.         background-color: #979797;
  133.         border-radius: 5px;
  134.         width: 10px;
  135.     }
  136.     .block_obj_list_textarea_div::-webkit-scrollbar-thumb {
  137.         background-color: #404040;
  138.         border-radius: 5px;
  139.     }
  140.     .block_obj_button_clicked {
  141.         color: #000;
  142.     }
  143.     .block_obj_child_span {
  144.         background-color: #3D3D3D;
  145.         border-radius: 5px;
  146.         border: 1px solid #3D3D3D;
  147.         display: inline-block;
  148.         margin: 3px;
  149.         padding: 2px;
  150.         min-height: 18px;
  151.         line-height: normal;
  152.     }
  153.     .block_obj_child_text {
  154.         border-right: 1px solid #A9181C;
  155.         margin-right: 4px;
  156.         padding-right: 4px;
  157.     }
  158.     .block_obj_child_del {
  159.         color: #A9181C;
  160.         cursor: pointer;
  161.     }
  162.     .block_obj_list_textarea_expand {
  163.         max-height: 720px;
  164.     }
  165.     .block_obj_li_hide {
  166.         display: none;
  167.     }
  168.     .block_obj_reg_input {
  169.         width: 100px;
  170.     }
  171.     .block_obj_modifier_input {
  172.         width: 50px;
  173.     }
  174.     .block_obj_button {
  175.         background-color: #FB7299;
  176.         border-radius: 4px;
  177.         border: 1px solid #FB7299;
  178.         color: #FFF;
  179.         cursor: pointer;
  180.         margin-top: 5px;
  181.         padding: 2px 4px;
  182.         position: relative;
  183.         min-height: 17px;
  184.         line-height: normal;
  185.     }
  186.     .block_obj_save_button {
  187.         float: right;
  188.         margin-right: 5px;
  189.     }
  190.     .block_obj_cancel_button {
  191.         float: left;
  192.         margin-left: 5px;
  193.     }
  194.     .block_obj_expand_box {
  195.         bottom: 0px;
  196.         height: 6vh;
  197.         position: fixed;
  198.         right: -6vw;
  199.         transition: 0.5s;
  200.         width: 12vw;
  201.         z-index: 99999;
  202.     }
  203.     .block_obj_show_expand_box {
  204.         right: 0;
  205.         width: 6vw;
  206.     }
  207.     .block_obj_expand_span {
  208.         background-color: #00A1D6;
  209.         border-radius: 19px;
  210.         border: 1px solid #00A1D6;
  211.         bottom: 1vh;
  212.         color: #FFF;
  213.         cursor: pointer;
  214.         display: block;
  215.         font-size: 13px;
  216.         height: 38px;
  217.         line-height: 38px;
  218.         position: absolute;
  219.         right: 1vw;
  220.         text-align: center;
  221.         width: 38px;
  222.         z-index: 99999;
  223.     }
  224.     .block_obj_expand_span:hover {
  225.         box-shadow: 0 0 5px 1px green;
  226.     }
  227. `;
  228. class Block_Obj {
  229.     constructor(config) {
  230.         this.wrapDiv = null;
  231.         this.mainFieldset = null;
  232.         this.ulNode = null;
  233.         this.style = null;
  234.         this.saveField = [];
  235.         this.onSave = null;
  236.         this.field = [];
  237.         this.config = config;
  238.     }
  239.     init(initialization) {
  240.         if (! this.id) {
  241.             this.id = initialization.id ? 'blockObj_' + initialization.id : 'blockObj_' + Block_Obj.count;
  242.             ! initialization.id && Block_Obj.count ++;
  243.         }
  244.         this.display = initialization.display ? true : false;
  245.         if (initialization.events) {
  246.             if (typeof(initialization.events['save']) === 'function') {
  247.                 this.onSave = initialization.events['save'];
  248.             }
  249.         }
  250.         this.style = document.createElement('style');
  251.         this.style.type = 'text/css';
  252.         this.style.innerHTML = BLOCK_STYLE;
  253.         document.body.appendChild(this.style);
  254.         ! this.wrapDiv && this.createSettingsPanel();
  255.         this.field = initialization.field;
  256.         this.settingsPanel();
  257.         let expand_box = document.createElement('div');
  258.         expand_box.className = 'block_obj_expand_box';
  259.         expand_box.onmouseenter = function() {
  260.             this.classList.add('block_obj_show_expand_box');
  261.         };
  262.         expand_box.onmouseleave = function() {
  263.             this.classList.remove('block_obj_show_expand_box');
  264.         };
  265.         let expand_span = document.createElement('span');
  266.         expand_span.id = this.id + '_expandSpan';
  267.         expand_span.className = 'block_obj_expand_span';
  268.         expand_span.textContent = '屏蔽';
  269.         expand_span.title = '显示屏蔽设置';
  270.         expand_span.addEventListener('click', () => this.expandWrap());
  271.         expand_box.appendChild(expand_span);
  272.         document.body.appendChild(expand_box);
  273.     }
  274.     settingsPanel() {
  275.         if (Array.isArray(this.field)) {
  276.             this.field.forEach(ele => {
  277.                 if (ele.id && ! this.wrapDiv.querySelector('#' + this.id + '_' + ele.id)) {
  278.                     switch (ele.type.toLowerCase()) {
  279.                         case 'separator':
  280.                         case 's':
  281.                             this.insertSeparator(ele.id, ele.label, ele.title, ele.classname);
  282.                             break;
  283.                         case 'input':
  284.                         case 'i':
  285.                             this.insertInput(ele.id, ele.list_id, false, ele.label, ele.title, ele.placeholder, ele.classname);
  286.                             break;
  287.                         case 'reg_input':
  288.                         case 'ri':
  289.                             this.insertInput(ele.id, ele.list_id, true, ele.label, ele.title, ele.placeholder, ele.classname);
  290.                             break;
  291.                         case 'list':
  292.                         case 'l':
  293.                             this.insertList(ele.id, this.config[ele.id] ? this.config[ele.id] : ele.default, ele.label, ele.title, ele.classname);
  294.                             break;
  295.                         case 'checkbox':
  296.                         case 'c':
  297.                         default:
  298.                             this.insertCheckbox(ele.id, ele.label, ele.title, this.config[ele.id] ? this.config[ele.id] : ele.default, ele.classname);
  299.                             break;
  300.                     }
  301.                 }
  302.             });
  303.         }
  304.         let save_button = this.createSpanBtn('block_obj_button block_obj_save_button', '保存并关闭', '保存设置并关闭设置窗口', e => {
  305.             this.saveConfig(true);
  306.         });
  307.         let only_save_button = this.createSpanBtn('block_obj_button block_obj_save_button', '仅保存', '仅保存设置', e => {
  308.             this.saveConfig(false);
  309.             only_save_button.textContent = '已保存';
  310.             save_timer && window.clearTimeout(save_timer);
  311.             var save_timer = window.setTimeout(() => {
  312.                 only_save_button.textContent = '仅保存';
  313.             }, 1500);
  314.         });
  315.         let cancel_button = this.createSpanBtn('block_obj_button block_obj_cancel_button', '取消', '关闭设置窗口', e => {
  316.             this.expandWrap();
  317.             cancel_timer && window.clearTimeout(cancel_timer);
  318.             var cancel_timer = window.setTimeout(() => {
  319.                 this.display = false;
  320.                 this.destroyAndRebuild();
  321.             }, 800);
  322.             e.stopPropagation();
  323.         });
  324.         this.ulNode.appendChild(save_button);
  325.         this.ulNode.appendChild(only_save_button);
  326.         this.ulNode.appendChild(cancel_button);
  327.         document.body.appendChild(this.wrapDiv);
  328.     }
  329.     getConfig() {
  330.         return this.config;
  331.     }
  332.     saveConfig(close_status) {
  333.         this.saveField.forEach(item => {
  334.             if (item.type == 'checkbox') {
  335.                 this.config[item.key] = document.getElementById(this.id + '_' + item.key).checked;
  336.             } else if (item.type == 'list') {
  337.                 this.config[item.key] = this.extractList(this.id + '_' + item.key);
  338.             }
  339.             typeof(this.onSave) === 'function' && this.onSave(this.config);
  340.             close_status && this.expandWrap();
  341.         });
  342.     }
  343.     createSettingsPanel() {
  344.         this.wrapDiv = document.createElement('div');
  345.         this.wrapDiv.id = this.id + '_wrapDiv';
  346.         this.wrapDiv.className = 'block_obj_wrap_div ' + this.display ? 'block_obj_show_wrap' : 'block_obj_hidden_wrap';
  347.         this.mainFieldset = document.createElement('fieldset');
  348.         this.mainFieldset.id = this.id + '_mainFieldset';
  349.         this.mainFieldset.className = 'block_obj_main_fieldset';
  350.         this.wrapDiv.appendChild(this.mainFieldset);
  351.         this.ulNode = document.createElement('ul');
  352.         this.ulNode.id = this.id + '_ulNode';
  353.         this.ulNode.className = 'block_obj_ul_node';
  354.         this.mainFieldset.appendChild(this.ulNode);
  355.         document.body.appendChild(this.wrapDiv);
  356.     }
  357.     destroyAndRebuild(new_config = null) {
  358.         this.config = this.config || new_config;
  359.         document.body.removeChild(this.wrapDiv);
  360.         this.createSettingsPanel();
  361.         this.settingsPanel();
  362.     }
  363.     expandWrap() {
  364.         let panel = document.getElementById(this.id + '_wrapDiv');
  365.         let button = document.getElementById(this.id + '_expandSpan');
  366.         if (panel) {
  367.             if (panel.classList.contains('block_obj_show_wrap')) {
  368.                 this.display = false;
  369.                 panel.classList.remove('block_obj_show_wrap');
  370.                 panel.classList.add('block_obj_hidden_wrap');
  371.                 if (button) {
  372.                     button.title = '显示屏蔽设置';
  373.                 }
  374.             } else {
  375.                 this.display = true;
  376.                 panel.classList.remove('block_obj_hidden_wrap');
  377.                 panel.classList.add('block_obj_show_wrap');
  378.                 if (button) {
  379.                     button.title = '隐藏屏蔽设置';
  380.                 }
  381.             }
  382.         }
  383.     }
  384.     insertCheckbox(id, label = '', title = '', checked = false, classname = null) {
  385.         let checkbox_li = document.createElement('li');
  386.         checkbox_li.className = 'block_obj_checkbox_li';
  387.         classname && checkbox_li.classList.add(classname);
  388.         let checkbox_input = document.createElement('input');
  389.         checkbox_input.type = 'checkbox';
  390.         checkbox_input.className = 'block_obj_checkbox_input';
  391.         checkbox_input.id = this.id + '_' + id;
  392.         checkbox_input.checked = checked ? true : false;
  393.         let checkbox_label = document.createElement('label');
  394.         checkbox_label.className = 'block_obj_checkbox_label';
  395.         checkbox_label.setAttribute('for', id);
  396.         checkbox_label.textContent = label;
  397.         checkbox_label.title = title;
  398.         checkbox_li.appendChild(checkbox_input);
  399.         checkbox_li.appendChild(checkbox_label);
  400.         this.ulNode.appendChild(checkbox_li);
  401.         this.saveField.push({
  402.             'key': id,
  403.             'type': 'checkbox'
  404.         });
  405.     }
  406.     insertSeparator(id = null, label = null, title = null, li_classname = null) {
  407.         let separator_li = document.createElement('li');
  408.         separator_li.className = 'block_obj_separator_li';
  409.         li_classname && separator_li.classList.add(li_classname);
  410.         let separator_div = document.createElement('div');
  411.         if (id) {
  412.             separator_div.id = this.id + '_' + id;
  413.         }
  414.         if (label) {
  415.             separator_div.className = 'block_obj_separator_text';
  416.             separator_div.textContent = label;
  417.         } else {
  418.             separator_div.className = 'block_obj_separator_symbol';
  419.         }
  420.         separator_div.title = title ? title : '';
  421.         separator_li.appendChild(separator_div);
  422.         this.ulNode.appendChild(separator_li);
  423.     }
  424.     insertInput(id, list_id, is_reg = false, label = '', title = '', placeholder = '', li_classname = null) {
  425.         let input_li = document.createElement('li');
  426.         input_li.className = li_classname ? li_classname : '';
  427.         let input_div = document.createElement('div');
  428.         input_div.className = 'block_obj_input_div';
  429.         let input_span = document.createElement('span');
  430.         input_span.className = 'block_obj_input_span';
  431.         input_span.textContent = label;
  432.         input_div.appendChild(input_span);
  433.         let input = document.createElement('input');
  434.         input.id = this.id + '_' + id;
  435.         input.title = title;
  436.         input.placeholder = placeholder;
  437.         input.type = 'text';
  438.         input.className = is_reg ? 'block_obj_input block_obj_reg_input' : 'block_obj_input block_obj_keyword_input';
  439.         input_span.appendChild(input);
  440.         let modifier_span = document.createElement('span');
  441.         modifier_span.textContent = '修饰符：';
  442.         is_reg && input_div.appendChild(modifier_span);
  443.         let modifier_input = document.createElement('input');
  444.         modifier_input.placeholder = '如:gim';
  445.         modifier_input.type = 'text';
  446.         modifier_input.className = 'block_obj_input block_obj_modifier_input';
  447.         modifier_span.appendChild(modifier_input);
  448.         list_id = this.id + '_' + list_id;
  449.         input.addEventListener('keyup', e => {
  450.             if (e.keyCode === 13) {
  451.                 is_reg ? this.addRegListItem(input, modifier_input, list_id) : this.addListItem(input, list_id);
  452.             }
  453.         });
  454.         modifier_input.addEventListener('keyup', e => {
  455.             e.keyCode === 13 && this.addRegListItem(input, modifier_input, list_id);
  456.         });
  457.         let add_btn = this.createSpanBtn('block_obj_input_btn', '添加', '添加内容到列表中', e => {
  458.             if (is_reg ? this.addRegListItem(input, modifier_input, list_id) : this.addListItem(input, list_id))
  459.                 this.buttonClicked(add_btn, '添加成功', 'block_obj_button_clicked');
  460.         });
  461.         let delete_btn = this.createSpanBtn('block_obj_input_btn', '删除', '从列表中删除符合的项目', e => {
  462.             if (is_reg ? this.delRegListItem(input, modifier_input, list_id) : this.delListItem(input, list_id))
  463.                 this.buttonClicked(delete_btn, '删除成功', 'block_obj_button_clicked');
  464.         });
  465.         let clear_btn = this.createSpanBtn('block_obj_input_btn', '清空', '清空列表', e => {
  466.             document.getElementById(list_id).innerHTML = '';
  467.             this.buttonClicked(clear_btn, '清除成功', 'block_obj_button_clicked');
  468.         });
  469.         let copy_btn = this.createSpanBtn('block_obj_inut_btn', '复制', '复制列表', e => {
  470.             if (typeof(GM_setClipboard) == 'function') {
  471.                 GM_setClipboard(this.extractList(list_id).toString(), 'text');
  472.                 this.buttonClicked(copy_btn, '复制成功', 'block_obj_button_clicked');
  473.             } else {
  474.                 alert('GM_setClipboard is not an interface.');
  475.             }
  476.         });
  477.         let expand_btn = this.createSpanBtn('block_obj_input_btn', '展开', '展开列表', e => {
  478.             li_classname && this.toggleList(li_classname);
  479.             if (expand_btn.textContent == '展开') {
  480.                 expand_btn.textContent = '恢复';
  481.                 expand_btn.title = '收缩列表';
  482.             } else {
  483.                 expand_btn.textContent = '展开';
  484.                 expand_btn.title = '展开列表';
  485.             }
  486.         });
  487.         input_div.appendChild(add_btn);
  488.         input_div.appendChild(delete_btn);
  489.         input_div.appendChild(clear_btn);
  490.         input_div.appendChild(copy_btn);
  491.         input_div.appendChild(expand_btn);
  492.         input_li.appendChild(input_div);
  493.         this.ulNode.appendChild(input_li);
  494.     }
  495.     insertList(id, save_array = [], label = '', title = '', li_classname = '') {
  496.         let list_li = document.createElement('li');
  497.         list_li.className = li_classname;
  498.         let list_div = document.createElement('div');
  499.         list_div.className = 'block_obj_list_div';
  500.         list_div.textContent = label;
  501.         list_div.title = title;
  502.         let list_textarea_div = document.createElement('div');
  503.         list_textarea_div.id = this.id + '_' + id;
  504.         list_textarea_div.className = 'block_obj_list_textarea_div';
  505.         for (let item of save_array) {
  506.             item && list_div.insertAdjacentElement('afterbegin', this.createListItem(item));
  507.         }
  508.         list_div.appendChild(list_textarea_div);
  509.         list_li.appendChild(list_div);
  510.         this.ulNode.appendChild(list_li);
  511.         this.saveField.push({
  512.             'key': id,
  513.             'type': 'list'
  514.         });
  515.     }
  516.     addListItem(input, list_id) {
  517.         let text_value = input.value;
  518.         if (text_value) {
  519.             let text_arr = this.stringToArray(text_value);
  520.             let save_arr = this.extractList(list_id);
  521.             text_arr.forEach(item => {
  522.                 ! save_arr.includes(item) && document.getElementById(list_id).insertAdjacentElement('afterbegin', this.createListItem(item));
  523.             });
  524.             input.value = '';
  525.             return true;
  526.         }
  527.         return false;
  528.     }
  529.     delListItem(input, list_id) {
  530.         let text_value = input.value;
  531.         if (text_value) {
  532.             let del_status = false;
  533.             let text_arr = this.stringToArray(text_value);
  534.             let save_arr = this.extractList(list_id);
  535.             text_arr.forEach(item => {
  536.                 if (save_arr.includes(item)) {
  537.                     let total_child = document.getElementById(list_id).getElementsByClassName('block_obj_child_span');
  538.                     try {
  539.                         document.getElementById(list_id).removeChild(total_child[total_child.length - 1 - save_arr.indexOf(item)]);
  540.                         del_status = true;
  541.                     } catch(e) {
  542.                         del_status = false;
  543.                         console.error('Block_Obj: Error deleting element.');
  544.                         console.error(e);
  545.                     }
  546.                 }
  547.             });
  548.             if (del_status) {
  549.                 input.value = '';
  550.                 return true;
  551.             }
  552.         }
  553.         return false;
  554.     }
  555.     addRegListItem(reg_input, modifier_input, list_id) {
  556.         let reg_value = reg_input.value;
  557.         let modifier_value = modifier_input.value;
  558.         if (reg_value) {
  559.             try {
  560.                 let reg_obj = new RegExp(reg_value, modifier_value);
  561.                 let save_arr = this.extractList(list_id);
  562.                 ! save_arr.includes(reg_obj.toString()) && document.getElementById(list_id).insertAdjacentElement('afterbegin', this.createListItem(reg_obj.toString()));
  563.                 reg_input.value = '';
  564.                 modifier_input.value = '';
  565.                 return true;
  566.             } catch(e) {
  567.                 console.error('Block_Obj: Invalid regular expression.');
  568.                 console.error(e);
  569.             }
  570.         }
  571.         return false;
  572.     }
  573.     delRegListItem(reg_input, modifier_input, list_id) {
  574.         let reg_value = reg_input.value;
  575.         let modifier_value = modifier_input.value;
  576.         if (reg_value) {
  577.             let del_status = false;
  578.             try {
  579.                 let reg_obj = new RegExp(reg_value, modifier_value);
  580.                 let save_arr = this.extractList(list_id);
  581.                 if (save_arr.includes(reg_obj.toString())) {
  582.                     let total_child = document.getElementById(list_id).getElementsByClassName('block_obj_child_span');
  583.                     document.getElementById(list_id).removeChild(total_child[total_child.length - 1 - save_arr.indexOf(reg_obj.toString())]);
  584.                     del_status = true;
  585.                 }
  586.             } catch(e) {
  587.                 del_status = false;
  588.                 console.error('Block_Obj: Invalid regular expression or error deleting element.');
  589.                 console.error(e);
  590.             }
  591.             if (del_status) {
  592.                 reg_input.value = '';
  593.                 modifier_input.value = '';
  594.                 return true;
  595.             }
  596.             return false;
  597.         }
  598.     }
  599.     createSpanBtn(classname, label, title, callback) {
  600.         let btn_span = document.createElement('span');
  601.         btn_span.className = classname;
  602.         btn_span.textContent = label;
  603.         btn_span.title = title;
  604.         btn_span.addEventListener('click', e => typeof(callback) === 'function' && callback(e));
  605.         return btn_span;
  606.     }
  607.     createListItem(text_value) {
  608.         let child_span = document.createElement('span');
  609.         child_span.className = 'block_obj_child_span';
  610.         let text_span = document.createElement('span');
  611.         text_span.className = 'block_obj_child_text';
  612.         text_span.textContent = text_value.length > 9 ? text_value.slice(0, 3) + '...' + text_value.slice(-3) : text_value;
  613.         if (text_value.length > 9) {
  614.             text_span.title = text_value;
  615.         }
  616.         let del_span = document.createElement('span');
  617.         del_span.textContent = 'X';
  618.         del_span.title = '移除';
  619.         del_span.className = 'block_obj_child_del';
  620.         del_span.addEventListener('click', e => child_span.remove());
  621.         child_span.appendChild(text_span);
  622.         child_span.appendChild(del_span);
  623.         return child_span;
  624.     }
  625.     buttonClicked(button, click_title, click_class) {
  626.         let original_title = button.title;
  627.         button.title = click_title;
  628.         click_class && button.classList.add(click_class);
  629.         timer && window.clearTimeout(timer);
  630.         var timer = window.setTimeout(() => {
  631.             button.title = original_title;
  632.             button.classList.remove(click_class);
  633.         }, 1500);
  634.     }
  635.     extractList(list_id) {
  636.         let re_arr = [];
  637.         let list_dom = document.getElementById(list_id);
  638.         let list_arr = list_dom.getElementsByClassName('block_obj_child_text');
  639.         for (let i = list_arr.length - 1; i >= 0; i --) {
  640.             list_arr[i].title ? re_arr.push(list_arr[i].title) : re_arr.push(list_arr[i].textContent);
  641.         }
  642.         return re_arr;
  643.     }
  644.     stringToArray(text_string) {
  645.         let temp_array = text_string.split(',');
  646.         let return_array = [];
  647.         for (let i = 0, l = temp_array.length; i < l; i ++) {
  648.             for (let j = i + 1; j < l; j ++) {
  649.                 if (temp_array[i] === temp_array[j]) {
  650.                     ++ i;
  651.                     j = i;
  652.                 }
  653.             }
  654.             return_array.push(temp_array[i]);
  655.         }
  656.         return return_array;
  657.     }
  658.     toggleList(li_classname) {
  659.         for (let li of this.ulNode.querySelectorAll('li')) {
  660.             if (li.classList.contains(li_classname)) {
  661.                 let list_textarea_div = li.querySelector('.block_obj_list_textarea_div');
  662.                 if (list_textarea_div) {
  663.                     list_textarea_div.classList.contains('block_obj_list_textarea_expand') ? list_textarea_div.classList.remove('block_obj_list_textarea_expand') : list_textarea_div.classList.add('block_obj_list_textarea_expand');
  664.                 }
  665.             } else {
  666.                 li.classList.contains('block_obj_li_hide') ? li.classList.remove('block_obj_li_hide') : li.classList.add('block_obj_li_hide');
  667.             }
  668.         }
  669.     }
  670.     static convertArray(string_array) {
  671.         let re_arr = [];
  672.         if (Array.isArray(string_array)) {            
  673.             for (let i in string_array) {
  674.                 try {
  675.                     let new_reg = new RegExp(string_array[i].replace(/^\/|\/[a-z]*$/gi, ''), string_array[i].replace(/^\/.*\/[^a-z]*/i, ''));
  676.                     re_arr.push(new_reg);
  677.                 } catch(e) {
  678.                     console.error('Block_Obj: The transformation contains invalid regular expressions.');
  679.                     console.error(e);
  680.                 }
  681.             }
  682.         }
  683.         return re_arr;
  684.     }
  685. }
  686. Block_Obj.count = 0;