Skip to content

Commit

Permalink
strikethrough
Browse files Browse the repository at this point in the history
  • Loading branch information
@14790897
14790897 committed Sep 6, 2023
1 parent 657bd74 commit d7f2340
Show file tree
Hide file tree
Showing 3 changed files with 105 additions and 30 deletions.
6 changes: 5 additions & 1 deletion backend/app.py
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
from flask import Flask, request, jsonify, send_file, session, current_app
from handrightbeta import Template, handwrite
from handright import Template, handwrite
from PIL import Image, ImageFont
from threading import Thread
from PIL import Image, ImageFont, ImageQt, ImageDraw
Expand Down Expand Up @@ -302,6 +302,10 @@ def generate_handwriting():
perturb_x_sigma=int(data["perturb_x_sigma"]), # 笔画横向偏移随机扰动
perturb_y_sigma=int(data["perturb_y_sigma"]), # 笔画纵向偏移随机扰动
perturb_theta_sigma=float(data["perturb_theta_sigma"]), # 笔画旋转偏移随机扰动
strikethrough_probability=float(data["strikethrough_probability"]), # 删除线概率
strikethrough_length_sigma=float(data["strikethrough_length_sigma"]), # 删除线长度随机扰动
strikethrough_width_sigma=float(data["strikethrough_width_sigma"]), # 删除线宽度随机扰动
strikethrough_angle_sigma=float(data["strikethrough_angle_sigma"]), # 删除线角度随机扰动

)
images = handwrite(text_to_generate, template)
Expand Down
19 changes: 15 additions & 4 deletions frontend/src/i18n.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { createI18n } from 'vue-i18n'
import { createI18n } from "vue-i18n";

const messages = {
en: {
Expand Down Expand Up @@ -46,6 +46,13 @@ const messages = {
perturbThetaSigma: "Perturb Theta Sigma",
wordSpacing: "Word Spacing",
expand: "expand",
strikethrough_probability: "Probability of a strikethrough occurring",
strikethrough_length_sigma:
"Standard deviation of the strikethrough length",
strikethrough_width_sigma:
"Standard deviation of the strikethrough width",
strikethrough_angle_sigma:
"Standard deviation of the strikethrough angle",
},
},
cn: {
Expand Down Expand Up @@ -92,13 +99,17 @@ const messages = {
perturbThetaSigma: "笔画旋转偏移",
wordSpacing: "字间距",
expand: "更多内容",
strikethrough_probability: "涂改出现的几率",
strikethrough_length_sigma: "涂改线长度的标准差",
strikethrough_width_sigma: "涂改线宽度的标准差",
strikethrough_angle_sigma: "涂改线角度的标准差",
},
},
};

const i18n = createI18n({
locale: 'cn', // 默认显示的语言
locale: "cn", // 默认显示的语言
messages,
})
});

export default i18n
export default i18n;
110 changes: 85 additions & 25 deletions frontend/src/views/HomeView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
<div id="form">
<div class="container_file row">

<div class="col d-flex flex-row justify-content-between">
<div class="col justify-content-between">
<TextInput @childEvent="(eventData) => { this.text = eventData }"></TextInput>
</div>

Expand Down Expand Up @@ -79,7 +79,7 @@
<div class="label-container">

<label>{{ $t('message.fontSize') }}:
<input type="number" v-model="fontSize" />
<input type="number" v-model="fontSize" placeholder="recommend > 100"/>
</label>
</div>

Expand Down Expand Up @@ -113,13 +113,12 @@
</label>
</div>
<!-- 这是一个按钮，用户点击这个按钮时，会展开或折叠下面的内容区域 -->
<button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseContent"
aria-expanded="false" aria-controls="collapseContent" style="width: 100px;">
<button class="btn btn-primary" type="button" @click="toggleCollapse" style="width: 100px;">
{{ $t('message.expand') }}
</button>

<!-- 这是一个内容区域，它的 id 与上面的按钮的 data-target 相对应 -->
<div class="collapse" id="collapseContent">
<div v-if="isExpanded" id="collapseContent">
<div class="card card-body">
<div class="label-container">
<label>{{ $t('message.lineSpacingSigma') }}:
Expand Down Expand Up @@ -162,6 +161,31 @@
<input type="number" v-model="wordSpacing" />
</label>
</div>

<div class="label-container">
<label>{{ $t('message.strikethrough_length_sigma') }}:
<input type="text" v-model="strikethrough_length_sigma" />
</label>
</div>

<div class='label-container'>
<label>{{ $t('message.strikethrough_angle_sigma') }}:
<input type="number" v-model="strikethrough_angle_sigma" />
</label>
</div>

<div class='label-container'>
<label>{{ $t('message.strikethrough_width_sigma') }}:
<input type="number" v-model="strikethrough_width_sigma" />
</label>
</div>

<div class='label-container'>
<label>{{ $t('message.strikethrough_probability') }}:
<input type="number" v-model="strikethrough_probability" />
</label>
</div>

</div>
</div>
</div>
Expand All @@ -176,22 +200,16 @@
<h2>{{ $t('message.preview') }}:</h2>

<!-- <div v-viewer> -->
<img :src="previewImage" :alt="$t('message.previewImage')" style="width: 600px;"/>
<img :src="previewImage" :alt="$t('message.previewImage')" style="width: 600px;" />
<!-- </div> -->


</div>




