Skip to content

Commit

Permalink
[PE] Add cmb insert shape in home and insert tabs
Browse files Browse the repository at this point in the history
  • Loading branch information
@Basher0303
Basher0303 committed Sep 30, 2024
1 parent 88bc777 commit 13b221f
Show file tree
Hide file tree
Showing 9 changed files with 103 additions and 162 deletions.
8 changes: 4 additions & 4 deletions apps/common/main/resources/less/toolbar.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -877,7 +877,7 @@
}
}

#slot-combo-insertshape {
#slot-combo-insertshape, .slot-combo-insertshape {
width: 150px;
height: 46px;
.view {
Expand Down Expand Up @@ -914,8 +914,8 @@
.button {
width: 14px;
.caret {
width: 4px;
height: 4px;
width: 4px !important;
height: 4px !important;
}
}
}
Expand Down Expand Up @@ -1192,4 +1192,4 @@ section .field-styles {
}
}
}
}
}
4 changes: 2 additions & 2 deletions apps/pdfeditor/main/resources/less/toolbar.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@
width: 40px;
}

#slot-combo-insertshape .menu-insert-shape {
#slot-combo-insertshape .menu-insert-shape, .slot-combo-insertshape .menu-insert-shape {
width: 330px;
}

Expand Down Expand Up @@ -168,4 +168,4 @@
.separator {
height: 20px;
}
}
}
79 changes: 29 additions & 50 deletions apps/presentationeditor/main/app/controller/Toolbar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -213,43 +213,38 @@ define([

if (cmp.attr('id') != 'editor_sdk' && cmp_sdk.length<=0) {
if ( me.toolbar.btnsInsertText.pressed() && !me.toolbar.btnsInsertText.contains(btn_id) ||
me.toolbar.btnsInsertShape.pressed() && !me.toolbar.btnsInsertShape.contains(btn_id) ||
me.toolbar.cmbInsertShape.isComboViewRecActive() && me.toolbar.cmbInsertShape.id !== btn_id ||
me.toolbar.btnInsertPlaceholder.pressed && me.toolbar.btnInsertPlaceholder.id !== btn_id)
me.toolbar.cmbsInsertShape.some(function(cmb) {
return cmb.isComboViewRecActive() && cmb.id !== btn_id;
}) ||
me.toolbar.btnInsertPlaceholder.pressed && me.toolbar.btnInsertPlaceholder.id !== btn_id)
{
me._isAddingShape = false;

me._addAutoshape(false);
me.toolbar.btnsInsertShape.toggle(false, true);
me.toolbar.btnsInsertText.toggle(false, true);
me.toolbar.cmbInsertShape.deactivateRecords();
me.toolbar.cmbsInsertShape.forEach(function(cmb) {
cmb.deactivateRecords();
});
me.toolbar.btnInsertPlaceholder.toggle(false, true);
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
} else
if ( me.toolbar.btnsInsertShape.pressed() && me.toolbar.btnsInsertShape.contains(btn_id) ) {
_.defer(function(){
me.api.StartAddShape('', false);
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
}, 100);
}
}
};

