Commit 3a057c93 authored by Alexander Yuzhin's avatar Alexander Yuzhin

[SE mobile] Add EditCell layout.

parent 848e27bb
......@@ -39,6 +39,10 @@
margin-top: 0;
}
&:last-child {
margin-bottom: 30px;
}
li:first-child a,
li:last-child a {
border-radius: 0 !important;
......
......@@ -69,6 +69,7 @@
&.no-indicator {
.item-inner {
background-image: none;
padding-right: 15px;
}
}
}
......
......@@ -2,23 +2,28 @@
<div id="edit-text-root">
<div class="list-block">
<ul>
<li><a id="font-fonts" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title"><%= scope.textFonts %></div>
<div class="item-after" style="color: #000;"><span></span><span style="margin-left: 5px;"></span></div>
<li>
<a id="font-fonts" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title"><%= scope.textFonts %></div>
<div class="item-after" style="color: #000;"><span></span><span style="margin-left: 5px;"></span></div>
</div>
</div>
</div></a></li>
<li><div class="item-content buttons">
<div class="item-inner">
<div class="row">
<a id="font-bold" class="button"><b>B</b></a>
<a id="font-italic" class="button"><i>I</i></a>
<a id="font-underline" class="button" style="text-decoration: underline;">U</a>
<a id="font-strikethrough" class="button" style="text-decoration: line-through">S</a>
</a>
</li>
<li>
<div class="item-content buttons">
<div class="item-inner">
<div class="row">
<a id="font-bold" class="button"><b>B</b></a>
<a id="font-italic" class="button"><i>I</i></a>
<a id="font-underline" class="button" style="text-decoration: underline;">U</a>
<a id="font-strikethrough" class="button" style="text-decoration: line-through">S</a>
</div>
</div>
</div>
</div></li>
</li>
<li>
<a id="font-color" class="item-link">
<div class="item-content">
......@@ -30,15 +35,16 @@
</div>
</a>
</li>
<li><a id="font-background" class="item-link">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-selection"><span class="color-preview"></span></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textHighlightColor %></div>
<% if (android) { %><div class="item-after"><div class="color-preview"></div></div><% } %>
<li>
<a id="font-background" class="item-link">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-selection"><span class="color-preview"></span></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textHighlightColor %></div>
<% if (android) { %><div class="item-after"><div class="color-preview"></div></div><% } %>
</div>
</div>
</div>
</a>
</a>
</li>
<li>
<a id="font-additional" class="item-link">
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -123,7 +123,7 @@ require([
, 'Statusbar'
,'Settings'
,'EditContainer'
// ,'EditText'
,'EditCell'
// ,'EditParagraph'
// ,'EditTable'
// ,'EditImage'
......@@ -193,7 +193,7 @@ require([
, 'spreadsheeteditor/mobile/app/controller/Statusbar'
, 'spreadsheeteditor/mobile/app/controller/Settings'
,'spreadsheeteditor/mobile/app/controller/edit/EditContainer'
// ,'spreadsheeteditor/mobile/app/controller/edit/EditText'
,'spreadsheeteditor/mobile/app/controller/edit/EditCell'
// ,'spreadsheeteditor/mobile/app/controller/edit/EditParagraph'
// ,'spreadsheeteditor/mobile/app/controller/edit/EditTable'
// ,'spreadsheeteditor/mobile/app/controller/edit/EditImage'
......
/*
*
* (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
*
*/
/**
* EditCell.js
* Spreadsheet Editor
*
* Created by Alexander Yuzhin on 12/6/16
* Copyright (c) 2016 Ascensio System SIA. All rights reserved.
*
*/
define([
'core',
'spreadsheeteditor/mobile/app/view/edit/EditCell',
'jquery',
'underscore',
'backbone',
'common/mobile/lib/component/ThemeColorPalette'
], function (core, view, $, _, Backbone) {
'use strict';
SSE.Controllers.EditCell = Backbone.Controller.extend(_.extend((function() {
var _fontsArray = [],
_stack = [],
_cellObject = undefined,
_fontInfo = {};
function onApiLoadFonts(fonts, select) {
_.each(fonts, function(font){
var fontId = font.asc_getFontId();
_fontsArray.push({
id : fontId,
name : font.asc_getFontName(),
// displayValue: font.asc_getFontName(),
imgidx : font.asc_getFontThumbnail(),
type : font.asc_getFontType()
});
});
Common.NotificationCenter.trigger('fonts:load', _fontsArray, select);
}
return {
models: [],
collections: [],
views: [
'EditCell'
],
initialize: function () {
Common.NotificationCenter.on('editcontainer:show', _.bind(this.initEvents, this));
this.addListeners({
'EditCell': {
'page:show' : this.onPageShow,
'font:click': this.onFontClick
}
});
},
setApi: function (api) {
var me = this;
me.api = api;
// me.api.asc_registerCallback('asc_onInitEditorFonts', _.bind(onApiLoadFonts, me));
// me.api.asc_registerCallback('asc_onFocusObject', _.bind(me.onApiFocusObject, me));
// me.api.asc_registerCallback('asc_onFontFamily', _.bind(me.onApiChangeFont, me));
// me.api.asc_registerCallback('asc_onFontSize', _.bind(me.onApiFontSize, me));
// me.api.asc_registerCallback('asc_onBold', _.bind(me.onApiBold, me));
// me.api.asc_registerCallback('asc_onItalic', _.bind(me.onApiItalic, me));
// me.api.asc_registerCallback('asc_onUnderline', _.bind(me.onApiUnderline, me));
// me.api.asc_registerCallback('asc_onStrikeout', _.bind(me.onApiStrikeout, me));
// me.api.asc_registerCallback('asc_onVerticalAlign', _.bind(me.onApiVerticalAlign, me));
// me.api.asc_registerCallback('asc_onListType', _.bind(me.onApiBullets, me));
// me.api.asc_registerCallback('asc_onPrAlign', _.bind(me.onApiParagraphAlign, me));
// me.api.asc_registerCallback('asc_onTextColor', _.bind(me.onApiTextColor, me));
// me.api.asc_registerCallback('asc_onParaSpacingLine', _.bind(me.onApiLineSpacing, me));
// me.api.asc_registerCallback('asc_onTextShd', _.bind(me.onApiTextShd, me));
},
onLaunch: function () {
this.createView('EditCell').render();
},
initEvents: function () {
var me = this;
// $('#font-bold').single('click', _.bind(me.onBold, me));
// $('#font-italic').single('click', _.bind(me.onItalic, me));
// $('#font-underline').single('click', _.bind(me.onUnderline, me));
// $('#font-strikethrough').single('click', _.bind(me.onStrikethrough, me));
//
// $('#paragraph-align .button').single('click', _.bind(me.onParagraphAlign, me));
// $('#font-moveleft, #font-moveright').single('click', _.bind(me.onParagraphMove, me));
me.initSettings();
},
onPageShow: function (view, pageId) {
var me = this;
// paletteTextColor = me.getView('EditCell').paletteTextColor,
// paletteBackgroundColor = me.getView('EditCell').paletteBackgroundColor;
//
// $('#text-additional li').single('click', _.buffered(me.onAdditional, 100, me));
// $('#page-text-linespacing li').single('click', _.buffered(me.onLineSpacing, 100, me));
// $('#font-size .button').single('click', _.bind(me.onFontSize, me));
// $('#letter-spacing .button').single('click', _.bind(me.onLetterSpacing, me));
//
// $('.dataview.bullets li').single('click', _.buffered(me.onBullet, 100, me));
// $('.dataview.numbers li').single('click', _.buffered(me.onNumber, 100, me));
//
// $('#font-color-auto').single('click', _.bind(me.onTextColorAuto, me));
// paletteTextColor && paletteTextColor.on('select', _.bind(me.onTextColor, me));
// paletteBackgroundColor && paletteBackgroundColor.on('select', _.bind(me.onBackgroundColor, me));
me.initSettings(pageId);
},
initSettings: function (pageId) {
var me = this;
// me.api && me.api.UpdateInterfaceState();
//
// if (_cellObject) {
// var $inputStrikethrough = $('#text-additional input[name=text-strikethrough]');
// var $inputTextCaps = $('#text-additional input[name=text-caps]');
//
// _cellObject.get_Strikeout() && $inputStrikethrough.val(['strikethrough']).prop('prevValue', 'strikethrough');
// _cellObject.get_DStrikeout() && $inputStrikethrough.val(['double-strikethrough']).prop('prevValue', 'double-strikethrough');
//
// _cellObject.get_SmallCaps() && $inputTextCaps.val(['small']).prop('prevValue', 'small');
// _cellObject.get_AllCaps() && $inputTextCaps.val(['all']).prop('prevValue', 'all');
//
// _fontInfo.letterSpacing = Common.Utils.Metric.fnRecalcFromMM(_cellObject.get_TextSpacing());
// $('#letter-spacing .item-after label').text(_fontInfo.letterSpacing + ' ' + Common.Utils.Metric.getCurrentMetricName());
// }
},
// Public
getFonts: function() {
return _fontsArray;
},
getStack: function() {
return _stack;
},
getFontInfo: function () {
return _fontInfo;
},
getCell: function () {
return _cellObject;
},
// Handlers
onBold: function (e) {
var pressed = this._toggleButton(e);
if (this.api) {
this.api.put_TextPrBold(pressed);
}
},
onItalic: function (e) {
var pressed = this._toggleButton(e);
if (this.api) {
this.api.put_TextPrItalic(pressed);
}
},
onUnderline: function (e) {
var pressed = this._toggleButton(e);
if (this.api) {
this.api.put_TextPrUnderline(pressed);
}
},
// API handlers
onApiFocusObject: function (objects) {
_stack = objects;
// var paragraphs = [];
//
// _.each(_stack, function(object) {
// if (object.get_ObjectType() == Asc.c_oAscTypeSelectElement.Paragraph) {
// paragraphs.push(object);
// }
// });
//
// if (paragraphs.length > 0) {
// var object = paragraphs[paragraphs.length - 1]; // get top
// _cellObject = object.get_ObjectValue();
// } else {
// _cellObject = undefined;
// }
},
// Helpers
_toggleButton: function (e) {
return $(e.currentTarget).toggleClass('active').hasClass('active');
},
textFonts: 'Fonts',
textAuto: 'Auto',
textPt: 'pt'
}
})(), SSE.Controllers.EditCell || {}))
});
\ No newline at end of file
......@@ -62,7 +62,8 @@ define([
setApi: function(api) {
this.api = api;
this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onApiFocusObject, this));
this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onApiFocusObject, this)); //????
this.api.asc_registerCallback('asc_onSelectionChanged', _.bind(this.onApiSelectionChanged, this));
},
onLaunch: function() {
......@@ -351,6 +352,220 @@ define([
_settings = [];
},
onApiSelectionChanged: function (cellInfo) {
_settings = [];
var isCell, isRow, isCol, isAll, isChart, isImage, isTextShape, isShape, isTextChart,
selType = cellInfo.asc_getFlags().asc_getSelectionType(),
isCellLocked = cellInfo.asc_getLocked(),
isTableLocked = cellInfo.asc_getLockedTable()===true,
isObjLocked = false;
switch (selType) {
case Asc.c_oAscSelectionType.RangeCells: isCell = true; break;
case Asc.c_oAscSelectionType.RangeRow: isRow = true; break;
case Asc.c_oAscSelectionType.RangeCol: isCol = true; break;
case Asc.c_oAscSelectionType.RangeMax: isAll = true; break;
case Asc.c_oAscSelectionType.RangeImage: isImage = true; break;
case Asc.c_oAscSelectionType.RangeShape: isShape = true; break;
case Asc.c_oAscSelectionType.RangeChart: isChart = true; break;
case Asc.c_oAscSelectionType.RangeChartText:isTextChart = true; break;
case Asc.c_oAscSelectionType.RangeShapeText: isTextShape = true; break;
}
if (isImage || isShape || isChart) {
if (!showMenu && !documentHolder.imgMenu.isVisible()) return;
isImage = isShape = isChart = false;
var has_chartprops = false;
var selectedObjects = this.api.asc_getGraphicObjectProps();
for (var i = 0; i < selectedObjects.length; i++) {
if (selectedObjects[i].asc_getObjectType() == Asc.c_oAscTypeSelectElement.Image) {
var elValue = selectedObjects[i].asc_getObjectValue();
isObjLocked = isObjLocked || elValue.asc_getLocked();
var shapeProps = elValue.asc_getShapeProperties();
if (shapeProps) {
if (shapeProps.asc_getFromChart()) {
isChart = true;
} else {
// documentHolder.mnuShapeAdvanced.shapeInfo = elValue;
isShape = true;
}
} else if (elValue.asc_getChartProperties()) {
isChart = true;
has_chartprops = true;
}
else
isImage = true;
}
}
// documentHolder.mnuUnGroupImg.setDisabled(isObjLocked || !this.api.asc_canUnGroupGraphicsObjects());
// documentHolder.mnuGroupImg.setDisabled(isObjLocked || !this.api.asc_canGroupGraphicsObjects());
// documentHolder.mnuShapeAdvanced.setVisible(isShape && !isImage && !isChart);
// documentHolder.mnuShapeAdvanced.setDisabled(isObjLocked);
// documentHolder.mnuChartEdit.setVisible(isChart && !isImage && !isShape && has_chartprops);
// documentHolder.mnuChartEdit.setDisabled(isObjLocked);
// documentHolder.pmiImgCut.setDisabled(isObjLocked);
// documentHolder.pmiImgPaste.setDisabled(isObjLocked);
// if (showMenu) this.showPopupMenu(documentHolder.imgMenu, {}, event);
// documentHolder.mnuShapeSeparator.setVisible(documentHolder.mnuShapeAdvanced.isVisible() || documentHolder.mnuChartEdit.isVisible());
} else if (isTextShape || isTextChart) {
var selectedObjects = this.api.asc_getGraphicObjectProps(),
isEquation = false;
for (var i = 0; i < selectedObjects.length; i++) {
var elType = selectedObjects[i].asc_getObjectType();
if (elType == Asc.c_oAscTypeSelectElement.Image) {
var value = selectedObjects[i].asc_getObjectValue(),
align = value.asc_getVerticalTextAlign(),
direct = value.asc_getVert();
isObjLocked = isObjLocked || value.asc_getLocked();
// documentHolder.menuParagraphTop.setChecked(align == Asc.c_oAscVAlign.Top);
// documentHolder.menuParagraphCenter.setChecked(align == Asc.c_oAscVAlign.Center);
// documentHolder.menuParagraphBottom.setChecked(align == Asc.c_oAscVAlign.Bottom);
//
// documentHolder.menuParagraphDirectH.setChecked(direct == Asc.c_oAscVertDrawingText.normal);
// documentHolder.menuParagraphDirect90.setChecked(direct == Asc.c_oAscVertDrawingText.vert);
// documentHolder.menuParagraphDirect270.setChecked(direct == Asc.c_oAscVertDrawingText.vert270);
} else if (elType == Asc.c_oAscTypeSelectElement.Paragraph) {
// documentHolder.pmiTextAdvanced.textInfo = selectedObjects[i].asc_getObjectValue();
// isObjLocked = isObjLocked || documentHolder.pmiTextAdvanced.textInfo.asc_getLocked();
} else if (elType == Asc.c_oAscTypeSelectElement.Math) {
// this._currentMathObj = selectedObjects[i].asc_getObjectValue();
isEquation = true;
}
}
var hyperInfo = cellInfo.asc_getHyperlink(),
can_add_hyperlink = this.api.asc_canAddShapeHyperlink();
// documentHolder.menuHyperlinkShape.setVisible(isTextShape && can_add_hyperlink!==false && hyperInfo);
// documentHolder.menuAddHyperlinkShape.setVisible(isTextShape && can_add_hyperlink!==false && !hyperInfo);
// documentHolder.menuParagraphVAlign.setVisible(isTextChart!==true && !isEquation); // убрать после того, как заголовок можно будет растягивать по вертикали!!
// documentHolder.menuParagraphDirection.setVisible(isTextChart!==true && !isEquation); // убрать после того, как заголовок можно будет растягивать по вертикали!!
// documentHolder.pmiTextAdvanced.setVisible(documentHolder.pmiTextAdvanced.textInfo!==undefined);
//
// _.each(documentHolder.textInShapeMenu.items, function(item) {
// item.setDisabled(isObjLocked);
// });
// documentHolder.pmiTextCopy.setDisabled(false);
//
// //equation menu
// var eqlen = 0;
// this._currentParaObjDisabled = isObjLocked;
// if (isEquation) {
// eqlen = this.addEquationMenu(4);
// } else
// this.clearEquationMenu(4);
//
// if (showMenu) this.showPopupMenu(documentHolder.textInShapeMenu, {}, event);
// documentHolder.textInShapeMenu.items[3].setVisible( documentHolder.menuHyperlinkShape.isVisible() ||
// documentHolder.menuAddHyperlinkShape.isVisible() ||
// documentHolder.menuParagraphVAlign.isVisible() || isEquation);
}
// } else if (selType !== Asc.c_oAscSelectionType.RangeImage && selType !== Asc.c_oAscSelectionType.RangeShape &&
// selType !== Asc.c_oAscSelectionType.RangeChart && selType !== Asc.c_oAscSelectionType.RangeChartText && selType !== Asc.c_oAscSelectionType.RangeShapeText) {
//
// var isCellEdit = this.api.isCellEdited,
// formatTableInfo = cellInfo.asc_getFormatTableInfo(),
// isinsparkline = (cellInfo.asc_getSparklineInfo()!==null),
// isintable = (formatTableInfo !== null),
// ismultiselect = cellInfo.asc_getFlags().asc_getMultiselect();
// documentHolder.ssMenu.formatTableName = (isintable) ? formatTableInfo.asc_getTableName() : null;
// documentHolder.ssMenu.cellColor = cellInfo.asc_getFill().asc_getColor();
// documentHolder.ssMenu.fontColor = cellInfo.asc_getFont().asc_getColor();
//
// documentHolder.pmiInsertEntire.setVisible(isRow||isCol);
// documentHolder.pmiInsertEntire.setCaption((isRow) ? this.textInsertTop : this.textInsertLeft);
// documentHolder.pmiDeleteEntire.setVisible(isRow||isCol);
// documentHolder.pmiInsertCells.setVisible(isCell && !isCellEdit && !isintable);
// documentHolder.pmiDeleteCells.setVisible(isCell && !isCellEdit && !isintable);
// documentHolder.pmiSelectTable.setVisible(isCell && !isCellEdit && isintable);
// documentHolder.pmiInsertTable.setVisible(isCell && !isCellEdit && isintable);
// documentHolder.pmiDeleteTable.setVisible(isCell && !isCellEdit && isintable);
// documentHolder.pmiSparklines.setVisible(isinsparkline);
// documentHolder.pmiSortCells.setVisible((isCell||isAll||cansort) && !isCellEdit);
// documentHolder.pmiFilterCells.setVisible((isCell||cansort) && !isCellEdit);
// documentHolder.pmiReapply.setVisible((isCell||isAll||cansort) && !isCellEdit);
// documentHolder.ssMenu.items[12].setVisible((isCell||isAll||cansort||isinsparkline) && !isCellEdit);
// documentHolder.pmiInsFunction.setVisible(isCell||insfunc);
// documentHolder.pmiAddNamedRange.setVisible(isCell && !isCellEdit);
//
// if (isintable) {
// documentHolder.pmiInsertTable.menu.items[0].setDisabled(!formatTableInfo.asc_getIsInsertRowAbove());
// documentHolder.pmiInsertTable.menu.items[1].setDisabled(!formatTableInfo.asc_getIsInsertRowBelow());
// documentHolder.pmiInsertTable.menu.items[2].setDisabled(!formatTableInfo.asc_getIsInsertColumnLeft());
// documentHolder.pmiInsertTable.menu.items[3].setDisabled(!formatTableInfo.asc_getIsInsertColumnRight());
//
// documentHolder.pmiDeleteTable.menu.items[0].setDisabled(!formatTableInfo.asc_getIsDeleteRow());
// documentHolder.pmiDeleteTable.menu.items[1].setDisabled(!formatTableInfo.asc_getIsDeleteColumn());
// documentHolder.pmiDeleteTable.menu.items[2].setDisabled(!formatTableInfo.asc_getIsDeleteTable());
//
// }
//
// var hyperinfo = cellInfo.asc_getHyperlink();
// documentHolder.menuHyperlink.setVisible(isCell && hyperinfo && !isCellEdit && !ismultiselect);
// documentHolder.menuAddHyperlink.setVisible(isCell && !hyperinfo && !isCellEdit && !ismultiselect);
//
// documentHolder.pmiRowHeight.setVisible(isRow||isAll);
// documentHolder.pmiColumnWidth.setVisible(isCol||isAll);
// documentHolder.pmiEntireHide.setVisible(isCol||isRow);
// documentHolder.pmiEntireShow.setVisible(isCol||isRow);
// documentHolder.pmiFreezePanes.setVisible(!isCellEdit);
// documentHolder.pmiFreezePanes.setCaption(this.api.asc_getSheetViewSettings().asc_getIsFreezePane() ? documentHolder.textUnFreezePanes : documentHolder.textFreezePanes);
// documentHolder.pmiEntriesList.setVisible(!isCellEdit);
//
// /** coauthoring begin **/
// documentHolder.ssMenu.items[17].setVisible(isCell && !isCellEdit && this.permissions.canCoAuthoring && this.permissions.canComments);
// documentHolder.pmiAddComment.setVisible(isCell && !isCellEdit && this.permissions.canCoAuthoring && this.permissions.canComments);
// /** coauthoring end **/
// documentHolder.pmiCellMenuSeparator.setVisible(isCell || isRow || isCol || isAll || insfunc);
// documentHolder.pmiEntireHide.isrowmenu = isRow;
// documentHolder.pmiEntireShow.isrowmenu = isRow;
//
// documentHolder.setMenuItemCommentCaptionMode(cellInfo.asc_getComments().length > 0);
// commentsController && commentsController.blockPopover(true);
//
// documentHolder.pmiClear.menu.items[1].setDisabled(isCellEdit);
// documentHolder.pmiClear.menu.items[2].setDisabled(isCellEdit);
// documentHolder.pmiClear.menu.items[3].setDisabled(isCellEdit);
// documentHolder.pmiClear.menu.items[4].setDisabled(isCellEdit);
//
// documentHolder.pmiClear.menu.items[3].setVisible(!this.permissions.isEditDiagram);
// documentHolder.pmiClear.menu.items[4].setVisible(!this.permissions.isEditDiagram);
//
// var filterInfo = cellInfo.asc_getAutoFilterInfo(),
// isApplyAutoFilter = (filterInfo) ? filterInfo.asc_getIsApplyAutoFilter() : false;
// filterInfo = (filterInfo) ? filterInfo.asc_getIsAutoFilter() : null;
// documentHolder.pmiInsertCells.menu.items[0].setDisabled(isApplyAutoFilter);
// documentHolder.pmiDeleteCells.menu.items[0].setDisabled(isApplyAutoFilter);
// documentHolder.pmiInsertCells.menu.items[1].setDisabled(isApplyAutoFilter);
// documentHolder.pmiDeleteCells.menu.items[1].setDisabled(isApplyAutoFilter);
//
// _.each(documentHolder.ssMenu.items, function(item) {
// item.setDisabled(isCellLocked);
// });
// documentHolder.pmiCopy.setDisabled(false);
// documentHolder.pmiInsertEntire.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiInsertCells.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiInsertTable.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiDeleteEntire.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiDeleteCells.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiDeleteTable.setDisabled(isCellLocked || isTableLocked);
// documentHolder.pmiFilterCells.setDisabled(isCellLocked || isTableLocked|| (filterInfo==null));
// documentHolder.pmiSortCells.setDisabled(isCellLocked || isTableLocked|| (filterInfo==null));
// documentHolder.pmiReapply.setDisabled(isCellLocked || isTableLocked|| (isApplyAutoFilter!==true));
// if (showMenu) this.showPopupMenu(documentHolder.ssMenu, {}, event);
// }
_settings.push('cell');
},
textSettings: 'Settings',
textCell: 'Cell',
textTable: 'Table',
......
<!-- Root view -->
<div id="edit-cell-root">
<div class="list-block">
<ul>
<li>
<a id="font-fonts" class="item-link" data-page="#edit-text-fonts">
<div class="item-content">
<div class="item-inner">
<div class="item-title"><%= scope.textFonts %></div>
<div class="item-after" style="color: #000;"><span></span><span style="margin-left: 5px;"></span></div>
</div>
</div>
</a>
</li>
<li>
<div class="item-content buttons">
<div class="item-inner">
<div class="row">
<a id="font-bold" class="button"><b>B</b></a>
<a id="font-italic" class="button"><i>I</i></a>
<a id="font-underline" class="button" style="text-decoration: underline;">U</a>
</div>
</div>
</div>
</li>
<li>
<a id="text-color" class="item-link" data-page="#edit-text-color">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-color"><span class="color-preview"></span></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textTextColor %></div>
<% if (android) { %><div class="item-after"><div class="color-preview"></div></div><% } %>
</div>
</div>
</a>
</li>
<li>
<a id="fill-color" class="item-link" data-page="#edit-fill-color">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-selection"><span class="color-preview"></span></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textFillColor %></div>
<% if (android) { %><div class="item-after"><div class="color-preview"></div></div><% } %>
</div>
</div>
</a>
</li>
<li>
<a id="text-format" class="item-link" data-page="#edit-text-format">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-additional"></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textTextFormat %></div>
</div>
</div>
</a>
</li>
<li>
<a id="border-style" class="item-link" data-page="#edit-border-style">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-additional"></i></div><% } %>
<div class="item-inner">
<div class="item-title"><%= scope.textBorderStyle %></div>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="list-block">
<ul>
<a class="item-link" data-page="#edit-cell-format">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-additional"></i></div><% } %>
<div class="item-inner">
<div class="item-title">Format</div>
</div>
</div>
</a>
</ul>
</div>
<div class="content-block-title">Cell Styles</div>
<div class="list-block">
<ul>
<li class="cell-styles">
<div class="item-content"></div>
</li>
</ul>
</div>
</div>
<!-- Fonts view -->
<div id="edit-text-fonts">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"><i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
<div class="center sliding"><%= scope.textFonts %></div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="page" data-page="edit-text-font-page">
<div class="page-content">
<div class="list-block">
<ul>
<li id="font-size">
<div class="item-content">
<div class="item-inner">
<div class="item-title"><%= scope.textSize %></div>
<div class="item-after splitter">
<% if (!android) { %><label></label><% } %>
<p class="buttons-row">
<span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
<% if (android) { %><label></label><% } %>
<span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
</p>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="content-block-title"><%= scope.textFonts %></div>
<div id="font-list" class="list-block virtual-list">
<!-- Fonts List -->
</div>
</div>
</div>
</div>
<!-- Text color view -->
<div id="edit-text-color">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding"><%= scope.textTextColor %></div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="page" data-page="edit-text-color">
<div class="page-content">
</div>
</div>
</div>
<!-- Fill color view -->
<div id="edit-fill-color">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding"><%= scope.textFillColor %></div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="page" data-page="edit-fill-color">
<div class="page-content">
</div>
</div>
</div>
<!-- Text Format view -->
<div id="edit-text-format">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding"><%= scope.textTextFormat %></div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="page" data-page="edit-text-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-halign" value="left">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Left</div>
</div>
</label>
</li>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-halign" value="center">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Center</div>
</div>
</label>
</li>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-halign" value="right">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Right</div>
</div>
</label>
</li>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-halign" value="justified">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Justified</div>
</div>
</label>
</li>
</ul>
</div>
<div class="list-block">
<ul>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-valign" value="top">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Top</div>
</div>
</label>
</li>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-valign" value="middle">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Middle</div>
</div>
</label>
</li>
<li>
<label class="label-radio item-content">
<input type="radio" name="text-valign" value="bottom">
<% if (android) { %>
<div class="item-media"><i class="icon icon-form-radio"></i></div>
<% } else { %>
<div class="item-media"><i class="icon icon-wrap-inline"></i></div>
<% } %>
<div class="item-inner">
<div class="item-title">Align Bottom</div>
</div>
</label>
</li>
</ul>
</div>
<div class="list-block">
<ul>
<li id="edit-cell-wrap-text">
<div class="item-content">
<% if (!android) { %><div class="item-media"><i class="icon icon-text-additional"></i></div><% } %>
<div class="item-inner">
<div class="item-title">Wrap Text</div>
<div class="item-after">
<label class="label-switch">
<input type="checkbox">
<div class="checkbox"></div>
</label>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Border Styles view -->
<div id="edit-border-style">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Border Style</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-border-style">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-none"></i></div>
<div class="item-inner"><div class="item-title">No Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="lrtbcm" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-all"></i></div>
<div class="item-inner"><div class="item-title">All Borders</div></div>
</div>
</a>
</li>
<li>
<a data-type="b" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-bottom"></i></div>
<div class="item-inner"><div class="item-title">Bottom Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="t" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-top"></i></div>
<div class="item-inner"><div class="item-title">Top Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="l" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-left"></i></div>
<div class="item-inner"><div class="item-title">Left Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="r" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-right"></i></div>
<div class="item-inner"><div class="item-title">Right Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="cm" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-inner"></i></div>
<div class="item-inner"><div class="item-title">Inside Borders</div></div>
</div>
</a>
</li>
<li>
<a data-type="c" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-center"></i></div>
<div class="item-inner"><div class="item-title">Inside Vertical Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="m" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-middle"></i></div>
<div class="item-inner"><div class="item-title">Inside Horizontal Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="u" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-"></i></div>
<div class="item-inner"><div class="item-title">Diagonal Up Border</div></div>
</div>
</a>
</li>
<li>
<a data-type="d" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-table-borders-"></i></div>
<div class="item-inner"><div class="item-title">Diagonal Down Border</div></div>
</div>
</a>
</li>
</ul>
</div>
<div class="content-block-title">Style</div>
<div class="list-block">
<ul>
<li>
<a id="edit-cell-border-color" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Color</div>
<div class="item-after"><div class="color-preview"></div></div>
</div>
</div>
</a>
</li>
<li>
<a id="edit-cell-border-size" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Size</div>
<div class="item-after">Thin</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Cell Format view -->
<div id="edit-cell-format">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Format</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-cell-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">General</div></div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Number</div></div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Integer</div></div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Scientific</div></div>
</div>
</a>
</li>
<li>
<a class="item-link" data-page="#edit-cell-format-accounting">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Accounting</div></div>
</div>
</a>
</li>
<li>
<a class="item-link" data-page="#edit-cell-format-currency">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Currency</div></div>
</div>
</a>
</li>
<li>
<a class="item-link" data-page="#edit-cell-format-date">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Date</div></div>
</div>
</a>
</li>
<li>
<a class="item-link" data-page="#edit-cell-format-time">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Time</div></div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Percentage</div></div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-media"><i class="icon icon-search"></i></div>
<div class="item-inner"><div class="item-title">Text</div></div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Cell Format Accounting view -->
<div id="edit-cell-format-accounting">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Accounting</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-cell-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Dollar</div>
<div class="item-after">$</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Euro</div>
<div class="item-after">€</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Pound</div>
<div class="item-after">£</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Rouble</div>
<div class="item-after">₽</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Yen</div>
<div class="item-after">¥</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Cell Format Accounting view -->
<div id="edit-cell-format-currency">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Currency</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-cell-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Dollar</div>
<div class="item-after">$</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Euro</div>
<div class="item-after">€</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Pound</div>
<div class="item-after">£</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Rouble</div>
<div class="item-after">₽</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Yen</div>
<div class="item-after">¥</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Cell Format Date view -->
<div id="edit-cell-format-date">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Date</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-cell-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">07-24-88</div>
<div class="item-after">MM-dd-yy</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">07-24-1988</div>
<div class="item-after">MM-dd-yyyy</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">24-07-88</div>
<div class="item-after">dd-MM-yy</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">24-07-1988</div>
<div class="item-after">dd-MM-yyyy</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">24-Jul-1988</div>
<div class="item-after">dd-MMM-yyyy</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">24-Jul</div>
<div class="item-after">dd-MMM</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Jul-88</div>
<div class="item-after">MMM-yy</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Cell Format Time view -->
<div id="edit-cell-format-time">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></a></div>
<div class="center sliding">Time</div>
<div class="right"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="edit-cell-format">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">10:56</div>
<div class="item-after">HH:mm</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">21:56:00</div>
<div class="item-after">HH:MM:ss</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">05:56 AM</div>
<div class="item-after">hh:mm tt</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">05:56:00 AM</div>
<div class="item-after">hh:mm:ss tt</div>
</div>
</div>
</a>
</li>
<li>
<a data-type="" class="item-link no-indicator">
<div class="item-content">
<div class="item-inner">
<div class="item-title">38:56:00</div>
<div class="item-after">[h]:mm:ss</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
/*
*
* (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
*
*/
/**
* EditCell.js
* Spreadsheet Editor
*
* Created by Alexander Yuzhin on 12/6/16
* Copyright (c) 2016 Ascensio System SIA. All rights reserved.
*
*/
define([
'text!spreadsheeteditor/mobile/app/template/EditCell.template',
'jquery',
'underscore',
'backbone',
'common/mobile/lib/component/ThemeColorPalette'
], function (editTemplate, $, _, Backbone) {
'use strict';
SSE.Views.EditCell = Backbone.View.extend(_.extend((function() {
// private
var _fontsList,
_editTextController;
return {
// el: '.view-main',
template: _.template(editTemplate),
events: {
},
initialize: function () {
_editTextController = SSE.getController('EditCell');
Common.NotificationCenter.on('editcontainer:show', _.bind(this.initEvents, this));
this.on('page:show', _.bind(this.updateItemHandlers, this));
},
initEvents: function () {
var me = this;
me.updateItemHandlers();
// $('#font-fonts').single('click', _.bind(me.showFonts, me));
// $('#font-color').single('click', _.bind(me.showFontColor, me));
// $('#font-background').single('click', _.bind(me.showBackgroundColor, me));
// $('#font-additional').single('click', _.bind(me.showAdditional, me));
// $('#font-line-spacing').single('click', _.bind(me.showLineSpacing, me));
// $('#font-bullets').single('click', _.bind(me.showBullets, me));
// $('#font-numbers').single('click', _.bind(me.showNumbers, me));
me.initControls();
},
// Render layout
render: function () {
this.layout = $('<div/>').append(this.template({
android : Common.SharedSettings.get('android'),
phone : Common.SharedSettings.get('phone'),
scope : this
}));
return this;
},
rootLayout: function () {
if (this.layout) {
return this.layout
.find('#edit-cell-root')
.html();
}
return '';
},
initControls: function () {
//
},
updateItemHandlers: function () {
$('.container-edit a.item-link').single('click', _.bind(this.onItemClick, this));
},
showPage: function (templateId, suspendEvent) {
var rootView = SSE.getController('EditContainer').rootView;
if (rootView && this.layout) {
var $content = this.layout.find(templateId);
// Android fix for navigation
if (Framework7.prototype.device.android) {
$content.find('.page').append($content.find('.navbar'));
}
rootView.router.load({
content: $content.html()
});
if (suspendEvent !== true) {
this.fireEvent('page:show', [this, templateId]);
}
}
},
onItemClick: function (e) {
var $target = $(e.currentTarget),
page = $target.data('page');
if (page && page.length > 0 ) {
this.showPage(page);
}
},
showFonts: function () {
this.showPage('#edit-text-fonts');
var me = this,
$template = $(
'<div>' +
'<li>' +
'<label class="label-radio item-content">' +
'<input type="radio" name="font-name" value="{{name}}">' +
(Framework7.prototype.device.android ? '<div class="item-media"><i class="icon icon-form-radio"></i></div>' : '') +
'<div class="item-inner">' +
'<div class="item-title" style="font-family: \'{{name}}\';">{{name}}</div>' +
'</div>' +
'</label>' +
'</li>' +
'</div>'
);
_fontsList = uiApp.virtualList('#font-list.virtual-list', {
items: SSE.getController('EditCell').getFonts(),
template: $template.html(),
onItemsAfterInsert: function (list, fragment) {
var fontInfo = _editTextController.getFontInfo();
$('#font-list input[name=font-name]').val([fontInfo.name]);
$('#font-list li').single('click', _.buffered(function (e) {
me.fireEvent('font:click', [me, e]);
}, 100));
}
});
},
showFontColor: function () {
this.showPage('#edit-text-color', true);
this.paletteTextColor = new Common.UI.ThemeColorPalette({
el: $('.page[data-page=edit-text-font-color] .page-content')
});
this.fireEvent('page:show', [this, '#edit-text-color']);
},
showBackgroundColor: function () {
this.showPage('#edit-text-background', true);
this.paletteBackgroundColor = new Common.UI.ThemeColorPalette({
el: $('.page[data-page=edit-text-font-background] .page-content'),
transparent: true
});
this.fireEvent('page:show', [this, '#edit-text-background']);
},
showAdditional: function () {
this.showPage('#edit-text-additional');
},
showLineSpacing: function () {
this.showPage('#edit-text-linespacing');
},
showBullets: function () {
this.showPage('#edit-text-bullets');
},
showNumbers: function () {
this.showPage('#edit-text-numbers');
},
textBack: 'Back',
textFonts: 'Fonts',
textTextColor: 'Text Color',
textFillColor: 'Fill Color',
textTextFormat: 'Text Format',
textBorderStyle: 'Border Style',
textSize: 'Size',
textFontColors: 'Font Colors',
textAutomatic: 'Automatic',
textHighlightColors: 'Highlight Colors',
textAdditional: 'Additional',
textStrikethrough: 'Strikethrough',
textDblStrikethrough: 'Double Strikethrough',
textDblSuperscript: 'Superscript',
textSubscript: 'Subscript',
textSmallCaps: 'Small Caps',
textAllCaps: 'All Caps',
textLetterSpacing: 'Letter Spacing',
textLineSpacing: 'Line Spacing',
textBullets: 'Bullets',
textNone: 'None',
textNumbers: 'Numbers'
}
})(), SSE.Views.EditCell || {}))
});
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment