diff options
Diffstat (limited to 'electron')
| -rw-r--r-- | electron/src/renderer/components/Preferences.vue | 216 | ||||
| -rw-r--r-- | electron/src/renderer/router/index.js | 5 |
2 files changed, 221 insertions, 0 deletions
diff --git a/electron/src/renderer/components/Preferences.vue b/electron/src/renderer/components/Preferences.vue new file mode 100644 index 00000000..19fe670f --- /dev/null +++ b/electron/src/renderer/components/Preferences.vue @@ -0,0 +1,216 @@ +<template> + <v-card raised rounded="lg" class="preferences-card"> + <v-card-title class="text-center justify-center py-6"> + <h1 class="font-weight-bold text-h2 basil--text"> + Ink/Stitch Settings + </h1> + </v-card-title> + + <v-card-text> + <v-tabs v-model="tab" background-color="transparent" grow> + <v-tab key="this_svg_settings"> + This SVG + </v-tab> + <v-tab key="global_settings"> + Global + </v-tab> + </v-tabs> + + <v-tabs-items v-model="tab"> + <v-tab-item key="this_svg_settings"> + <v-card flat> + <v-card-text> + <table> + <tr> + <td class="label"> + <v-tooltip bottom> + <template v-slot:activator="{on, attrs}"> + <label for="collapse_len_mm" v-on="on" v-bind="attrs"><translate>Minimum jump stitch length</translate></label> + </template> + <label for="collapse_len_mm"><translate>Jump stitches smaller than this will be treated as normal stitches.</translate></label> + </v-tooltip> + </td> + <td class="preference"> + <v-text-field hide-details id="collapse_len_mm" @change="updateSettings" v-model.number="this_svg_settings.collapse_len_mm" type="number"></v-text-field> + </td> + <td class="unit"> + mm + </td> + <td class="button"> + <v-btn small @click="set_default('collapse_len_mm')"><translate>set as default</translate></v-btn> + </td> + </tr> + <tr> + <td class="label"> + <v-tooltip bottom> + <template v-slot:activator="{on, attrs}"> + <label for="min_stitch_len_mm" v-on="on" v-bind="attrs"><translate>Minimum stitch length</translate></label> + </template> + <label for="min_stitch_len_mm"><translate>Drop stitches smaller than this value.</translate></label> + </v-tooltip> + </td> + <td class="preference"> + <v-text-field hide-details id="min_stitch_len_mm" @change="updateSettings" v-model.number="this_svg_settings.min_stitch_len_mm" type="number"></v-text-field> + </td> + <td class="unit"> + mm + </td> + <td class="button"> + <v-btn small @click="set_default('min_stitch_len_mm')"><translate>set as default</translate></v-btn> + </td> + </tr> + </table> + </v-card-text> + </v-card> + </v-tab-item> + <v-tab-item key="global_settings"> + <v-card flat> + <v-card-text> + <table> + <tr> + <td> + <v-tooltip bottom> + <template v-slot:activator="{on, attrs}"> + <label for="default_collapse_len_mm" v-on="on" v-bind="attrs"><translate>Default minimum jump stitch length</translate></label> + </template> + <label for="default_collapse_len_mm"><translate>Used for new SVGs.</translate></label> + </v-tooltip> + </td> + <td class="preference"> + <v-text-field hide-details id="default_min_stitch_len_mm" @change="updateSettings" v-model.number="global_settings.default_collapse_len_mm" type="number"></v-text-field> + </td> + <td class="unit"> + mm + </td> + </tr> + <tr> + <td> + <v-tooltip bottom> + <template v-slot:activator="{on, attrs}"> + <label for="default_min_stitch_len_mm" v-on="on" v-bind="attrs"><translate>Default minimum stitch length</translate></label> + </template> + <label for="default_min_stitch_len_mm"><translate>Used for new SVGs.</translate></label> + </v-tooltip> + </td> + <td class="preference"> + <v-text-field hide-details id="default_min_stitch_len_mm" @change="updateSettings" v-model.number="global_settings.default_min_stitch_len_mm" type="number"></v-text-field> + </td> + <td class="unit"> + mm + </td> + </tr> + <tr> + <td> + <v-tooltip bottom> + <template v-slot:activator="{on, attrs}"> + <label for="cache_size" v-on="on" v-bind="attrs"><translate>Stitch plan cache size</translate></label> + </template> + <label for="default_min_stitch_len_mm"><translate>The greater the number, the more stitch plans can be cached, speeding up stitch plan calculation. Default: 100</translate></label> + </v-tooltip> + </td> + <td class="preference"> + <v-text-field hide-details id="cache_size" @change="updateSettings" v-model.number="global_settings.cache_size" type="number"></v-text-field> + </td> + <td class="unit"> + MB + </td> + <td class="button"> + <v-btn small @click="clearCache"><translate>clear stitch plan cache</translate></v-btn> + </td> + </tr> + </table> + </v-card-text> + </v-card> + </v-tab-item> + </v-tabs-items> + </v-card-text> + <v-card-actions> + <v-btn text color="primary" @click="close"><translate>done</translate></v-btn> + </v-card-actions> + </v-card> + +</template> + +<script> +const inkStitch = require("../../lib/api") + +export default { + name: "Preferences", + data: function () { + return { + tab: "this_svg_settings", + this_svg_settings: { + collapse_len_mm: null, + min_stitch_len_mm: null, + }, + global_settings: { + default_min_stitch_len_mm: null, + default_collapse_len_mm: null, + cache_size: null + } + } + }, + created: function () { + inkStitch.get("preferences/").then(response => { + Object.assign(this.this_svg_settings, response.data.this_svg_settings) + Object.assign(this.global_settings, response.data.global_settings) + }) + }, + methods: { + setDefault(preference_name) { + console.log(`set default: ${preference_name}`) + this.global_settings[`default_${preference_name}`] = this.this_svg_settings[preference_name] + this.updateSettings() + }, + updateSettings() { + console.log(this.this_svg_settings) + console.log(this.global_settings) + inkStitch.post("preferences/", { + this_svg_settings: this.this_svg_settings, + global_settings: this.global_settings + }).then(response => { + console.log(response) + }) + }, + clearCache() { + inkStitch.post("preferences/clear_cache").then(response => { + console.log(response) + }) + }, + close() { + window.close() + } + } +} +</script> + +<style scoped> +.preferences-card { + margin-left: 20%; + margin-right: 20%; + margin-top: 5%; +} + +td.label { + vertical-align: bottom; +} + +td.preference { + padding-right: 4px; + padding-left: 16px; + max-width: 100px; +} + +td.preference::v-deep input { + text-align: right; +} + +td.unit { + vertical-align: bottom; +} + +td.button { + vertical-align: bottom; + padding-left: 12px; +} +</style> diff --git a/electron/src/renderer/router/index.js b/electron/src/renderer/router/index.js index c9b72569..1200fa0e 100644 --- a/electron/src/renderer/router/index.js +++ b/electron/src/renderer/router/index.js @@ -24,6 +24,11 @@ export default new Router({ component: require('@/components/InstallPalettes').default }, { + path: '/preferences', + name: 'preferences', + component: require('@/components/Preferences').default + }, + { path: '*', redirect: '/' } |