diff --git a/src/i18n/locale/en.js b/src/i18n/locale/en.js
index 972acbe14..2d527d211 100644
--- a/src/i18n/locale/en.js
+++ b/src/i18n/locale/en.js
@@ -37,5 +37,15 @@ export default {
'open-blocks': 'Open Blocks'
}
}
+ },
+ selectorManager: {
+ label: 'Classes',
+ selected: 'Selected',
+ emptyState: '- State -',
+ states: {
+ hover: 'Hover',
+ active: 'Click',
+ 'nth-of-type(2n)': 'Even/Odd'
+ }
}
};
diff --git a/src/i18n/locale/tr.js b/src/i18n/locale/tr.js
index d1393aaea..e9ed2a11b 100644
--- a/src/i18n/locale/tr.js
+++ b/src/i18n/locale/tr.js
@@ -27,10 +27,12 @@ export default {
}
}
},
+ selectorManager: {
+ selected: 'Seçili',
+ emptyState: '- DURUM -'
+ },
styleManager: {
noEl: 'Stilini düzenlemek istediğiniz öğeyi seçiniz',
- selectedLabel: 'Seçili',
- states: '- DURUM -',
label: 'Sınıflar',
sectors: {
general: 'Genel',
diff --git a/src/selector_manager/config/config.js b/src/selector_manager/config/config.js
index 8ea14c16a..42b81eeea 100644
--- a/src/selector_manager/config/config.js
+++ b/src/selector_manager/config/config.js
@@ -9,20 +9,8 @@ export default {
// Default selectors
selectors: [],
- // Label for selectors
- label: 'Classes',
-
- // Label for states
- statesLabel: '- State -',
-
- selectedLabel: 'Selected',
-
// States
- states: [
- { name: 'hover', label: 'Hover' },
- { name: 'active', label: 'Click' },
- { name: 'nth-of-type(2n)', label: 'Even/Odd' }
- ],
+ states: [{ name: 'hover' }, { name: 'active' }, { name: 'nth-of-type(2n)' }],
// Custom selector name escaping strategy, eg.
// name => name.replace(' ', '_')
diff --git a/src/selector_manager/view/ClassTagView.js b/src/selector_manager/view/ClassTagView.js
index 870f07eec..55a851212 100644
--- a/src/selector_manager/view/ClassTagView.js
+++ b/src/selector_manager/view/ClassTagView.js
@@ -4,9 +4,9 @@ const inputProp = 'contentEditable';
export default Backbone.View.extend({
template() {
- const pfx = this.pfx;
- const ppfx = this.ppfx;
- const label = this.model.get('label') || '';
+ const { pfx, model } = this;
+ const label = model.get('label') || '';
+
return `
${label}
diff --git a/src/selector_manager/view/ClassTagsView.js b/src/selector_manager/view/ClassTagsView.js
index 3ca7b15bf..bb83555c3 100644
--- a/src/selector_manager/view/ClassTagsView.js
+++ b/src/selector_manager/view/ClassTagsView.js
@@ -90,16 +90,18 @@ export default Backbone.View.extend({
* @private
*/
getStateOptions() {
- var strInput = '';
- for (var i = 0; i < this.states.length; i++) {
- strInput +=
- '';
- }
- return strInput;
+ const { states, em } = this;
+ let result = [];
+
+ states.forEach(state =>
+ result.push(``)
+ );
+
+ return result.join('');
},
/**
@@ -304,21 +306,19 @@ export default Backbone.View.extend({
},
render() {
- const ppfx = this.ppfx;
- const config = this.config;
- const $el = this.$el;
+ const { em, pfx, ppfx, $el } = this;
$el.html(
this.template({
- selectedLabel: config.selectedLabel,
- statesLabel: config.statesLabel,
- label: config.label,
- pfx: this.pfx,
- ppfx: this.ppfx
+ selectedLabel: em.t('selectorManager.selected'),
+ statesLabel: em.t('selectorManager.emptyState'),
+ label: em.t('selectorManager.label'),
+ pfx,
+ ppfx
})
);
this.$input = $el.find('input#' + this.newInputId);
this.$addBtn = $el.find('#' + this.addBtnId);
- this.$classes = $el.find('#' + this.pfx + 'tags-c');
+ this.$classes = $el.find('#' + pfx + 'tags-c');
this.$states = $el.find('#' + this.stateInputId);
this.$statesC = $el.find('#' + this.stateInputC);
this.$states.append(this.getStateOptions());