Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Refactoring Common.UI.ButtonColored

Browse source
This commit is contained in:
Julia Radzhabova 2021-07-10 22:52:39 +03:00
parent 1c3224eeeb
commit f6032f2312
7 changed files with 219 additions and 134 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

173
apps/common/main/lib/component/ColorButton.js
View file

@ -233,7 +233,6 @@ define([
e.stopPropagation();
_.delay(function() {
me.focusInner(e);
// me.colorPicker.focus(e.keyCode == Common.UI.Keys.DOWN ? 'first' : 'last');
}, 10);
}
}
@ -270,14 +269,184 @@ define([
$('button:first-child', this.cmpEl).append( $('<div class="btn-color-value-line"></div>'));
this.colorEl = this.cmpEl.find('.btn-color-value-line');
if (this.options.auto)
this.autocolor = (typeof this.options.auto == 'object') ? this.options.auto.color || '000000' : '000000';
this.cmpEl.on('keydown.after.bs.dropdown', _.bind(this.onAfterKeydownMenu, this));
if (this.options.color!==undefined)
this.setColor(this.options.color);
},
getPicker: function(color, colors) {
if (!this.colorPicker) {
this.colorPicker = new Common.UI.ThemeColorPalette({
el: this.cmpEl.find('#' + this.menu.id + '-color-menu'),
transparent: this.options.transparent,
value: color,
colors: colors,
parentButton: this
});
this.colorPicker.on('select', _.bind(this.onColorSelect, this));
this.cmpEl.find('#' + this.menu.id + '-color-new').on('click', _.bind(this.addNewColor, this));
if (this.options.auto) {
this.cmpEl.find('#' + this.menu.id + '-color-auto').on('click', _.bind(this.onAutoColorSelect, this));
this.colorAuto = this.cmpEl.find('#' + this.menu.id + '-color-auto > a');
(color == 'auto') && this.setAutoColor(true);
}
}
return this.colorPicker;
},
setPicker: function(picker) {
this.colorPicker = picker;
},
getMenu: function(options) {
if (typeof this.menu !== 'object') {
options = options || this.options;
var height = options.paletteHeight || 240,
id = Common.UI.getId(),
auto = [];
if (options.auto) {
this.autocolor = (typeof options.auto == 'object') ? options.auto.color || '000000' : '000000';
auto.push({
id: id + '-color-auto',
caption: (typeof options.auto == 'object') ? options.auto.caption || this.textAutoColor : this.textAutoColor,
template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon color-auto" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 1px; background-color: #' + this.autocolor + ';"></span><%= caption %></a>')
});
auto.push({caption: '--'});
}
var menu = new Common.UI.Menu({
id: id,
cls: 'shifted-left',
additionalAlign: options.additionalAlign,
items: (options.additionalItems ? options.additionalItems : []).concat(auto).concat([
{ template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height:' + height + 'px; margin: 10px;"></div>') },
{
id: id + '-color-new',
template: _.template('<a tabindex="-1" type="menuitem" style="">' + this.textNewColor + '</a>')
}
])
});
this.colorPicker && (this.colorPicker.parentButton = menu);
var me = this;
menu.on('keydown:before', _.bind(this.onBeforeKeyDown, this));
menu.on('show:after', function(menu) {
me.colorPicker && _.delay(function() {
me.colorPicker.showLastSelected();
!(options.additionalItems || options.auto) && me.colorPicker.focus();
}, 10);
}).on('hide:after', function() {
if (me.options.takeFocusOnClose) {
setTimeout(function(){me.focus();}, 1);
}
});
return menu;
}
return this.menu;
},
setMenu: function (m) {
m = m || this.getMenu();
Common.UI.Button.prototype.setMenu.call(this, m);
this.getPicker(this.options.color, this.options.colors);
},
onColorSelect: function(picker, color) {
this.setColor(color);
this.setAutoColor(false);
this.trigger('color:select', this, color);
},
setColor: function(color) {
if (color == 'auto' && this.options.auto)
color = this.autocolor;
this.color = color;
if (this.colorEl) {
this.colorEl.css({'background-color': (color=='transparent') ? color : ((typeof(color) == 'object') ? '#'+color.color : '#'+color)});
this.colorEl.toggleClass('bordered', color=='transparent');
}
}
},
setAutoColor: function(selected) {
if (!this.colorAuto) return;
if (selected && !this.colorAuto.hasClass('selected'))
this.colorAuto.addClass('selected');
else if (!selected && this.colorAuto.hasClass('selected'))
this.colorAuto.removeClass('selected');
},
isAutoColor: function() {
return this.colorAuto && this.colorAuto.hasClass('selected');
},
onAutoColorSelect: function() {
this.setColor('auto');
this.setAutoColor(true);
this.colorPicker && this.colorPicker.clearSelection();
this.trigger('auto:select', this, this.autocolor);
},
addNewColor: function() {
this.colorPicker && this.colorPicker.addNewColor((typeof(this.color) == 'object') ? this.color.color : this.color);
},
onAfterKeydownMenu: function(e) {
if ((e.keyCode == Common.UI.Keys.DOWN || e.keyCode == Common.UI.Keys.SPACE) && !this.isMenuOpen()) {
$('button', this.cmpEl).click();
return false;
}
},
onBeforeKeyDown: function(menu, e) {
console.log(e.keyCode);
if (e.keyCode == Common.UI.Keys.RETURN) {
e.preventDefault();
e.stopPropagation();
var li = $(e.target).closest('li');
(li.length>0) && li.click();
Common.UI.Menu.Manager.hideAll();
} else if (e.namespace!=="after.bs.dropdown" && (e.keyCode == Common.UI.Keys.DOWN || e.keyCode == Common.UI.Keys.UP)) {
var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', menu.$el).find('> a');
if (!$items.length) return;
var index = $items.index($items.filter(':focus')),
me = this,
pickerIndex = $items.length-1 ;
if (e.keyCode == Common.UI.Keys.DOWN && (index==pickerIndex-1 || pickerIndex==0) || e.keyCode == Common.UI.Keys.UP && index==pickerIndex) {
e.preventDefault();
e.stopPropagation();
_.delay(function() {
me.focusInner(e);
}, 10);
}
}
},
isMenuOpen: function() {
return this.cmpEl.hasClass('open');
},
focusInner: function(e) {
if (!this.colorPicker) return;
this.colorPicker.focus(e.keyCode == Common.UI.Keys.DOWN ? 'first' : 'last');
},
focusOuter: function(e) {
if (!this.menu) return;
var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', this.menu.$el).find('> a');
if (!$items.length) return;
$items.eq(e.keyCode == Common.UI.Keys.UP ? $items.length-2 : $items.length-1).focus();
},
textNewColor: 'Add New Custom Color',
textAutoColor: 'Automatic'
}, Common.UI.ButtonColored || {}));

