Skip to content

Commit

Permalink
现在可以直接上传文件了
Browse files Browse the repository at this point in the history
  • Loading branch information
YuanXiQWQ committed Sep 9, 2024
1 parent f9d63f7 commit 53d8727
Showing 1 changed file with 101 additions and 86 deletions.
187 changes: 101 additions & 86 deletions comparator.html
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,12 @@
}

.input-group label{
width: 125px;
width: 200px;
margin-right: 10px;
}

.APIConfig button{
width: 42px;
width: 200px;
}

.introduction{
Expand All @@ -98,7 +98,7 @@
.console{
/* layout */
display: grid;
grid-template-rows: 2em 1fr;
grid-template-rows: 3em 2em 2em 1fr;
}

.console-btns{
Expand Down Expand Up @@ -222,6 +222,15 @@
<button @click="autoGen">自动生成json</button>
<button @click="autoTranslate">自动翻译</button>
</div>
<div class="input-group">
<label for="oldFile">上传旧版翻译文件:</label>
<input type="file" id="oldFile" @change="loadFile('zh')">
</div>

<div class="input-group">
<label for="newFile">上传新版文件:</label>
<input type="file" id="newFile" @change="loadFile('en')">
</div>
<div class="console-textarea">
<label for="textJson"></label>
<textarea id="textJson"></textarea>
Expand All @@ -236,22 +245,7 @@
选择并填写API配置并点击 [保存]
</li>
<li class="introduction-list-li">
将旧版汉化文件(如 strings_9.5.1.json )重命名为 strings_old.json
</li>
<li class="introduction-list-li">
使
<ul>
<li style="list-style: square;">comparator.html;</li>
<li style="list-style: square;">strings_old.json;</li>
<li style="list-style: square;">更新的英文 strings.json</li>
</ul>
位于同级目录
</li>
<li class="introduction-list-li">
使用 VSCode 的 Live Server 插件打开 comparator.html ,将自动解析两个json文件
</li>
<li class="introduction-list-li">
点击 [对比] 按钮得到差异内容
上传旧版翻译文件和新版文件并点击 [对比] 按钮得到差异内容
</li>
<li class="introduction-list-li">
点击 [自动翻译] 按钮翻译并等待弹出"翻译完成"提示框,之后将结果使用
Expand All @@ -270,7 +264,7 @@
<b>对于没有API的用户</b>
<ol class="introduction-list">
<li class="introduction-list-li">
执行上面的步骤2,3,4,5
上传旧版翻译文件和新版文件并点击 [对比] 按钮得到差异内容
</li>
<li class="introduction-list-li">
点击 [自动生成json] 按钮生成整合后的 json 文件
Expand All @@ -286,7 +280,7 @@
整理
</li>
<li class="introduction-list-li">
执行上面的步骤7
重启 GitKraken
</li>
</ol>
<b>可能出现的问题和解决建议</b>
Expand All @@ -306,7 +300,7 @@
</ul>
</li>
<li class="introduction-list-li">
打开页面有一段时间非常卡
有一段时间非常卡
<ul>
<li style="list-style: circle">
由于JSON文件较大,卡顿是正常的
Expand Down Expand Up @@ -442,12 +436,6 @@
}
}
},
mounted() {
// 英文源文件
this.loadJsonKeys('./strings.json', 'en')
// 旧版汉化文件
this.loadJsonKeys('./strings_old.json', 'zh')
},
methods: {
/**
* 显示/隐藏内容
Expand All @@ -470,51 +458,78 @@
toggleOpenAI() {
this.showOpenAI = !this.showOpenAI;
},
loadJsonKeys(url, type) {
let vm = this;
let request = new XMLHttpRequest();
request.open("get", url);
request.send(null);
request.onload = function () {
if (request.status === 200) {
let key;
let json = JSON.parse(request.responseText);
if (type === 'en') {
vm.sourceEN = json;
}
const menuStrings = json['menuStrings'];
for (key in menuStrings) {
if (type === 'en') {
vm.menuStringsEN.push({
key: key,
value: menuStrings[key],
scope: 'menuStrings',
});
} else {
vm.menuStringsZH.push({
key: key,
value: menuStrings[key],
scope: 'menuStrings',
});
}
}
const strings = json['strings'];
for (key in strings) {
if (type === 'en') {
vm.menuStringsEN.push({
key: key,
value: strings[key],
scope: 'strings',
});
} else {
vm.menuStringsZH.push({
key: key,
value: strings[key],
scope: 'strings',
});
}
}
/**
* 删除上传的旧文件,读取上传的新文件
*
* @param type 上传的文件类型
*/
loadFile(type) {
const input = type === 'en' ? document.getElementById('newFile') : document.getElementById('oldFile');
const file = input.files[0];

if (!file) {
alert("请选择文件");
return;
}

if (type === 'en') {
this.menuStringsEN = [];
this.sourceEN = {};
} else {
this.menuStringsZH = [];
}

const reader = new FileReader();
reader.onload = e => {
try {
const json = JSON.parse(e.target.result);
if (type === 'en') {
this.sourceEN = json;
this.processJsonKeys(json, 'en');
} else {
this.processJsonKeys(json, 'zh');
}
} catch (err) {
alert("文件内容无效,无法解析为JSON");
}
};
reader.readAsText(file);
},

processJsonKeys(json, type) {
let key;
const menuStrings = json['menuStrings'];
for (key in menuStrings) {
if (type === 'en') {
this.menuStringsEN.push({
key: key,
value: menuStrings[key],
scope: 'menuStrings',
});
} else {
this.menuStringsZH.push({
key: key,
value: menuStrings[key],
scope: 'menuStrings',
});
}
}

const strings = json['strings'];
for (key in strings) {
if (type === 'en') {
this.menuStringsEN.push({
key: key,
value: strings[key],
scope: 'strings',
});
} else {
this.menuStringsZH.push({
key: key,
value: strings[key],
scope: 'strings',
});
}
}
},
doCompare() {
Expand All @@ -533,7 +548,7 @@
this.sourceEN[item.scope][item.key] = item.value;
}

document.getElementById("textJson").innerHTML = JSON.stringify(this.sourceEN, null, 2);
document.getElementById("textJson").innerHTML = JSON.stringify(this.sourceEN, null, 2);
},
async autoTranslate() {
if (this.menuStringsCY.length === 0) {
Expand Down Expand Up @@ -576,15 +591,15 @@
const sign = this.buildSign(query, curtime);
const url = 'https://openapi.youdao.com/api';
const data = {
q: query,
appKey: this.youdao.appKey,
salt: this.youdao.salt,
from: this.youdao.from,
to: this.youdao.to,
sign: sign,
signType: "v3",
curtime: curtime,
};
q: query,
appKey: this.youdao.appKey,
salt: this.youdao.salt,
from: this.youdao.from,
to: this.youdao.to,
sign: sign,
signType: "v3",
curtime: curtime,
};
return new Promise(resolve => {
$.ajax({
url: url,
Expand Down Expand Up @@ -650,23 +665,23 @@
return CryptoJS.SHA256(str).toString(CryptoJS.enc.Hex);
},
truncate(q) {
const len = q.length;
if (len <= 20) return q;
const len = q.length;
if (len <= 20) return q;
return q.substring(0, 10) + len + q.substring(len - 10, len);
},
sleep(time) {
return new Promise((resolve) => setTimeout(resolve, time));
},
saveKeys() {
// 获取 AppKey和 AppSecret 或 OpenAI API 密钥的表单内容
// 获取 AppKey和 AppSecret 或 OpenAI API 密钥的表单内容
if (this.selectedApi === 'youdao') {
this.youdao.appKey = document.getElementById('appKey').value;
this.youdao.appSecret = document.getElementById('appSecret').value;
alert('有道API 配置已保存');
} else if (this.selectedApi === 'openai') {
this.openai.apiKey = document.getElementById('openaiApiKey').value;
this.openai.model = document.getElementById("modelSelector").value;
alert('OpenAI API 配置已保存');
alert('OpenAI API 配置已保存');
}
}
},
Expand Down

0 comments on commit 53d8727

Please sign in to comment.