Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[se mobile] added color schemes

Browse source
This commit is contained in:
Julia Svinareva 2019-04-17 10:34:01 +03:00
parent 9d9afccc11
commit ea65f55d58
8 changed files with 163 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
apps/spreadsheeteditor/mobile/app/controller/Settings.js
View file

@ -52,7 +52,8 @@ define([
inProgress,
infoObj,
modalView,
_licInfo;
_licInfo,
templateInsert;
return {
models: [],
@ -78,6 +79,7 @@ define([
setApi: function (api) {
var me = this;
me.api = api;
me.api.asc_registerCallback('asc_onSendThemeColorSchemes', _.bind(me.onSendThemeColorSchemes, me));
},
onLaunch: function () {
@ -160,6 +162,33 @@ define([
me.setLicInfo(_licInfo);
} else if ('#settings-application-view' == pageId) {
me.initPageApplicationSettings();
} else if ('#color-schemes-view' == pageId) {
me.initPageColorSchemes();
}
},
initPageColorSchemes: function() {
$('#color-schemes-content').html(templateInsert);
$('.color-schemes-menu').on('click', _.bind(this.onColorSchemaClick, this));
},
onSendThemeColorSchemes: function (schemas) {
templateInsert = "";
_.each(schemas, function (schema, index) {
var colors = schema.get_colors();//schema.colors;
templateInsert = templateInsert + "<a class='color-schemes-menu item-link no-indicator'><input type='hidden' value='" + index + "'><div class='item-content'><div class='item-inner'><span class='color-schema-block'>";
for (var j = 2; j < 7; j++) {
var clr = '#' + Common.Utils.ThemeColor.getHexColor(colors[j].get_r(), colors[j].get_g(), colors[j].get_b());
templateInsert = templateInsert + "<span class='color' style='background: " + clr + ";'></span>"
}
templateInsert = templateInsert + "</span><span class='text'>" + schema.get_name() + "</span></div></div></a>";
}, this);
},
onColorSchemaClick: function(event) {
if (this.api) {
var ind = $(event.currentTarget).children('input').val();
this.api.asc_ChangeColorScheme(ind);
}
},

60
apps/spreadsheeteditor/mobile/app/template/Settings.template
View file

@ -49,6 +49,18 @@
</div>
</a>
</li>
<li>
<a id="settings-spreadsheet" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-print"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textSpreadsheetSettings %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-application" class="item-link">
<div class="item-content">
@ -394,4 +406,52 @@
</div>
</div>
</div>
</div>
<div id="settings-spreadsheet-view">
<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.textSpreadsheetSettings %></div>
</div>
</div>
<div class="page" id="page-settings-spreadsheet-view" data-page="settings-spreadsheet-view">
<div class="page-content">
<div class="list-block media-list">
<ul>
<li>
<a id="color-schemes" class="item-link item-content">
<div class="item-inner">
<div class="item-title-row">
<div class="item-title"><%= scope.textColorSchemes %></div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Color schemes view -->
<div id="color-schemes-view">
<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.textColorSchemes %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="color-schemes-view">
<div class="page-content">
<div id="color-schemes-content" class="list-block">
</div>
</div>
</div>
</div>
</div>

14
apps/spreadsheeteditor/mobile/app/view/Settings.js
View file

@ -80,6 +80,7 @@ define([
$('#settings-help').single('click', _.bind(me.showHelp, me));
$('#settings-about').single('click', _.bind(me.showAbout, me));
$('#settings-application').single('click', _.bind(me.showSetApp, me));
$('#settings-spreadsheet').single('click', _.bind(me.showSetSpreadsheet, me));
Common.Utils.addScrollIfNeed('.view[data-page=settings-root-view] .pages', '.view[data-page=settings-root-view] .page');
me.initControls();
@ -167,6 +168,15 @@ define([
this.showPage('#settings-application-view');
},
showColorSchemes: function () {
this.showPage('#color-schemes-view');
},
showSetSpreadsheet: function () {
this.showPage('#settings-spreadsheet-view');
$('#color-schemes').single('click', _.bind(this.showColorSchemes, this));
},
showDocumentInfo: function() {
this.showPage('#settings-info-view');
@ -235,7 +245,9 @@ define([
textUnitOfMeasurement: 'Unit of Measurement',
textCentimeter: 'Centimeter',
textPoint: 'Point',
textInch: 'Inch'
textInch: 'Inch',
textSpreadsheetSettings: 'Spreadsheet Settings',
textColorSchemes: 'Color Schemes'
}
})(), SSE.Views.Settings || {}))
});

12
apps/spreadsheeteditor/mobile/locale/en.json
View file

@ -512,11 +512,13 @@
"SSE.Views.Settings.textSettings": "Settings",
"SSE.Views.Settings.textTel": "tel",
"SSE.Views.Settings.textVersion": "Version",
"DE.Views.Settings.textApplicationSettings": "Application Settings",
"DE.Views.Settings.textUnitOfMeasurement": "Unit of Measurement",
"DE.Views.Settings.textCentimeter": "Centimeter",
"DE.Views.Settings.textPoint": "Point",
"DE.Views.Settings.textInch": "Inch",
"SSE.Views.Settings.textApplicationSettings": "Application Settings",
"SSE.Views.Settings.textUnitOfMeasurement": "Unit of Measurement",
"SSE.Views.Settings.textCentimeter": "Centimeter",
"SSE.Views.Settings.textPoint": "Point",
"SSE.Views.Settings.textInch": "Inch",
"SSE.Views.Settings.textColorSchemes": "Color Schemes",
"SSE.Views.Settings.textSpreadsheetSettings": "Spreadsheet Settings",
"SSE.Views.Settings.unknownText": "Unknown",
"SSE.Views.Toolbar.textBack": "Back"
}

25
apps/spreadsheeteditor/mobile/resources/css/app-ios.css
View file

@ -6239,6 +6239,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after
background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
margin-top: 20px;
}
.color-schemes-menu {
cursor: pointer;
display: block;
background-color: #fff;
}
.color-schemes-menu .item-content {
padding-left: 0;
}
.color-schemes-menu .item-inner {
justify-content: flex-start;
padding-left: 16px;
}
.color-schemes-menu .color-schema-block {
display: flex;
}
.color-schemes-menu .color {
min-width: 26px;
min-height: 26px;
margin: 0 2px 0 0;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
}
.color-schemes-menu .text {
margin-left: 20px;
color: #212121;
}
i.icon.icon-search {
width: 24px;
height: 24px;

25
apps/spreadsheeteditor/mobile/resources/css/app-material.css
View file

@ -5848,6 +5848,31 @@ html.phone .document-menu .list-block .item-link {
.about .logo {
background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
}
.color-schemes-menu {
cursor: pointer;
display: block;
background-color: #fff;
}
.color-schemes-menu .item-content {
padding-left: 0;
}
.color-schemes-menu .item-inner {
justify-content: flex-start;
padding-left: 16px;
}
.color-schemes-menu .color-schema-block {
display: flex;
}
.color-schemes-menu .color {
min-width: 26px;
min-height: 26px;
margin: 0 2px 0 0;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
}
.color-schemes-menu .text {
margin-left: 20px;
color: #212121;
}
.tablet .searchbar.document.replace .center > .replace {
display: flex;
}

2
apps/spreadsheeteditor/mobile/resources/less/app-ios.less
View file

@ -73,6 +73,8 @@ input, textarea {
@import url('../../../../common/mobile/resources/less/ios/_contextmenu.less');
@import url('../../../../common/mobile/resources/less/ios/_color-palette.less');
@import url('../../../../common/mobile/resources/less/ios/_about.less');
@import url('../../../../common/mobile/resources/less/ios/_color-schema.less');
@import url('ios/_icons.less');
@import url('app-common');

1
apps/spreadsheeteditor/mobile/resources/less/app-material.less
View file

@ -66,6 +66,7 @@ input, textarea {
@import url('../../../../common/mobile/resources/less/material/_contextmenu.less');
@import url('../../../../common/mobile/resources/less/material/_color-palette.less');
@import url('../../../../common/mobile/resources/less/material/_about.less');
@import url('../../../../common/mobile/resources/less/material/_color-schema.less');
@import url('material/_search.less');
@import url('material/_icons.less');