whatsapp-like smiley implementation

6 files changed, 165 insertions, 26 deletions

diff --git a/src/main/java/eu/siacs/conversations/ui/ConversationActivity.java b/src/main/java/eu/siacs/conversations/ui/ConversationActivity.java
index 615926d3..0fbaa479 100644
--- a/src/main/java/eu/siacs/conversations/ui/ConversationActivity.java
+++ b/src/main/java/eu/siacs/conversations/ui/ConversationActivity.java
@@ -43,6 +43,7 @@ import eu.siacs.conversations.services.XmppConnectionService.OnRosterUpdate;
 import eu.siacs.conversations.ui.adapter.ConversationAdapter;
 import eu.siacs.conversations.utils.ExceptionHelper;
 import eu.siacs.conversations.xmpp.OnUpdateBlocklist;
+import github.ankushsachdeva.emojicon.EmojiconEditText;
 
 public class ConversationActivity extends XmppActivity
 	implements OnAccountUpdate, OnConversationUpdate, OnRosterUpdate, OnUpdateBlocklist {
@@ -140,13 +141,13 @@ public class ConversationActivity extends XmppActivity
 	@Override
 	protected void onCreate(final Bundle savedInstanceState) {
 		super.onCreate(savedInstanceState);
-		if (savedInstanceState != null) {mOpenConverstaion = savedInstanceState.getString(
-				STATE_OPEN_CONVERSATION, null);
-		mPanelOpen = savedInstanceState.getBoolean(STATE_PANEL_OPEN, true);
-		String pending = savedInstanceState.getString(STATE_PENDING_URI, null);
-		if (pending != null) {
-			mPendingImageUri = Uri.parse(pending);
-		}
+		if (savedInstanceState != null) {
+            mOpenConverstaion = savedInstanceState.getString(STATE_OPEN_CONVERSATION, null);
+            mPanelOpen = savedInstanceState.getBoolean(STATE_PANEL_OPEN, true);
+            String pending = savedInstanceState.getString(STATE_PENDING_URI, null);
+            if (pending != null) {
+                mPendingImageUri = Uri.parse(pending);
+            }
 		}
 
 		setContentView(R.layout.fragment_conversations_overview);
diff --git a/src/main/java/eu/siacs/conversations/ui/ConversationFragment.java b/src/main/java/eu/siacs/conversations/ui/ConversationFragment.java
index b9a3b8da..4f359d9c 100644
--- a/src/main/java/eu/siacs/conversations/ui/ConversationFragment.java
+++ b/src/main/java/eu/siacs/conversations/ui/ConversationFragment.java
@@ -27,7 +27,9 @@ import android.widget.AbsListView.OnScrollListener;
 import android.widget.AdapterView;
 import android.widget.AdapterView.AdapterContextMenuInfo;
 import android.widget.ImageButton;
+import android.widget.ImageView;
 import android.widget.ListView;
+import android.widget.PopupWindow;
 import android.widget.RelativeLayout;
 import android.widget.TextView;
 import android.widget.TextView.OnEditorActionListener;
@@ -63,6 +65,10 @@ import eu.siacs.conversations.ui.adapter.MessageAdapter.OnContactPictureLongClic
 import eu.siacs.conversations.utils.GeoHelper;
 import eu.siacs.conversations.xmpp.chatstate.ChatState;
 import eu.siacs.conversations.xmpp.jid.Jid;
+import github.ankushsachdeva.emojicon.EmojiconEditText;
+import github.ankushsachdeva.emojicon.EmojiconGridView;
+import github.ankushsachdeva.emojicon.EmojiconsPopup;
+import github.ankushsachdeva.emojicon.emoji.Emojicon;
 
 public class ConversationFragment extends Fragment implements EditMessage.KeyboardListener {
 
@@ -105,6 +111,9 @@ public class ConversationFragment extends Fragment implements EditMessage.Keyboa
 	protected MessageAdapter messageListAdapter;
 	private EditMessage mEditMessage;
 	private ImageButton mSendButton;
+    private ImageView mEmojButton;
+    private View mRootView;
+    private EmojiconsPopup mEmojPopup;
 	private RelativeLayout snackbar;
 	private TextView snackbarMessage;
 	private TextView snackbarAction;
@@ -332,6 +341,115 @@ public class ConversationFragment extends Fragment implements EditMessage.Keyboa
 		});
 		mEditMessage.setOnEditorActionListener(mEditorActionListener);
 
+        // Start of emojicon
+        mEmojButton = (ImageView) view.findViewById(R.id.emoji_btn);
+        mRootView = view.findViewById(R.id.textsend);
+
+        // Give the topmost view of your activity layout hierarchy. This will be used to measure soft keyboard height
+        mEmojPopup = new EmojiconsPopup(mRootView, this.getActivity());
+
+        //Will automatically set size according to the soft keyboard size
+        mEmojPopup.setSizeForSoftKeyboard();
+
+        //Set on emojicon click listener
+        mEmojPopup.setOnEmojiconClickedListener(new EmojiconGridView.OnEmojiconClickedListener() {
+
+            @Override
+            public void onEmojiconClicked(Emojicon emojicon) {
+                mEditMessage.append(emojicon.getEmoji());
+            }
+        });
+
+        //Set on backspace click listener
+        mEmojPopup.setOnEmojiconBackspaceClickedListener(new EmojiconsPopup.OnEmojiconBackspaceClickedListener() {
+
+            @Override
+            public void onEmojiconBackspaceClicked(View v) {
+                KeyEvent event = new KeyEvent(
+                        0, 0, 0, KeyEvent.KEYCODE_DEL, 0, 0, 0, 0, KeyEvent.KEYCODE_ENDCALL);
+                mEditMessage.dispatchKeyEvent(event);
+            }
+        });
+
+        //If the emoji popup is dismissed, change emojiButton to smiley icon
+        mEmojPopup.setOnDismissListener(new PopupWindow.OnDismissListener() {
+
+            @Override
+            public void onDismiss() {
+                changeEmojiKeyboardIcon(mEmojButton, R.drawable.smiley);
+            }
+        });
+
+        //If the text keyboard closes, also dismiss the emoji popup
+        mEmojPopup.setOnSoftKeyboardOpenCloseListener(new EmojiconsPopup.OnSoftKeyboardOpenCloseListener() {
+
+            @Override
+            public void onKeyboardOpen(int keyBoardHeight) {
+
+            }
+
+            @Override
+            public void onKeyboardClose() {
+                if (mEmojPopup.isShowing())
+                    mEmojPopup.dismiss();
+            }
+        });
+
+        //On emoji clicked, add it to edittext
+        mEmojPopup.setOnEmojiconClickedListener(new EmojiconGridView.OnEmojiconClickedListener() {
+
+            @Override
+            public void onEmojiconClicked(Emojicon emojicon) {
+                mEditMessage.append(emojicon.getEmoji());
+            }
+        });
+
+        //On backspace clicked, emulate the KEYCODE_DEL key event
+        mEmojPopup.setOnEmojiconBackspaceClickedListener(new EmojiconsPopup.OnEmojiconBackspaceClickedListener() {
+
+            @Override
+            public void onEmojiconBackspaceClicked(View v) {
+                KeyEvent event = new KeyEvent(
+                        0, 0, 0, KeyEvent.KEYCODE_DEL, 0, 0, 0, 0, KeyEvent.KEYCODE_ENDCALL);
+                mEditMessage.dispatchKeyEvent(event);
+            }
+        });
+
+        // To toggle between text keyboard and emoji keyboard keyboard(Popup)
+        mEmojButton.setOnClickListener(new OnClickListener() {
+
+            @Override
+            public void onClick(View v) {
+
+                //If popup is not showing => emoji keyboard is not visible, we need to show it
+                if(!mEmojPopup.isShowing()){
+
+                    //If keyboard is visible, simply show the emoji popup
+                    if(mEmojPopup.isKeyBoardOpen()){
+                        mEmojPopup.showAtBottom();
+                        changeEmojiKeyboardIcon(mEmojButton, R.drawable.ic_action_keyboard);
+                    }
+
+                    //else, open the text keyboard first and immediately after that show the emoji popup
+                    else{
+                        mEditMessage.setFocusableInTouchMode(true);
+                        mEditMessage.requestFocus();
+                        mEmojPopup.showAtBottomPending();
+                        final InputMethodManager inputMethodManager = (InputMethodManager) getActivity().getSystemService(Context.INPUT_METHOD_SERVICE);
+                        inputMethodManager.showSoftInput(mEditMessage, InputMethodManager.SHOW_IMPLICIT);
+                        changeEmojiKeyboardIcon(mEmojButton, R.drawable.ic_action_keyboard);
+                    }
+                }
+
+                //If popup is showing, simply dismiss it to show the undelying text keyboard
+                else{
+                    mEmojPopup.dismiss();
+                }
+            }
+        });
+
+        // End of emojicon
+
 		mSendButton = (ImageButton) view.findViewById(R.id.textSendButton);
 		mSendButton.setOnClickListener(this.mSendButtonListener);
 
@@ -1009,15 +1127,15 @@ public class ConversationFragment extends Fragment implements EditMessage.Keyboa
 		final ConversationActivity activity = (ConversationActivity) getActivity();
 		final XmppConnectionService xmppService = activity.xmppConnectionService;
 		activity.selectPresence(message.getConversation(),
-				new OnPresenceSelected() {
-
-					@Override
-					public void onPresenceSelected() {
-						message.setCounterpart(conversation.getNextCounterpart());
-						xmppService.sendMessage(message);
-						messageSent();
-					}
-				});
+                new OnPresenceSelected() {
+
+                    @Override
+                    public void onPresenceSelected() {
+                        message.setCounterpart(conversation.getNextCounterpart());
+                        xmppService.sendMessage(message);
+                        messageSent();
+                    }
+                });
 	}
 
 	public void appendText(String text) {
@@ -1062,4 +1180,8 @@ public class ConversationFragment extends Fragment implements EditMessage.Keyboa
 		}
 	}
 
