From 285f74d55ec8b680e40012ba0dfe1ca5e4986ad6 Mon Sep 17 00:00:00 2001 From: antelle Date: Sat, 13 Aug 2016 23:19:15 +0300 Subject: [PATCH] presets selection --- app/scripts/models/app-settings-model.js | 1 + app/scripts/util/locale.js | 5 ++ app/scripts/views/generator-presets-view.js | 75 ++++++++++++++++++++- app/scripts/views/grp-view.js | 4 +- app/styles/areas/_generator-presets.scss | 14 ++++ app/styles/base/_variables.scss | 1 + app/templates/generator-presets.hbs | 22 ++++++ util/config-example.json | 1 + 8 files changed, 118 insertions(+), 5 deletions(-) diff --git a/app/scripts/models/app-settings-model.js b/app/scripts/models/app-settings-model.js index b82bd7c4..54d6da98 100644 --- a/app/scripts/models/app-settings-model.js +++ b/app/scripts/models/app-settings-model.js @@ -27,6 +27,7 @@ var AppSettingsModel = Backbone.Model.extend({ demoOpened: false, fontSize: 0, tableViewColumns: null, + generatorPresets: null, dropbox: true, webdav: true, gdrive: true, diff --git a/app/scripts/util/locale.js b/app/scripts/util/locale.js index 69adc5ec..8a3c1c59 100644 --- a/app/scripts/util/locale.js +++ b/app/scripts/util/locale.js @@ -89,6 +89,11 @@ var Locale = { tagBadNameBody: 'Tag name can not contain characters `,`, `;`, `:`. Please remove them.', genPsTitle: 'Generator Presets', + genPsEmpty: 'You have no presets yet', + genPsEmptyDesc: 'Presets allow you to generate passwords by your rules faster', + genPsCreate: 'New preset', + genPsDelete: 'Delete preset', + genPsNew: 'preset', keyChangeTitleRemote: 'Master Key Changed', keyChangeMessageRemote: 'Master key was changed for this database. Please enter a new key', diff --git a/app/scripts/views/generator-presets-view.js b/app/scripts/views/generator-presets-view.js index 6e78b94d..952a7b81 100644 --- a/app/scripts/views/generator-presets-view.js +++ b/app/scripts/views/generator-presets-view.js @@ -1,27 +1,96 @@ 'use strict'; const Backbone = require('backbone'); +const Locale = require('../util/locale'); -var GeneratorPresetsView = Backbone.View.extend({ +let GeneratorPresetsView = Backbone.View.extend({ template: require('templates/generator-presets.hbs'), events: { - 'click .back-button': 'returnToApp' + 'click .back-button': 'returnToApp', + 'change .gen-ps__list': 'changePreset', + 'click .gen-ps__btn-create': 'createPreset', + 'click .gen-ps__btn-delete': 'deletePreset', + 'input #gen-ps__field-name': 'changeName' }, + selected: null, + initialize: function() { this.appModel = this.model; }, render: function() { + let presets = this.appModel.settings.get('generatorPresets') || []; + if (!this.selected || presets.indexOf(this.selected) < 0) { + this.selected = presets[0]; + } this.renderTemplate({ - // + empty: !presets.length, + presets: presets, + selected: this.selected }, true); return this; }, returnToApp: function() { Backbone.trigger('edit-generator-presets'); + }, + + changePreset: function(e) { + let id = e.target.value; + let presets = this.appModel.settings.get('generatorPresets'); + this.selected = presets.filter(p => p.id === id)[0]; + this.render(); + }, + + createPreset: function() { + let presets = this.appModel.settings.get('generatorPresets') || []; + let name; + let id; + for (let i = 1; ; i++) { + let newName = Locale.genPsNew + ' ' + i; + if (!presets.filter(p => p.name === newName).length) { + name = newName; + break; + } + } + for (let i = 1; ; i++) { + let newId = 'custom' + i; + if (!presets.filter(p => p.id === newId).length) { + id = newId; + break; + } + } + let preset = { id, name }; + presets.push(preset); + this.selected = preset; + this.appModel.settings.set('generatorPresets', presets); + this.render(); + }, + + deletePreset: function() { + let presets = this.appModel.settings.get('generatorPresets'); + presets = presets.filter(p => p.id !== this.selected.id); + this.appModel.settings.set('generatorPresets', presets.length ? presets : null); + this.render(); + }, + + changeName: function(e) { + let name = $.trim(e.target.value); + if (name && name !== this.selected.name) { + let presets = this.appModel.settings.get('generatorPresets'); + let another = presets.filter(p => p.name.toLowerCase() === name.toLowerCase())[0]; + if (another) { + $(e.target).addClass('input--error'); + return; + } else { + $(e.target).removeClass('input--error'); + } + this.selected.name = name; + this.appModel.settings.set('generatorPresets', presets); + this.$el.find('.gen-ps__list option[selected]').text(name); + } } }); diff --git a/app/scripts/views/grp-view.js b/app/scripts/views/grp-view.js index 21f2a4eb..f484beaa 100644 --- a/app/scripts/views/grp-view.js +++ b/app/scripts/views/grp-view.js @@ -66,8 +66,8 @@ var GrpView = Backbone.View.extend({ changeTitle: function(e) { var title = $.trim(e.target.value); if (title) { - if (!this.model.get('top') && e.target.value !== this.model.get('title')) { - this.model.setName(e.target.value); + if (!this.model.get('top') && title !== this.model.get('title')) { + this.model.setName(title); } } else { if (this.model.isJustCreated) { diff --git a/app/styles/areas/_generator-presets.scss b/app/styles/areas/_generator-presets.scss index 8bf773a5..5a8d3c1e 100644 --- a/app/styles/areas/_generator-presets.scss +++ b/app/styles/areas/_generator-presets.scss @@ -1,3 +1,17 @@ .gen-ps { + @include flex(1); + @include display(flex); + @include align-items(stretch); + @include flex-direction(column); + @include justify-content(flex-start); + width: 100%; + user-select: none; + &__empty-text { + padding-bottom: $large-padding; + } + + &__list, &__input { + height: 2em; + } } diff --git a/app/styles/base/_variables.scss b/app/styles/base/_variables.scss index cc55ee87..cbfc390e 100644 --- a/app/styles/base/_variables.scss +++ b/app/styles/base/_variables.scss @@ -23,6 +23,7 @@ $base-padding: $base-padding-v $base-padding-h; $medium-padding: 1em 1.2em; $base-padding-px: 5px 10px; $modal-icon-size: 6em; +$large-padding: 2em; // Borders @function base-border() { @return 1px solid base-border-color(); }; diff --git a/app/templates/generator-presets.hbs b/app/templates/generator-presets.hbs index dbef6ba7..5ac44743 100644 --- a/app/templates/generator-presets.hbs +++ b/app/templates/generator-presets.hbs @@ -3,4 +3,26 @@ {{res 'retToApp'}}

{{res 'genPsTitle'}}

+ {{#if empty}} +
+

{{res 'genPsEmpty'}}

+
{{res 'genPsEmptyDesc'}}
+ +
+ {{else}} + +
+ + +
+
+ + +
+ {{/if}} diff --git a/util/config-example.json b/util/config-example.json index a1b690a8..ce70bd74 100644 --- a/util/config-example.json +++ b/util/config-example.json @@ -22,6 +22,7 @@ "demoOpened": false, "fontSize": 0, "tableViewColumns": null, + "generatorPresets": null, "dropbox": true, "dropboxFolder": null,