<footer class=" footer mt-auto py-3 bg-white">
<div class="container text-center">
<span class="text-black">© 2023 Liuweiqing</span>
<a href="mailto:14790897abc@gmail.com" class="text-info">14790897abc@gmail.com</a>
<span class="text-black">{{ $t('message.projectAddress') }}:</span>
<a href="https://github.com/14790897/handwriting-web" class="text-info">GitHub</a>
</div>
<div class="container text-center">
<span class="text-black">© 2023 Liuweiqing</span>
<a href="mailto:14790897abc@gmail.com" class="text-info">14790897abc@gmail.com</a>
<span class="text-black">{{ $t('message.projectAddress') }}:</span>
<a href="https://github.com/14790897/handwriting-web" class="text-info">GitHub</a>
</div>
</footer>


Expand Down Expand Up @@ -252,10 +270,12 @@ export default {
selectedOption: '1', // 当前选中的选项
options: '', // 下拉选项
isLoading: false, //7.6
localStorageItems: ['text', 'fontFile', 'fontSize', 'lineSpacing', 'fill', 'width', 'height', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'selectedFontFileName', 'selectedOption', 'lineSpacingSigma', 'fontSizeSigma', 'wordSpacingSigma', 'perturbXSigma', 'perturbYSigma', 'perturbThetaSigma', 'wordSpacing'],
strikethrough_length_sigma: 2,
strikethrough_angle_sigma: 2,
strikethrough_width_sigma: 2,
strikethrough_probability: 0.08,
isExpanded: false,
localStorageItems: ['text', 'fontFile', 'fontSize', 'lineSpacing', 'fill', 'width', 'height', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'selectedFontFileName', 'selectedOption', 'lineSpacingSigma', 'fontSizeSigma', 'wordSpacingSigma', 'perturbXSigma', 'perturbYSigma', 'perturbThetaSigma', 'wordSpacing', 'strikethrough_length_sigma', 'strikethrough_angle_sigma', 'strikethrough_width_sigma', 'strikethrough_probability'],
};
},
created() {
Expand Down Expand Up @@ -441,11 +461,39 @@ export default {
},
deep: true
},
strikethrough_length_sigma: {
handler(newVal) {
localStorage.setItem('strikethrough_length_sigma', JSON.stringify(newVal));
},
deep: true
},
strikethrough_angle_sigma: {
handler(newVal) {
localStorage.setItem('strikethrough_angle_sigma', JSON.stringify(newVal));
},
deep: true
},
strikethrough_width_sigma: {
handler(newVal) {
localStorage.setItem('strikethrough_width_sigma', JSON.stringify(newVal));
},
deep: true
},
strikethrough_probability: {
handler(newVal) {
localStorage.setItem('strikethrough_probability', JSON.stringify(newVal));
},
deep: true
},
},
methods: {
toggleCollapse() {
this.isExpanded = !this.isExpanded;
},
async generateHandwriting(preview = false) {
// 验证输入
const Items = ['text', 'backgroundImage', 'fontSize', 'lineSpacing', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'lineSpacingSigma', 'fontSizeSigma', 'wordSpacingSigma', 'perturbXSigma', 'perturbYSigma', 'perturbThetaSigma', 'wordSpacing'];
const Items = ['text', 'backgroundImage', 'fontSize', 'lineSpacing', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'lineSpacingSigma', 'fontSizeSigma', 'wordSpacingSigma', 'perturbXSigma', 'perturbYSigma', 'perturbThetaSigma', 'wordSpacing', 'strikethrough_length_sigma', 'strikethrough_angle_sigma', 'strikethrough_width_sigma', 'strikethrough_probability'];
Items.forEach(item => {
let value = this[item];
// if (!value) {
Expand All @@ -458,8 +506,10 @@ export default {
// 验证 text 是否是字符串
if (typeof value !== 'string') {
console.error(`Invalid value for ${item}`);
this.errorMessage = '请输入字符串';
}
break;
return;
// break;
case 'fontSize':
case 'lineSpacing':
case 'marginTop':
Expand All @@ -473,11 +523,17 @@ export default {
case 'perturbYSigma':
case 'perturbThetaSigma':
case 'wordSpacing':
case 'strikethrough_length_sigma':
case 'strikethrough_angle_sigma':
case 'strikethrough_width_sigma':
case 'strikethrough_probability':
// 验证这些值是否是数字
if (isNaN(Number(value))) {
console.error(`Invalid value for ${item}`);
this.errorMessage = '请输入数字';
}
break;
return
// break;
case 'backgroundImage':
// 验证 backgroundImage 是否是有效的 URL 或者文件路径
// 这可能需要更复杂的验证
Expand Down Expand Up @@ -530,6 +586,10 @@ export default {
formData.append("word_spacing", this.wordSpacing);
formData.append("preview", this.preview.toString());
formData.append("font_option", this.options[this.selectedOption - 1].text);
formData.append("strikethrough_length_sigma", this.strikethrough_length_sigma);
formData.append("strikethrough_angle_sigma", this.strikethrough_angle_sigma);
formData.append("strikethrough_width_sigma", this.strikethrough_width_sigma);
formData.append("strikethrough_probability", this.strikethrough_probability);
for (let pair of formData.entries()) {
console.log(pair[0] + ', ' + pair[1]);
Expand Down

0 comments on commit d7f2340

Please sign in to comment.