this.onApiEndAddShape = function() {
this.toolbar.fireEvent('insertshape', this.toolbar);

if ( this.toolbar.btnsInsertShape.pressed() )
this.toolbar.btnsInsertShape.toggle(false, true);

if ( this.toolbar.btnsInsertText.pressed() ) {
this.toolbar.btnsInsertText.toggle(false, true);
this.toolbar.btnsInsertText.forEach(function(button) {
button.menu.clearAll();
});
}

if ( this.toolbar.cmbInsertShape.isComboViewRecActive() )
this.toolbar.cmbInsertShape.deactivateRecords();
this.toolbar.cmbsInsertShape.forEach(function(cmb) {
if (cmb.isComboViewRecActive())
cmb.deactivateRecords();
});

if (this.toolbar.btnInsertPlaceholder.pressed)
this.toolbar.btnInsertPlaceholder.toggle(false, true);
Expand Down Expand Up @@ -799,14 +794,15 @@ define([
if (this._state.no_slides !== (count<=0)) {
this._state.no_slides = (count<=0);
this.toolbar.lockToolbar(Common.enumLock.noSlides, this._state.no_slides, {array: this.toolbar.paragraphControls});
this.toolbar.lockToolbar(Common.enumLock.noSlides, this._state.no_slides, {array: this.toolbar.btnsChangeSlide.concat(this.toolbar.btnsPreview, [
this.toolbar.lockToolbar(Common.enumLock.noSlides, this._state.no_slides, {array: this.toolbar.btnsChangeSlide.concat(
this.toolbar.btnsPreview, this.toolbar.cmbsInsertShape, [
this.toolbar.btnPrint, this.toolbar.btnCopy, this.toolbar.btnCut, this.toolbar.btnSelectAll, this.toolbar.btnReplace, this.toolbar.btnPaste,
this.toolbar.btnCopyStyle, this.toolbar.btnInsertTable, this.toolbar.btnInsertChart, this.toolbar.btnInsertSmartArt,
this.toolbar.btnColorSchemas, this.toolbar.btnShapeAlign, this.toolbar.cmbInsertShape,
this.toolbar.btnColorSchemas, this.toolbar.btnShapeAlign,
this.toolbar.btnShapeArrange, this.toolbar.btnSlideSize, this.toolbar.listTheme, this.toolbar.btnEditHeader, this.toolbar.btnInsDateTime, this.toolbar.btnInsSlideNum
])});
this.toolbar.lockToolbar(Common.enumLock.noSlides, this._state.no_slides,
{ array: this.toolbar.btnsInsertImage.concat(this.toolbar.btnsInsertText, this.toolbar.btnsInsertShape, this.toolbar.btnInsertEquation, this.toolbar.btnInsertTextArt, this.toolbar.btnInsAudio, this.toolbar.btnInsVideo) });
{ array: this.toolbar.btnsInsertImage.concat(this.toolbar.btnsInsertText, this.toolbar.btnInsertEquation, this.toolbar.btnInsertTextArt, this.toolbar.btnInsAudio, this.toolbar.btnInsVideo) });
if (this.btnsComment)
this.toolbar.lockToolbar(Common.enumLock.noSlides, this._state.no_slides, { array: this.btnsComment });
if (this.btnsDrawTab)
Expand Down Expand Up @@ -1948,19 +1944,13 @@ define([
if (this.api)
this._addAutoshape(btn.pressed, type);

if ( this.toolbar.btnsInsertShape.pressed() )
this.toolbar.btnsInsertShape.toggle(false, true);

Common.NotificationCenter.trigger('edit:complete', this.toolbar);
Common.component.Analytics.trackEvent('ToolBar', 'Add Text');
},

onInsertShape: function (type) {
var me = this;
if ( type == 'menu:hide' ) {
if ( me.toolbar.btnsInsertShape.pressed() && !me._isAddingShape ) {
me.toolbar.btnsInsertShape.toggle(false, true);
}
me._isAddingShape = false;

Common.NotificationCenter.trigger('edit:complete', me.toolbar);
Expand All @@ -1982,9 +1972,6 @@ define([
me.toolbar.fireEvent('inserttextart', me.toolbar);
me.api.AddTextArt(data);

if ( me.toolbar.btnsInsertShape.pressed() )
me.toolbar.btnsInsertShape.toggle(false, true);

Common.NotificationCenter.trigger('edit:complete', me.toolbar);
Common.component.Analytics.trackEvent('ToolBar', 'Add Text Art');
},
Expand Down Expand Up @@ -2309,28 +2296,23 @@ define([
onResetAutoshapes: function () {
var me = this,
collection = PE.getCollection('ShapeGroups');
var onShowBefore = function(menu) {
me.toolbar.updateAutoshapeMenu(menu, collection);
menu.off('show:before', onShowBefore);
};
me.toolbar.btnsInsertShape.forEach(function (btn, index) {
btn.menu.on('show:before', onShowBefore);
});
var onComboShowBefore = function (menu) {
me.toolbar.updateComboAutoshapeMenu(collection);
menu.off('show:before', onComboShowBefore);
}
me.toolbar.cmbInsertShape.openButton.menu.on('show:before', onComboShowBefore);
me.toolbar.cmbInsertShape.fillComboView(collection);
me.toolbar.cmbInsertShape.on('click', function (btn, record, cancel) {
if (cancel) {
me._addAutoshape(false);
return;
}
if (record) {
me.toolbar.cmbInsertShape.updateComboView(record);
me.onInsertShape(record.get('data').shapeType);
}
me.toolbar.cmbsInsertShape.forEach(function(cmb) {
cmb.openButton.menu.on('show:before', onComboShowBefore);
cmb.fillComboView(collection);
cmb.on('click', function (btn, record, cancel) {
if (cancel) {
me._addAutoshape(false);
return;
}
if (record) {
cmb.updateComboView(record);
me.onInsertShape(record.get('data').shapeType);
}
});
});
},

Expand Down Expand Up @@ -2366,9 +2348,6 @@ define([
if (me.toolbar.btnsInsertText.pressed()) {
me.toolbar.btnsInsertText.toggle(false, true);
}
if (me.toolbar.btnsInsertShape.pressed()) {
me.toolbar.btnsInsertShape.toggle(false, true);
}

if (e.type !== 'click')
me.toolbar.btnInsertEquation.menu.hide();
Expand Down Expand Up @@ -3077,4 +3056,4 @@ define([
}

}, PE.Controllers.Toolbar || {}));
});});
});
3 changes: 2 additions & 1 deletion apps/presentationeditor/main/app/template/Toolbar.template
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,7 @@
<span class="btn-slot text x-huge slot-insertimg"></span>
<span class="btn-slot text x-huge slot-insertshape"></span>
</div>
<div class="group small slot-combo-insertshape"></div>
<div class="group small">
<div class="elset">
<span class="btn-slot split" id="slot-btn-arrange-shape"></span>
Expand Down Expand Up @@ -147,7 +148,7 @@
<span class="btn-slot text x-huge slot-insertimg"></span>
</div>
<div class="separator long invisible"></div>
<div class="group small" id="slot-combo-insertshape"></div>
<div class="group small slot-combo-insertshape"></div>
<div class="group small">
<span class="btn-slot text x-huge" id="slot-btn-inssmartart"></span>
<span class="btn-slot text x-huge" id="slot-btn-insertchart"></span>
Expand Down
10 changes: 6 additions & 4 deletions apps/presentationeditor/main/app/view/ImageSettings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -312,7 +312,9 @@ define([
});
shapePicker.on('item:click', function(picker, item, record, e) {
if (me.api) {
PE.getController('Toolbar').toolbar.cmbInsertShape.updateComboView(record);
PE.getController('Toolbar').toolbar.cmbsInsertShape.forEach(function(cmb) {
cmb.updateComboView(record);
});
me.api.ChangeShapeType(record.get('data').shapeType);
me.fireEvent('editcomplete', me);
}
Expand Down Expand Up @@ -422,7 +424,7 @@ define([
this._isFromFile = false;
}
},

openAdvancedSettings: function(e) {
if (this.linkAdvanced.hasClass('disabled')) return;

Expand Down Expand Up @@ -519,7 +521,7 @@ define([

disableControls: function(disable) {
if (this._initSettings) return;

if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
Expand Down Expand Up @@ -555,4 +557,4 @@ define([
textFromStorage: 'From Storage',
textRecentlyUsed: 'Recently Used'
}, PE.Views.ImageSettings || {}));
});
});
34 changes: 18 additions & 16 deletions apps/presentationeditor/main/app/view/ShapeSettings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -595,7 +595,7 @@ define([
arr.push(Common.Utils.ThemeColor.getRgbColor(item));
});
fill.get_fill().put_colors(arr);

props.put_fill(fill);
this.api.ShapeApply(props);
this._sliderChanged = false;
Expand Down Expand Up @@ -1122,7 +1122,7 @@ define([
this.BorderType = this._state.StrokeBorderType = borderType;
this.cmbBorderType.setValue(borderType);
}

// pattern colors
type1 = typeof(this.FGColor.Color);
type2 = typeof(this._state.FGColor);
Expand Down Expand Up @@ -1168,27 +1168,27 @@ define([
var shadowPreset = shadow.getPreset();
if(shadowPreset) {
shadowPresetRecord = this.viewShadowShapePresets.store.findWhere({value: shadowPreset});
}
}

color = shadow.getColor();
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
this.ShadowColor = {Value: 1, Color: {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() }};
} else {
this.ShadowColor = {Value: 1, Color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())};
}

color = this.ShadowColor.Color;
type1 = typeof(this.ShadowColor);
type2 = typeof(this._state.ShadowColor);

if ( (type1 !== type2) || (type1=='object' &&
(color.effectValue!==this._state.ShadowColor.effectValue || this._state.ShadowColor.color.indexOf(color.color)<0)) ||
(type1!='object' && this._state.ShadowColor.indexOf(color)<0 )) {

Common.Utils.ThemeColor.selectPickerColorByEffect(color, this.mnuShadowShapeColorPicker);
this._state.ShadowColor = color;
}
}
}

if(shadowPresetRecord) {
this._state.ShadowPreset = shadowPresetRecord;
Expand All @@ -1200,7 +1200,7 @@ define([

this.btnShadowShape.menu.items[1].setChecked(!shadow, true)


this._noApply = false;
}
},
Expand Down Expand Up @@ -1738,7 +1738,7 @@ define([
} else {
me.viewShadowShapePresets.deselectAll();
}
});
});
this.mnuShadowShapeColor.menu.on('show:before', function() {
if(me._state.ShadowColor) {
me.mnuShadowShapeColorPicker.select(me._state.ShadowColor,true);
Expand Down Expand Up @@ -1771,7 +1771,7 @@ define([
'margin-right:<%= offsetX %>px;' +
'box-shadow: <% if(Common.Utils.isIE) {%>rgba(0,0,0,0.4)<%} else {%>var(--text-tertiary)<%}%> <%= offsetX %>px <%= offsetY %>px 0px <%= spread %>px ;"' +
'>' +
'</div>' +
'</div>' +
'</div>')
});
this.viewShadowShapePresets.on('item:click', _.bind(this.onSelectShadowPreset, this));
Expand All @@ -1780,7 +1780,7 @@ define([
this.mnuShadowShapeColorPicker = new Common.UI.ThemeColorPalette({
el: $('#shape-button-shadow-shape-menu-picker'),
outerMenu: {menu: this.mnuShadowShapeColor.menu, index: 0}
});
});
this.mnuShadowShapeColor.menu.setInnerMenu([{menu: this.mnuShadowShapeColorPicker, index: 0}]);
this.mnuShadowShapeColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors())
this.mnuShadowShapeColorPicker.on('select', _.bind(this.onSelectShadowColor, this));
Expand Down Expand Up @@ -1922,7 +1922,7 @@ define([
if(item.value == 1) {
if (this.api) {
var shapeProps = new Asc.asc_CShapeProperty();

if(item.checked) {
shapeProps.asc_putShadow(null);
} else {
Expand All @@ -1933,7 +1933,7 @@ define([
this.api.ShapeApply(shapeProps);
}
this.fireEvent('editcomplete', this);
}
}
//Adjust shadow
else if(item.value == 3) {
var me = this;
Expand All @@ -1960,7 +1960,7 @@ define([
me.mnuShadowShapeColorPicker.setCustomColor('#' + color);
me.onSelectShadowColor(null, color);
});
}
}
//More colors
else if(item.value == 2) {
this.mnuShadowShapeColorPicker.addNewColor();
Expand All @@ -1981,7 +1981,7 @@ define([
this.api.ShapeApply(shapeProps);
this.fireEvent('editcomplete', this);
},

onApiAutoShapes: function(btnChangeShape) {
var me = this;
var onShowBefore = function(menu) {
Expand Down Expand Up @@ -2014,7 +2014,9 @@ define([
});
me.btnChangeShape.shapePicker.on('item:click', function(picker, item, record, e) {
if (me.api) {
PE.getController('Toolbar').toolbar.cmbInsertShape.updateComboView(record);
PE.getController('Toolbar').toolbar.cmbsInsertShape.forEach(function(cmb) {
cmb.updateComboView(record);
});
me.api.ChangeShapeType(record.get('data').shapeType);
me.fireEvent('editcomplete', me);
}
Expand Down Expand Up @@ -2176,7 +2178,7 @@ define([

disableControls: function(disable, disableFill) {
if (this._initSettings) return;

this.disableFillPanels(disable || disableFill);
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
Expand Down
Loading

0 comments on commit 13b221f

Please sign in to comment.