Skip to content

W
web-apps
Commit bf9e0240 authored by Alexander Yuzhin's avatar Alexander Yuzhin
Browse files
Options

[SE mobile] Chart settings, layout.

parent 1b88f290
Hide whitespace changes
Inline Side-by-side
Showing with 178 additions and 2 deletions
apps/spreadsheeteditor/mobile/app/controller/edit/EditChart.js
View file @ bf9e0240
...@@ -138,6 +138,8 @@ define([ ...@@ -138,6 +138,8 @@ define([
me.initStylePage(); me.initStylePage();
} else if ('#edit-chart-border-color-view' == pageId) { } else if ('#edit-chart-border-color-view' == pageId) {
me.initBorderColorPage(); me.initBorderColorPage();
} else if ('#edit-chart-layout' == pageId) {
me.initLayoutPage();
} else if ('#edit-chart-reorder' == pageId) { } else if ('#edit-chart-reorder' == pageId) {
me.initReorderPage(); me.initReorderPage();
} else { } else {
...@@ -208,7 +210,34 @@ define([ ...@@ -208,7 +210,34 @@ define([
_borderInfo.color = me._sdkToThemeColor(stroke.get_color()); _borderInfo.color = me._sdkToThemeColor(stroke.get_color());
} }
$('#edit-chart-bordercolor .color-preview').css('background-color', ('transparent' == _borderInfo.color) ? _borderInfo.color : ('#' + (_.isObject(_borderInfo.color) ? _borderInfo.color.color : _borderInfo.color))) $('#edit-chart-bordercolor .color-preview').css('background-color',
('transparent' == _borderInfo.color)
? _borderInfo.color
: ('#' + (_.isObject(_borderInfo.color) ? _borderInfo.color.color : _borderInfo.color))
)
},
initLayoutPage: function () {
var me = this,
chartProperties = _chartObject.get_ChartProperties(),
$layoutPage = $('.page[data-page=edit-chart-layout]');
var setValue = function (id, value) {
var textValue = $layoutPage.find('select[name=' + id + ']')
.val(value)
.find('option[value='+ value +']')
.text();
$layoutPage.find('#' + id + ' .item-after').text(textValue);
};
setValue('chart-layout-title', chartProperties.getTitle());
setValue('chart-layout-legend', chartProperties.getLegendPos());
setValue('chart-layout-axis-title-horizontal', chartProperties.getHorAxisLabel());
setValue('chart-layout-axis-title-vertical', chartProperties.getVertAxisLabel());
setValue('chart-layout-gridlines-horizontal', chartProperties.getHorGridLines());
setValue('chart-layout-gridlines-vertical', chartProperties.getDataLabelsPos());
// TODO: Modify Data Labels position by chart type
}, },
initReorderPage: function () { initReorderPage: function () {
......
apps/spreadsheeteditor/mobile/app/template/EditChart.template
View file @ bf9e0240
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
</a> </a>
</li> </li>
<li> <li>
<a id="chart-layout" class="item-link"> <a id="chart-layout" class="item-link" data-page="#edit-chart-layout">
<div class="item-content"> <div class="item-content">
<div class="item-inner"> <div class="item-inner">
<div class="item-title">Layout</div> <div class="item-title">Layout</div>
...@@ -220,4 +220,151 @@ ...@@ -220,4 +220,151 @@
<!--Color palette--> <!--Color palette-->
</div> </div>
</div> </div>
</div>
<!-- Layout view -->
<div id="edit-chart-layout">
<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">Layout</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-chart-layout">
<div class="page-content">
<div class="list-block">
<ul>
<li>
<a id="chart-layout-title" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-title">
<option value="0" selected>None</option>
<option value="1">Overlay</option>
<option value="2">No Overlay</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Chart Title</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
<li>
<a id="chart-layout-legend" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-legend">
<option value="0" selected>None</option>
<option value="1">Left</option>
<option value="2">Top</option>
<option value="3">Right</option>
<option value="4">Bottom</option>
<option value="5">Left Overlay</option>
<option value="6">Right Overlay</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Legend</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="content-block-title">Axis Title</div>
<div class="list-block">
<ul>
<li>
<a id="chart-layout-axis-title-horizontal" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-axis-title-horizontal">
<option value="0" selected>None</option>
<option value="1">No Overlay</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Horizontal</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
<li>
<a id="chart-layout-axis-title-vertical" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-axis-title-vertical">
<option value="0" selected>None</option>
<option value="1">Rotated</option>
<option value="3">Horizontal</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Vertical</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="content-block-title">Gridlines</div>
<div class="list-block">
<ul>
<li>
<a id="chart-layout-gridlines-horizontal" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-gridlines-horizontal">
<option value="0" selected>None</option>
<option value="1">Major</option>
<option value="2">Minor</option>
<option value="3">Major and Minor</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Horizontal</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
<li>
<a id="chart-layout-gridlines-vertical" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-gridlines-vertical">
<option value="0" selected>None</option>
<option value="1">Major</option>
<option value="2">Minor</option>
<option value="3">Major and Minor</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Vertical</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="list-block">
<ul>
<li>
<a id="chart-layout-data-labels" class="item-link smart-select" data-back-on-select="true">
<select name="chart-layout-data-labels">
<option value="0" selected>None</option>
<option value="3">Center</option>
<option value="4">Inner Bottom</option>
<option value="5">Inner Top</option>
<option value="7">Outer Top</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Data Labels</div>
<div class="item-after">None</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div> </div>
\ No newline at end of file
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7