From d732e426ce1dbf4aeeb81531ea67e024cc22e5a7 Mon Sep 17 00:00:00 2001 From: Terry Sahaidak Date: Tue, 22 Mar 2016 19:34:55 +0200 Subject: [PATCH] Add new message read status --- .../res/drawable-hdpi/ic_done_black_24dp.png | Bin 0 -> 177 bytes .../res/drawable-hdpi/ic_done_white_24dp.png | Bin 0 -> 188 bytes .../res/drawable-mdpi/ic_done_black_24dp.png | Bin 0 -> 130 bytes .../res/drawable-mdpi/ic_done_white_24dp.png | Bin 0 -> 139 bytes .../res/drawable-xhdpi/ic_done_black_24dp.png | Bin 0 -> 188 bytes .../res/drawable-xhdpi/ic_done_white_24dp.png | Bin 0 -> 199 bytes .../drawable-xxhdpi/ic_done_black_24dp.png | Bin 0 -> 227 bytes .../drawable-xxhdpi/ic_done_white_24dp.png | Bin 0 -> 255 bytes .../drawable-xxxhdpi/ic_done_black_24dp.png | Bin 0 -> 277 bytes .../drawable-xxxhdpi/ic_done_white_24dp.png | Bin 0 -> 308 bytes app/components/Room/Message.js | 28 +++++++++++------- app/components/Room/StatusMessage.js | 11 +++++-- app/screens/RoomScreen.js | 3 +- app/styles/screens/Room/MessageStyles.js | 8 +++++ .../screens/Room/StatusMessageStyles.js | 8 +++++ 15 files changed, 45 insertions(+), 13 deletions(-) create mode 100644 android/app/src/main/res/drawable-hdpi/ic_done_black_24dp.png create mode 100644 android/app/src/main/res/drawable-hdpi/ic_done_white_24dp.png create mode 100644 android/app/src/main/res/drawable-mdpi/ic_done_black_24dp.png create mode 100644 android/app/src/main/res/drawable-mdpi/ic_done_white_24dp.png create mode 100644 android/app/src/main/res/drawable-xhdpi/ic_done_black_24dp.png create mode 100644 android/app/src/main/res/drawable-xhdpi/ic_done_white_24dp.png create mode 100644 android/app/src/main/res/drawable-xxhdpi/ic_done_black_24dp.png create mode 100644 android/app/src/main/res/drawable-xxhdpi/ic_done_white_24dp.png create mode 100644 android/app/src/main/res/drawable-xxxhdpi/ic_done_black_24dp.png create mode 100644 android/app/src/main/res/drawable-xxxhdpi/ic_done_white_24dp.png diff --git a/android/app/src/main/res/drawable-hdpi/ic_done_black_24dp.png b/android/app/src/main/res/drawable-hdpi/ic_done_black_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..d4c06072b56dace7da1ab5fcfc5cb0a494adc5cf GIT binary patch literal 177 zcmeAS@N?(olHy`uVBq!ia0vp^Dj>|k0wldT1B8K8g{O;SNCo5DGlpDEh5{}R!&SuQ zX|-?oV07r-F(+5sYxQj19uA4F0*7@nHs;@YsQf$gW>+px@zP|&GZEd1Z}?}-I>Y|V z=y1-BV5J$-bD3R}6Ta_|*W@zZWWK6sUb;=`BCRvpTf-#$b)_C_PW(7UG2P#7{m0nI aGWJPksgEnI&wc~Cfx*+&&t;ucLK6Uc3_uP5 literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-hdpi/ic_done_white_24dp.png b/android/app/src/main/res/drawable-hdpi/ic_done_white_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..c278b6c2b30ba9bb52391af71120270e908a7502 GIT binary patch literal 188 zcmeAS@N?(olHy`uVBq!ia0vp^Dj>|k0wldT1B8K8v!{z=h{y4_R}8rt40u`}^1XVn zvWkOUU-^j{pVq65HqD1Oi)r3+T*LWdLcQO)Q$gY0SWi# mI0*h{o5b;0Guz~Cq_l|d_dwzLnQwv4VeoYIb6Mw<&;$SqxI>Tt literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-mdpi/ic_done_black_24dp.png b/android/app/src/main/res/drawable-mdpi/ic_done_black_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..5e5e7cf2b14732802095661e2de6a8c6eac3e8b5 GIT binary patch literal 130 zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM0wlfaz7_*1Pfr)ekP61+1H5jHVwtC$CF+b# zCM^47?|k?}@VQePx)djfTvl$Fv|pmhqkt#ilYKy-z^-GeF>qN`e$ mOkm7ZjI#{k);#6T#=sC9S)hEq`Oa^k=?tE(elF{r5}E+GHZxWL literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xhdpi/ic_done_black_24dp.png b/android/app/src/main/res/drawable-xhdpi/ic_done_black_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..64a4944f7531ab9fb745fd34dd00c778cff1573f GIT binary patch literal 188 zcmeAS@N?(olHy`uVBq!ia0vp^1|ZDA0wn)(8}b0DW=|K#kP61P7xwZt8HzYxyd7xd z_anOJT=vF;=6o%TO%qmB2=N*^J(z8E{F3t0DRy@o7f;`BG-3LF`^uk20(J8L%76ab z`e&B#*^~M_=S=wbCso$$y z)eh4Z*LH7YPT^1c;c>xMY3CR5UF8g~O~MqEfWRtq)wx@t#f5EcS$cj=DHe>A9+n8m zSQI=s(8$bw&b3_ExG+wt$|R_#_-}!m@==T1(=U4%_LXEm_Sb!xepO%dfZ-C;lZ8td zj!$Hgapx-N^Vofj<@f|98RxE|K99&g#i>rA^B#LHEf9Sw5tKPe>yY6RAwfaGi}hdF Y%FU*83Z;v716|GF>FVdQ&MBb@0A~SHegFUf literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xxhdpi/ic_done_white_24dp.png b/android/app/src/main/res/drawable-xxhdpi/ic_done_white_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..0ebb55559b55f99df3270796763745a71f113078 GIT binary patch literal 255 zcmV=}0*5fKp)HP1G&I6Iqc zjKz5rgEVtukiIy2Qo_-K;J|?c2M!!K@i?}(lWik$uJ;4aeo|e|;mI*SsV?U@bDX5g zSJ{Te;g>S0!OODIPipkgGo)TTcRZxVWAGnIFqKOr(UM3=(~BhBSvit;g=R?Vjh>M7 zAB+M?!6}eboF615Cqq(m7NiKA4^kA)n-qydL_|cirW>R3em?os7vTT^002ovPDHLk FV1hF8Y9jyu literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xxxhdpi/ic_done_black_24dp.png b/android/app/src/main/res/drawable-xxxhdpi/ic_done_black_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..2f6d6386de9510fa6dd8c83cbb61a6f2e0fab9b2 GIT binary patch literal 277 zcmeAS@N?(olHy`uVBq!ia0vp^2_VeD0wg^q?%xcg?s&R5hEy=VJ?|UH<|x2&QEUS@ zUqF*g%NA{xn*DVG1~S@B-uDxXPUtYNKXnEQ>b^wD=lt6oW;%QS1o1=daUAyI8~(&3 zd|u96v#;i-{{JTZcp&}h>FMeJ8GvN{`tw#N{;ZEGUD<;p)-Lh7=#>`kZ6pLOOe=>Nw L`njxgN@xNAv*3Ko literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xxxhdpi/ic_done_white_24dp.png b/android/app/src/main/res/drawable-xxxhdpi/ic_done_white_24dp.png new file mode 100644 index 0000000000000000000000000000000000000000..d670618c7e96225f7756cb4c2743e7ebbf688cf8 GIT binary patch literal 308 zcmeAS@N?(olHy`uVBq!ia0vp^2_VeD0wg^q?%xcgetWt&hE&{od;P3vlYxj!B3Hnh z1714EonD+``t$ZU)3IJ|2aboi6~%ilJM7!-={Kv*@R&q$518Ox)_m^XpXp1^&DOu% zB6r^~@kqJ%j0e`LXFkL-JviL|Ir_(khlktwLa#r83bn@|VwIw^gKjzH(>hUq>tlAsh9~)aj{(R+p z`Qx=v&?j!r?}<)Pb+Jxa|B9Td>MRd7#ru4CATBh=u6rtH + backgroundColor={backgroundColor} + opacity={readStatusOpacity} /> ) } @@ -126,6 +122,11 @@ class Message extends Component { {this.renderMessageText()} + + + ) @@ -145,12 +146,19 @@ class Message extends Component { onUsernamePress(fromUser.username)}>{fromUser.username} - {this.renderDate()} + + {this.renderDate()} + {this.renderMessageText()} + + + ) diff --git a/app/components/Room/StatusMessage.js b/app/components/Room/StatusMessage.js index b5895f4..f8300f9 100644 --- a/app/components/Room/StatusMessage.js +++ b/app/components/Room/StatusMessage.js @@ -1,6 +1,7 @@ import React, { PropTypes, TouchableNativeFeedback, + Image, View } from 'react-native' import s from '../../styles/screens/Room/StatusMessageStyles' @@ -18,7 +19,7 @@ const renderEmoji = (matchingString, matches) => { ) } -const StatusMessage = ({onPress, onLongPress, text, handleUrlPress, backgroundColor}) => { +const StatusMessage = ({onPress, onLongPress, text, handleUrlPress, backgroundColor, opacity}) => { const patterns = [ {type: 'url', style: s.url, onPress: handleUrlPress}, {pattern: EMOJI_REGEX, style: s.emoji, renderText: renderEmoji}, @@ -43,6 +44,11 @@ const StatusMessage = ({onPress, onLongPress, text, handleUrlPress, backgroundCo + + + ) @@ -53,7 +59,8 @@ StatusMessage.propTypes = { onLongPress: PropTypes.func, text: PropTypes.string, handleUrlPress: PropTypes.func, - backgroundColor: PropTypes.string + backgroundColor: PropTypes.string, + opacity: PropTypes.number } export default StatusMessage diff --git a/app/screens/RoomScreen.js b/app/screens/RoomScreen.js index 5662b27..23b3ac5 100644 --- a/app/screens/RoomScreen.js +++ b/app/screens/RoomScreen.js @@ -385,7 +385,8 @@ class Room extends Component { {this.renderToolbar()} {isLoadingMore ? this.renderLoadingMore() : null} {isLoadingMessages ? this.renderLoading() : this.renderListView()} - {getMessagesError || isLoadingMessages || _.has(listView, 'data') && listView.data.length === 0 ? null : this.renderBottom()} + {getMessagesError || isLoadingMessages || _.has(listView, 'data') && + listView.data.length === 0 ? null : this.renderBottom()} ) } diff --git a/app/styles/screens/Room/MessageStyles.js b/app/styles/screens/Room/MessageStyles.js index b56ca27..e0329f1 100644 --- a/app/styles/screens/Room/MessageStyles.js +++ b/app/styles/screens/Room/MessageStyles.js @@ -39,6 +39,14 @@ const style = StyleSheet.create({ }, url: { color: 'blue' + }, + readStatus: { + width: 15, + marginTop: 3 + }, + readStatusIcon: { + width: 15, + height: 15 } }) diff --git a/app/styles/screens/Room/StatusMessageStyles.js b/app/styles/screens/Room/StatusMessageStyles.js index 1bf3aff..195d183 100644 --- a/app/styles/screens/Room/StatusMessageStyles.js +++ b/app/styles/screens/Room/StatusMessageStyles.js @@ -24,6 +24,14 @@ const style = StyleSheet.create({ }, url: { color: colors.link + }, + readStatus: { + width: 15, + marginTop: 3 + }, + readStatusIcon: { + width: 15, + height: 15 } })