Implement display name editing

AndroidManifest.xml

@@ -152,7 +152,8 @@
             android:windowSoftInputMode="adjustResize" />
         <activity
             android:name="org.thoughtcrime.securesms.loki.redesign.activities.SettingsActivity"
-            android:launchMode="singleTask" />
+            android:launchMode="singleTask"
+            android:theme="@style/Session.DarkTheme.NoActionBar" />
         <activity
             android:name="org.thoughtcrime.securesms.loki.redesign.activities.QRCodeActivity"
             android:launchMode="singleTask" />

res/layout/activity_settings.xml

@@ -3,6 +3,7 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:scrollbars="none">
 
     <LinearLayout
@@ -12,29 +13,101 @@
         android:orientation="vertical"
         android:gravity="center_horizontal">
 
+        <android.support.v7.widget.Toolbar
+            android:id="@+id/toolbar"
+            android:layout_width="match_parent"
+            android:layout_height="?attr/actionBarSize"
+            android:minHeight="?attr/actionBarSize"
+            app:contentInsetLeft="20dp"
+            app:contentInsetRight="20dp"
+            android:theme="?attr/actionBarStyle">
+
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:gravity="center_vertical"
+                android:orientation="horizontal">
+
+                <ImageView
+                    android:id="@+id/cancelButton"
+                    android:layout_width="24dp"
+                    android:layout_height="24dp"
+                    android:src="@drawable/ic_close_white_24dp"
+                    android:visibility="gone" />
+
+                <TextView
+                    android:id="@+id/titleTextView"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:text="Settings"
+                    android:textColor="@color/text"
+                    android:textSize="@dimen/very_large_font_size"
+                    android:fontFamily="sans-serif-medium" />
+
+                <View
+                    android:layout_width="0dp"
+                    android:layout_height="match_parent"
+                    android:layout_weight="1" />
+
+                <ImageView
+                    android:id="@+id/saveButton"
+                    android:layout_width="24dp"
+                    android:layout_height="24dp"
+                    android:src="@drawable/ic_check_white_24dp"
+                    android:visibility="gone" />
+
+                <ImageView
+                    android:id="@+id/showQRCodeButton"
+                    android:layout_width="24dp"
+                    android:layout_height="24dp"
+                    android:src="@drawable/ic_qr_code" />
+
+            </LinearLayout>
+
+        </android.support.v7.widget.Toolbar>
+
         <org.thoughtcrime.securesms.loki.redesign.views.ProfilePictureView
             android:id="@+id/profilePictureView"
             android:layout_width="@dimen/large_profile_picture_size"
             android:layout_height="@dimen/large_profile_picture_size"
             android:layout_marginTop="@dimen/medium_spacing" />
 
+        <RelativeLayout
+            android:id="@+id/displayNameContainer"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginLeft="@dimen/large_spacing"
+            android:layout_marginTop="@dimen/small_spacing"
+            android:layout_marginRight="@dimen/large_spacing">
+
+            <EditText
+                style="@style/SessionEditText"
+                android:id="@+id/displayNameEditText"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_centerInParent="true"
+                android:paddingTop="12dp"
+                android:paddingBottom="12dp"
+                android:visibility="invisible"
+                android:hint="Enter a display name" />
+
             <TextView
                 android:id="@+id/displayNameTextView"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-            android:layout_marginLeft="@dimen/large_spacing"
+                android:layout_centerInParent="true"
-            android:layout_marginTop="@dimen/small_spacing"
-            android:layout_marginRight="@dimen/large_spacing"
                 android:textColor="@color/text"
                 android:textSize="@dimen/very_large_font_size"
                 android:textStyle="bold" />
 
+        </RelativeLayout>
+
         <org.thoughtcrime.securesms.loki.redesign.views.SeparatorView
             android:id="@+id/separatorView"
             android:layout_width="match_parent"
             android:layout_height="32dp"
             android:layout_marginLeft="@dimen/large_spacing"
-            android:layout_marginTop="@dimen/large_spacing"
+            android:layout_marginTop="20dp"
             android:layout_marginRight="@dimen/large_spacing"/>
 
         <TextView

res/values/dimens.xml

@@ -18,7 +18,7 @@
     <dimen name="medium_profile_picture_size">46dp</dimen>
     <dimen name="large_profile_picture_size">76dp</dimen>
     <dimen name="conversation_view_status_indicator_size">14dp</dimen>
