CMFM: Make the sort dialog pretty

Change-Id: I5b53589b15b059f257b1c22ad06ac0efa3864fdd

14 files changed, 581 insertions, 46 deletions

diff --git a/res/drawable/ic_sort_abc.xml b/res/drawable/ic_sort_abc.xml
new file mode 100644
index 00000000..c8fa28b7
--- /dev/null
+++ b/res/drawable/ic_sort_abc.xml
@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M2,9v8h2v-4h2v4h2V9c0-1.1-0.9-2-2-2H4C2.9,7,2,7.9,2,9z M6,11H4V9h2V11z M18,9v6
+h4v2h-4c-1.1,0-2-0.9-2-2V9c0-1.1,0.9-2,2-2h4v2H18z
+M15,11V9c0-1.1-0.9-2-2-2H9v10h2h2c1.1,0,2-0.9,2-2v-2c0-0.6-0.4-1-1-1
+C14.6,12,15,11.6,15,11z M11,9h2v2h-2V9z M13,15h-2v-2h2V15z" />
+</vector>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_asc.xml b/res/drawable/ic_sort_asc.xml
new file mode 100644
index 00000000..92054f7b
--- /dev/null
+++ b/res/drawable/ic_sort_asc.xml
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M18,17c0-1.1,0.9-2,2-2c1.1,0,2,0.9,2,2s-0.9,2-2,2C18.9,19,18,18.1,18,17z
+M12,19c1.1,0,2-0.9,2-2s-0.9-2-2-2s-2,0.9-2,2S10.9,19,12,19z
+M4,19c1.1,0,2-0.9,2-2s-0.9-2-2-2s-2,0.9-2,2S2.9,19,4,19z M16,13
+c1.1,0,2-0.9,2-2s-0.9-2-2-2s-2,0.9-2,2S14.9,13,16,13z
+M8,13c1.1,0,2-0.9,2-2S9.1,9,8,9s-2,0.9-2,2S6.9,13,8,13z M12,7
+c1.1,0,2-0.9,2-2s-0.9-2-2-2s-2,0.9-2,2S10.9,7,12,7z" />
+</vector>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_date.xml b/res/drawable/ic_sort_date.xml
new file mode 100644
index 00000000..e515cf1c
--- /dev/null
+++ b/res/drawable/ic_sort_date.xml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M16,1v2H8V1H6v2H5C3.9,3,3,3.9,3,5l0,14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5c0-1.1-0.9-2-2-2h-1V1H16z
+M19,19H5V8h14V19z" />
+</vector>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_desc.xml b/res/drawable/ic_sort_desc.xml
new file mode 100644
index 00000000..7398c3f3
--- /dev/null
+++ b/res/drawable/ic_sort_desc.xml
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M6,7c0,1.1-0.9,2-2,2S2,8.1,2,7s0.9-2,2-2S6,5.9,6,7z M12,5c-1.1,0-2,0.9-2,2
+s0.9,2,2,2s2-0.9,2-2S13.1,5,12,5z
+M20,5c-1.1,0-2,0.9-2,2s0.9,2,2,2c1.1,0,2-0.9,2-2S21.1,5,20,5z
+M8,11c-1.1,0-2,0.9-2,2 s0.9,2,2,2s2-0.9,2-2S9.1,11,8,11z
+M16,11c-1.1,0-2,0.9-2,2s0.9,2,2,2s2-0.9,2-2S17.1,11,16,11z
+M12,17c-1.1,0-2,0.9-2,2s0.9,2,2,2 s2-0.9,2-2S13.1,17,12,17z" />
+</vector>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_selector.xml b/res/drawable/ic_sort_selector.xml
new file mode 100644
index 00000000..ea924991
--- /dev/null
+++ b/res/drawable/ic_sort_selector.xml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<shape
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="oval">
+
+    <solid
+        android:color="#607D8B"/>
+
+    <size
+        android:width="40dp"
+        android:height="40dp"/>
+</shape>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_size.xml b/res/drawable/ic_sort_size.xml
new file mode 100644
index 00000000..70e5e85b
--- /dev/null
+++ b/res/drawable/ic_sort_size.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M8,21H4V3h4V21z M14,9h-4v12h4V9z M20,15h-4v6h4V15z" />
+</vector>
\ No newline at end of file
diff --git a/res/drawable/ic_sort_type.xml b/res/drawable/ic_sort_type.xml
new file mode 100644
index 00000000..029dc200
--- /dev/null
+++ b/res/drawable/ic_sort_type.xml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2015 The CyanogenMod Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="#FFFFFF"
+        android:pathData="M20,22h-6c-1.1,0-2-0.9-2-2v-6c0-1.1,0.9-2,2-2h6c1.1,0,2,0.9,2,2v6
+C22,21.1,21.1,22,20,22z M7,2C4.2,2,2,4.2,2,7s2.2,5,5,5s5-2.2,5-5S9.8,2,7,2z" />
+</vector>
\ No newline at end of file
diff --git a/res/layout/sort_item.xml b/res/layout/sort_item.xml
new file mode 100644
index 00000000..d6d0fa7e
--- /dev/null
+++ b/res/layout/sort_item.xml
@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2015 The CyanogenMod Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+ -->
+<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+              android:orientation="vertical"
+              android:layout_width="match_parent"
+              android:layout_height="match_parent"
+              android:clipChildren="false"
+              android:paddingTop="6dp"
+              android:paddingBottom="2dp">
+
+    <ImageView
+        android:id="@+id/sort_item_icon"
+        android:layout_marginBottom="11dp"
+        android:layout_width="40dp"
+        android:layout_height="40dp"
+        android:layout_alignParentTop="true"
+        android:layout_centerHorizontal="true"
+        android:scaleType="center" />
+    <TextView
+        android:id="@+id/sort_item_title"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_below="@id/sort_item_icon"
+        android:layout_centerHorizontal="true"
+        android:textAlignment="center"
+        android:textSize="14sp"
+        android:textColor="@color/darker_black" />
+</RelativeLayout>
\ No newline at end of file
diff --git a/res/layout/sort_view_options.xml b/res/layout/sort_view_options.xml
new file mode 100644
index 00000000..1eea6bd2
--- /dev/null
+++ b/res/layout/sort_view_options.xml
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2015 The CyanogenMod Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+ -->
+<com.cyanogenmod.filemanager.dialogs.SortViewOptions
+    xmlns:android="http://schemas.android.com/apk/res/android"
+              android:layout_width="wrap_content"
+              android:layout_height="wrap_content"
+              android:orientation="vertical"
+              android:padding="12dp">
+
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_horizontal"
+        android:orientation="horizontal">
+        <include
+            android:id="@+id/sort_item_abc"
+            android:layout_width="64dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+        <include
+            android:id="@+id/sort_item_date"
+            android:layout_width="64dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+        <include
+            android:id="@+id/sort_item_size"
+            android:layout_width="64dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+        <include
+            android:id="@+id/sort_item_type"
+            android:layout_width="64dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+    </LinearLayout>
+
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_horizontal"
+        android:orientation="horizontal">
+        <include
+            android:id="@+id/sort_item_asc"
+            android:layout_width="104dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+        <include
+            android:id="@+id/sort_item_desc"
+            android:layout_width="104dp"
+            android:layout_height="80dp"
+            layout="@layout/sort_item" />
+    </LinearLayout>
+
+</com.cyanogenmod.filemanager.dialogs.SortViewOptions>
\ No newline at end of file
diff --git a/res/values/colors.xml b/res/values/colors.xml
index c3ac889e..a129ff9b 100644
--- a/res/values/colors.xml
+++ b/res/values/colors.xml
@@ -41,6 +41,9 @@
 
     <!-- A black color with some transparency -->
     <color name="black_transparent">#8a000000</color>
