From de564a6968116c08fadfd2cfd101260105b9d282 Mon Sep 17 00:00:00 2001 From: OVSharova Date: Wed, 21 Jul 2021 05:25:56 +0300 Subject: [PATCH] Create listEffects --- .../main/app/controller/Transitions.js | 72 ++---- .../main/app/view/Transitions.js | 243 ++++++++++++++---- 2 files changed, 225 insertions(+), 90 deletions(-) diff --git a/apps/presentationeditor/main/app/controller/Transitions.js b/apps/presentationeditor/main/app/controller/Transitions.js index ca76c0399..b142320f4 100644 --- a/apps/presentationeditor/main/app/controller/Transitions.js +++ b/apps/presentationeditor/main/app/controller/Transitions.js @@ -64,7 +64,9 @@ define([ 'transit:preview': _.bind(this.onPreviewClick, this), 'transit:parametrs': _.bind(this.onParametrClick,this), 'transit:duration': _.bind(this.onDurationChange,this), - 'transit:applytoall': _.bind(this.onApplyToAllClick,this) + 'transit:applytoall': _.bind(this.onApplyToAllClick,this), + 'transit:selecteffect': _.bind(this.onEffectSelect, this), + 'transit:slidenum': _.bind(this.onHeaderChange,this) } }); @@ -127,52 +129,9 @@ define([ if ( me.view && Common.localStorage.getBool(me.view.appPrefix + "settings-spellcheck", !(config.customization && config.customization.spellcheck===false))) me.view.turnSpelling(true); - /*if ( config.canReview ) { - (new Promise(function (resolve) { - resolve(); - })).then(function () { - // function _setReviewStatus(state, global) { - // me.view.turnChanges(state, global); - // !global && me.api.asc_SetLocalTrackRevisions(state); - // Common.Utils.InternalSettings.set(me.view.appPrefix + "track-changes", (state ? 0 : 1) + (global ? 2 : 0)); - // }; - /*var trackChanges = typeof (me.appConfig.customization) == 'object' ? me.appConfig.customization.trackChanges : undefined; - if (config.isReviewOnly || trackChanges!==undefined) - me.api.asc_SetLocalTrackRevisions(config.isReviewOnly || trackChanges===true); - else - me.onApiTrackRevisionsChange(me.api.asc_GetLocalTrackRevisions(), me.api.asc_GetGlobalTrackRevisions()); - me.api.asc_HaveRevisionsChanges() && me.view.markChanges(true); - // _setReviewStatus(state, global); - if ( typeof (me.appConfig.customization) == 'object' && (me.appConfig.customization.showReviewChanges==true) ) { - me.dlgChanges = (new Common.Views.ReviewChangesDialog({ - popoverChanges : me.popoverChanges, - mode : me.appConfig - })); - var sdk = $('#editor_sdk'), - offset = sdk.offset(); - me.dlgChanges.show(Math.max(10, offset.left + sdk.width() - 300), Math.max(10, offset.top + sdk.height() - 150)); - } - }); - }*/ /*else if (config.canViewReview) { - config.canViewReview = (config.isEdit || me.api.asc_HaveRevisionsChanges(true)); // check revisions from all users - if (config.canViewReview) { - var val = Common.localStorage.getItem(me.view.appPrefix + "review-mode"); - if (val===null) - val = me.appConfig.customization && /^(original|final|markup)$/i.test(me.appConfig.customization.reviewDisplay) ? me.appConfig.customization.reviewDisplay.toLocaleLowerCase() : 'original'; - me.turnDisplayMode((config.isEdit || config.isRestrictedEdit) ? 'markup' : val); // load display mode only in viewer - me.view.turnDisplayMode((config.isEdit || config.isRestrictedEdit) ? 'markup' : val); - } - }*/ - - /* if (me.view && me.view.btnChat) { - me.getApplication().getController('LeftMenu').leftMenu.btnChat.on('toggle', function(btn, state){ - if (state !== me.view.btnChat.pressed) - me.view.turnChat(state); - }); - }*/ if (me.view) { me.view.btnCommentRemove && me.view.btnCommentRemove.setDisabled(!Common.localStorage.getBool(me.view.appPrefix + "settings-livecomment", true)); me.view.btnCommentResolve && me.view.btnCommentResolve.setDisabled(!Common.localStorage.getBool(me.view.appPrefix + "settings-livecomment", true)); @@ -203,8 +162,33 @@ define([ this.api.SetSlideProps(props); } }, + onHeaderChange: function(type, field, newValue, oldValue, eOpts){ + if (this.api && !this._noApply) { + var props = this.api.asc_getHeaderFooterProperties(); + props.get_Slide()[(type=='slidenum') ? 'put_ShowSlideNum' : 'put_ShowDateTime'](field.getValue()=='checked'); + this.api.asc_setHeaderFooterProperties(props); + } + this.fireEvent('editcomplete', this); + }, onApplyToAllClick: function (){ if (this.api) this.api.SlideTransitionApplyToAll(); + }, + onEffectSelect:function (combo, record){ + var type = record.get('value'); + if (this.Effect !== type && + !((this.Effect===Asc.c_oAscSlideTransitionTypes.Wipe || this.Effect===Asc.c_oAscSlideTransitionTypes.UnCover || this.Effect===Asc.c_oAscSlideTransitionTypes.Cover)&& + (type===Asc.c_oAscSlideTransitionTypes.Wipe || type===Asc.c_oAscSlideTransitionTypes.UnCover || type===Asc.c_oAscSlideTransitionTypes.Cover)) ) + this.view.setMenuParametrs(type); + this.Effect = type; + if (this.api && !this._noApply) { + var props = new Asc.CAscSlideProps(); + var transition = new Asc.CAscSlideTransition(); + transition.put_TransitionType(type); + transition.put_TransitionOption(this.EffectType); + props.put_transition(transition); + this.api.SetSlideProps(props); + } + } }, PE.Controllers.Transitions || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/app/view/Transitions.js b/apps/presentationeditor/main/app/view/Transitions.js index 13e0fb549..c2e1ebb30 100644 --- a/apps/presentationeditor/main/app/view/Transitions.js +++ b/apps/presentationeditor/main/app/view/Transitions.js @@ -49,8 +49,9 @@ define([ 'common/main/lib/util/utils', 'common/main/lib/component/Button', 'common/main/lib/component/DataView', - 'common/main/lib/component/Layout',/* - 'presentationeditor/main/app/view/SlideSettings',*/ + 'common/main/lib/component/ComboDataView', + 'common/main/lib/component/Layout', + 'presentationeditor/main/app/view/SlideSettings', 'common/main/lib/component/MetricSpinner', 'common/main/lib/component/Window' ], function () { @@ -60,14 +61,16 @@ define([ var template = '
' + //'' + - '
' + + '
'+ + + '
' + '' + '
' + '
' + '
' + '
'+ - 'Durations'+ - ''+ + 'Durations'+ + ''+ '
'+ '
'+ '' + @@ -76,21 +79,27 @@ define([ '
' + '
' + '
'+ - ''+ + ''+ '
'+ '
'+ - 'Delay'+ - ''+ + 'Delay'+ + ''+ '
'+ '
'+ '
' + - '
' + + '
' + '' + '
' + '
'; function setEvents() { var me = this; + if(me.listEffects) + { + me.listEffects.on('click', _.bind(function (combo,record){ + me.fireEvent('transit:selecteffect',[combo,record]); + },me)); + } if(me.btnPreview) { me.btnPreview.on('click', _.bind(function(btn){ @@ -117,6 +126,17 @@ define([ me.fireEvent('transit:duration', [me.numDuration]); },me); } + if(me.numDelay){ + me.numDelay.on('change', function(bth) { + me.fireEvent('transit:delay', [me.numDelay]); + },me); + } + if(me.chSlideNum) + { + me.chSlideNum.on('change',_.bind(function (e){ + me.fireEvent('transit:slidenum',['slidenum', me.chSlideNum,me.chSlideNum.value, me.chSlideNum.lastValue]) + },me)); + } } return { @@ -126,34 +146,109 @@ define([ initialize: function (options) { this.$el=$(_.template(template)( {} )); + this.SladeSettings=PE.Views.ShapeSettings; + Common.UI.BaseView.prototype.initialize.call(this, options); this.appConfig = options.mode; var filter = Common.localStorage.getKeysFilter(); this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : ''; - this._arrEffectType = [ - {displayValue: this.textSmoothly, value: Asc.c_oAscSlideTransitionParams.Fade_Smoothly}, - {displayValue: this.textBlack, value: Asc.c_oAscSlideTransitionParams.Fade_Through_Black}, - {displayValue: this.textLeft, value: Asc.c_oAscSlideTransitionParams.Param_Left}, - {displayValue: this.textTop, value: Asc.c_oAscSlideTransitionParams.Param_Top}, - {displayValue: this.textRight, value: Asc.c_oAscSlideTransitionParams.Param_Right}, - {displayValue: this.textBottom, value: Asc.c_oAscSlideTransitionParams.Param_Bottom}, - {displayValue: this.textTopLeft, value: Asc.c_oAscSlideTransitionParams.Param_TopLeft}, - {displayValue: this.textTopRight, value: Asc.c_oAscSlideTransitionParams.Param_TopRight}, - {displayValue: this.textBottomLeft, value: Asc.c_oAscSlideTransitionParams.Param_BottomLeft}, - {displayValue: this.textBottomRight, value: Asc.c_oAscSlideTransitionParams.Param_BottomRight}, - {displayValue: this.textVerticalIn, value: Asc.c_oAscSlideTransitionParams.Split_VerticalIn}, - {displayValue: this.textVerticalOut, value: Asc.c_oAscSlideTransitionParams.Split_VerticalOut}, - {displayValue: this.textHorizontalIn, value: Asc.c_oAscSlideTransitionParams.Split_HorizontalIn}, - {displayValue: this.textHorizontalOut, value: Asc.c_oAscSlideTransitionParams.Split_HorizontalOut}, - {displayValue: this.textClockwise, value: Asc.c_oAscSlideTransitionParams.Clock_Clockwise}, - {displayValue: this.textCounterclockwise, value: Asc.c_oAscSlideTransitionParams.Clock_Counterclockwise}, - {displayValue: this.textWedge, value: Asc.c_oAscSlideTransitionParams.Clock_Wedge}, - {displayValue: this.textZoomIn, value: Asc.c_oAscSlideTransitionParams.Zoom_In}, - {displayValue: this.textZoomOut, value: Asc.c_oAscSlideTransitionParams.Zoom_Out}, - {displayValue: this.textZoomRotate, value: Asc.c_oAscSlideTransitionParams.Zoom_AndRotate} + this._arrEffectName = [ + {title: this.textNone, imageUrl:"btn-text", value: Asc.c_oAscSlideTransitionTypes.None, id: Common.UI.getId()}, + {title: this.textFade, imageUrl:"btn-insertimage", value: Asc.c_oAscSlideTransitionTypes.Fade, id: Common.UI.getId()}, + {title: this.textPush, imageUrl:"btn-insertshape", value: Asc.c_oAscSlideTransitionTypes.Push, id: Common.UI.getId()}, + {title: this.textWipe, imageUrl:"btn-insertchart", value: Asc.c_oAscSlideTransitionTypes.Wipe, id: Common.UI.getId()}, + {title: this.textSplit, imageUrl:"btn-textart", value: Asc.c_oAscSlideTransitionTypes.Split, id: Common.UI.getId()}, + {title: this.textUnCover, imageUrl:"btn-menu-comments", value: Asc.c_oAscSlideTransitionTypes.UnCover, id: Common.UI.getId()}, + {title: this.textCover, imageUrl:"btn-editheader", value: Asc.c_oAscSlideTransitionTypes.Cover, id: Common.UI.getId()}, + {title: this.textClock, imageUrl:"btn-datetime", value: Asc.c_oAscSlideTransitionTypes.Clock, id: Common.UI.getId()}, + {title: this.textZoom, imageUrl:"btn-insertequatio", value: Asc.c_oAscSlideTransitionTypes.Zoom, id: Common.UI.getId()} ]; + this._arrEffectType = [ + {caption: this.textSmoothly, value: Asc.c_oAscSlideTransitionParams.Fade_Smoothly}, + {caption: this.textBlack, value: Asc.c_oAscSlideTransitionParams.Fade_Through_Black}, + {caption: this.textLeft, value: Asc.c_oAscSlideTransitionParams.Param_Left}, + {caption: this.textTop, value: Asc.c_oAscSlideTransitionParams.Param_Top}, + {caption: this.textRight, value: Asc.c_oAscSlideTransitionParams.Param_Right}, + {caption: this.textBottom, value: Asc.c_oAscSlideTransitionParams.Param_Bottom}, + {caption: this.textTopLeft, value: Asc.c_oAscSlideTransitionParams.Param_TopLeft}, + {caption: this.textTopRight, value: Asc.c_oAscSlideTransitionParams.Param_TopRight}, + {caption: this.textBottomLeft, value: Asc.c_oAscSlideTransitionParams.Param_BottomLeft}, + {caption: this.textBottomRight, value: Asc.c_oAscSlideTransitionParams.Param_BottomRight}, + {caption: this.textVerticalIn, value: Asc.c_oAscSlideTransitionParams.Split_VerticalIn}, + {caption: this.textVerticalOut, value: Asc.c_oAscSlideTransitionParams.Split_VerticalOut}, + {caption: this.textHorizontalIn, value: Asc.c_oAscSlideTransitionParams.Split_HorizontalIn}, + {caption: this.textHorizontalOut, value: Asc.c_oAscSlideTransitionParams.Split_HorizontalOut}, + {caption: this.textClockwise, value: Asc.c_oAscSlideTransitionParams.Clock_Clockwise}, + {caption: this.textCounterclockwise, value: Asc.c_oAscSlideTransitionParams.Clock_Counterclockwise}, + {caption: this.textWedge, value: Asc.c_oAscSlideTransitionParams.Clock_Wedge}, + {caption: this.textZoomIn, value: Asc.c_oAscSlideTransitionParams.Zoom_In}, + {caption: this.textZoomOut, value: Asc.c_oAscSlideTransitionParams.Zoom_Out}, + {caption: this.textZoomRotate, value: Asc.c_oAscSlideTransitionParams.Zoom_AndRotate} + ]; + + this.listEffects = new Common.UI.ComboDataView({ + cls: 'combo-styles', + itemWidth: 90, + itemHeight: 38, + enableKeyEvents: true, + beforeOpenHandler: function (e) { + var cmp = this, + menu = cmp.openButton.menu, + minMenuColumn = 7; + + if (menu.cmpEl) { + var itemEl = $(cmp.cmpEl.find('.dataview.inner .style').get(0)).parent(); + var itemMargin = /*parseInt($(itemEl.get(0)).parent().css('margin-right'))*/-1; + Common.Utils.applicationPixelRatio() > 1 && Common.Utils.applicationPixelRatio() < 2 && (itemMargin = itemMargin + 1/Common.Utils.applicationPixelRatio()); + var itemWidth = itemEl.is(':visible') ? parseInt(itemEl.css('width')) : + (cmp.itemWidth + parseInt(itemEl.css('padding-left')) + parseInt(itemEl.css('padding-right')) + + parseInt(itemEl.css('border-left-width')) + parseInt(itemEl.css('border-right-width'))); + + var minCount = cmp.menuPicker.store.length >= minMenuColumn ? minMenuColumn : cmp.menuPicker.store.length, + columnCount = Math.min(cmp.menuPicker.store.length, Math.round($('.dataview', $(cmp.fieldPicker.el)).width() / (itemMargin + itemWidth) + 0.5)); + + columnCount = columnCount < minCount ? minCount : columnCount; + menu.menuAlignEl = cmp.cmpEl; + + menu.menuAlign = 'tl-tl'; + var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - columnCount * (itemMargin + itemWidth) - 1; + menu.setOffset(Math.min(offset, 0)); + + menu.cmpEl.css({ + 'width': columnCount * (itemWidth + itemMargin), + 'min-height': cmp.cmpEl.height() + }); + } + + if (cmp.menuPicker.scroller) { + cmp.menuPicker.scroller.update({ + includePadding: true, + suppressScrollX: true + }); + } + + cmp.removeTips(); + } + }); + this.listEffects.menuPicker.store.add(this._arrEffectName); + + this.listEffects.fieldPicker.itemTemplate = _.template([ + '
', + '
', + '
', + '
', + '', + '
', + '
', + '<%= title %>', + '
', + '
', + '
', + '
' + ].join('')); + this.listEffects.menuPicker.itemTemplate =this.listEffects.fieldPicker.itemTemplate; this.btnPreview = new Common.UI.Button({ cls: 'btn-toolbar text',// x-huge icon-top', @@ -219,39 +314,40 @@ define([ var menuTemplate = _.template('
<%= caption %>
' + '<% if (options.description !== null) { %>' + '<% } %>'); + var itemsMenu=[]; + _.each(me._arrEffectType, function (item){ + itemsMenu.push( + { + caption: item.caption, + value: item.value, + checkable: true, + toggleGroup: 'effects', + disabled:false + } + ); + }); me.btnParametrs.setMenu( new Common.UI.Menu({ - items: [ - { - caption: me.textSmoothly, - value: me.textSmoothly, - checkable: true, - toggleGroup: 'effects' - }, - { - caption: me.textBlack, - value: me.textBlack, - checkable: true, - toggleGroup: 'effects' - } - ] + items: itemsMenu }) ); + setEvents.call(me); }); }, getPanel: function () { - this.$el = $(_.template(template)( {} )); - + //this.$el = $(_.template(template)( {} )); + this.listEffects&&this.listEffects.render(this.$el.find('#transit-field-effects')); this.btnPreview && this.btnPreview.render(this.$el.find('#transit-button-preview')); this.btnParametrs && this.btnParametrs.render(this.$el.find('#transit-button-parametrs')); this.btnApplyToAll && this.btnApplyToAll.render(this.$el.find('#transit-button-apply')); this.renderComponent('#transit-spin-duration', this.numDuration); this.renderComponent('#transit-spin-delay', this.numDelay); this.renderComponent('#transit-checkbox-slidenum', this.chSlideNum); + return this.$el; }, @@ -276,6 +372,52 @@ define([ var element=this.$el.find(compid); element.parent().append(obj.el); }, + setMenuParametrs:function (effect) + { + + var minMax=[0,0]; + switch (effect) { + case Asc.c_oAscSlideTransitionTypes.Fade: + minMax=[0,1]; + break; + case Asc.c_oAscSlideTransitionTypes.Push: + minMax=[2, 6]; + break; + case Asc.c_oAscSlideTransitionTypes.Wipe: + minMax=[2, 10]; + break; + case Asc.c_oAscSlideTransitionTypes.Split: + minMax=[10, 14]; + break; + case Asc.c_oAscSlideTransitionTypes.UnCover: + minMax=[2, 10]; + break; + case Asc.c_oAscSlideTransitionTypes.Cover: + minMax=[2, 10]; + break; + case Asc.c_oAscSlideTransitionTypes.Clock: + minMax=[14, 17]; + break; + case Asc.c_oAscSlideTransitionTypes.Zoom: + minMax=[17,17]; + break; + } + var i + _.each(this.btnParametrs.menu.items,function (element,index){ + + if((indexminMax[1])) + element.$el.css('display','none'); + else + element.$el.css('display',''); + + + + }); + + + }, + + txtSec:'s', txtPreview:'Preview', txtParametrs: 'Parametrs', @@ -283,6 +425,15 @@ define([ strDuration: 'Duration', strSlideNum: 'Start On Click', + textNone: 'None', + textFade: 'Fade', + textPush: 'Push', + textWipe: 'Wipe', + textSplit: 'Split', + textUnCover: 'UnCover', + textCover: 'Cover', + textClock: 'Clock', + textZoom: 'Zoom', textSmoothly: 'Smoothly', textBlack: 'Through Black', textLeft: 'Left',