5
apps/documenteditor/main/app/controller/FormsTab.js
View file

@ -90,7 +90,6 @@ define([
this.addListeners({
'FormsTab': {
'forms:insert': this.onControlsSelect,
'forms:new-color': this.onNewControlsColor,
'forms:clear': this.onClearClick,
'forms:no-color': this.onNoControlsColor,
'forms:select-color': this.onSelectControlsColor,
@ -206,10 +205,6 @@ define([
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
},
onNewControlsColor: function() {
this.view.mnuFormsColorPicker.addNewColor();
},
onNoControlsColor: function(item) {
if (!item.isChecked())
this.api.asc_SetSpecialFormsHighlightColor(201, 200, 255);

25
apps/documenteditor/main/app/controller/Toolbar.js
View file

@ -310,14 +310,12 @@ define([
toolbar.mnuMultiChangeLevel.menu.on('item:click', _.bind(this.onChangeLevelClick, this, 2));
toolbar.btnHighlightColor.on('click', _.bind(this.onBtnHighlightColor, this));
toolbar.btnFontColor.on('click', _.bind(this.onBtnFontColor, this));
toolbar.btnFontColor.on('color:select', _.bind(this.onSelectFontColor, this));
toolbar.btnFontColor.on('auto:select', _.bind(this.onAutoFontColor, this));
toolbar.btnParagraphColor.on('click', _.bind(this.onBtnParagraphColor, this));
toolbar.btnParagraphColor.on('color:select', _.bind(this.onParagraphColorPickerSelect, this));
toolbar.mnuHighlightColorPicker.on('select', _.bind(this.onSelectHighlightColor, this));
toolbar.mnuFontColorPicker.on('select', _.bind(this.onSelectFontColor, this));
toolbar.mnuParagraphColorPicker.on('select', _.bind(this.onParagraphColorPickerSelect, this));
toolbar.mnuHighlightTransparent.on('click', _.bind(this.onHighlightTransparentClick, this));
$('#id-toolbar-menu-auto-fontcolor').on('click', _.bind(this.onAutoFontColor, this));
$('#id-toolbar-menu-new-fontcolor').on('click', _.bind(this.onNewFontColor, this));
$('#id-toolbar-menu-new-paracolor').on('click', _.bind(this.onNewParagraphColor, this));
toolbar.mnuLineSpace.on('item:toggle', _.bind(this.onLineSpaceToggle, this));
toolbar.mnuNonPrinting.on('item:toggle', _.bind(this.onMenuNonPrintingToggle, this));
toolbar.btnShowHidenChars.on('toggle', _.bind(this.onNonPrintingToggle, this));
@ -2437,10 +2435,6 @@ define([
return out_value;
},
onNewFontColor: function(picker, color) {
this.toolbar.mnuFontColorPicker.addNewColor();
},
onAutoFontColor: function(e) {
this._state.clrtext = this._state.clrtext_asccolor = undefined;
@ -2449,16 +2443,9 @@ define([
this.api.put_TextColor(color);
this.toolbar.btnFontColor.currentColor = {color: color, isAuto: true};
this.toolbar.btnFontColor.setColor('000');
this.toolbar.mnuFontColorPicker.clearSelection();
this.toolbar.mnuFontColorPicker.currentColor = {color: color, isAuto: true};
},
onNewParagraphColor: function(picker, color) {
this.toolbar.mnuParagraphColorPicker.addNewColor();
},
onSelectHighlightColor: function(picker, color) {
this._setMarkerColor(color, 'menu');
},
@ -2562,9 +2549,8 @@ define([
onApiTextColor: function(color) {
if (color.get_auto()) {
if (this._state.clrtext !== 'auto') {
this.toolbar.btnFontColor.setAutoColor(true);
this.toolbar.mnuFontColorPicker.clearSelection();
var clr_item = this.toolbar.btnFontColor.menu.$el.find('#id-toolbar-menu-auto-fontcolor > a');
!clr_item.hasClass('selected') && clr_item.addClass('selected');
this._state.clrtext = 'auto';
}
} else {
@ -2583,8 +2569,7 @@ define([
(clr.effectValue!==this._state.clrtext.effectValue || this._state.clrtext.color.indexOf(clr.color)<0)) ||
(type1!='object' && this._state.clrtext.indexOf(clr)<0 )) {
var clr_item = this.toolbar.btnFontColor.menu.$el.find('#id-toolbar-menu-auto-fontcolor > a');
clr_item.hasClass('selected') && clr_item.removeClass('selected');
this.toolbar.btnFontColor.setAutoColor(false);
if ( typeof(clr) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {

51
apps/documenteditor/main/app/view/FormsTab.js
View file

@ -108,18 +108,12 @@ define([
me.fireEvent('forms:clear');
});
if (this.mnuFormsColorPicker) {
$('#id-toolbar-menu-new-form-color').on('click', function (b, e) {
me.fireEvent('forms:new-color');
this.btnHighlight.on('color:select', function(picker, color) {
me.fireEvent('forms:select-color', [color]);
});
this.mnuNoFormsColor.on('click', function (item) {
me.fireEvent('forms:no-color', [item]);
});
this.mnuFormsColorPicker.on('select', function(picker, color) {
me.fireEvent('forms:select-color', [color]);
});
this.btnHighlight.menu.on('show:after', function(picker, color) {
me.fireEvent('forms:open-color', [color]);
});
}
this.btnPrevForm && this.btnPrevForm.on('click', function (b, e) {
me.fireEvent('forms:goto', ['prev']);
@ -222,7 +216,20 @@ define([
iconCls : 'toolbar__icon btn-highlight',
caption : this.textHighlight,
menu : true,
disabled: true
disabled: true,
additionalItems: [ this.mnuNoFormsColor = new Common.UI.MenuItem({
id: 'id-toolbar-menu-no-highlight-form',
caption: this.textNoHighlight,
checkable: true,
style: 'padding-left: 20px;'
}),
{caption: '--'}],
colors: ['000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333', '800000', 'FF6600',
'808000', '00FF00', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900', '99CC00', '339966',
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
'993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF'
],
paletteHeight: 94
});
this.paragraphControls.push(this.btnHighlight);
}
@ -267,28 +274,9 @@ define([
})).then(function(){
if (config.isEdit && config.canFeatureContentControl) {
if (config.canEditContentControl) {
me.btnHighlight.setMenu(new Common.UI.Menu({
items: [
me.mnuNoFormsColor = new Common.UI.MenuItem({
id: 'id-toolbar-menu-no-highlight-form',
caption: me.textNoHighlight,
checkable: true,
checked: me.btnHighlight.currentColor === null
}),
{caption: '--'},
{template: _.template('<div id="id-toolbar-menu-form-color" style="width: 169px; height: 94px; margin: 10px;"></div>')},
{template: _.template('<a id="id-toolbar-menu-new-form-color" style="padding-left:12px;">' + me.textNewColor + '</a>')}
]
}));
me.mnuFormsColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-form-color'),
colors: ['000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333', '800000', 'FF6600',
'808000', '00FF00', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900', '99CC00', '339966',
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
'993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', '99CCFF', 'CC99FF', 'FFFFFF'
],
value: me.btnHighlight.currentColor
});
me.btnHighlight.setMenu();
me.mnuFormsColorPicker = me.btnHighlight.getPicker();
me.mnuNoFormsColor.setChecked(me.btnHighlight.currentColor === null);
me.btnHighlight.setColor(me.btnHighlight.currentColor || 'transparent');
} else {
me.btnHighlight.cmpEl.parents('.group').hide().prev('.separator').hide();
@ -380,7 +368,6 @@ define([
tipImageField: 'Insert image',
tipViewForm: 'View form',
textNoHighlight: 'No highlighting',
textNewColor: 'Add New Custom Color',
textClear: 'Clear Fields',
capBtnPrev: 'Previous Field',
capBtnNext: 'Next Field',

35
apps/documenteditor/main/app/view/Toolbar.js
View file

@ -259,19 +259,8 @@ define([
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-fontcolor',
split: true,
menu: new Common.UI.Menu({
cls: 'shifted-left',
items: [
{
id: 'id-toolbar-menu-auto-fontcolor',
caption: this.textAutoColor,
template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 1px; background-color: #000;"></span><%= caption %></a>')
},
{caption: '--'},
{template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 240px;"></div>')},
{template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="">' + this.textNewColor + '</a>')}
]
})
menu: true,
auto: true
});
this.paragraphControls.push(this.btnFontColor);
@ -280,12 +269,8 @@ define([
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-paracolor',
split: true,
menu: new Common.UI.Menu({
items: [
{template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 240px;"></div>')},
{template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
]
})
transparent: true,
menu: true
});
this.paragraphControls.push(this.btnParagraphColor);
this.textOnlyControls.push(this.btnParagraphColor);
@ -2005,21 +1990,19 @@ define([
]
});
this.mnuHighlightColorPicker.select('FFFF00');
this.btnHighlightColor.setPicker(this.mnuHighlightColorPicker);
}
if (this.btnFontColor.cmpEl) {
this.btnFontColor.setMenu();
this.mnuFontColorPicker = this.btnFontColor.getPicker();
this.btnFontColor.setColor(this.btnFontColor.currentColor || 'transparent');
this.mnuFontColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-fontcolor')
});
}
if (this.btnParagraphColor.cmpEl) {
this.btnParagraphColor.setMenu();
this.mnuParagraphColorPicker = this.btnParagraphColor.getPicker();
this.btnParagraphColor.setColor(this.btnParagraphColor.currentColor || 'transparent');
this.mnuParagraphColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-paracolor'),
transparent: true
});
}
if (this.btnContentControls.cmpEl) {

58
apps/documenteditor/main/app/view/WatermarkSettingsDialog.js
View file

@ -314,44 +314,24 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
});
this.textControls.push(this.btnStrikeout);
var initNewColor = function(btn, picker_el) {
if (btn && btn.cmpEl) {
btn.currentColor = 'c0c0c0';
btn.setColor( btn.currentColor);
var picker = new Common.UI.ThemeColorPalette({
el: $(picker_el)
});
}
btn.menu.cmpEl.on('click', picker_el+'-new', _.bind(function() {
picker.addNewColor((typeof(btn.color) == 'object') ? btn.color.color : btn.color);
}, me));
picker.on('select', _.bind(me.onColorSelect, me));
return picker;
};
this.btnTextColor = new Common.UI.ButtonColored({
parentEl: $('#watermark-textcolor'),
cls : 'btn-toolbar',
iconCls : 'toolbar__icon btn-fontcolor',
hint : this.textColor,
menu : new Common.UI.Menu({
cls: 'shifted-left',
additionalAlign: this.menuAddAlign,
items: [
{
id: 'watermark-auto-color',
caption: this.textAuto,
template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 1px; background-color: #000;"></span><%= caption %></a>')
},
{caption: '--'},
{ template: _.template('<div id="watermark-menu-textcolor" style="width: 169px; height: 240px; margin: 10px;"></div>') },
{ template: _.template('<a id="watermark-menu-textcolor-new">' + this.textNewColor + '</a>') }
]
})
additionalAlign: this.menuAddAlign,
auto: true,
color: 'c0c0c0',
menu: true
});
this.mnuTextColorPicker = initNewColor(this.btnTextColor, "#watermark-menu-textcolor");
$('#watermark-auto-color').on('click', _.bind(this.onAutoColor, this));
this.btnTextColor.setMenu();
this.mnuTextColorPicker = this.btnTextColor.getPicker();
this.btnTextColor.currentColor = 'c0c0c0';
this.textControls.push(this.btnTextColor);
this.btnTextColor.on('color:select', _.bind(this.onColorSelect, this));
this.btnTextColor.on('auto:select', _.bind(this.onAutoColor, this));
this.chTransparency = new Common.UI.CheckBox({
el: $('#watermark-chb-transparency'),
labelText: this.textTransparency,
@ -403,30 +383,17 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
},
onColorSelect: function(picker, color) {
var clr_item = this.btnTextColor.menu.$el.find('#watermark-auto-color > a');
clr_item.hasClass('selected') && clr_item.removeClass('selected');
this.isAutoColor = false;
this.btnTextColor.currentColor = color;
this.btnTextColor.setColor( this.btnTextColor.currentColor);
},
updateThemeColors: function() {
this.mnuTextColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
},
addNewColor: function(picker, btn) {
picker.addNewColor((typeof(btn.color) == 'object') ? btn.color.color : btn.color);
},
onAutoColor: function(e) {
var clr_item = this.btnTextColor.menu.$el.find('#watermark-auto-color > a');
!clr_item.hasClass('selected') && clr_item.addClass('selected');
this.isAutoColor = true;
this.btnTextColor.currentColor = "000";
this.btnTextColor.setColor( this.btnTextColor.currentColor);
this.mnuTextColorPicker.clearSelection();
},
afterRender: function() {
@ -582,16 +549,14 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
this.btnUnderline.toggle(val.get_Underline());
this.btnStrikeout.toggle(val.get_Strikeout());
var color = val.get_Color(),
clr_item = this.btnTextColor.menu.$el.find('#watermark-auto-color > a'),
clr = "c0c0c0";
if (color.get_auto()) {
clr = "000";
this.isAutoColor = true;
this.mnuTextColorPicker.clearSelection();
!clr_item.hasClass('selected') && clr_item.addClass('selected');
this.btnTextColor.setAutoColor(true);
} else {
clr_item.hasClass('selected') && clr_item.removeClass('selected');
if (color) {
color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME ?
clr = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value()} :
@ -718,7 +683,6 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
textDiagonal: 'Diagonal',
textHor: 'Horizontal',
textColor: 'Text color',
textNewColor: 'Add New Custom Color',
textLanguage: 'Language',
textFromStorage: 'From Storage',
textSelect: 'Select Image'

6
apps/documenteditor/main/locale/en.json
View file

@ -124,6 +124,8 @@
"Common.Translation.warnFileLocked": "You can't edit this file because it's being edited in another app.",
"Common.Translation.warnFileLockedBtnEdit": "Create a copy",
"Common.Translation.warnFileLockedBtnView": "Open for viewing",
"Common.UI.ButtonColored.textAutoColor": "Automatic",
"Common.UI.ButtonColored.textNewColor": "Add New Custom Color",
"Common.UI.Calendar.textApril": "April",
"Common.UI.Calendar.textAugust": "August",
"Common.UI.Calendar.textDecember": "December",
@ -1787,7 +1789,7 @@
"DE.Views.FormsTab.textClear": "Clear Fields",
"DE.Views.FormsTab.textClearFields": "Clear All Fields",
"DE.Views.FormsTab.textHighlight": "Highlight Settings",
"DE.Views.FormsTab.textNewColor": "Add New Custom Color",
"del_DE.Views.FormsTab.textNewColor": "Add New Custom Color",
"DE.Views.FormsTab.textNoHighlight": "No highlighting",
"DE.Views.FormsTab.textRequired": "Fill all required fields to send form.",
"DE.Views.FormsTab.textSubmited": "Form submitted successfully",
@ -2749,7 +2751,7 @@
"DE.Views.WatermarkSettingsDialog.textItalic": "Italic",
"DE.Views.WatermarkSettingsDialog.textLanguage": "Language",
"DE.Views.WatermarkSettingsDialog.textLayout": "Layout",
"DE.Views.WatermarkSettingsDialog.textNewColor": "Add New Custom Color",
"del_DE.Views.WatermarkSettingsDialog.textNewColor": "Add New Custom Color",
"DE.Views.WatermarkSettingsDialog.textNone": "None",
"DE.Views.WatermarkSettingsDialog.textScale": "Scale",
"DE.Views.WatermarkSettingsDialog.textSelect": "Select Image",