+
+    <color name="lighter_black">#42000000</color>
+    <color name="darker_black">#C9000000</color>
     <!-- A derivated blue from @color/material_palette_blue_primary with some transparency -->
     <color name="blue_transparent">#9933b5e5</color>
 
diff --git a/res/values/strings.xml b/res/values/strings.xml
index 2fcf6ab5..1be3cf14 100644
--- a/res/values/strings.xml
+++ b/res/values/strings.xml
@@ -181,6 +181,13 @@
     <!-- ActionBar Buttons - Print -->
     <string name="actionbar_button_print_cd">Print</string>
 
+    <string name="sort_options">Sort options</string>
+    <string name="sort_by_name">Name</string>
+    <string name="sort_by_date">Date</string>
+    <string name="sort_by_size">Size</string>
+    <string name="sort_by_type">Type</string>
+    <string name="sort_by_asc">Ascending</string>
+    <string name="sort_by_desc">Descending</string>
     <!-- Navigation View - Sort - Sort by name (ascending) -->
     <string name="sort_by_name_asc">By name \u25B2</string>
     <!-- Navigation View - Sort - Sort by name (descending) -->
diff --git a/src/com/cyanogenmod/filemanager/activities/MainActivity.java b/src/com/cyanogenmod/filemanager/activities/MainActivity.java
index 8b6627ef..945428f5 100755
--- a/src/com/cyanogenmod/filemanager/activities/MainActivity.java
+++ b/src/com/cyanogenmod/filemanager/activities/MainActivity.java
@@ -18,8 +18,10 @@ package com.cyanogenmod.filemanager.activities;
 
 import android.Manifest;
 import android.app.Activity;
