diff --git a/apps/common/main/lib/component/ComboBorderSize.js b/apps/common/main/lib/component/ComboBorderSize.js index 86a7f6f2a..4478f8f11 100644 --- a/apps/common/main/lib/component/ComboBorderSize.js +++ b/apps/common/main/lib/component/ComboBorderSize.js @@ -215,4 +215,52 @@ define([ txtNoBorders: 'No Borders' }, Common.UI.ComboBorderSizeEditable || {})); + + Common.UI.ComboBorderType = Common.UI.ComboBorderSize.extend(_.extend({ + template: _.template([ + '
', + '
', + '
', + '', + '', + '
' + ].join('')), + + initialize : function(options) { + Common.UI.ComboBorderSize.prototype.initialize.call(this, _.extend({ + store: new Common.UI.BordersStore(), + data: [ + {value: Asc.c_oDashType.solid, offsety: 140}, + {value: Asc.c_oDashType.sysDot, offsety: 160}, + {value: Asc.c_oDashType.sysDash, offsety: 180}, + {value: Asc.c_oDashType.dash, offsety: 200}, + {value: Asc.c_oDashType.dashDot, offsety: 220}, + {value: Asc.c_oDashType.lgDash, offsety: 240}, + {value: Asc.c_oDashType.lgDashDot, offsety: 260}, + {value: Asc.c_oDashType.lgDashDotDot, offsety: 280} + ] + }, options)); + }, + + render : function(parentEl) { + Common.UI.ComboBorderSize.prototype.render.call(this, parentEl); + return this; + }, + + updateFormControl: function(record) { + var formcontrol = $(this.el).find('.form-control'); + formcontrol[0].innerHTML = ''; + formcontrol.removeClass('text').addClass('image'); + formcontrol.css('background-position', '0 -' + record.get('offsety') + 'px'); + } + }, Common.UI.ComboBorderType || {})); }); \ No newline at end of file diff --git a/apps/common/main/resources/img/combo-border-size/BorderSize.png b/apps/common/main/resources/img/combo-border-size/BorderSize.png index 82fc38c2f..cc8dcdf94 100644 Binary files a/apps/common/main/resources/img/combo-border-size/BorderSize.png and b/apps/common/main/resources/img/combo-border-size/BorderSize.png differ diff --git a/apps/documenteditor/main/app/template/ShapeSettings.template b/apps/documenteditor/main/app/template/ShapeSettings.template index 9dd8993c9..c309b15e8 100644 --- a/apps/documenteditor/main/app/template/ShapeSettings.template +++ b/apps/documenteditor/main/app/template/ShapeSettings.template @@ -108,6 +108,14 @@ + + +
+ +
+
+ +
diff --git a/apps/documenteditor/main/app/template/TextArtSettings.template b/apps/documenteditor/main/app/template/TextArtSettings.template index 4d837ca5e..d64e7d07d 100644 --- a/apps/documenteditor/main/app/template/TextArtSettings.template +++ b/apps/documenteditor/main/app/template/TextArtSettings.template @@ -83,6 +83,14 @@ + + +
+ +
+
+ +
diff --git a/apps/documenteditor/main/app/view/ShapeSettings.js b/apps/documenteditor/main/app/view/ShapeSettings.js index 8449545cd..e408d1a8d 100644 --- a/apps/documenteditor/main/app/view/ShapeSettings.js +++ b/apps/documenteditor/main/app/view/ShapeSettings.js @@ -89,6 +89,7 @@ define([ StrokeType: Asc.c_oAscStrokeType.STROKE_COLOR, StrokeWidth: this._pt2mm(1), StrokeColor: '000000', + StrokeBorderType: Asc.c_oDashType.solid, FGColor: '000000', BGColor: 'ffffff', GradColor: '000000', @@ -117,6 +118,7 @@ define([ this.BorderColor = {Value: 1, Color: 'transparent'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным this.BorderSize = 0; + this.BorderType = Asc.c_oDashType.solid; this.textureNames = [this.txtCanvas, this.txtCarton, this.txtDarkFabric, this.txtGrain, this.txtGranite, this.txtGreyPaper, this.txtKnit, this.txtLeather, this.txtBrownPaper, this.txtPapyrus, this.txtWood]; @@ -540,6 +542,16 @@ define([ this.btnBorderColor.setColor('000000'); $(this.el).on('click', '#shape-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor)); + this.cmbBorderType = new Common.UI.ComboBorderType({ + el: $('#shape-combo-border-type'), + style: "width: 93px;", + menuStyle: 'min-width: 93px;' + }).on('selected', _.bind(this.onBorderTypeSelect, this)) + .on('combo:blur', _.bind(this.onComboBlur, this, false)); + this.BorderType = Asc.c_oDashType.solid; + this.cmbBorderType.setValue(this.BorderType); + this.lockedControls.push(this.cmbBorderType); + var viewData = [ { offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconcls:'wrap-inline', tip: this.txtInline, selected: true }, { offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconcls:'wrap-square', tip: this.txtSquare }, @@ -1020,6 +1032,7 @@ define([ stroke.put_color(Common.Utils.ThemeColor.getRgbColor({color: '000000', effectId: 29})); else if (this._state.StrokeType == Asc.c_oAscStrokeType.STROKE_NONE || this._state.StrokeType === null) stroke.put_color(Common.Utils.ThemeColor.getRgbColor(Common.Utils.ThemeColor.colorValue2EffectId(this.BorderColor.Color))); + stroke.asc_putPrstDash(this.BorderType); stroke.put_width(this._pt2mm(this.BorderSize)); } props.put_stroke(stroke); @@ -1057,6 +1070,26 @@ define([ this.applyBorderSize(record.value); }, + onBorderTypeSelect: function(combo, record) { + this.BorderType = record.value; + if (this.api && !this._noApply) { + var props = new Asc.asc_CShapeProperty(); + var stroke = new Asc.asc_CStroke(); + if (this.BorderSize<0.01) { + stroke.put_type( Asc.c_oAscStrokeType.STROKE_NONE); + } else { + stroke.put_type( Asc.c_oAscStrokeType.STROKE_COLOR); + stroke.put_color(Common.Utils.ThemeColor.getRgbColor(this.BorderColor.Color)); + stroke.put_width(this._pt2mm(this.BorderSize)); + stroke.asc_putPrstDash(this.BorderType); + } + props.put_stroke(stroke); + this.imgprops.put_ShapeProperties(props); + this.api.ImgApply(this.imgprops); + } + this.fireEvent('editcomplete', this); + }, + onColorsBorderSelect: function(picker, color) { this.btnBorderColor.setColor(color); this.BorderColor = {Value: 1, Color: color}; @@ -1069,6 +1102,7 @@ define([ stroke.put_type( Asc.c_oAscStrokeType.STROKE_COLOR); stroke.put_color(Common.Utils.ThemeColor.getRgbColor(this.BorderColor.Color)); stroke.put_width(this._pt2mm(this.BorderSize)); + stroke.asc_putPrstDash(this.BorderType); } props.put_stroke(stroke); this.imgprops.put_ShapeProperties(props); @@ -1434,8 +1468,9 @@ define([ } // border colors - var stroke = shapeprops.get_stroke(); - var strokeType = stroke.get_type(); + var stroke = shapeprops.get_stroke(), + strokeType = stroke.get_type(), + borderType; if (stroke) { if ( strokeType == Asc.c_oAscStrokeType.STROKE_COLOR ) { @@ -1452,6 +1487,7 @@ define([ } else { this.BorderColor = {Value: 1, Color: 'transparent'}; } + borderType = stroke.asc_getPrstDash(); } else { // no stroke strokeType = null; this.BorderColor = {Value: 0, Color: 'transparent'}; @@ -1514,6 +1550,11 @@ define([ this._state.StrokeType = strokeType; } + if (this._state.StrokeBorderType !== borderType) { + this.BorderType = this._state.StrokeBorderType = borderType; + this.cmbBorderType.setValue(borderType); + } + // pattern colors type1 = typeof(this.FGColor.Color); type2 = typeof(this._state.FGColor); @@ -1825,6 +1866,7 @@ define([ txtTopAndBottom: 'Top and bottom', txtBehind: 'Behind', txtInFront: 'In front', - textBorderSizeErr: 'The entered value is incorrect.
Please enter a value between 0 pt and 1584 pt.' + textBorderSizeErr: 'The entered value is incorrect.
Please enter a value between 0 pt and 1584 pt.', + strType: 'Type' }, DE.Views.ShapeSettings || {})); }); diff --git a/apps/documenteditor/main/app/view/TextArtSettings.js b/apps/documenteditor/main/app/view/TextArtSettings.js index 6f60b114f..bfc576069 100644 --- a/apps/documenteditor/main/app/view/TextArtSettings.js +++ b/apps/documenteditor/main/app/view/TextArtSettings.js @@ -86,6 +86,7 @@ define([ StrokeType: Asc.c_oAscStrokeType.STROKE_COLOR, StrokeWidth: this._pt2mm(1), StrokeColor: '000000', + StrokeBorderType: Asc.c_oDashType.solid, GradColor: '000000', GradFillType: Asc.c_oAscFillGradType.GRAD_LINEAR, FormId: null, @@ -103,6 +104,7 @@ define([ this.BorderColor = {Value: 1, Color: 'transparent'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным this.BorderSize = 0; + this.BorderType = Asc.c_oDashType.solid; this.render(); @@ -379,6 +381,16 @@ define([ this.btnBorderColor.setColor('000000'); $(this.el).on('click', '#textart-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor)); + this.cmbBorderType = new Common.UI.ComboBorderType({ + el: $('#textart-combo-border-type'), + style: "width: 93px;", + menuStyle: 'min-width: 93px;' + }).on('selected', _.bind(this.onBorderTypeSelect, this)) + .on('combo:blur', _.bind(this.onComboBlur, this, false)); + this.BorderType = Asc.c_oDashType.solid; + this.cmbBorderType.setValue(this.BorderType); + this.lockedControls.push(this.cmbBorderType); + this.cmbTransform = new Common.UI.ComboDataView({ itemWidth: 50, itemHeight: 50, @@ -716,6 +728,7 @@ define([ stroke.put_color(Common.Utils.ThemeColor.getRgbColor({color: '000000', effectId: 29})); else if (this._state.StrokeType == Asc.c_oAscStrokeType.STROKE_NONE || this._state.StrokeType === null) stroke.put_color(Common.Utils.ThemeColor.getRgbColor(Common.Utils.ThemeColor.colorValue2EffectId(this.BorderColor.Color))); + stroke.asc_putPrstDash(this.BorderType); stroke.put_width(this._pt2mm(this.BorderSize)); } props.asc_putLine(stroke); @@ -753,6 +766,26 @@ define([ this.applyBorderSize(record.value); }, + onBorderTypeSelect: function(combo, record) { + this.BorderType = record.value; + if (this.api && !this._noApply) { + var props = new Asc.asc_TextArtProperties(); + var stroke = new Asc.asc_CStroke(); + if (this.BorderSize<0.01) { + stroke.put_type( Asc.c_oAscStrokeType.STROKE_NONE); + } else { + stroke.put_type( Asc.c_oAscStrokeType.STROKE_COLOR); + stroke.put_color(Common.Utils.ThemeColor.getRgbColor(this.BorderColor.Color)); + stroke.put_width(this._pt2mm(this.BorderSize)); + stroke.asc_putPrstDash(this.BorderType); + } + props.asc_putLine(stroke); + this.shapeprops.put_TextArtProperties(props); + this.api.ImgApply(this.imgprops); + } + this.fireEvent('editcomplete', this); + }, + onColorsBorderSelect: function(picker, color) { this.btnBorderColor.setColor(color); this.BorderColor = {Value: 1, Color: color}; @@ -765,6 +798,7 @@ define([ stroke.put_type( Asc.c_oAscStrokeType.STROKE_COLOR); stroke.put_color(Common.Utils.ThemeColor.getRgbColor(this.BorderColor.Color)); stroke.put_width(this._pt2mm(this.BorderSize)); + stroke.asc_putPrstDash(this.BorderType); } props.asc_putLine(stroke); this.shapeprops.put_TextArtProperties(props); @@ -940,7 +974,8 @@ define([ // border colors var stroke = shapeprops.asc_getLine(), - strokeType = (stroke) ? stroke.get_type() : null; + strokeType = (stroke) ? stroke.get_type() : null, + borderType; if (stroke) { if ( strokeType == Asc.c_oAscStrokeType.STROKE_COLOR ) { @@ -957,6 +992,7 @@ define([ } else { this.BorderColor = {Value: 1, Color: 'transparent'}; } + borderType = stroke.asc_getPrstDash(); } else { // no stroke this.BorderColor = {Value: 0, Color: 'transparent'}; } @@ -1018,6 +1054,11 @@ define([ this._state.StrokeType = strokeType; } + if (this._state.StrokeBorderType !== borderType) { + this.BorderType = this._state.StrokeBorderType = borderType; + this.cmbBorderType.setValue(borderType); + } + color = this.GradColor.colors[this.GradColor.currentIdx]; type1 = typeof(color); type2 = typeof(this._state.GradColor); @@ -1175,6 +1216,7 @@ define([ textGradient: 'Gradient', textBorderSizeErr: 'The entered value is incorrect.
Please enter a value between 0 pt and 1584 pt.', textTransform: 'Transform', - textTemplate: 'Template' + textTemplate: 'Template', + strType: 'Type' }, DE.Views.TextArtSettings || {})); }); diff --git a/apps/documenteditor/main/locale/en.json b/apps/documenteditor/main/locale/en.json index a2b8002dc..572fd49cb 100644 --- a/apps/documenteditor/main/locale/en.json +++ b/apps/documenteditor/main/locale/en.json @@ -1188,6 +1188,7 @@ "DE.Views.ShapeSettings.strSize": "Size", "DE.Views.ShapeSettings.strStroke": "Stroke", "DE.Views.ShapeSettings.strTransparency": "Opacity", + "DE.Views.ShapeSettings.strType": "Type", "DE.Views.ShapeSettings.textAdvanced": "Show advanced settings", "DE.Views.ShapeSettings.textBorderSizeErr": "The entered value is incorrect.
Please enter a value between 0 pt and 1584 pt.", "DE.Views.ShapeSettings.textColor": "Color Fill", @@ -1385,6 +1386,7 @@ "DE.Views.TextArtSettings.strSize": "Size", "DE.Views.TextArtSettings.strStroke": "Stroke", "DE.Views.TextArtSettings.strTransparency": "Opacity", + "DE.Views.TextArtSettings.strType": "Type", "DE.Views.TextArtSettings.textBorderSizeErr": "The entered value is incorrect.
Please enter a value between 0 pt and 1584 pt.", "DE.Views.TextArtSettings.textColor": "Color Fill", "DE.Views.TextArtSettings.textDirection": "Direction", diff --git a/apps/documenteditor/main/resources/img/popupmenu-btns.png b/apps/documenteditor/main/resources/img/popupmenu-btns.png index 7ba292ee8..91b274feb 100644 Binary files a/apps/documenteditor/main/resources/img/popupmenu-btns.png and b/apps/documenteditor/main/resources/img/popupmenu-btns.png differ diff --git a/apps/documenteditor/main/resources/img/popupmenu-btns@2x.png b/apps/documenteditor/main/resources/img/popupmenu-btns@2x.png index 1482a176d..5a1b534c5 100644 Binary files a/apps/documenteditor/main/resources/img/popupmenu-btns@2x.png and b/apps/documenteditor/main/resources/img/popupmenu-btns@2x.png differ