diff --git a/apps/presentationeditor/main/app/template/ImageSettings.template b/apps/presentationeditor/main/app/template/ImageSettings.template index d1c9ef2fa..558f0b94b 100644 --- a/apps/presentationeditor/main/app/template/ImageSettings.template +++ b/apps/presentationeditor/main/app/template/ImageSettings.template @@ -17,6 +17,11 @@ + + +
+ +
diff --git a/apps/presentationeditor/main/app/view/ImageSettings.js b/apps/presentationeditor/main/app/view/ImageSettings.js index 274cac1ab..f6c3cc17b 100644 --- a/apps/presentationeditor/main/app/view/ImageSettings.js +++ b/apps/presentationeditor/main/app/view/ImageSettings.js @@ -93,6 +93,9 @@ define([ setApi: function(api) { this.api = api; + if (this.api) { + this.api.asc_registerCallback('asc_ChangeCropState', _.bind(this._changeCropState, this)); + } return this; }, @@ -139,6 +142,37 @@ define([ this.fireEvent('editcomplete', this); }, this)); + this.btnCrop = new Common.UI.Button({ + cls: 'btn-text-split-default', + caption: this.textCrop, + split: true, + enableToggle: true, + allowDepress: true, + width: 100, + menu : new Common.UI.Menu({ + style : 'min-width: 100px;', + items: [ + { + caption: this.textCrop, + checkable: true, + allowDepress: true, + value: 0 + }, + { + caption: this.textCropFill, + value: 1 + }, + { + caption: this.textCropFit, + value: 2 + }] + }) + }); + this.btnCrop.render( $('#image-button-crop')) ; + this.btnCrop.on('click', _.bind(this.onCrop, this)); + this.btnCrop.menu.on('item:click', _.bind(this.onCropMenu, this)); + this.lockedControls.push(this.btnCrop); + this.btnRotate270 = new Common.UI.Button({ cls: 'btn-toolbar', iconCls: 'rotate-270', @@ -312,6 +346,31 @@ define([ } }, + _changeCropState: function(state) { + this.btnCrop.toggle(state, true); + this.btnCrop.menu.items[0].setChecked(state, true); + }, + + onCrop: function(btn, e) { + if (this.api) { + btn.pressed ? this.api.asc_startEditCrop() : this.api.asc_endEditCrop(); + } + this.fireEvent('editcomplete', this); + }, + + onCropMenu: function(menu, item) { + if (this.api) { + if (item.value == 1) { + this.api.asc_cropFill(); + } else if (item.value == 2) { + this.api.asc_cropFit(); + } else { + item.checked ? this.api.asc_startEditCrop() : this.api.asc_endEditCrop(); + } + } + this.fireEvent('editcomplete', this); + }, + onBtnRotateClick: function(btn) { var properties = new Asc.asc_CImgProperty(); properties.asc_putRotAdd((btn.options.value==1 ? 90 : 270) * 3.14159265358979 / 180); @@ -343,6 +402,7 @@ define([ }); this.linkAdvanced.toggleClass('disabled', disable); } + this.btnCrop.setDisabled(disable || !this.api.asc_canEditCrop()); }, textSize: 'Size', @@ -361,7 +421,10 @@ define([ textHint270: 'Rotate 90° Counterclockwise', textHint90: 'Rotate 90° Clockwise', textHintFlipV: 'Flip Vertically', - textHintFlipH: 'Flip Horizontally' + textHintFlipH: 'Flip Horizontally', + textCrop: 'Crop', + textCropFill: 'Fill', + textCropFit: 'Fit' }, PE.Views.ImageSettings || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index ab110e5d5..0892bb1f1 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -1240,6 +1240,9 @@ "PE.Views.ImageSettings.textRotation": "Rotation", "PE.Views.ImageSettings.textSize": "Size", "PE.Views.ImageSettings.textWidth": "Width", + "PE.Views.ImageSettings.textCrop": "Crop", + "PE.Views.ImageSettings.textCropFill": "Fill", + "PE.Views.ImageSettings.textCropFit": "Fit", "PE.Views.ImageSettingsAdvanced.cancelButtonText": "Cancel", "PE.Views.ImageSettingsAdvanced.okButtonText": "OK", "PE.Views.ImageSettingsAdvanced.textAlt": "Alternative Text", diff --git a/apps/spreadsheeteditor/main/app/template/ImageSettings.template b/apps/spreadsheeteditor/main/app/template/ImageSettings.template index bef0c6502..8e90e9ace 100644 --- a/apps/spreadsheeteditor/main/app/template/ImageSettings.template +++ b/apps/spreadsheeteditor/main/app/template/ImageSettings.template @@ -24,6 +24,11 @@ + + +
+ +
diff --git a/apps/spreadsheeteditor/main/app/view/ImageSettings.js b/apps/spreadsheeteditor/main/app/view/ImageSettings.js index 6109babce..46e1c006b 100644 --- a/apps/spreadsheeteditor/main/app/view/ImageSettings.js +++ b/apps/spreadsheeteditor/main/app/view/ImageSettings.js @@ -97,6 +97,9 @@ define([ setApi: function(api) { if ( api == undefined ) return; this.api = api; + if (this.api) { + this.api.asc_registerCallback('asc_ChangeCropState', _.bind(this._changeCropState, this)); + } return this; }, @@ -195,6 +198,37 @@ define([ this.lblReplace = $('#image-lbl-replace'); + this.btnCrop = new Common.UI.Button({ + cls: 'btn-text-split-default', + caption: this.textCrop, + split: true, + enableToggle: true, + allowDepress: true, + width: 100, + menu : new Common.UI.Menu({ + style : 'min-width: 100px;', + items: [ + { + caption: this.textCrop, + checkable: true, + allowDepress: true, + value: 0 + }, + { + caption: this.textCropFill, + value: 1 + }, + { + caption: this.textCropFit, + value: 2 + }] + }) + }); + this.btnCrop.render( $('#image-button-crop')) ; + this.btnCrop.on('click', _.bind(this.onCrop, this)); + this.btnCrop.menu.on('item:click', _.bind(this.onCropMenu, this)); + this.lockedControls.push(this.btnCrop); + this.btnRotate270 = new Common.UI.Button({ cls: 'btn-toolbar', iconCls: 'rotate-270', @@ -410,6 +444,31 @@ define([ })).show(); }, + _changeCropState: function(state) { + this.btnCrop.toggle(state, true); + this.btnCrop.menu.items[0].setChecked(state, true); + }, + + onCrop: function(btn, e) { + if (this.api) { + btn.pressed ? this.api.asc_startEditCrop() : this.api.asc_endEditCrop(); + } + this.fireEvent('editcomplete', this); + }, + + onCropMenu: function(menu, item) { + if (this.api) { + if (item.value == 1) { + this.api.asc_cropFill(); + } else if (item.value == 2) { + this.api.asc_cropFit(); + } else { + item.checked ? this.api.asc_startEditCrop() : this.api.asc_endEditCrop(); + } + } + this.fireEvent('editcomplete', this); + }, + onBtnRotateClick: function(btn) { var properties = new Asc.asc_CImgProperty(); properties.asc_putRotAdd((btn.options.value==1 ? 90 : 270) * 3.14159265358979 / 180); @@ -441,6 +500,7 @@ define([ }); this.linkAdvanced.toggleClass('disabled', disable); } + this.btnCrop.setDisabled(disable || !this.api.asc_canEditCrop()); }, textKeepRatio: 'Constant Proportions', @@ -460,6 +520,9 @@ define([ textHint270: 'Rotate 90° Counterclockwise', textHint90: 'Rotate 90° Clockwise', textHintFlipV: 'Flip Vertically', - textHintFlipH: 'Flip Horizontally' + textHintFlipH: 'Flip Horizontally', + textCrop: 'Crop', + textCropFill: 'Fill', + textCropFit: 'Fit' }, SSE.Views.ImageSettings || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/locale/en.json b/apps/spreadsheeteditor/main/locale/en.json index 3d2407280..529def99f 100644 --- a/apps/spreadsheeteditor/main/locale/en.json +++ b/apps/spreadsheeteditor/main/locale/en.json @@ -1605,6 +1605,9 @@ "SSE.Views.ImageSettings.textRotation": "Rotation", "SSE.Views.ImageSettings.textSize": "Size", "SSE.Views.ImageSettings.textWidth": "Width", + "SSE.Views.ImageSettings.textCrop": "Crop", + "SSE.Views.ImageSettings.textCropFill": "Fill", + "SSE.Views.ImageSettings.textCropFit": "Fit", "SSE.Views.ImageSettingsAdvanced.cancelButtonText": "Cancel", "SSE.Views.ImageSettingsAdvanced.okButtonText": "Ok", "SSE.Views.ImageSettingsAdvanced.textAlt": "Alternative Text",