+import android.app.AlertDialog;
 import android.app.Dialog;
 import android.app.FragmentTransaction;
+import android.content.DialogInterface;
 import android.content.Intent;
 import android.content.pm.PackageManager;
 import android.net.Uri;
@@ -43,6 +45,7 @@ import com.cyanogenmod.filemanager.FileManagerApplication;
 import com.cyanogenmod.filemanager.R;
 import com.cyanogenmod.filemanager.activities.preferences.SettingsPreferences;
 import com.cyanogenmod.filemanager.controllers.NavigationDrawerController;
+import com.cyanogenmod.filemanager.dialogs.SortViewOptions;
 import com.cyanogenmod.filemanager.model.Bookmark;
 import com.cyanogenmod.filemanager.model.FileSystemObject;
 import com.cyanogenmod.filemanager.preferences.FileManagerSettings;
@@ -50,6 +53,7 @@ import com.cyanogenmod.filemanager.preferences.Preferences;
 import com.cyanogenmod.filemanager.ui.ThemeManager;
 import com.cyanogenmod.filemanager.ui.fragments.HomeFragment;
 import com.cyanogenmod.filemanager.ui.fragments.NavigationFragment;
+import com.cyanogenmod.filemanager.util.DialogHelper;
 import com.cyanogenmod.filemanager.util.FileHelper;
 import com.cyanogenmod.filemanager.util.MimeTypeHelper.MimeTypeCategory;
 import com.cyanogenmod.filemanager.util.StorageHelper;
@@ -438,10 +442,20 @@ public class MainActivity extends ActionBarActivity
                 //Navigation view options
                 //######################
                 case com.cyanogenmod.filemanager.R.id.ab_sort_mode:
-                    ((NavigationFragment)currentFragment).showSettingsPopUp(view,
-                            java.util.Arrays.asList(
-                                    new FileManagerSettings[]{
-                                            FileManagerSettings.SETTINGS_SORT_MODE}));
+                    final SortViewOptions sortViewOptions = (SortViewOptions) getLayoutInflater()
+                            .inflate(R.layout.sort_view_options, null);
+                    AlertDialog dialog =  DialogHelper.createTwoButtonsDialog(this,
+                            R.string.ok, R.string.cancel, 0, getString(R.string.sort_options),
+                            sortViewOptions, new DialogInterface.OnClickListener() {
+                                @Override
+                                public void onClick(DialogInterface dialog, int which) {
+                                    if (which == DialogInterface.BUTTON_POSITIVE) {
+                                        ((NavigationFragment) currentFragment).updateSetting(
+                                                FileManagerSettings.SETTINGS_SORT_MODE, sortViewOptions.getSortId());
+                                    }
+                                }
+                            });
+                    dialog.show();
                     break;
                 case com.cyanogenmod.filemanager.R.id.ab_layout_mode:
                     ((NavigationFragment)currentFragment).showSettingsPopUp(view,
diff --git a/src/com/cyanogenmod/filemanager/dialogs/SortViewOptions.java b/src/com/cyanogenmod/filemanager/dialogs/SortViewOptions.java
new file mode 100644
index 00000000..2e503af3
--- /dev/null
+++ b/src/com/cyanogenmod/filemanager/dialogs/SortViewOptions.java
@@ -0,0 +1,194 @@
+/*
+ * Copyright (C) 2015 The CyanogenMod Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package com.cyanogenmod.filemanager.dialogs;
+
+import android.content.Context;
+import android.graphics.drawable.Drawable;
+import android.util.AttributeSet;
+import android.view.View;
+import android.widget.ImageView;
+import android.widget.LinearLayout;
+import android.widget.TextView;
+
+import com.cyanogenmod.filemanager.R;
+import com.cyanogenmod.filemanager.preferences.FileManagerSettings;
+import com.cyanogenmod.filemanager.preferences.NavigationSortMode;
+import com.cyanogenmod.filemanager.preferences.ObjectIdentifier;
+import com.cyanogenmod.filemanager.preferences.Preferences;
+
+public class SortViewOptions extends LinearLayout {
+    private Drawable mSelectedShape;
+    private int mSelectedTextColor;
+    private int mUnselectedTextColor;
+
+    private IconGroup mGroupABC;
+    private IconGroup mGroupDate;
+    private IconGroup mGroupSize;
+    private IconGroup mGroupType;
+    private IconGroup mGroupAsc;
+    private IconGroup mGroupDesc;
+
+    private IconGroup[] mTopGroup;
+    private IconGroup[] mBottomGroup;
+
+    /**
+     * Holds points to the different views and sort types for an icon group
+     * so that when the user selects it, we can quickly change the ui
+     */
+    private class IconGroup {
+        public View mGroup;
+        public ImageView mIcon;
+        public TextView mText;
+        public NavigationSortMode mAsc;
+        public NavigationSortMode mDesc;
+        public boolean mSelected;
+
+        public void setSelected(boolean selected) {
+            if (selected) {
+                mIcon.setBackground(mSelectedShape);
+                mIcon.setColorFilter(null);
+                mText.setTextColor(mSelectedTextColor);
+                mSelected = true;
+            } else {
+                mIcon.setBackground(null);
+                mIcon.setColorFilter(R.color.lighter_black);
+                mText.setTextColor(mUnselectedTextColor);
+                mSelected = false;
+            }
+        }
+    }
+
+    /**
+     * Group click listener than deselects all other items when an item is clicked
+     */
+    private class GroupClickListener implements View.OnClickListener {
+        private IconGroup[] mIconGroup;
+        public GroupClickListener(IconGroup[] iconGroup) {
+            mIconGroup = iconGroup;
+        }
+
+        @Override
+        public void onClick(View v) {
+            for (IconGroup ig : mIconGroup) {
+                ig.setSelected(ig.mGroup == v);
+            }
+        }
+    };
+
+    public SortViewOptions(Context context, AttributeSet attrs) {
+        super(context, attrs);
+
+        init();
+    }
+
+    public SortViewOptions(Context context, AttributeSet attrs, int defStyleAttr) {
+        super(context, attrs, defStyleAttr);
+        init();
+    }
+
+    private void init() {
+        mSelectedShape = getResources().getDrawable(R.drawable.ic_sort_selector);
+        mSelectedTextColor = getResources().getColor(R.color.darker_black);
+        mUnselectedTextColor = getResources().getColor(R.color.lighter_black);
+    }
+
+    @Override
+    protected void onFinishInflate() {
+        super.onFinishInflate();
+
+        boolean asc = true;
+        int defaultId = ((ObjectIdentifier) FileManagerSettings.SETTINGS_SORT_MODE
+                .getDefaultValue()).getId();
+        int selected = Preferences.getSharedPreferences()
+                .getInt(FileManagerSettings.SETTINGS_SORT_MODE.getId(), defaultId);
+        NavigationSortMode selectedSortMode = NavigationSortMode.fromId(selected);
+
+        mGroupABC = setupIcon(this, R.id.sort_item_abc, R.drawable.ic_sort_abc,
+                R.string.sort_by_name, NavigationSortMode.NAME_ASC, NavigationSortMode.NAME_DESC);
+        mGroupDate = setupIcon(this, R.id.sort_item_date, R.drawable.ic_sort_date,
+                R.string.sort_by_date, NavigationSortMode.DATE_ASC, NavigationSortMode.DATE_DESC);
+        mGroupSize = setupIcon(this, R.id.sort_item_size, R.drawable.ic_sort_size,
+                R.string.sort_by_size, NavigationSortMode.SIZE_ASC, NavigationSortMode.SIZE_DESC);
+        mGroupType = setupIcon(this, R.id.sort_item_type, R.drawable.ic_sort_type,
+                R.string.sort_by_type, NavigationSortMode.TYPE_ASC, NavigationSortMode.TYPE_DESC);
+
+        mTopGroup = new IconGroup[] {
+                mGroupABC,
+                mGroupDate,
+                mGroupSize,
+                mGroupType,
+        };
+
+        final GroupClickListener topClickListener = new GroupClickListener(mTopGroup);
+        for (IconGroup ig : mTopGroup) {
+            ig.mGroup.setOnClickListener(topClickListener);
+            if (ig.mAsc == selectedSortMode || ig.mDesc == selectedSortMode) {
+                asc = (ig.mAsc == selectedSortMode);
+                ig.setSelected(true);
+            }
+        }
+
+        mGroupAsc = setupIcon(this, R.id.sort_item_asc, R.drawable.ic_sort_asc,
+                R.string.sort_by_asc, null, null);
+        mGroupDesc = setupIcon(this, R.id.sort_item_desc, R.drawable.ic_sort_desc,
+                R.string.sort_by_desc, null, null);
+
+        mBottomGroup = new IconGroup[] {
+                mGroupAsc,
+                mGroupDesc,
+        };
+
+        final GroupClickListener botClickListener = new GroupClickListener(mBottomGroup);
+        for (IconGroup ig : mBottomGroup) {
+            ig.mGroup.setOnClickListener(botClickListener);
+        }
+
+        mBottomGroup[asc ? 0 : 1].setSelected(true);
+    }
+
+    private IconGroup setupIcon(View view, int groupId, int imageDrawableId, int textId,
+                                NavigationSortMode asc, NavigationSortMode desc) {
+        IconGroup iconGroup = new IconGroup();
+        iconGroup.mGroup = view.findViewById(groupId);
+        iconGroup.mIcon = (ImageView)iconGroup.mGroup.findViewById(R.id.sort_item_icon);
+        iconGroup.mText = (TextView)iconGroup.mGroup.findViewById(R.id.sort_item_title);
+
+        iconGroup.mIcon.setImageDrawable(getResources().getDrawable(imageDrawableId));
+        iconGroup.mText.setText(getResources().getString(textId));
+
+        iconGroup.mAsc = asc;
+        iconGroup.mDesc = desc;
+
+        // default the group to false first
+        iconGroup.setSelected(false);
+
+        return iconGroup;
+    }
+
+    /**
+     * @return the id of the NavigationSortMode that the user selected
+     */
+    public int getSortId() {
+        boolean ascending = mGroupAsc.mSelected;
+        for (IconGroup ig : mTopGroup) {
+            if (ig.mSelected) {
+                return ascending ? ig.mAsc.getId() : ig.mDesc.getId();
+            }
+        }
+
+        return NavigationSortMode.NAME_ASC.getId();
+    }
+}
diff --git a/src/com/cyanogenmod/filemanager/ui/fragments/NavigationFragment.java b/src/com/cyanogenmod/filemanager/ui/fragments/NavigationFragment.java
index c34cca37..00acc2cf 100644
--- a/src/com/cyanogenmod/filemanager/ui/fragments/NavigationFragment.java
+++ b/src/com/cyanogenmod/filemanager/ui/fragments/NavigationFragment.java
@@ -87,6 +87,7 @@ import com.cyanogenmod.filemanager.console.NoSuchFileOrDirectory;
 import com.cyanogenmod.filemanager.console.VirtualConsole;
 import com.cyanogenmod.filemanager.console.VirtualMountPointConsole;
 import com.cyanogenmod.filemanager.console.secure.SecureConsole;