-    <dimen name="border_thickness">2dp</dimen>
+    <dimen name="border_thickness">1dp</dimen>
     <dimen name="profile_picture_border_thickness">1dp</dimen>
     <dimen name="new_conversation_button_size">56dp</dimen>
     <dimen name="tab_bar_height">48dp</dimen>

res/values/styles.xml

@@ -35,7 +35,7 @@
         <item name="android:background">@drawable/prominent_filled_button_medium_background</item>
         <item name="android:textAllCaps">false</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/text</item>
     </style>
 
@@ -43,7 +43,7 @@
         <item name="android:background">@drawable/prominent_outline_button_medium_background</item>
         <item name="android:textAllCaps">false</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/accent</item>
     </style>
 
@@ -51,7 +51,7 @@
         <item name="android:background">@drawable/unimportant_filled_button_medium_background</item>
         <item name="android:textAllCaps">false</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/text</item>
     </style>
 
@@ -59,7 +59,7 @@
         <item name="android:background">@drawable/unimportant_outline_button_medium_background</item>
         <item name="android:textAllCaps">false</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/text</item>
     </style>
 
@@ -90,7 +90,7 @@
         <item name="android:paddingRight">@dimen/medium_spacing</item>
         <item name="android:paddingBottom">12dp</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/fake_chat_bubble_text</item>
         <item name="android:elevation">20dp</item>
     </style>
@@ -102,7 +102,7 @@
         <item name="android:paddingRight">@dimen/medium_spacing</item>
         <item name="android:paddingBottom">12dp</item>
         <item name="android:textSize">@dimen/medium_font_size</item>
-        <item name="android:textStyle">bold</item>
+        <item name="android:fontFamily">sans-serif-medium</item>
         <item name="android:textColor">@color/text</item>
         <item name="android:elevation">20dp</item>
     </style>

src/org/thoughtcrime/securesms/loki/redesign/activities/HomeActivity.kt

@@ -46,7 +46,7 @@ class HomeActivity : PassphraseRequiredActionBarActivity, ConversationClickListe
         super.onCreate(savedInstanceState, isReady)
         // Set content view
         setContentView(R.layout.activity_home)
-        // Set title
+        // Set custom toolbar
         setSupportActionBar(toolbar)
         // Set up Glide
         glide = GlideApp.with(this)

src/org/thoughtcrime/securesms/loki/redesign/activities/SettingsActivity.kt

@@ -5,20 +5,26 @@ import android.content.ClipboardManager
 import android.content.Context
 import android.content.Intent
 import android.os.Bundle
-import android.view.Menu
+import android.view.View
-import android.view.MenuItem
+import android.view.inputmethod.InputMethodManager
+import android.widget.LinearLayout
 import android.widget.Toast
 import kotlinx.android.synthetic.main.activity_settings.*
 import network.loki.messenger.R
+import org.thoughtcrime.securesms.ApplicationContext
 import org.thoughtcrime.securesms.PassphraseRequiredActionBarActivity
 import org.thoughtcrime.securesms.database.DatabaseFactory
 import org.thoughtcrime.securesms.loki.redesign.utilities.push