+    private void changeEmojiKeyboardIcon(ImageView iconToBeChanged, int drawableResourceId){
+        iconToBeChanged.setImageResource(drawableResourceId);
+    }
+
 }
diff --git a/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java b/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java
index c98dbdd0..933ca1f8 100644
--- a/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java
+++ b/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java
@@ -38,6 +38,7 @@ import eu.siacs.conversations.entities.Message.ImageParams;
 import eu.siacs.conversations.ui.ConversationActivity;
 import eu.siacs.conversations.utils.GeoHelper;
 import eu.siacs.conversations.utils.UIHelper;
+import github.ankushsachdeva.emojicon.EmojiconTextView;
 
 public class MessageAdapter extends ArrayAdapter<Message> {
 
@@ -382,7 +383,7 @@ public class MessageAdapter extends ArrayAdapter<Message> {
 						.findViewById(R.id.security_indicator);
 					viewHolder.image = (ImageView) view
 						.findViewById(R.id.message_image);
-					viewHolder.messageBody = (TextView) view
+					viewHolder.messageBody = (EmojiconTextView) view
 						.findViewById(R.id.message_body);
 					viewHolder.time = (TextView) view
 						.findViewById(R.id.message_time);
@@ -402,7 +403,7 @@ public class MessageAdapter extends ArrayAdapter<Message> {
 						.findViewById(R.id.security_indicator);
 					viewHolder.image = (ImageView) view
 						.findViewById(R.id.message_image);
-					viewHolder.messageBody = (TextView) view
+					viewHolder.messageBody = (EmojiconTextView) view
 						.findViewById(R.id.message_body);
 					viewHolder.time = (TextView) view
 						.findViewById(R.id.message_time);
@@ -596,7 +597,7 @@ public class MessageAdapter extends ArrayAdapter<Message> {
 		protected ImageView indicator;
 		protected ImageView indicatorReceived;
 		protected TextView time;
-		protected TextView messageBody;
+		protected EmojiconTextView messageBody;
 		protected ImageView contact_picture;
 		protected TextView status_message;
 	}
diff --git a/src/main/res/layout/fragment_conversation.xml b/src/main/res/layout/fragment_conversation.xml
index f9aae10a..b343781b 100644
--- a/src/main/res/layout/fragment_conversation.xml
+++ b/src/main/res/layout/fragment_conversation.xml
@@ -33,8 +33,8 @@
             android:id="@+id/textinput"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_alignParentLeft="true"
             android:layout_toLeftOf="@+id/textSendButton"
+            android:layout_toRightOf="@+id/emoji_btn"
             android:background="@color/primarybackground"
             android:ems="10"
             android:imeOptions="flagNoExtractUi|actionSend"
@@ -58,6 +58,15 @@
             android:layout_centerVertical="true"
             android:background="?android:selectableItemBackground"
             android:src="@drawable/ic_action_send_now_offline" />
+
+        <ImageView
+            android:layout_width="48dp"
+            android:layout_height="48dp"
+            android:id="@+id/emoji_btn"
+            android:layout_centerVertical="true"
+            android:layout_alignParentLeft="true"
+            android:padding="4dp"
+            android:src="@drawable/smiley" />
     </RelativeLayout>
 
     <RelativeLayout
diff --git a/src/main/res/layout/message_received.xml b/src/main/res/layout/message_received.xml
index 39bb842a..23997028 100644
--- a/src/main/res/layout/message_received.xml
+++ b/src/main/res/layout/message_received.xml
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<RelativeLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:emojicon="http://schemas.android.com/apk/res-auto"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:orientation="vertical"
@@ -38,13 +40,14 @@
                 android:paddingBottom="2dp"
                 android:scaleType="centerCrop" />
 
-            <TextView
+            <github.ankushsachdeva.emojicon.EmojiconTextView
                 android:id="@+id/message_body"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:autoLink="web"
                 android:textColor="@color/primarytext"
-                android:textSize="?attr/TextSizeBody" />
+                android:textSize="?attr/TextSizeBody"
+                emojicon:emojiconSize="28sp" />
 
             <Button
                 android:id="@+id/download_button"
diff --git a/src/main/res/layout/message_sent.xml b/src/main/res/layout/message_sent.xml
index 3e854643..e91c9230 100644
--- a/src/main/res/layout/message_sent.xml
+++ b/src/main/res/layout/message_sent.xml
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<RelativeLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:emojicon="http://schemas.android.com/apk/res-auto"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:orientation="vertical"
@@ -38,13 +40,14 @@
                 android:paddingBottom="2dp"
                 android:scaleType="centerCrop" />
 
-            <TextView
+            <github.ankushsachdeva.emojicon.EmojiconTextView
                 android:id="@+id/message_body"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:autoLink="web"
                 android:textColor="@color/primarytext"
-                android:textSize="?attr/TextSizeBody" />
+                android:textSize="?attr/TextSizeBody"
+                emojicon:emojiconSize="28sp" />
             
              <Button
                 android:id="@+id/download_button"