[SSE mobile] added page "Sort & Filter"

This commit is contained in:
Maxim Kadushkin 2016-12-16 19:49:25 +03:00
parent f8a23844bb
commit 4f9c256dee
6 changed files with 80 additions and 20 deletions

View file

@ -181,3 +181,46 @@
</div>
</div>
</div>
<!-- View for Sort&Filter -->
<div id="addother-sort">
<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.textSort %></div>
</div>
</div>
<div class="page">
<div class="page-content">
<div class="list-block">
<ul><li>
<div class="item-content buttons">
<div class="item-inner">
<div class="row">
<a class="button no-ripple"><i class="icon sortdown"></i></a>
<a class="button no-ripple"><i class="icon sortup"></i></a>
</div>
</div>
</div>
</li></ul>
</div>
<div class="list-block">
<ul>
<li id="paragraph-page-break">
<div class="item-content">
<div class="item-inner">
<div class="item-title"><%= scope.textFilter %></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>

View file

@ -62,8 +62,10 @@ define([
initEvents: function () {
var me = this;
$('#add-other-insimage').single('click', _.bind(me.showInsertImage, me));
$('#add-other-link').single('click', _.bind(me.showLink, me));
var $page = $('#add-other');
$page.find('#add-other-insimage').single('click', _.bind(me.showInsertImage, me));
$page.find('#add-other-link').single('click', _.bind(me.showLink, me));
$page.find('#add-other-sort').single('click', _.bind(me.showSortPage, me));
me.initControls();
},
@ -135,6 +137,10 @@ define([
$('#add-link-insert').single('click', _.buffered(this.clickInsertLink, 100, this));
},
showSortPage: function (e) {
this.showPage('#addother-sort');
},
clickInsertLink: function (e) {
var url = $('#add-link-url input').val(),
display = $('#add-link-display input').val(),
@ -170,23 +176,12 @@ define([
textDisplay: 'Display',
textTip: 'Screen Tip',
textInsert: 'Insert',
textPosition: 'Position',
textLeftTop: 'Left Top',
textCenterTop: 'Center Top',
textRightTop: 'Right Top',
textLeftBottom: 'Left Bottom',
textCenterBottom: 'Center Bottom',
textRightBottom: 'Right Bottom',
textCurrentPos: 'Current Position',
textNextPage: 'Next Page',
textContPage: 'Continuous Page',
textEvenPage: 'Even Page',
textOddPage: 'Odd Page'
, textFromLibrary: 'Picture from Library'
, textFromURL: 'Picture from URL'
, textLinkSettings: 'Link Settings'
, textAddress: 'Address'
, textImageURL: 'Image URL'
textFromLibrary: 'Picture from Library',
textFromURL: 'Picture from URL',
textLinkSettings: 'Link Settings',
textAddress: 'Address',
textImageURL: 'Image URL',
textFilter: 'Filter'
}
})(), SSE.Views.AddOther || {}))
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 436 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 438 B

View file

@ -164,6 +164,17 @@ i.icon {
height: 28px;
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28" fill="@{themeColor}"><g><path opacity="0.3" d="M1,1V13H13V1H1ZM12,12H2V2H12V12Z"/><path opacity="0.3" d="M15,15V27H27V15H15ZM26,26H16V16H26V26Z"/><rect x="8" y="8" width="13" height="13"/></g></svg>');
}
&.sortdown {
width: 22px;
height: 22px;
background-image: url(../img/sort-a-z.png);
}
&.sortup {
width: 22px;
height: 22px;
background-image: url(../img/sort-z-a.png);
}
}
.chart-types .thumb {

View file

@ -113,6 +113,17 @@ i.icon {
height: 28px;
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28" fill="@{themeColor}"><g><path opacity="0.3" d="M1,1V13H13V1H1ZM12,12H2V2H12V12Z"/><path opacity="0.3" d="M15,15V27H27V15H15ZM26,26H16V16H26V26Z"/><rect x="8" y="8" width="13" height="13"/></g></svg>');
}
&.sortdown {
width: 22px;
height: 22px;
background-image: url(../img/sort-a-z.png);
}
&.sortup {
width: 22px;
height: 22px;
background-image: url(../img/sort-z-a.png);
}
}
// Overwrite color for toolbar