2016-04-01 13:17:09 +00:00
|
|
|
|
/*
|
|
|
|
|
|
*
|
|
|
|
|
|
* (c) Copyright Ascensio System Limited 2010-2016
|
|
|
|
|
|
*
|
|
|
|
|
|
* This program is a free software product. You can redistribute it and/or
|
|
|
|
|
|
* modify it under the terms of the GNU Affero General Public License (AGPL)
|
|
|
|
|
|
* version 3 as published by the Free Software Foundation. In accordance with
|
|
|
|
|
|
* Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect
|
|
|
|
|
|
* that Ascensio System SIA expressly excludes the warranty of non-infringement
|
|
|
|
|
|
* of any third-party rights.
|
|
|
|
|
|
*
|
|
|
|
|
|
* This program is distributed WITHOUT ANY WARRANTY; without even the implied
|
|
|
|
|
|
* warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For
|
|
|
|
|
|
* details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
|
|
|
|
|
|
*
|
|
|
|
|
|
* You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
|
|
|
|
|
|
* EU, LV-1021.
|
|
|
|
|
|
*
|
|
|
|
|
|
* The interactive user interfaces in modified source and object code versions
|
|
|
|
|
|
* of the Program must display Appropriate Legal Notices, as required under
|
|
|
|
|
|
* Section 5 of the GNU AGPL version 3.
|
|
|
|
|
|
*
|
|
|
|
|
|
* Pursuant to Section 7(b) of the License you must retain the original Product
|
|
|
|
|
|
* logo when distributing the program. Pursuant to Section 7(e) we decline to
|
|
|
|
|
|
* grant you any rights under trademark law for use of our trademarks.
|
|
|
|
|
|
*
|
|
|
|
|
|
* All the Product's GUI elements, including illustrations and icon sets, as
|
|
|
|
|
|
* well as technical writing content are licensed under the terms of the
|
|
|
|
|
|
* Creative Commons Attribution-ShareAlike 4.0 International. See the License
|
|
|
|
|
|
* terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
|
|
|
|
|
*
|
|
|
|
|
|
*/
|
2016-03-11 00:48:53 +00:00
|
|
|
|
/**
|
|
|
|
|
|
* SlideSettings.js
|
|
|
|
|
|
*
|
|
|
|
|
|
* Created by Julia Radzhabova on 4/14/14
|
|
|
|
|
|
* Copyright (c) 2014 Ascensio System SIA. All rights reserved.
|
|
|
|
|
|
*
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
define([
|
|
|
|
|
|
'text!presentationeditor/main/app/template/SlideSettings.template',
|
|
|
|
|
|
'jquery',
|
|
|
|
|
|
'underscore',
|
|
|
|
|
|
'backbone',
|
|
|
|
|
|
'common/main/lib/component/ComboBox',
|
|
|
|
|
|
'common/main/lib/component/MetricSpinner',
|
|
|
|
|
|
'common/main/lib/component/ThemeColorPalette',
|
|
|
|
|
|
'common/main/lib/component/ColorButton',
|
|
|
|
|
|
'common/main/lib/component/ComboDataView',
|
|
|
|
|
|
'common/main/lib/component/MultiSliderGradient',
|
|
|
|
|
|
'common/main/lib/view/ImageFromUrlDialog'
|
|
|
|
|
|
], function (menuTemplate, $, _, Backbone) {
|
|
|
|
|
|
'use strict';
|
|
|
|
|
|
|
|
|
|
|
|
PE.Views.SlideSettings = Backbone.View.extend(_.extend({
|
|
|
|
|
|
el: '#id-slide-settings',
|
|
|
|
|
|
|
|
|
|
|
|
// Compile our stats template
|
|
|
|
|
|
template: _.template(menuTemplate),
|
|
|
|
|
|
|
|
|
|
|
|
// Delegated events for creating new items, and clearing completed ones.
|
|
|
|
|
|
events: {
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
options: {
|
|
|
|
|
|
alias: 'SlideSettings'
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
initialize: function () {
|
|
|
|
|
|
var me = this;
|
|
|
|
|
|
this._initSettings = true;
|
|
|
|
|
|
this._originalProps = null;
|
|
|
|
|
|
this._noApply = true;
|
|
|
|
|
|
this._sendUndoPoint = true;
|
|
|
|
|
|
this._sliderChanged = false;
|
|
|
|
|
|
|
|
|
|
|
|
this.FillItems = [];
|
|
|
|
|
|
|
|
|
|
|
|
this._stateDisabled = {
|
2016-06-21 14:30:02 +00:00
|
|
|
|
background: true,
|
|
|
|
|
|
effects: true,
|
|
|
|
|
|
timing: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
this._state = {
|
2016-06-21 14:30:02 +00:00
|
|
|
|
FillType:undefined,
|
2016-03-11 00:48:53 +00:00
|
|
|
|
SlideColor: 'ffffff',
|
2016-04-05 11:52:34 +00:00
|
|
|
|
BlipFillType: Asc.c_oAscFillBlipType.STRETCH,
|
2016-03-11 00:48:53 +00:00
|
|
|
|
FGColor: '000000',
|
|
|
|
|
|
BGColor: 'ffffff',
|
|
|
|
|
|
GradColor: '000000',
|
2016-04-05 11:52:34 +00:00
|
|
|
|
GradFillType: Asc.c_oAscFillGradType.GRAD_LINEAR
|
2016-03-11 00:48:53 +00:00
|
|
|
|
};
|
|
|
|
|
|
|
2016-06-21 14:30:02 +00:00
|
|
|
|
this.OriginalFillType = undefined;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.SlideColor = {Value: 1, Color: 'ffffff'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.BlipFillType = Asc.c_oAscFillBlipType.STRETCH;
|
|
|
|
|
|
this.Effect = Asc.c_oAscSlideTransitionTypes.None;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.EffectType = undefined;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.GradFillType = Asc.c_oAscFillGradType.GRAD_LINEAR;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.GradColor = { values: [0, 100], colors: ['000000', 'ffffff'], currentIdx: 0};
|
|
|
|
|
|
this.GradRadialDirectionIdx = 0;
|
|
|
|
|
|
this.GradLinearDirectionType = 0;
|
|
|
|
|
|
this.PatternFillType = 0;
|
|
|
|
|
|
this.FGColor = {Value: 1, Color: '000000'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: 'ffffff'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным
|
|
|
|
|
|
|
|
|
|
|
|
this.textureNames = [this.txtCanvas, this.txtCarton, this.txtDarkFabric, this.txtGrain, this.txtGranite, this.txtGreyPaper,
|
|
|
|
|
|
this.txtKnit, this.txtLeather, this.txtBrownPaper, this.txtPapyrus, this.txtWood];
|
|
|
|
|
|
|
|
|
|
|
|
this.render();
|
|
|
|
|
|
|
|
|
|
|
|
this._arrFillSrc = [
|
2016-04-05 11:52:34 +00:00
|
|
|
|
{displayValue: this.textColor, value: Asc.c_oAscFill.FILL_TYPE_SOLID},
|
|
|
|
|
|
{displayValue: this.textGradientFill, value: Asc.c_oAscFill.FILL_TYPE_GRAD},
|
|
|
|
|
|
{displayValue: this.textImageTexture, value: Asc.c_oAscFill.FILL_TYPE_BLIP},
|
|
|
|
|
|
{displayValue: this.textPatternFill, value: Asc.c_oAscFill.FILL_TYPE_PATT},
|
|
|
|
|
|
{displayValue: this.textNoFill, value: Asc.c_oAscFill.FILL_TYPE_NOFILL}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbFillSrc = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-fill-src'),
|
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
|
style: 'width: 100%;',
|
|
|
|
|
|
menuStyle: 'min-width: 190px;',
|
|
|
|
|
|
editable: false,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
data: this._arrFillSrc,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
2016-06-21 14:30:02 +00:00
|
|
|
|
this.cmbFillSrc.setValue('');
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.cmbFillSrc.on('selected', _.bind(this.onFillSrcSelect, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBackColor = new Common.UI.ColorButton({
|
|
|
|
|
|
style: "width:45px;",
|
2016-06-21 14:30:02 +00:00
|
|
|
|
disabled: true,
|
2016-03-11 00:48:53 +00:00
|
|
|
|
menu : new Common.UI.Menu({
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="slide-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
|
|
|
|
|
|
{ template: _.template('<a id="slide-back-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
})
|
|
|
|
|
|
});
|
|
|
|
|
|
this.FillItems.push(this.btnBackColor);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBackColor.on('render:after', function(btn) {
|
|
|
|
|
|
me.colorsBack = new Common.UI.ThemeColorPalette({
|
|
|
|
|
|
el: $('#slide-back-color-menu'),
|
|
|
|
|
|
value: 'ffffff',
|
2016-08-08 14:13:39 +00:00
|
|
|
|
transparent: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
me.colorsBack.on('select', _.bind(me.onColorsBackSelect, me));
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnBackColor.render( $('#slide-back-color-btn'));
|
|
|
|
|
|
this.btnBackColor.setColor('ffffff');
|
|
|
|
|
|
$(this.el).on('click', '#slide-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor));
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbPattern = new Common.UI.ComboDataView({
|
|
|
|
|
|
itemWidth: 28,
|
|
|
|
|
|
itemHeight: 28,
|
|
|
|
|
|
menuMaxHeight: 300,
|
|
|
|
|
|
enableKeyEvents: true,
|
|
|
|
|
|
cls: 'combo-pattern'
|
|
|
|
|
|
});
|
|
|
|
|
|
this.cmbPattern.menuPicker.itemTemplate = this.cmbPattern.fieldPicker.itemTemplate = _.template([
|
|
|
|
|
|
'<div class="style" id="<%= id %>">',
|
|
|
|
|
|
'<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="combo-pattern-item" ',
|
|
|
|
|
|
'width="' + this.cmbPattern.itemWidth + '" height="' + this.cmbPattern.itemHeight + '" ',
|
|
|
|
|
|
'style="background-position: -<%= offsetx %>px -<%= offsety %>px;"/>',
|
|
|
|
|
|
'</div>'
|
|
|
|
|
|
].join(''));
|
|
|
|
|
|
this.cmbPattern.render($('#slide-combo-pattern'));
|
|
|
|
|
|
this.cmbPattern.openButton.menu.cmpEl.css({
|
|
|
|
|
|
'min-width': 178,
|
|
|
|
|
|
'max-width': 178
|
|
|
|
|
|
});
|
|
|
|
|
|
this.cmbPattern.on('click', _.bind(this.onPatternSelect, this));
|
|
|
|
|
|
this.FillItems.push(this.cmbPattern);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnFGColor = new Common.UI.ColorButton({
|
|
|
|
|
|
style: "width:45px;",
|
|
|
|
|
|
menu : new Common.UI.Menu({
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="slide-foreground-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
|
|
|
|
|
|
{ template: _.template('<a id="slide-foreground-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
})
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
this.btnFGColor.on('render:after', function(btn) {
|
|
|
|
|
|
me.colorsFG = new Common.UI.ThemeColorPalette({
|
|
|
|
|
|
el: $('#slide-foreground-color-menu'),
|
2016-08-08 14:13:39 +00:00
|
|
|
|
value: '000000'
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
me.colorsFG.on('select', _.bind(me.onColorsFGSelect, me));
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnFGColor.render( $('#slide-foreground-color-btn'));
|
|
|
|
|
|
this.btnFGColor.setColor('000000');
|
|
|
|
|
|
$(this.el).on('click', '#slide-foreground-color-new', _.bind(this.addNewColor, this, this.colorsFG, this.btnFGColor));
|
|
|
|
|
|
this.FillItems.push(this.btnFGColor);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBGColor = new Common.UI.ColorButton({
|
|
|
|
|
|
style: "width:45px;",
|
|
|
|
|
|
menu : new Common.UI.Menu({
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="slide-background-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
|
|
|
|
|
|
{ template: _.template('<a id="slide-background-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
})
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBGColor.on('render:after', function(btn) {
|
|
|
|
|
|
me.colorsBG = new Common.UI.ThemeColorPalette({
|
|
|
|
|
|
el: $('#slide-background-color-menu'),
|
2016-08-08 14:13:39 +00:00
|
|
|
|
value: 'ffffff'
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
me.colorsBG.on('select', _.bind(me.onColorsBGSelect, me));
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnBGColor.render( $('#slide-background-color-btn'));
|
|
|
|
|
|
this.btnBGColor.setColor('ffffff');
|
|
|
|
|
|
$(this.el).on('click', '#slide-background-color-new', _.bind(this.addNewColor, this, this.colorsBG, this.btnBGColor));
|
|
|
|
|
|
this.FillItems.push(this.btnBGColor);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnInsertFromFile = new Common.UI.Button({
|
|
|
|
|
|
el: $('#slide-button-from-file')
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnInsertFromFile.on('click', _.bind(function(btn){
|
|
|
|
|
|
if (this.api) this.api.ChangeSlideImageFromFile();
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
}, this));
|
|
|
|
|
|
this.FillItems.push(this.btnInsertFromFile);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnInsertFromUrl = new Common.UI.Button({
|
|
|
|
|
|
el: $('#slide-button-from-url')
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnInsertFromUrl.on('click', _.bind(this.insertFromUrl, this));
|
|
|
|
|
|
this.FillItems.push(this.btnInsertFromUrl);
|
|
|
|
|
|
|
|
|
|
|
|
this._arrFillType = [
|
2016-04-05 11:52:34 +00:00
|
|
|
|
{displayValue: this.textStretch, value: Asc.c_oAscFillBlipType.STRETCH},
|
|
|
|
|
|
{displayValue: this.textTile, value: Asc.c_oAscFillBlipType.TILE}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbFillType = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-fill-type'),
|
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
|
menuStyle: 'min-width: 90px;',
|
|
|
|
|
|
editable: false,
|
|
|
|
|
|
data: this._arrFillType
|
|
|
|
|
|
});
|
|
|
|
|
|
this.cmbFillType.setValue(this._arrFillType[0].value);
|
|
|
|
|
|
this.cmbFillType.on('selected', _.bind(this.onFillTypeSelect, this));
|
|
|
|
|
|
this.FillItems.push(this.cmbFillType);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnTexture = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-fill-texture'),
|
|
|
|
|
|
template: _.template([
|
|
|
|
|
|
'<div class="input-group combobox combo-dataview-menu input-group-nr dropdown-toggle" tabindex="0" data-toggle="dropdown">',
|
|
|
|
|
|
'<div class="form-control text" style="width: 90px;">' + this.textSelectTexture + '</div>',
|
|
|
|
|
|
'<div style="display: table-cell;"></div>',
|
|
|
|
|
|
'<button type="button" class="btn btn-default"><span class="caret img-commonctrl"></span></button>',
|
|
|
|
|
|
'</div>'
|
|
|
|
|
|
].join(''))
|
|
|
|
|
|
});
|
|
|
|
|
|
this.textureMenu = new Common.UI.Menu({
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="id-slide-menu-texture" style="width: 233px; margin: 0 5px;"></div>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
});
|
|
|
|
|
|
this.textureMenu.render($('#slide-combo-fill-texture'));
|
|
|
|
|
|
this.FillItems.push(this.btnTexture);
|
|
|
|
|
|
|
|
|
|
|
|
this._arrGradType = [
|
2016-04-05 11:52:34 +00:00
|
|
|
|
{displayValue: this.textLinear, value: Asc.c_oAscFillGradType.GRAD_LINEAR},
|
|
|
|
|
|
{displayValue: this.textRadial, value: Asc.c_oAscFillGradType.GRAD_PATH}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbGradType = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-grad-type'),
|
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
|
menuStyle: 'min-width: 90px;',
|
|
|
|
|
|
editable: false,
|
|
|
|
|
|
data: this._arrGradType
|
|
|
|
|
|
});
|
|
|
|
|
|
this.cmbGradType.setValue(this._arrGradType[0].value);
|
|
|
|
|
|
this.cmbGradType.on('selected', _.bind(this.onGradTypeSelect, this));
|
|
|
|
|
|
this.FillItems.push(this.cmbGradType);
|
|
|
|
|
|
|
|
|
|
|
|
this._viewDataLinear = [
|
|
|
|
|
|
{ offsetx: 0, offsety: 0, type:45, subtype:-1, iconcls:'gradient-left-top' },
|
|
|
|
|
|
{ offsetx: 50, offsety: 0, type:90, subtype:4, iconcls:'gradient-top'},
|
|
|
|
|
|
{ offsetx: 100, offsety: 0, type:135, subtype:5, iconcls:'gradient-right-top'},
|
|
|
|
|
|
{ offsetx: 0, offsety: 50, type:0, subtype:6, iconcls:'gradient-left', cls: 'item-gradient-separator', selected: true},
|
|
|
|
|
|
{ offsetx: 100, offsety: 50, type:180, subtype:1, iconcls:'gradient-right'},
|
|
|
|
|
|
{ offsetx: 0, offsety: 100, type:315, subtype:2, iconcls:'gradient-left-bottom'},
|
|
|
|
|
|
{ offsetx: 50, offsety: 100, type:270, subtype:3, iconcls:'gradient-bottom'},
|
|
|
|
|
|
{ offsetx: 100, offsety: 100, type:225, subtype:7, iconcls:'gradient-right-bottom'}
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this._viewDataRadial = [
|
|
|
|
|
|
{ offsetx: 100, offsety: 150, type:2, subtype:5, iconcls:'gradient-radial-center'}
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.btnDirection = new Common.UI.Button({
|
|
|
|
|
|
cls : 'btn-large-dataview',
|
|
|
|
|
|
iconCls : 'item-gradient gradient-left',
|
|
|
|
|
|
menu : new Common.UI.Menu({
|
|
|
|
|
|
style: 'min-width: 60px;',
|
|
|
|
|
|
menuAlign: 'tr-br',
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="id-slide-menu-direction" style="width: 175px; margin: 0 5px;"></div>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
})
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnDirection.on('render:after', function(btn) {
|
|
|
|
|
|
me.mnuDirectionPicker = new Common.UI.DataView({
|
|
|
|
|
|
el: $('#id-slide-menu-direction'),
|
|
|
|
|
|
parentMenu: btn.menu,
|
|
|
|
|
|
restoreHeight: 174,
|
|
|
|
|
|
store: new Common.UI.DataViewStore(me._viewDataLinear),
|
|
|
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnDirection.render($('#slide-button-direction'));
|
|
|
|
|
|
this.mnuDirectionPicker.on('item:click', _.bind(this.onSelectGradient, this, this.btnDirection));
|
|
|
|
|
|
this.FillItems.push(this.btnDirection);
|
|
|
|
|
|
|
|
|
|
|
|
this.btnGradColor = new Common.UI.ColorButton({
|
|
|
|
|
|
style: "width:45px;",
|
|
|
|
|
|
menu : new Common.UI.Menu({
|
|
|
|
|
|
items: [
|
|
|
|
|
|
{ template: _.template('<div id="slide-gradient-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
|
|
|
|
|
|
{ template: _.template('<a id="slide-gradient-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
|
|
|
|
|
]
|
|
|
|
|
|
})
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnGradColor.on('render:after', function(btn) {
|
|
|
|
|
|
me.colorsGrad = new Common.UI.ThemeColorPalette({
|
|
|
|
|
|
el: $('#slide-gradient-color-menu'),
|
2016-08-08 14:13:39 +00:00
|
|
|
|
value: '000000'
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
me.colorsGrad.on('select', _.bind(me.onColorsGradientSelect, me));
|
|
|
|
|
|
});
|
|
|
|
|
|
this.btnGradColor.render( $('#slide-gradient-color-btn'));
|
|
|
|
|
|
this.btnGradColor.setColor('000000');
|
|
|
|
|
|
$(this.el).on('click', '#slide-gradient-color-new', _.bind(this.addNewColor, this, this.colorsGrad, this.btnGradColor));
|
|
|
|
|
|
this.FillItems.push(this.btnGradColor);
|
|
|
|
|
|
|
|
|
|
|
|
this.sldrGradient = new Common.UI.MultiSliderGradient({
|
|
|
|
|
|
el: $('#slide-slider-gradient'),
|
|
|
|
|
|
width: 125,
|
|
|
|
|
|
minValue: 0,
|
|
|
|
|
|
maxValue: 100,
|
|
|
|
|
|
values: [0, 100]
|
|
|
|
|
|
});
|
|
|
|
|
|
this.sldrGradient.on('change', _.bind(this.onGradientChange, this));
|
|
|
|
|
|
this.sldrGradient.on('changecomplete', _.bind(this.onGradientChangeComplete, this));
|
|
|
|
|
|
this.sldrGradient.on('thumbclick', function(cmp, index){
|
|
|
|
|
|
me.GradColor.currentIdx = index;
|
|
|
|
|
|
var color = me.GradColor.colors[me.GradColor.currentIdx];
|
|
|
|
|
|
me.btnGradColor.setColor(color);
|
|
|
|
|
|
me.colorsGrad.select(color,false);
|
|
|
|
|
|
});
|
|
|
|
|
|
this.sldrGradient.on('thumbdblclick', function(cmp){
|
|
|
|
|
|
me.btnGradColor.cmpEl.find('button').dropdown('toggle');
|
|
|
|
|
|
});
|
|
|
|
|
|
this.FillItems.push(this.sldrGradient);
|
|
|
|
|
|
|
|
|
|
|
|
this.FillColorContainer = $('#slide-panel-color-fill');
|
|
|
|
|
|
this.FillImageContainer = $('#slide-panel-image-fill');
|
|
|
|
|
|
this.FillPatternContainer = $('#slide-panel-pattern-fill');
|
|
|
|
|
|
this.FillGradientContainer = $('#slide-panel-gradient-fill');
|
|
|
|
|
|
|
|
|
|
|
|
this._arrEffectName = [
|
2016-04-05 11:52:34 +00:00
|
|
|
|
{displayValue: this.textNone, value: Asc.c_oAscSlideTransitionTypes.None},
|
|
|
|
|
|
{displayValue: this.textFade, value: Asc.c_oAscSlideTransitionTypes.Fade},
|
|
|
|
|
|
{displayValue: this.textPush, value: Asc.c_oAscSlideTransitionTypes.Push},
|
|
|
|
|
|
{displayValue: this.textWipe, value: Asc.c_oAscSlideTransitionTypes.Wipe},
|
|
|
|
|
|
{displayValue: this.textSplit, value: Asc.c_oAscSlideTransitionTypes.Split},
|
|
|
|
|
|
{displayValue: this.textUnCover, value: Asc.c_oAscSlideTransitionTypes.UnCover},
|
|
|
|
|
|
{displayValue: this.textCover, value: Asc.c_oAscSlideTransitionTypes.Cover},
|
|
|
|
|
|
{displayValue: this.textClock, value: Asc.c_oAscSlideTransitionTypes.Clock},
|
|
|
|
|
|
{displayValue: this.textZoom, value: Asc.c_oAscSlideTransitionTypes.Zoom}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbEffectName = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-effect-name'),
|
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
|
style: 'width: 100%;',
|
|
|
|
|
|
menuStyle: 'min-width: 190px;',
|
|
|
|
|
|
editable: false,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
data: this._arrEffectName,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
2016-06-21 14:30:02 +00:00
|
|
|
|
this.cmbEffectName.setValue('');
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.cmbEffectName.on('selected', _.bind(this.onEffectNameSelect, this));
|
|
|
|
|
|
|
|
|
|
|
|
this._arrEffectType = [
|
2016-04-05 11:52:34 +00:00
|
|
|
|
{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}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbEffectType = new Common.UI.ComboBox({
|
|
|
|
|
|
el: $('#slide-combo-effect-type'),
|
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
|
style: 'width: 100%;',
|
|
|
|
|
|
menuStyle: 'min-width: 190px;',
|
|
|
|
|
|
editable: false,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
data: this._arrEffectType,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.cmbEffectType.setValue('');
|
|
|
|
|
|
this.cmbEffectType.on('selected', _.bind(this.onEffectTypeSelect, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.numDuration = new Common.UI.MetricSpinner({
|
|
|
|
|
|
el: $('#slide-spin-duration'),
|
|
|
|
|
|
step: 1,
|
|
|
|
|
|
width: 65,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
value: '',
|
2016-04-06 13:38:54 +00:00
|
|
|
|
defaultUnit : this.textSec,
|
2016-03-11 00:48:53 +00:00
|
|
|
|
maxValue: 300,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
minValue: 0,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.numDuration.on('change', _.bind(this.onDurationChange, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.numDelay = new Common.UI.MetricSpinner({
|
|
|
|
|
|
el: $('#slide-spin-delay'),
|
|
|
|
|
|
step: 1,
|
|
|
|
|
|
width: 70,
|
2016-06-21 14:30:02 +00:00
|
|
|
|
value: '',
|
2016-04-06 13:38:54 +00:00
|
|
|
|
defaultUnit : this.textSec,
|
2016-03-11 00:48:53 +00:00
|
|
|
|
maxValue: 300,
|
|
|
|
|
|
minValue: 0,
|
|
|
|
|
|
disabled: true
|
|
|
|
|
|
});
|
|
|
|
|
|
this.numDelay.on('change', _.bind(this.onDelayChange, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.chStartOnClick = new Common.UI.CheckBox({
|
|
|
|
|
|
el: $('#slide-checkbox-start-click'),
|
2016-06-21 14:30:02 +00:00
|
|
|
|
labelText: this.strStartOnClick,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.chStartOnClick.on('change', _.bind(this.onStartOnClickChange, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.chDelay = new Common.UI.CheckBox({
|
|
|
|
|
|
el: $('#slide-checkbox-delay'),
|
2016-06-21 14:30:02 +00:00
|
|
|
|
labelText: this.strDelay,
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.chDelay.on('change', _.bind(this.onCheckDelayChange, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.btnPreview = new Common.UI.Button({
|
2016-06-21 14:30:02 +00:00
|
|
|
|
el: $('#slide-button-preview'),
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.btnPreview.on('click', _.bind(function(btn){
|
|
|
|
|
|
if (this.api) this.api.SlideTransitionPlay();
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
}, this));
|
|
|
|
|
|
|
|
|
|
|
|
this.btnApplyToAll = new Common.UI.Button({
|
2016-06-21 14:30:02 +00:00
|
|
|
|
el: $('#slide-button-apply-all'),
|
|
|
|
|
|
disabled: true
|
2016-03-11 00:48:53 +00:00
|
|
|
|
});
|
|
|
|
|
|
this.btnApplyToAll.on('click', _.bind(function(btn){
|
|
|
|
|
|
if (this.api) this.api.SlideTimingApplyToAll();
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
}, this));
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
render: function () {
|
|
|
|
|
|
var el = $(this.el);
|
|
|
|
|
|
el.html(this.template({
|
|
|
|
|
|
scope: this
|
|
|
|
|
|
}));
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
setApi: function(api) {
|
|
|
|
|
|
this.api = api;
|
|
|
|
|
|
if (this.api) {
|
|
|
|
|
|
this.api.SetInterfaceDrawImagePlaceSlide('slide-texture-img');
|
2016-05-06 13:46:04 +00:00
|
|
|
|
this.api.asc_registerCallback('asc_onInitStandartTextures', _.bind(this.onInitStandartTextures, this));
|
2016-03-11 00:48:53 +00:00
|
|
|
|
}
|
|
|
|
|
|
return this;
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onFillSrcSelect: function(combo, record) {
|
|
|
|
|
|
this.ShowHideElem(record.value);
|
|
|
|
|
|
switch (record.value){
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscFill.FILL_TYPE_SOLID:
|
|
|
|
|
|
this._state.FillType = Asc.c_oAscFill.FILL_TYPE_SOLID;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
if (!this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_SOLID);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillSolid());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_color(Common.Utils.ThemeColor.getRgbColor((this.SlideColor.Color=='transparent') ? {color: '4f81bd', effectId: 24} : this.SlideColor.Color));
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscFill.FILL_TYPE_GRAD:
|
|
|
|
|
|
this._state.FillType = Asc.c_oAscFill.FILL_TYPE_GRAD;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
if (!this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillGrad());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_grad_type(this.GradFillType);
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_linear_angle(this.GradLinearDirectionType * 60000);
|
|
|
|
|
|
fill.get_fill().put_linear_scale(true);
|
|
|
|
|
|
}
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_GRAD) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
var HexColor0 = Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[0]).get_color().get_hex(),
|
|
|
|
|
|
HexColor1 = Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[1]).get_color().get_hex();
|
|
|
|
|
|
|
|
|
|
|
|
if (HexColor0 === 'ffffff' && HexColor1 === 'ffffff') {
|
|
|
|
|
|
HexColor0 = {color: '4f81bd', effectId: 24}; // color accent1
|
|
|
|
|
|
} else {
|
|
|
|
|
|
HexColor0 = this.GradColor.colors[0];
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
fill.get_fill().put_positions([this.GradColor.values[0]*1000, this.GradColor.values[1]*1000]);
|
|
|
|
|
|
fill.get_fill().put_colors([Common.Utils.ThemeColor.getRgbColor(HexColor0), Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[1])]);
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscFill.FILL_TYPE_BLIP:
|
|
|
|
|
|
this._state.FillType = Asc.c_oAscFill.FILL_TYPE_BLIP;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscFill.FILL_TYPE_PATT:
|
|
|
|
|
|
this._state.FillType = Asc.c_oAscFill.FILL_TYPE_PATT;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
if (!this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_PATT);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillHatch());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_pattern_type(this.PatternFillType);
|
|
|
|
|
|
|
|
|
|
|
|
var fHexColor = Common.Utils.ThemeColor.getRgbColor(this.FGColor.Color).get_color().get_hex();
|
|
|
|
|
|
var bHexColor = Common.Utils.ThemeColor.getRgbColor(this.BGColor.Color).get_color().get_hex();
|
|
|
|
|
|
|
|
|
|
|
|
if (bHexColor === 'ffffff' && fHexColor === 'ffffff') {
|
|
|
|
|
|
fHexColor = {color: '4f81bd', effectId: 24}; // color accent1
|
|
|
|
|
|
} else {
|
|
|
|
|
|
fHexColor = this.FGColor.Color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
fill.get_fill().put_color_fg(Common.Utils.ThemeColor.getRgbColor(fHexColor));
|
|
|
|
|
|
fill.get_fill().put_color_bg(Common.Utils.ThemeColor.getRgbColor(this.BGColor.Color));
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscFill.FILL_TYPE_NOFILL:
|
|
|
|
|
|
this._state.FillType = Asc.c_oAscFill.FILL_TYPE_NOFILL;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
if (!this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_NOFILL);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.put_fill(null);
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onColorsBackSelect: function(picker, color) {
|
|
|
|
|
|
this.btnBackColor.setColor(color);
|
|
|
|
|
|
this.SlideColor = {Value: 1, Color: color};
|
|
|
|
|
|
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
|
|
|
|
|
|
if (this.SlideColor.Color=='transparent') {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_NOFILL);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.put_fill(null);
|
|
|
|
|
|
} else {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_SOLID);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillSolid());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_color(Common.Utils.ThemeColor.getRgbColor(this.SlideColor.Color));
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
addNewColor: function(picker, btn) {
|
|
|
|
|
|
picker.addNewColor((typeof(btn.color) == 'object') ? btn.color.color : btn.color);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onPatternSelect: function(combo, record){
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
|
|
|
|
|
this.PatternFillType = record.get('type');
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_PATT);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillHatch());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_pattern_type(this.PatternFillType);
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_PATT) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_color_fg(Common.Utils.ThemeColor.getRgbColor(this.FGColor.Color));
|
|
|
|
|
|
fill.get_fill().put_color_bg(Common.Utils.ThemeColor.getRgbColor(this.BGColor.Color));
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onColorsFGSelect: function(picker, color) {
|
|
|
|
|
|
this.btnFGColor.setColor(color);
|
|
|
|
|
|
this.FGColor = {Value: 1, Color: color};
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_PATT);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillHatch());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_color_fg(Common.Utils.ThemeColor.getRgbColor(this.FGColor.Color));
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_PATT) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_pattern_type(this.PatternFillType);
|
|
|
|
|
|
fill.get_fill().put_color_bg(Common.Utils.ThemeColor.getRgbColor(this.BGColor.Color));
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onColorsBGSelect: function(picker, color) {
|
|
|
|
|
|
this.btnBGColor.setColor(color);
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: color};
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_PATT);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillHatch());
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_PATT) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_pattern_type(this.PatternFillType);
|
|
|
|
|
|
fill.get_fill().put_color_fg(Common.Utils.ThemeColor.getRgbColor(this.FGColor.Color));
|
|
|
|
|
|
}
|
|
|
|
|
|
fill.get_fill().put_color_bg(Common.Utils.ThemeColor.getRgbColor(this.BGColor.Color));
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onFillTypeSelect: function(combo, record) {
|
|
|
|
|
|
this.BlipFillType = record.value;
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.api && this._fromTextureCmb !== true && this.OriginalFillType == Asc.c_oAscFill.FILL_TYPE_BLIP) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_BLIP);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillBlip());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
|
|
|
|
|
|
fill.get_fill().put_type(this.BlipFillType);
|
|
|
|
|
|
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onGradTypeSelect: function(combo, record){
|
|
|
|
|
|
this.GradFillType = record.value;
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.mnuDirectionPicker.store.reset(this._viewDataLinear);
|
|
|
|
|
|
this.mnuDirectionPicker.cmpEl.width(175);
|
|
|
|
|
|
this.mnuDirectionPicker.restoreHeight = 174;
|
|
|
|
|
|
var record = this.mnuDirectionPicker.store.findWhere({type: this.GradLinearDirectionType});
|
|
|
|
|
|
this.mnuDirectionPicker.selectRecord(record, true);
|
|
|
|
|
|
if (record)
|
|
|
|
|
|
this.btnDirection.setIconCls('item-gradient ' + record.get('iconcls'));
|
|
|
|
|
|
else
|
|
|
|
|
|
this.btnDirection.setIconCls('');
|
2016-04-05 11:52:34 +00:00
|
|
|
|
} else if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_PATH) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.mnuDirectionPicker.store.reset(this._viewDataRadial);
|
|
|
|
|
|
this.mnuDirectionPicker.cmpEl.width(60);
|
|
|
|
|
|
this.mnuDirectionPicker.restoreHeight = 58;
|
|
|
|
|
|
this.mnuDirectionPicker.selectByIndex(this.GradRadialDirectionIdx, true);
|
|
|
|
|
|
if (this.GradRadialDirectionIdx>=0)
|
|
|
|
|
|
this.btnDirection.setIconCls('item-gradient ' + this._viewDataRadial[this.GradRadialDirectionIdx].iconcls);
|
|
|
|
|
|
else
|
|
|
|
|
|
this.btnDirection.setIconCls('');
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillGrad());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_grad_type(this.GradFillType);
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_linear_angle(this.GradLinearDirectionType * 60000);
|
|
|
|
|
|
fill.get_fill().put_linear_scale(true);
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onSelectGradient: function(btn, picker, itemView, record) {
|
|
|
|
|
|
if (this._noApply) return;
|
|
|
|
|
|
|
|
|
|
|
|
var rawData = {},
|
|
|
|
|
|
isPickerSelect = _.isFunction(record.toJSON);
|
|
|
|
|
|
|
|
|
|
|
|
if (isPickerSelect){
|
|
|
|
|
|
if (record.get('selected')) {
|
|
|
|
|
|
rawData = record.toJSON();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// record deselected
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
rawData = record;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.btnDirection.setIconCls('item-gradient ' + rawData.iconcls);
|
2016-04-05 11:52:34 +00:00
|
|
|
|
(this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) ? this.GradLinearDirectionType = rawData.type : this.GradRadialDirectionIdx = 0;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
if (this.api) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillGrad());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_grad_type(this.GradFillType);
|
|
|
|
|
|
fill.get_fill().put_linear_angle(rawData.type * 60000);
|
|
|
|
|
|
fill.get_fill().put_linear_scale(true);
|
|
|
|
|
|
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onColorsGradientSelect: function(picker, color) {
|
|
|
|
|
|
this.btnGradColor.setColor(color);
|
|
|
|
|
|
this.GradColor.colors[this.GradColor.currentIdx] = color;
|
|
|
|
|
|
this.sldrGradient.setColorValue(Common.Utils.String.format('#{0}', (typeof(color) == 'object') ? color.color : color));
|
|
|
|
|
|
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillGrad());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_grad_type(this.GradFillType);
|
|
|
|
|
|
fill.get_fill().put_colors([Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[0]), Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[1])]);
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_GRAD) {
|
|
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_linear_angle(this.GradLinearDirectionType * 60000);
|
|
|
|
|
|
fill.get_fill().put_linear_scale(true);
|
|
|
|
|
|
}
|
|
|
|
|
|
fill.get_fill().put_positions([this.GradColor.values[0]*1000, this.GradColor.values[1]*1000]);
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onGradientChange: function(slider, newValue, oldValue){
|
|
|
|
|
|
this.GradColor.values = slider.getValues();
|
|
|
|
|
|
this._sliderChanged = true;
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
|
|
|
|
|
if (this._sendUndoPoint) {
|
|
|
|
|
|
this.api.setStartPointHistory();
|
|
|
|
|
|
this._sendUndoPoint = false;
|
|
|
|
|
|
this.updateslider = setInterval(_.bind(this._gradientApplyFunc, this), 100);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onGradientChangeComplete: function(slider, newValue, oldValue){
|
|
|
|
|
|
clearInterval(this.updateslider);
|
|
|
|
|
|
this._sliderChanged = true;
|
|
|
|
|
|
this.api.setEndPointHistory();
|
|
|
|
|
|
this._gradientApplyFunc();
|
|
|
|
|
|
this._sendUndoPoint = true;
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
_gradientApplyFunc: function() {
|
|
|
|
|
|
if (this._sliderChanged) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillGrad());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_grad_type(this.GradFillType);
|
|
|
|
|
|
fill.get_fill().put_positions([this.GradColor.values[0]*1000, this.GradColor.values[1]*1000]);
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.OriginalFillType !== Asc.c_oAscFill.FILL_TYPE_GRAD) {
|
|
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_linear_angle(this.GradLinearDirectionType * 60000);
|
|
|
|
|
|
fill.get_fill().put_linear_scale(true);
|
|
|
|
|
|
}
|
|
|
|
|
|
fill.get_fill().put_colors([Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[0]), Common.Utils.ThemeColor.getRgbColor(this.GradColor.colors[1])]);
|
|
|
|
|
|
}
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
this._sliderChanged = false;
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
insertFromUrl: function() {
|
|
|
|
|
|
var me = this;
|
|
|
|
|
|
(new Common.Views.ImageFromUrlDialog({
|
|
|
|
|
|
handler: function(result, value) {
|
|
|
|
|
|
if (result == 'ok') {
|
|
|
|
|
|
if (me.api) {
|
|
|
|
|
|
var checkUrl = value.replace(/ /g, '');
|
|
|
|
|
|
if (!_.isEmpty(checkUrl)) {
|
|
|
|
|
|
if (me.BlipFillType !== null) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_BLIP);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillBlip());
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_type(me.BlipFillType);
|
|
|
|
|
|
fill.get_fill().put_url(checkUrl);
|
|
|
|
|
|
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
me.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
me.fireEvent('editcomplete', me);
|
|
|
|
|
|
}
|
|
|
|
|
|
})).show();
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
createDelayedElements: function() {
|
|
|
|
|
|
var global_hatch_menu_map = [
|
|
|
|
|
|
0,1,3,2,4,
|
|
|
|
|
|
53,5,6,7,8,
|
|
|
|
|
|
9,10,11,12,13,
|
|
|
|
|
|
14,15,16,17,18,
|
|
|
|
|
|
19,20,22,23,24,
|
|
|
|
|
|
25,27,28,29,30,
|
|
|
|
|
|
31,32,33,34,35,
|
|
|
|
|
|
36,37,38,39,40,
|
|
|
|
|
|
41,42,43,44,45,
|
|
|
|
|
|
46,49,50,51,52
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
this.patternViewData = [];
|
|
|
|
|
|
for (var i=0; i<13; i++) {
|
|
|
|
|
|
for (var j=0; j<4; j++) {
|
|
|
|
|
|
var num = i*4+j;
|
|
|
|
|
|
this.patternViewData[num] = {offsetx: j*28, offsety: i*28, type: global_hatch_menu_map[num]};
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
this.patternViewData.splice(this.patternViewData.length-2, 2);
|
|
|
|
|
|
|
|
|
|
|
|
for ( var i=0; i<this.patternViewData.length; i++ ) {
|
|
|
|
|
|
this.patternViewData[i].id = Common.UI.getId();
|
|
|
|
|
|
}
|
|
|
|
|
|
this.cmbPattern.menuPicker.store.add(this.patternViewData);
|
|
|
|
|
|
if (this.cmbPattern.menuPicker.store.length > 0) {
|
|
|
|
|
|
this.cmbPattern.fillComboView(this.cmbPattern.menuPicker.store.at(0),true);
|
|
|
|
|
|
this.PatternFillType = this.patternViewData[0].type;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.UpdateThemeColors();
|
2016-10-14 10:48:04 +00:00
|
|
|
|
this._initSettings = false;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onInitStandartTextures: function(texture) {
|
|
|
|
|
|
var me = this;
|
|
|
|
|
|
if (texture && texture.length>0){
|
|
|
|
|
|
var texturearray = [];
|
|
|
|
|
|
_.each(texture, function(item){
|
|
|
|
|
|
texturearray.push({
|
|
|
|
|
|
imageUrl: item.get_image(),
|
|
|
|
|
|
name : me.textureNames[item.get_id()],
|
|
|
|
|
|
type : item.get_id(),
|
|
|
|
|
|
// allowSelected : false,
|
|
|
|
|
|
selected: false
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
var mnuTexturePicker = new Common.UI.DataView({
|
|
|
|
|
|
el: $('#id-slide-menu-texture'),
|
|
|
|
|
|
restoreHeight: 174,
|
|
|
|
|
|
parentMenu: me.textureMenu,
|
|
|
|
|
|
showLast: false,
|
|
|
|
|
|
store: new Common.UI.DataViewStore(texturearray),
|
|
|
|
|
|
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>')
|
|
|
|
|
|
});
|
|
|
|
|
|
mnuTexturePicker.on('item:click', _.bind(this.onSelectTexture, this));
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onSelectTexture: function(picker, view, record){
|
|
|
|
|
|
this._fromTextureCmb = true;
|
|
|
|
|
|
this.cmbFillType.setValue(this._arrFillType[1].value);
|
|
|
|
|
|
this._fromTextureCmb = false;
|
|
|
|
|
|
|
|
|
|
|
|
if (this.api) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
2016-04-18 12:21:15 +00:00
|
|
|
|
var fill = new Asc.asc_CShapeFill();
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.put_type(Asc.c_oAscFill.FILL_TYPE_BLIP);
|
2016-04-18 12:21:15 +00:00
|
|
|
|
fill.put_fill( new Asc.asc_CFillBlip());
|
2016-04-05 11:52:34 +00:00
|
|
|
|
fill.get_fill().put_type(Asc.c_oAscFillBlipType.TILE);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill.get_fill().put_texture_id(record.get('type'));
|
|
|
|
|
|
props.put_background(fill);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
$(this.btnTexture.el).find('.form-control').prop('innerHTML', record.get('name'));
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
fillEffectTypeCombo: function (type) {
|
|
|
|
|
|
var arr = [];
|
|
|
|
|
|
switch (type) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Fade:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr.push(this._arrEffectType[0], this._arrEffectType[1]);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Push:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(2, 6);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Wipe:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(2, 10);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Split:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(10, 14);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.UnCover:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(2, 10);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Cover:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(2, 10);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Clock:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(14, 17);
|
|
|
|
|
|
break;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
case Asc.c_oAscSlideTransitionTypes.Zoom:
|
2016-03-11 00:48:53 +00:00
|
|
|
|
arr = this._arrEffectType.slice(17);
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (arr.length>0) {
|
|
|
|
|
|
this.cmbEffectType.store.reset(arr);
|
|
|
|
|
|
this.cmbEffectType.setValue(arr[0].value);
|
|
|
|
|
|
this.EffectType = arr[0].value;
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.cmbEffectType.store.reset();
|
|
|
|
|
|
this.EffectType = undefined;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.cmbEffectType.setDisabled(arr.length<1 || this._stateDisabled.effects);
|
2016-07-26 14:53:03 +00:00
|
|
|
|
this.numDuration.setDisabled(arr.length<1 || this._stateDisabled.effects);
|
|
|
|
|
|
this.btnPreview.setDisabled(arr.length<1 || this._stateDisabled.effects);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onEffectNameSelect: function(combo, record) {
|
|
|
|
|
|
var type = record.value;
|
|
|
|
|
|
if (this.Effect !== type &&
|
2016-04-05 11:52:34 +00:00
|
|
|
|
!((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)) )
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.fillEffectTypeCombo(type);
|
|
|
|
|
|
this.Effect = type;
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_TransitionType(type);
|
|
|
|
|
|
timing.put_TransitionOption(this.EffectType);
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onEffectTypeSelect: function(combo, record) {
|
|
|
|
|
|
this.EffectType = record.value;
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_TransitionType(this.Effect);
|
|
|
|
|
|
timing.put_TransitionOption(this.EffectType);
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onDurationChange: function(field, newValue, oldValue, eOpts){
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_TransitionDuration(field.getNumberValue()*1000);
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onDelayChange: function(field, newValue, oldValue, eOpts){
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_SlideAdvanceDuration(field.getNumberValue()*1000);
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onStartOnClickChange: function(field, newValue, oldValue, eOpts){
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_SlideAdvanceOnMouseClick(field.getValue()=='checked');
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onCheckDelayChange: function(field, newValue, oldValue, eOpts){
|
|
|
|
|
|
this.numDelay.setDisabled(field.getValue()!=='checked');
|
|
|
|
|
|
if (this.api && !this._noApply) {
|
2016-04-08 13:39:20 +00:00
|
|
|
|
var props = new Asc.CAscSlideProps();
|
|
|
|
|
|
var timing = new Asc.CAscSlideTiming();
|
2016-03-11 00:48:53 +00:00
|
|
|
|
timing.put_SlideAdvanceAfter(field.getValue()=='checked');
|
|
|
|
|
|
props.put_timing(timing);
|
|
|
|
|
|
this.api.SetSlideProps(props);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.fireEvent('editcomplete', this);
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
UpdateThemeColors: function() {
|
|
|
|
|
|
this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
|
|
|
|
|
|
this.colorsFG.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
|
|
|
|
|
|
this.colorsBG.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
|
|
|
|
|
|
this.colorsGrad.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
ShowHideElem: function(value) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.FillColorContainer.toggleClass('settings-hidden', value !== Asc.c_oAscFill.FILL_TYPE_SOLID);
|
|
|
|
|
|
this.FillImageContainer.toggleClass('settings-hidden', value !== Asc.c_oAscFill.FILL_TYPE_BLIP);
|
|
|
|
|
|
this.FillPatternContainer.toggleClass('settings-hidden', value !== Asc.c_oAscFill.FILL_TYPE_PATT);
|
|
|
|
|
|
this.FillGradientContainer.toggleClass('settings-hidden', value !== Asc.c_oAscFill.FILL_TYPE_GRAD);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
ChangeSettings: function(props) {
|
|
|
|
|
|
if (this._initSettings)
|
|
|
|
|
|
this.createDelayedElements();
|
|
|
|
|
|
|
|
|
|
|
|
if (props)
|
|
|
|
|
|
{
|
|
|
|
|
|
this._originalProps = props;
|
|
|
|
|
|
this._noApply = true;
|
|
|
|
|
|
|
|
|
|
|
|
// background colors
|
|
|
|
|
|
var rec = null;
|
|
|
|
|
|
var fill = props.get_background();
|
|
|
|
|
|
var fill_type = fill.get_type();
|
|
|
|
|
|
var color = null;
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (fill===null || fill_type===null || fill_type==Asc.c_oAscFill.FILL_TYPE_NOFILL) { // заливки нет или не совпадает у неск. фигур
|
|
|
|
|
|
this.OriginalFillType = Asc.c_oAscFill.FILL_TYPE_NOFILL;
|
|
|
|
|
|
} else if (fill_type==Asc.c_oAscFill.FILL_TYPE_SOLID) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill = fill.get_fill();
|
|
|
|
|
|
color = fill.get_color();
|
|
|
|
|
|
if (color) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.SlideColor = {Value: 1, Color: {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() }};
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.SlideColor = {Value: 1, Color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())};
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.SlideColor = {Value: 0, Color: 'transparent'};
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.OriginalFillType = Asc.c_oAscFill.FILL_TYPE_SOLID;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.FGColor = (this.SlideColor.Color!=='transparent') ? {Value: 1, Color: Common.Utils.ThemeColor.colorValue2EffectId(this.SlideColor.Color)} : {Value: 1, Color: '000000'};
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: 'ffffff'};
|
|
|
|
|
|
this.GradColor.colors[0] = (this.SlideColor.Color!=='transparent') ? Common.Utils.ThemeColor.colorValue2EffectId(this.SlideColor.Color) : '000000';
|
|
|
|
|
|
this.GradColor.colors[1] = 'ffffff';
|
2016-04-05 11:52:34 +00:00
|
|
|
|
} else if (fill_type==Asc.c_oAscFill.FILL_TYPE_BLIP) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill = fill.get_fill();
|
|
|
|
|
|
this.BlipFillType = fill.get_type(); // null - не совпадают у нескольких фигур
|
|
|
|
|
|
if (this._state.BlipFillType !== this.BlipFillType) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.BlipFillType == Asc.c_oAscFillBlipType.STRETCH || this.BlipFillType == Asc.c_oAscFillBlipType.TILE) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.cmbFillType.setValue(this.BlipFillType);
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.cmbFillType.setValue('');
|
|
|
|
|
|
this._state.BlipFillType = this.BlipFillType;
|
|
|
|
|
|
}
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.OriginalFillType = Asc.c_oAscFill.FILL_TYPE_BLIP;
|
|
|
|
|
|
} else if (fill_type==Asc.c_oAscFill.FILL_TYPE_PATT) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill = fill.get_fill();
|
|
|
|
|
|
this.PatternFillType = fill.get_pattern_type(); // null - не совпадают у нескольких фигур
|
|
|
|
|
|
if (this._state.PatternFillType !== this.PatternFillType) {
|
|
|
|
|
|
this.cmbPattern.suspendEvents();
|
|
|
|
|
|
var rec = this.cmbPattern.menuPicker.store.findWhere({
|
|
|
|
|
|
type: this.PatternFillType
|
|
|
|
|
|
});
|
|
|
|
|
|
this.cmbPattern.menuPicker.selectRecord(rec);
|
|
|
|
|
|
this.cmbPattern.resumeEvents();
|
|
|
|
|
|
this._state.PatternFillType = this.PatternFillType;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
color = fill.get_color_fg();
|
|
|
|
|
|
if (color) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.FGColor = {Value: 1, Color: {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() }};
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.FGColor = {Value: 1, Color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())};
|
|
|
|
|
|
}
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.FGColor = {Value: 1, Color: '000000'};
|
|
|
|
|
|
|
|
|
|
|
|
color = fill.get_color_bg();
|
|
|
|
|
|
if (color) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.BGColor = {Value: 1, Color: {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() }};
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())};
|
|
|
|
|
|
}
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: 'ffffff'};
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.OriginalFillType = Asc.c_oAscFill.FILL_TYPE_PATT;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.SlideColor = {Value: 1, Color: Common.Utils.ThemeColor.colorValue2EffectId(this.FGColor.Color)};
|
|
|
|
|
|
this.GradColor.colors[0] = Common.Utils.ThemeColor.colorValue2EffectId(this.FGColor.Color);
|
|
|
|
|
|
this.GradColor.colors[1] = 'ffffff';
|
2016-04-05 11:52:34 +00:00
|
|
|
|
} else if (fill_type==Asc.c_oAscFill.FILL_TYPE_GRAD) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
fill = fill.get_fill();
|
|
|
|
|
|
var gradfilltype = fill.get_grad_type(); // null - не совпадают у нескольких фигур
|
|
|
|
|
|
if (this._state.GradFillType !== gradfilltype || this.GradFillType !== gradfilltype) {
|
|
|
|
|
|
this.GradFillType = gradfilltype;
|
|
|
|
|
|
rec = undefined;
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR || this.GradFillType == Asc.c_oAscFillGradType.GRAD_PATH) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.cmbGradType.setValue(this.GradFillType);
|
|
|
|
|
|
rec = this.cmbGradType.store.findWhere({value: this.GradFillType});
|
|
|
|
|
|
this.onGradTypeSelect(this.cmbGradType, rec.attributes);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.cmbGradType.setValue('');
|
|
|
|
|
|
this.btnDirection.setIconCls('');
|
|
|
|
|
|
}
|
|
|
|
|
|
this._state.GradFillType = this.GradFillType;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (this.GradFillType == Asc.c_oAscFillGradType.GRAD_LINEAR ) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
var value = Math.floor(fill.get_linear_angle()/60000);
|
|
|
|
|
|
if (Math.abs(this.GradLinearDirectionType-value)>0.001) {
|
|
|
|
|
|
this.GradLinearDirectionType=value;
|
|
|
|
|
|
var record = this.mnuDirectionPicker.store.findWhere({type: value});
|
|
|
|
|
|
this.mnuDirectionPicker.selectRecord(record, true);
|
|
|
|
|
|
if (record)
|
|
|
|
|
|
this.btnDirection.setIconCls('item-gradient ' + record.get('iconcls'));
|
|
|
|
|
|
else
|
|
|
|
|
|
this.btnDirection.setIconCls('');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
var colors = fill.get_colors();
|
|
|
|
|
|
if (colors && colors.length>0) {
|
|
|
|
|
|
color = colors[0];
|
|
|
|
|
|
if (color) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.GradColor.colors[0] = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value()};
|
|
|
|
|
|
Common.Utils.ThemeColor.colorValue2EffectId(this.GradColor.colors[0]);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.GradColor.colors[0] = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b());
|
|
|
|
|
|
}
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.GradColor.colors[0] = '000000';
|
|
|
|
|
|
|
|
|
|
|
|
color = colors[1];
|
|
|
|
|
|
if (color) {
|
2016-04-05 11:52:34 +00:00
|
|
|
|
if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) {
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.GradColor.colors[1] = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value()};
|
|
|
|
|
|
Common.Utils.ThemeColor.colorValue2EffectId(this.GradColor.colors[1]);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.GradColor.colors[1] = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b());
|
|
|
|
|
|
}
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.GradColor.colors[1] = 'ffffff';
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
var positions = fill.get_positions();
|
|
|
|
|
|
if (positions && positions.length>0) {
|
|
|
|
|
|
var position = positions[0];
|
|
|
|
|
|
if (position!==null) {
|
|
|
|
|
|
position = position/1000;
|
|
|
|
|
|
this.GradColor.values[0] = position;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
position = positions[1];
|
|
|
|
|
|
if (position!==null) {
|
|
|
|
|
|
position = position/1000;
|
|
|
|
|
|
this.GradColor.values[1] = position;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
this.sldrGradient.setColorValue(Common.Utils.String.format('#{0}', (typeof(this.GradColor.colors[0]) == 'object') ? this.GradColor.colors[0].color : this.GradColor.colors[0]), 0);
|
|
|
|
|
|
this.sldrGradient.setColorValue(Common.Utils.String.format('#{0}', (typeof(this.GradColor.colors[1]) == 'object') ? this.GradColor.colors[1].color : this.GradColor.colors[1]), 1);
|
|
|
|
|
|
this.sldrGradient.setValue(0, this.GradColor.values[0]);
|
|
|
|
|
|
this.sldrGradient.setValue(1, this.GradColor.values[1]);
|
2016-04-05 11:52:34 +00:00
|
|
|
|
this.OriginalFillType = Asc.c_oAscFill.FILL_TYPE_GRAD;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.FGColor = {Value: 1, Color: this.GradColor.colors[0]};
|
|
|
|
|
|
this.BGColor = {Value: 1, Color: 'ffffff'};
|
|
|
|
|
|
this.SlideColor = {Value: 1, Color: this.GradColor.colors[0]};
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if ( this._state.FillType!==this.OriginalFillType ) {
|
|
|
|
|
|
this.cmbFillSrc.setValue(this.OriginalFillType);
|
|
|
|
|
|
this._state.FillType=this.OriginalFillType;
|
|
|
|
|
|
this.ShowHideElem(this.OriginalFillType);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$(this.btnTexture.el).find('.form-control').prop('innerHTML', this.textSelectTexture);
|
|
|
|
|
|
|
|
|
|
|
|
var type1 = typeof(this.SlideColor.Color),
|
|
|
|
|
|
type2 = typeof(this._state.SlideColor);
|
|
|
|
|
|
|
|
|
|
|
|
if ( (type1 !== type2) || (type1=='object' &&
|
|
|
|
|
|
(this.SlideColor.Color.effectValue!==this._state.SlideColor.effectValue || this._state.SlideColor.color.indexOf(this.SlideColor.Color.color)<0)) ||
|
|
|
|
|
|
(type1!='object' && this._state.SlideColor.indexOf(this.SlideColor.Color)<0 )) {
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBackColor.setColor(this.SlideColor.Color);
|
|
|
|
|
|
if ( typeof(this.SlideColor.Color) == 'object' ) {
|
|
|
|
|
|
var isselected = false;
|
|
|
|
|
|
for (var i=0; i<10; i++) {
|
|
|
|
|
|
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.SlideColor.Color.effectValue ) {
|
|
|
|
|
|
this.colorsBack.select(this.SlideColor.Color,true);
|
|
|
|
|
|
isselected = true;
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (!isselected) this.colorsBack.clearSelection();
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.colorsBack.select(this.SlideColor.Color,true);
|
|
|
|
|
|
|
|
|
|
|
|
this._state.SlideColor = this.SlideColor.Color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
var timing = props.get_timing();
|
|
|
|
|
|
if (timing) {
|
|
|
|
|
|
var value = timing.get_TransitionType();
|
|
|
|
|
|
var found = false;
|
|
|
|
|
|
if (this._state.Effect !== value) {
|
|
|
|
|
|
var item = this.cmbEffectName.store.findWhere({value: value});
|
|
|
|
|
|
if (item) {
|
|
|
|
|
|
found = true;
|
|
|
|
|
|
this.cmbEffectName.setValue(item.get('value'));
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.cmbEffectName.setValue('');
|
|
|
|
|
|
|
|
|
|
|
|
this.fillEffectTypeCombo((found) ? value : undefined);
|
|
|
|
|
|
this.Effect = value;
|
|
|
|
|
|
this._state.Effect = value;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
value = timing.get_TransitionOption();
|
|
|
|
|
|
if (this._state.EffectType !== value || found) {
|
|
|
|
|
|
found = false;
|
|
|
|
|
|
item = this.cmbEffectType.store.findWhere({value: value});
|
|
|
|
|
|
if (item) {
|
|
|
|
|
|
found = true;
|
|
|
|
|
|
this.cmbEffectType.setValue(item.get('value'));
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.cmbEffectType.setValue('');
|
|
|
|
|
|
|
|
|
|
|
|
this._state.EffectType = value;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
value = timing.get_TransitionDuration();
|
|
|
|
|
|
if ( Math.abs(this._state.Duration-value)>0.001 ||
|
|
|
|
|
|
(this._state.Duration===null || value===null)&&(this._state.Duration!==value) ||
|
|
|
|
|
|
(this._state.Duration===undefined || value===undefined)&&(this._state.Duration!==value) ) {
|
|
|
|
|
|
this.numDuration.setValue((value !== null && value !== undefined) ? value/1000. : '', true);
|
|
|
|
|
|
this._state.Duration=value;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
value = timing.get_SlideAdvanceDuration();
|
|
|
|
|
|
if ( Math.abs(this._state.Delay-value)>0.001 ||
|
|
|
|
|
|
(this._state.Delay===null || value===null)&&(this._state.Delay!==value) ||
|
|
|
|
|
|
(this._state.Delay===undefined || value===undefined)&&(this._state.Delay!==value) ) {
|
|
|
|
|
|
this.numDelay.setValue((value !== null && value !== undefined) ? value/1000. : '', true);
|
|
|
|
|
|
this._state.Delay=value;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
value = timing.get_SlideAdvanceOnMouseClick();
|
|
|
|
|
|
if ( this._state.OnMouseClick!==value ) {
|
|
|
|
|
|
this.chStartOnClick.setValue((value !== null && value !== undefined) ? value : 'indeterminate', true);
|
|
|
|
|
|
this._state.OnMouseClick=value;
|
|
|
|
|
|
}
|
|
|
|
|
|
value = timing.get_SlideAdvanceAfter();
|
|
|
|
|
|
if ( this._state.AdvanceAfter!==value ) {
|
|
|
|
|
|
this.chDelay.setValue((value !== null && value !== undefined) ? value : 'indeterminate', true);
|
|
|
|
|
|
this.numDelay.setDisabled(this.chDelay.getValue()!=='checked');
|
|
|
|
|
|
this._state.AdvanceAfter=value;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// pattern colors
|
|
|
|
|
|
type1 = typeof(this.FGColor.Color);
|
|
|
|
|
|
type2 = typeof(this._state.FGColor);
|
|
|
|
|
|
|
|
|
|
|
|
if ( (type1 !== type2) || (type1=='object' &&
|
|
|
|
|
|
(this.FGColor.Color.effectValue!==this._state.FGColor.effectValue || this._state.FGColor.color.indexOf(this.FGColor.Color.color)<0)) ||
|
|
|
|
|
|
(type1!='object' && this._state.FGColor.indexOf(this.FGColor.Color)<0 )) {
|
|
|
|
|
|
|
|
|
|
|
|
this.btnFGColor.setColor(this.FGColor.Color);
|
|
|
|
|
|
if ( typeof(this.FGColor.Color) == 'object' ) {
|
|
|
|
|
|
var isselected = false;
|
|
|
|
|
|
for (var i=0; i<10; i++) {
|
|
|
|
|
|
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.FGColor.Color.effectValue ) {
|
|
|
|
|
|
this.colorsFG.select(this.FGColor.Color,true);
|
|
|
|
|
|
isselected = true;
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (!isselected) this.colorsFG.clearSelection();
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.colorsFG.select(this.FGColor.Color,true);
|
|
|
|
|
|
|
|
|
|
|
|
this._state.FGColor = this.FGColor.Color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
type1 = typeof(this.BGColor.Color);
|
|
|
|
|
|
type2 = typeof(this._state.BGColor);
|
|
|
|
|
|
|
|
|
|
|
|
if ( (type1 !== type2) || (type1=='object' &&
|
|
|
|
|
|
(this.BGColor.Color.effectValue!==this._state.BGColor.effectValue || this._state.BGColor.color.indexOf(this.BGColor.Color.color)<0)) ||
|
|
|
|
|
|
(type1!='object' && this._state.BGColor.indexOf(this.BGColor.Color)<0 )) {
|
|
|
|
|
|
|
|
|
|
|
|
this.btnBGColor.setColor(this.BGColor.Color);
|
|
|
|
|
|
if ( typeof(this.BGColor.Color) == 'object' ) {
|
|
|
|
|
|
var isselected = false;
|
|
|
|
|
|
for (var i=0; i<10; i++) {
|
|
|
|
|
|
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.BGColor.Color.effectValue ) {
|
|
|
|
|
|
this.colorsBG.select(this.BGColor.Color,true);
|
|
|
|
|
|
isselected = true;
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (!isselected) this.colorsBG.clearSelection();
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.colorsBG.select(this.BGColor.Color,true);
|
|
|
|
|
|
|
|
|
|
|
|
this._state.BGColor = this.BGColor.Color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
color = this.GradColor.colors[this.GradColor.currentIdx];
|
|
|
|
|
|
type1 = typeof(color);
|
|
|
|
|
|
type2 = typeof(this._state.GradColor);
|
|
|
|
|
|
|
|
|
|
|
|
if ( (type1 !== type2) || (type1=='object' &&
|
|
|
|
|
|
(color.effectValue!==this._state.GradColor.effectValue || this._state.GradColor.color.indexOf(color.color)<0)) ||
|
|
|
|
|
|
(type1!='object' && this._state.GradColor.indexOf(color)<0 )) {
|
|
|
|
|
|
|
|
|
|
|
|
this.btnGradColor.setColor(color);
|
|
|
|
|
|
if ( typeof(color) == 'object' ) {
|
|
|
|
|
|
var isselected = false;
|
|
|
|
|
|
for (var i=0; i<10; i++) {
|
|
|
|
|
|
if ( Common.Utils.ThemeColor.ThemeValues[i] == color.effectValue ) {
|
|
|
|
|
|
this.colorsGrad.select(color,true);
|
|
|
|
|
|
isselected = true;
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (!isselected) this.colorsGrad.clearSelection();
|
|
|
|
|
|
} else
|
|
|
|
|
|
this.colorsGrad.select(color,true);
|
|
|
|
|
|
|
|
|
|
|
|
this._state.GradColor = color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this._noApply = false;
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
SetSlideDisabled: function(background, effects, timing) {
|
|
|
|
|
|
if (background !== this._stateDisabled.background) {
|
|
|
|
|
|
this.cmbFillSrc.setDisabled(background);
|
|
|
|
|
|
for (var i=0; i<this.FillItems.length; i++) {
|
|
|
|
|
|
this.FillItems[i].setDisabled(background);
|
|
|
|
|
|
}
|
|
|
|
|
|
this._stateDisabled.background = background;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (effects !== this._stateDisabled.effects) {
|
2016-07-26 14:53:03 +00:00
|
|
|
|
var length = this.cmbEffectType.store.length;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this.cmbEffectName.setDisabled(effects);
|
2016-07-26 14:53:03 +00:00
|
|
|
|
this.cmbEffectType.setDisabled(length<1 || effects);
|
|
|
|
|
|
this.numDuration.setDisabled(length<1 || effects);
|
|
|
|
|
|
this.btnPreview.setDisabled(length<1 || effects);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
this._stateDisabled.effects = effects;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (timing !== this._stateDisabled.timing) {
|
|
|
|
|
|
this.chStartOnClick.setDisabled(timing);
|
|
|
|
|
|
this.chDelay.setDisabled(timing);
|
|
|
|
|
|
this.numDelay.setDisabled(timing || this.chDelay.getValue()!=='checked');
|
|
|
|
|
|
this.btnApplyToAll.setDisabled(timing);
|
|
|
|
|
|
this._stateDisabled.timing = timing;
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
strColor : 'Color',
|
|
|
|
|
|
strFill : 'Fill',
|
|
|
|
|
|
textColor : 'Color Fill',
|
|
|
|
|
|
textImageTexture : 'Picture or Texture',
|
|
|
|
|
|
textTexture : 'From Texture',
|
|
|
|
|
|
textFromUrl : 'From URL',
|
|
|
|
|
|
textFromFile : 'From File',
|
|
|
|
|
|
textStretch : 'Stretch',
|
|
|
|
|
|
textTile : 'Tile',
|
|
|
|
|
|
txtCanvas : 'Canvas',
|
|
|
|
|
|
txtCarton : 'Carton',
|
|
|
|
|
|
txtDarkFabric : 'Dark Fabric',
|
|
|
|
|
|
txtGrain : 'Grain',
|
|
|
|
|
|
txtGranite : 'Granite',
|
|
|
|
|
|
txtGreyPaper : 'Grey Paper',
|
|
|
|
|
|
txtKnit : 'Knit',
|
|
|
|
|
|
txtLeather : 'Leather',
|
|
|
|
|
|
txtBrownPaper : 'Brown Paper',
|
|
|
|
|
|
txtPapyrus : 'Papyrus',
|
|
|
|
|
|
txtWood : 'Wood',
|
|
|
|
|
|
textNewColor : 'Add New Custom Color',
|
|
|
|
|
|
textAdvanced : 'Show advanced settings',
|
|
|
|
|
|
textNoFill : 'No Fill',
|
|
|
|
|
|
textSelectTexture : 'Select',
|
|
|
|
|
|
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',
|
|
|
|
|
|
textTop: 'Top',
|
|
|
|
|
|
textRight: 'Right',
|
|
|
|
|
|
textBottom: 'Bottom',
|
|
|
|
|
|
textTopLeft: 'Top-Left',
|
|
|
|
|
|
textTopRight: 'Top-Right',
|
|
|
|
|
|
textBottomLeft: 'Bottom-Left',
|
|
|
|
|
|
textBottomRight: 'Bottom-Right',
|
|
|
|
|
|
textVerticalIn: 'Vertical In',
|
|
|
|
|
|
textVerticalOut: 'Vertical Out',
|
|
|
|
|
|
textHorizontalIn: 'Horizontal In',
|
|
|
|
|
|
textHorizontalOut: 'Horizontal Out',
|
|
|
|
|
|
textClockwise: 'Clockwise',
|
|
|
|
|
|
textCounterclockwise: 'Counterclockwise',
|
|
|
|
|
|
textWedge: 'Wedge',
|
|
|
|
|
|
textZoomIn: 'Zoom In',
|
|
|
|
|
|
textZoomOut: 'Zoom Out',
|
|
|
|
|
|
textZoomRotate: 'Zoom and Rotate',
|
|
|
|
|
|
strStartOnClick: 'Start On Click',
|
|
|
|
|
|
strDelay: 'Delay',
|
|
|
|
|
|
textApplyAll: 'Apply to All Slides',
|
|
|
|
|
|
textPreview: 'Preview',
|
|
|
|
|
|
strEffect: 'Effect',
|
|
|
|
|
|
strDuration: 'Duration',
|
|
|
|
|
|
textGradientFill: 'Gradient Fill',
|
|
|
|
|
|
textPatternFill: 'Pattern',
|
|
|
|
|
|
strBackground: 'Background color',
|
|
|
|
|
|
strForeground: 'Foreground color',
|
|
|
|
|
|
strPattern: 'Pattern',
|
|
|
|
|
|
textEmptyPattern: 'No Pattern',
|
|
|
|
|
|
textLinear: 'Linear',
|
|
|
|
|
|
textRadial: 'Radial',
|
|
|
|
|
|
textDirection: 'Direction',
|
|
|
|
|
|
textStyle: 'Style',
|
2016-04-06 13:38:54 +00:00
|
|
|
|
textGradient: 'Gradient',
|
|
|
|
|
|
textSec: 's'
|
2016-03-11 00:48:53 +00:00
|
|
|
|
}, PE.Views.SlideSettings || {}));
|
|
|
|
|
|
});
|