+import org.thoughtcrime.securesms.loki.toPx
 import org.thoughtcrime.securesms.mms.GlideApp
 import org.thoughtcrime.securesms.mms.GlideRequests
 import org.thoughtcrime.securesms.util.TextSecurePreferences
 
 class SettingsActivity : PassphraseRequiredActionBarActivity() {
     private lateinit var glide: GlideRequests
+    private var isEditingDisplayName = false
+        set(value) { field = value; handleIsEditingDisplayNameChanged() }
+    private var displayNameToBeUploaded: String? = null
 
     private val hexEncodedPublicKey: String
         get() {
@@ -32,8 +38,11 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
         super.onCreate(savedInstanceState, isReady)
         // Set content view
         setContentView(R.layout.activity_settings)
-        // Set title
+        // Set custom toolbar
-        supportActionBar!!.title = "Settings"
+        setSupportActionBar(toolbar)
+        cancelButton.setOnClickListener { cancelEditingDisplayName() }
+        saveButton.setOnClickListener { saveDisplayName() }
+        showQRCodeButton.setOnClickListener { showQRCode() }
         // Set up Glide
         glide = GlideApp.with(this)
         // Set up profile picture view
@@ -41,6 +50,8 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
         profilePictureView.hexEncodedPublicKey = hexEncodedPublicKey
         profilePictureView.isLarge = true
         profilePictureView.update()
+        // Set up display name container
+        displayNameContainer.setOnClickListener { showEditDisplayNameUI() }
         // Set up display name text view
         displayNameTextView.text = DatabaseFactory.getLokiUserDatabase(this).getDisplayName(hexEncodedPublicKey)
         // Set up public key text view
@@ -50,21 +61,53 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
         // Set up share button
         shareButton.setOnClickListener { sharePublicKey() }
     }
+    // endregion
 
-    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
+    // region Updating
-        menuInflater.inflate(R.menu.menu_settings, menu)
+    private fun handleIsEditingDisplayNameChanged() {
-        return true
+        cancelButton.visibility = if (isEditingDisplayName) View.VISIBLE else View.GONE
+        showQRCodeButton.visibility = if (isEditingDisplayName) View.GONE else View.VISIBLE
+        saveButton.visibility = if (isEditingDisplayName) View.VISIBLE else View.GONE
+        displayNameTextView.visibility = if (isEditingDisplayName) View.INVISIBLE else View.VISIBLE
+        displayNameEditText.visibility = if (isEditingDisplayName) View.VISIBLE else View.INVISIBLE
+        val titleTextViewLayoutParams = titleTextView.layoutParams as LinearLayout.LayoutParams
+        titleTextViewLayoutParams.leftMargin = if (isEditingDisplayName) toPx(16, resources) else 0
+        titleTextView.layoutParams = titleTextViewLayoutParams
+        val inputMethodManager = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
+        if (isEditingDisplayName) {
+            displayNameEditText.requestFocus()
+            inputMethodManager.showSoftInput(displayNameEditText, 0)
+        } else {
+            inputMethodManager.hideSoftInputFromWindow(displayNameEditText.windowToken, 0)
+        }
+    }
+
+    private fun updateProfile(isUpdatingDisplayName: Boolean, isUpdatingProfilePicture: Boolean) {
+        val displayName = displayNameToBeUploaded ?: TextSecurePreferences.getProfileName(this)
+        TextSecurePreferences.setProfileName(this, displayName)
+        val publicChatAPI = ApplicationContext.getInstance(this).lokiPublicChatAPI
+        if (publicChatAPI != null) {
+            val servers = DatabaseFactory.getLokiThreadDatabase(this).getAllPublicChatServers()
+            for (server in servers) {
+                publicChatAPI.setDisplayName(displayName, server)
+            }
+        }
+        displayNameTextView.text = displayName
+        displayNameToBeUploaded = null
     }
     // endregion
 
     // region Interaction
-    override fun onOptionsItemSelected(item: MenuItem): Boolean {
+    private fun cancelEditingDisplayName() {
-        val id = item.itemId
+        isEditingDisplayName = false
-        when (id) {
-            R.id.showQRCodeItem -> showQRCode()
-            else -> { /* Do nothing */ }
     }
-        return super.onOptionsItemSelected(item)
+
+    private fun saveDisplayName() {
+        val displayName = displayNameEditText.text.trim().toString()
+        // TODO: Validation
+        isEditingDisplayName = false
+        displayNameToBeUploaded = displayName
+        updateProfile(true, false)
     }
 
     private fun showQRCode() {
@@ -72,6 +115,10 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
         push(intent)
     }
 
+    private fun showEditDisplayNameUI() {
+        isEditingDisplayName = true
+    }
+
     private fun copyPublicKey() {
         val clipboard = getSystemService(Context.CLIPBOARD_SERVICE) as ClipboardManager
         val clip = ClipData.newPlainText("Session ID", hexEncodedPublicKey)

src/org/thoughtcrime/securesms/loki/redesign/views/SeparatorView.kt

@@ -60,7 +60,7 @@ class SeparatorView : RelativeLayout {
         path.reset()
         path.moveTo(0.0f, h / 2)
         path.lineTo(titleTextView.left - hMargin, h / 2)
-        path.addRoundRect(titleTextView.left - hMargin, 0.0f, titleTextView.right + hMargin, h, h / 2, h / 2, Path.Direction.CCW)
+        path.addRoundRect(titleTextView.left - hMargin, toPx(1, resources).toFloat(), titleTextView.right + hMargin, h - toPx(1, resources).toFloat(), h / 2, h / 2, Path.Direction.CCW)
         path.moveTo(titleTextView.right + hMargin, h / 2)
         path.lineTo(w, h / 2)
         path.close()