script.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  1. //创建复制中文按钮
  2. function create_copy_text_button(el) {
  3. const copy_button = document.createElement("button");
  4. copy_button.className = "btn btn-default btn-sm copy-code";
  5. copy_button.innerHTML = "Text";
  6. copy_button.type = "button";
  7. copy_button.onclick = function () {
  8. copy_button.innerHTML = "✅";
  9. //cover after 2s
  10. setTimeout(function () {
  11. copy_button.innerHTML = "Text";
  12. }, 2000);
  13. const text = el.text_content;
  14. const textarea = document.createElement("textarea");
  15. textarea.value = text;
  16. document.body.appendChild(textarea);
  17. textarea.select();
  18. document.execCommand("copy");
  19. document.body.removeChild(textarea);
  20. };
  21. return copy_button;
  22. }
  23. //创建展开收起按钮
  24. function create_collapse_button(el) {
  25. const collapse_button = document.createElement("button");
  26. collapse_button.className = "btn btn-link btn-sm collapse-code";
  27. collapse_button.innerHTML = "🔼";
  28. collapse_button.type = "button";
  29. collapse_button.onclick = function () {
  30. if (collapse_button.innerHTML === "🔼") {
  31. collapse_button.innerHTML = "🔽";
  32. el.style.display = "none";
  33. } else {
  34. collapse_button.innerHTML = "🔼";
  35. el.style.display = "block";
  36. }
  37. };
  38. return collapse_button;
  39. }
  40. //创建一键复制功能
  41. function create_copy_all_button(json_content) {
  42. const copy_all_button = document.createElement("button");
  43. copy_all_button.className = "btn btn-default btn-sm copy-all";
  44. copy_all_button.innerHTML = "Copy All";
  45. copy_all_button.type = "button";
  46. const keys = Object.keys(json_content);
  47. const text = keys.reduce(function (acc, key) {
  48. return acc + `'${json_content[key]}'|"${json_content[key]}"|`;
  49. }, "");
  50. copy_all_button.onclick = function () {
  51. copy_all_button.innerHTML = "✅";
  52. //cover after 2s
  53. setTimeout(function () {
  54. copy_all_button.innerHTML = "Copy All";
  55. }, 2000);
  56. const textarea = document.createElement("textarea");
  57. textarea.value = text.slice(0, -1);
  58. document.body.appendChild(textarea);
  59. textarea.select();
  60. document.execCommand("copy");
  61. document.body.removeChild(textarea);
  62. };
  63. return copy_all_button;
  64. }
  65. //创建复制按钮
  66. function create_copy_code_button(el) {
  67. const copy_button = document.createElement("button");
  68. copy_button.className = "btn btn-default btn-sm copy-code";
  69. copy_button.innerHTML = "Code";
  70. copy_button.type = "button";
  71. copy_button.onclick = function () {
  72. copy_button.innerHTML = "✅";
  73. //cover after 2s
  74. setTimeout(function () {
  75. copy_button.innerHTML = "Code";
  76. }, 2000);
  77. const text = el.code_content;
  78. const textarea = document.createElement("textarea");
  79. textarea.value = text;
  80. document.body.appendChild(textarea);
  81. textarea.select();
  82. document.execCommand("copy");
  83. document.body.removeChild(textarea);
  84. };
  85. return copy_button;
  86. }
  87. //创建键值标签
  88. function create_key_value(key, value) {
  89. const key_value = document.createElement("div");
  90. key_value.className = "key-value";
  91. const key_text = document.createElement("div");
  92. key_text.className = "key-text";
  93. key_text.innerHTML = key;
  94. const value_text = document.createElement("div");
  95. value_text.className = "value-text";
  96. value_text.innerHTML = value;
  97. key_value.appendChild(value_text);
  98. key_value.appendChild(key_text);
  99. return key_value;
  100. }
  101. //生成具体的列表
  102. function create_list(list_name, list_content) {
  103. console.log("创建", list_name, list_content);
  104. const ul_list = document.createElement("ul");
  105. const keys = Object.keys(list_content);
  106. ul_list.className = "list-group";
  107. ul_list.id = list_name;
  108. for (let i = 0; i < keys.length; i++) {
  109. const list_item = document.createElement("li");
  110. list_item.className = "list-group-item key-value-container";
  111. const key_value = create_key_value(keys[i], list_content[keys[i]]);
  112. list_item.appendChild(key_value);
  113. list_item.code_content = `i18nBook.${list_name}.${keys[i]}.t`;
  114. list_item.text_content = `'${list_content[keys[i]]}'|"${
  115. list_content[keys[i]]
  116. }"`;
  117. const text_button = create_copy_text_button(list_item);
  118. const code_button = create_copy_code_button(list_item);
  119. const button_container = document.createElement("div");
  120. button_container.className = "btn-group";
  121. button_container.appendChild(text_button);
  122. button_container.appendChild(code_button);
  123. list_item.appendChild(button_container);
  124. ul_list.appendChild(list_item);
  125. }
  126. return ul_list;
  127. }
  128. //通过JSON文件生成一列表
  129. function create_col(list_name, list_content) {
  130. console.log("创建", list_name, list_content);
  131. const panel = document.createElement("div");
  132. const keys = Object.keys(list_content);
  133. panel.className = "json-column";
  134. for (let i = 0; i < keys.length; i++) {
  135. const list_item = document.createElement("div");
  136. panel.appendChild(list_item);
  137. if (keys[i] == "locale") {
  138. } else {
  139. list_item.className = "panel panel-info";
  140. const head_div = document.createElement("div");
  141. head_div.className = "panel-heading heading-container";
  142. head_div.innerHTML = keys[i]+" —— ("+Object.keys(list_content[keys[i]]).length+")";
  143. list_item.appendChild(head_div);
  144. const list_item_content = create_list(keys[i], list_content[keys[i]]);
  145. const collapse_button = create_collapse_button(list_item_content);
  146. const copy_all_button = create_copy_all_button(list_content[keys[i]]);
  147. const button_container = document.createElement("div");
  148. create_sortable(list_item_content);
  149. button_container.appendChild(copy_all_button);
  150. button_container.appendChild(collapse_button);
  151. head_div.appendChild(button_container);
  152. list_item.appendChild(list_item_content);
  153. }
  154. }
  155. return panel;
  156. }
  157. //创建可拖拽
  158. function create_sortable(el) {
  159. const sortable = Sortable.create(el, {
  160. group: "shared",
  161. animation: 150,
  162. onUpdate: function (/**Event*/ evt) {
  163. console.log("onUpdate", evt);
  164. },
  165. });
  166. }
  167. //获取assets文件夹下的文件
  168. async function access_assets() {
  169. let fileHandles = [];
  170. var FileSystemDirectoryHandle = await window.showDirectoryPicker({
  171. startIn: "documents",
  172. });
  173. console.log(FileSystemDirectoryHandle);
  174. var currentDirHandle = await FileSystemDirectoryHandle.entries();
  175. console.log(currentDirHandle);
  176. let currentDir = await currentDirHandle.next();
  177. //循环遍历目录
  178. while (!currentDir.done) {
  179. console.log(currentDir.value[0]);
  180. fileHandles.push(currentDir.value);
  181. currentDir = await currentDirHandle.next();
  182. }
  183. for (let json_file of fileHandles) {
  184. if (json_file[0] == "class_mapping.json") {
  185. const mapping_file_handle = json_file[1];
  186. const mapping_file = await mapping_file_handle.getFile();
  187. const mapping_file_content = await mapping_file.text();
  188. const mapping_file_json = JSON.parse(mapping_file_content);
  189. console.log(mapping_file_json);
  190. } else {
  191. if (json_file[0] == "zh_CN.json") {
  192. const mapping_file_handle = json_file[1];
  193. const mapping_file = await mapping_file_handle.getFile();
  194. const mapping_file_content = await mapping_file.text();
  195. const mapping_file_json = JSON.parse(mapping_file_content);
  196. const column = create_col(json_file[0], mapping_file_json);
  197. document.getElementById("translate_list").appendChild(column);
  198. }
  199. }
  200. }
  201. }