1/* 2* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd. 3* Licensed under the Apache License, Version 2.0 (the "License"); 4* you may not use this file except in compliance with the License. 5* You may obtain a copy of the License at 6* 7* http://www.apache.org/licenses/LICENSE-2.0 8* 9* Unless required by applicable law or agreed to in writing, software 10* distributed under the License is distributed on an "AS IS" BASIS, 11* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12* See the License for the specific language governing permissions and 13* limitations under the License. 14*/ 15 16class AttributeArea { 17 constructor() { 18 document.attrCallback = this; 19 this.area = document.getElementById("attribute_area"); 20 this.htmlStr = "" 21 this.callbackFunc = null; 22 this.freshInputValue_ = [] 23 } 24 clear() { 25 this.htmlStr = "" 26 } 27 flush() { 28 this.area.innerHTML = this.htmlStr 29 while (this.freshInputValue_.length > 0) { 30 let v = this.freshInputValue_.shift(); 31 let e = document.getElementById(v[0]); 32 e.value = v[1]; 33 } 34 } 35 addTitle(name) { 36 this.htmlStr += '<p class="att_title">' + name + '</p>'; 37 } 38 addImage(path) { 39 this.htmlStr += '<img src="' + path + '">' + '</img>'; 40 } 41 addDotLine() { 42 this.htmlStr += '<p class="att_line">' + "----------------------" + '</p>'; 43 } 44 addInput(searchId, label, default_, disable) { 45 let ret = '<label class="input_text_readonly">' + label + '</label>' 46 ret += '<input id="' + searchId + '"'; 47 ret += ' class="input_text"'; 48 if (default_.indexOf('"') >= 0) { 49 ret += ' value=""'; 50 this.freshInputValue_.push([searchId, default_]) 51 } 52 else 53 ret += ' value="' + default_ + '"'; 54 if (disable) 55 ret += ' disabled="disabled"'; 56 ret += ' oninput="document.attrCallback.Event(' + "'input', " + "'" + searchId + "'" + ')" /><br>' 57 this.htmlStr += ret; 58 } 59 addTextArea(searchId, label, default_) { 60 let ret = '<label class="input_text_readonly">' + label + '</label><br>' 61 ret += '<textarea id="' + searchId + '"'; 62 ret += ' class="text_area"'; 63 ret += ' oninput="document.attrCallback.Event(' + "'input', " + "'" + searchId + "'" + ')">' 64 ret += default_; 65 ret += '</textarea><br>';//cols="20" rows="10" 66 this.htmlStr += ret; 67 } 68 addButton(searchId, label) { 69 if (label.length > 13) label = label.substring(0, 10) + "..." 70 let text = '" class="button_click" type="button" onclick="document.attrCallback.Event(' 71 this.htmlStr += '<button id="' + searchId + text + "'button', " + 72 "'" + searchId + "'" + ')">' + label + '</button><br>'; 73 } 74 addLabelButton(searchId, label, title) { 75 if (label.length > 13) label = label.substring(0, 10) + "..." 76 let text = '" class="label_button_click" type="button" onclick="document.attrCallback.Event(' 77 this.htmlStr += '<label class="input_text_readonly">' + title + '</label><button id="' + searchId + text + "'button', " + 78 "'" + searchId + "'" + ')">' + label + '</button><br>'; 79 } 80 81 addButtonDelete(searchId, label) { 82 if (label.length > 13) label = label.substring(0, 10) + "..." 83 let text = '" class="button_click_delete" type="button" onclick="document.attrCallback.Event(' 84 this.htmlStr += '<button id="' + searchId + text + "'button', " + 85 "'" + searchId + "'" + ')">' + label + '</button><br>'; 86 } 87 addSelect(searchId, label, selectList, default_, disable) { 88 let ret = '<label class="input_text_readonly">' + label + '</label>' 89 ret += '<select id="' + searchId + '"'; 90 ret += ' class="select_list"' 91 ret += ' size="1"' 92 if (disable) 93 ret += ' disabled="disabled"'; 94 ret += ' onchange="document.attrCallback.Event(' + "'select', " + "'" + searchId + "'" + ')">'; 95 for (let i in selectList) { 96 if (selectList[i] == default_) { 97 ret += '<option selected="selected">' + selectList[i] + "</option>"; 98 } 99 else { 100 ret += "<option>" + selectList[i] + "</option>"; 101 } 102 } 103 ret += "</select><br>"; 104 this.htmlStr += ret; 105 } 106 addGap(type) { 107 if (type == 0) this.htmlStr += '<br>'; 108 } 109 Event(type, value) { 110 let cbv = ""; 111 if (type == "input") { 112 cbv = document.getElementById(value).value 113 } 114 else if (type == "select") { 115 cbv = document.getElementById(value).value 116 } 117 if (this.callbackFunc != null) { 118 this.callbackFunc(value, type, cbv) 119 } 120 } 121 registRecvCallback(func) { 122 this.callbackFunc = func 123 } 124} 125AttributeArea.pInstance_ = null; 126AttributeArea.gi = function () { 127 if (AttributeArea.pInstance_ == null) AttributeArea.pInstance_ = new AttributeArea(); 128 return AttributeArea.pInstance_; 129} 130 131module.exports = { 132 AttributeArea 133}