[SSE mobile] added page "Sort & Filter"

apps/spreadsheeteditor/mobile/app/template/AddOther.template

@@ -180,4 +180,47 @@
             </div>
         </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>

apps/spreadsheeteditor/mobile/app/view/add/AddOther.js

@@ -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 || {}))
 });

apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less

@@ -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 {
@@ -242,4 +253,4 @@ i.icon {
   &.bar3dpsnormal {
     background-image: url('../img/charts/chart-20.png');
   }
-}
+}

apps/spreadsheeteditor/mobile/resources/less/material/_icons.less

@@ -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