+import com.cyanogenmod.filemanager.dialogs.SortViewOptions;
 import com.cyanogenmod.filemanager.listeners.OnHistoryListener;
 import com.cyanogenmod.filemanager.listeners.OnRequestRefreshListener;
 import com.cyanogenmod.filemanager.model.Bookmark;
@@ -1886,6 +1887,55 @@ public class NavigationFragment extends Fragment
     }
 
     /**
+     * Updates the {@link FileManagerSettings} to the value passed in and refreshes the view
+     *
+     * @param setting {@link FileManagerSettings} to modify
+     * @param value The value to set the setting to
+     */
+    public void updateSetting(FileManagerSettings setting, final int value) {
+        try {
+            if (setting.compareTo(FileManagerSettings.SETTINGS_LAYOUT_MODE) == 0) {
+                //Need to change the layout
+                getCurrentNavigationView().changeViewMode(
+                        NavigationLayoutMode.fromId(value));
+            } else {
+                //Save and refresh
+                if (setting.getDefaultValue() instanceof Enum<?>) {
+                    //Enumeration
+                    Preferences.savePreference(setting, new ObjectIdentifier() {
+                        @Override
+                        public int getId() {
+                            return value;
+                        }
+                    }, false);
+                } else {
+                    //Boolean
+                    boolean newval =
+                            Preferences.getSharedPreferences().
+                                    getBoolean(
+                                            setting.getId(),
+                                            ((Boolean)setting.getDefaultValue()).booleanValue());
+                    Preferences.savePreference(setting, Boolean.valueOf(!newval), false);
+                }
+                getCurrentNavigationView().refresh();
+            }
+        } catch (Exception e) {
+            Log.e(TAG, "Error applying navigation option", e); //$NON-NLS-1$
+            this.mHandler.post(new Runnable() {
+                @Override
+                public void run() {
+                    DialogHelper.showToast(
+                            getActivity(),
+                            R.string.msgs_settings_save_failure, Toast.LENGTH_SHORT);
+                }
+            });
+
+        } finally {
+            getCurrentNavigationView().getCustomTitle().restoreView();
+        }
+    }
+
+    /**
      * Method that shows a popup with a menu associated a {@link FileManagerSettings}.
      *
      * @param anchor The action button that was pressed
@@ -1905,48 +1955,9 @@ public class NavigationFragment extends Fragment
                 final int value = ((MenuSettingsAdapter)parent.getAdapter()).getId(position);
                 mPopupWindow.dismiss();
                 mPopupWindow = null;
-                try {
-                    if (setting.compareTo(FileManagerSettings.SETTINGS_LAYOUT_MODE) == 0) {
-                        //Need to change the layout
-                        getCurrentNavigationView().changeViewMode(
-                                NavigationLayoutMode.fromId(value));
-                    } else {
-                        //Save and refresh
-                        if (setting.getDefaultValue() instanceof Enum<?>) {
-                            //Enumeration
-                            Preferences.savePreference(setting, new ObjectIdentifier() {
-                                @Override
-                                public int getId() {
-                                    return value;
-                                }
-                            }, false);
-                        } else {
-                            //Boolean
-                            boolean newval =
-                                    Preferences.getSharedPreferences().
-                                        getBoolean(
-                                            setting.getId(),
-                                            ((Boolean)setting.getDefaultValue()).booleanValue());
-                            Preferences.savePreference(setting, Boolean.valueOf(!newval), false);
-                        }
-                        getCurrentNavigationView().refresh();
-                    }
-                } catch (Exception e) {
-                    Log.e(TAG, "Error applying navigation option", e); //$NON-NLS-1$
-                    NavigationFragment.this.mHandler.post(new Runnable() {
-                        @Override
-                        public void run() {
-                            DialogHelper.showToast(
-                                    getActivity(),
-                                    R.string.msgs_settings_save_failure, Toast.LENGTH_SHORT);
-                        }
-                    });
-
-                } finally {
-                    adapter.dispose();
-                    getCurrentNavigationView().getCustomTitle().restoreView();
-                }
-
+ 
+                updateSetting(setting, value);
+                adapter.dispose();
             }
         });
         mPopupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {