Merge pull request #6577 from RocketChat/tgxn-better-mb

[NEW] resolve merge share function
RocketChat · Apr 3, 2017 · 7651763 · 7651763
2 parents 9572a21 + 16bd5ef
commit 7651763
Show file tree

Hide file tree

Showing 5 changed files with 145 additions and 68 deletions.
diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -962,6 +962,9 @@
   "Message_AllowUnrecognizedSlashCommand": "Allow Unrecognized Slash Commands",
   "Message_AlwaysSearchRegExp": "Always search using RegExp",
   "Message_AlwaysSearchRegExp_Description": "We recommend to set `True` if your language is not supported on <a target=\"_blank\" href=\"https://docs.mongodb.org/manual/reference/text-search-languages/#text-search-languages\">MongoDB text search</a>.",
+  "Message_Attachments" : "Message Attachments",
+  "Message_Attachments_GroupAttach" : "Group Attachment Buttons",
+  "Message_Attachments_GroupAttachDescription" : "This groups the icons under an expandable menu. Takes up less screen space.",
   "Message_AudioRecorderEnabled": "Audio Recorder Enabled",
   "Message_AudioRecorderEnabledDescription": "Requires 'audio/wav' files to be an accepted media type within 'File Upload' settings.",
   "Message_BadWordsFilterList": "Add bad words to the blacklist",
@@ -1692,4 +1695,4 @@
   "your_message_optional": "your message (optional)",
   "Your_password_is_wrong": "Your password is wrong!",
   "Your_push_was_sent_to_s_devices": "Your push was sent to %s devices"
-}
+}
diff --git a/packages/rocketchat-lib/server/startup/settings.coffee b/packages/rocketchat-lib/server/startup/settings.coffee
@@ -181,6 +181,11 @@ RocketChat.settings.addGroup 'Email', ->
 		@add 'Verification_Email', '', { type: 'code', code: 'text/html', multiline: true, i18nLabel: 'Body', i18nDescription: 'Verification_Description', enableQuery: { _id: 'Verification_Customized', value: true }, i18nDefaultQuery: { _id: 'Verification_Customized', value: false } }
 
 RocketChat.settings.addGroup 'Message', ->
+
+	@section 'Message_Attachments', ->
+		@add 'Message_Attachments_GroupAttach', false, { type: 'boolean', public: true, i18nDescription: 'Message_Attachments_GroupAttachDescription' }
+		@add 'Message_AudioRecorderEnabled', true, { type: 'boolean', public: true, i18nDescription: 'Message_AudioRecorderEnabledDescription' }
+
 	@add 'Message_AllowEditing', true, { type: 'boolean', public: true }
 	@add 'Message_AllowEditing_BlockEditInMinutes', 0, { type: 'int', public: true, i18nDescription: 'Message_AllowEditing_BlockEditInMinutesDescription' }
 	@add 'Message_AllowDeleting', true, { type: 'boolean', public: true }
@@ -196,7 +201,6 @@ RocketChat.settings.addGroup 'Message', ->
 	@add 'Message_MaxAllowedSize', 5000, { type: 'int', public: true }
 	@add 'Message_ShowFormattingTips', true, { type: 'boolean', public: true }
 	@add 'Message_SetNameToAliasEnabled', false, { type: 'boolean', public: false, i18nDescription: 'Message_SetNameToAliasEnabled_Description' }
-	@add 'Message_AudioRecorderEnabled', true, { type: 'boolean', public: true, i18nDescription: 'Message_AudioRecorderEnabledDescription' }
 	@add 'Message_GroupingPeriod', 300, { type: 'int', public: true, i18nDescription: 'Message_GroupingPeriodDescription' }
 	@add 'API_Embed', true, { type: 'boolean', public: true }
 	@add 'API_EmbedCacheExpirationDays', 30, { type: 'int', public: false }

diff --git a/packages/rocketchat-theme/client/imports/base.less b/packages/rocketchat-theme/client/imports/base.less
@@ -2340,14 +2340,70 @@ label.required::after {
 			position: relative;
 			display: flex;
 
+			> .share-items {
+				display: flex;
+				position: relative;
+
+				input {
+					position: absolute;
+					top: 0;
+					left: 0;
+					right: 0;
+					bottom: 0;
+					overflow: hidden;
+					opacity: 0;
+					cursor: pointer;
+				}
+
+				input::-webkit-file-upload-button {
+					cursor: pointer;
+				}
+
+				i {
+					font-size: 18px;
+				}
+
+				> .message-buttons {
+					height: 35px;
+					width: 35px;
+					text-align: center;
+					border: 0;
+					cursor: pointer;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					position: relative;
+					overflow: hidden;
+
+					input {
+						position: absolute;
+						top: 0;
+						left: 0;
+						right: 0;
+						bottom: 0;
+						overflow: hidden;
+						opacity: 0;
+						cursor: pointer;
+					}
+
+					input::-webkit-file-upload-button {
+						cursor: pointer;
+					}
+
+					i {
+						font-size: 18px;
+					}
+				}
+			}
+
 			.input-message-container {
 				position: relative;
 				width: 100%;
 
 				.inner-left-toolbar {
 					position: absolute;
 					left: 13px;
-					top: 9px;
+					top: 8px;
 				}
 			}
 
@@ -2364,6 +2420,8 @@ label.required::after {
 
 				i {
 					font-size: 18px;
+					transform: rotate(0deg);
+					transition: transform 0.3s ease-out;
 				}
 
 				input {

diff --git a/packages/rocketchat-ui-message/client/messageBox.coffee b/packages/rocketchat-ui-message/client/messageBox.coffee
@@ -85,6 +85,12 @@ Template.messageBox.helpers
 			users: usernames.join " #{t 'and'} "
 		}
 
+	groupAttachHidden: ->
+		return 'hidden' if RocketChat.settings.get('Message_Attachments_GroupAttach')
+
+	fileUploadEnabled: ->
+		return RocketChat.settings.get('FileUpload_Enabled')
+
 	fileUploadAllowedMediaTypes: ->
 		return RocketChat.settings.get('FileUpload_MediaTypeWhiteList')
 
@@ -244,6 +250,10 @@ Template.messageBox.events
 
 		fileUpload filesToUpload
 
+	"click .message-buttons.share": (e, t) ->
+		t.$('.share-items').toggleClass('hidden')
+		t.$('.message-buttons.share').toggleClass('active')
+
 	'click .message-form .message-buttons.location': (event, instance) ->
 		roomId = @_id
 
@@ -358,4 +368,4 @@ Meteor.startup ->
 
 			navigator.geolocation.watchPosition success, error
 		else
-			RocketChat.Geolocation.set false
+			RocketChat.Geolocation.set false
diff --git a/packages/rocketchat-ui-message/client/messageBox.html b/packages/rocketchat-ui-message/client/messageBox.html
@@ -1,55 +1,70 @@
 <template name="messageBox">
 	{{#if subscribed}}
-		<form class="message-form secondary-font-color" method="post" action="/">
+		<form class="message-form" method="post" action="/">
 			{{> messagePopupConfig getPopupConfig}}
-			{{#if allowedToSend}}
+
 			<div class="message-input border-component-color">
-				<div class="input-message-container content-background-color">
-					<div id="msg_contenteditable" contenteditable="true" style="height: 0; width: 0; overflow: hidden"></div>
-					<textarea dir="auto" name="msg" maxlength="{{maxMessageLength}}" class="message-form-text input-message autogrow-short" placeholder="{{_ 'Message'}}"></textarea>
+
+				<div class="input-message-container">
+
+					<textarea dir="auto" name="msg" maxlength="{{maxMessageLength}}" class="input-message autogrow-short" placeholder="{{_ 'Message'}}"></textarea>
 
 					<div class="inner-left-toolbar">
 						<i class="emoji-picker-icon icon-people"></i>
 					</div>
+
 				</div>
 
 				{{#unless showSend}}
-					{{#if showFileUpload}}
-						<div class="message-buttons file">
-							<i class="icon-attach file"></i>
-							<input type="file" accept="{{fileUploadAllowedMediaTypes}}">
-						</div>
-					{{/if}}
 
+					<div class="share-items {{groupAttachHidden}}">
 
-					{{#if showSandstorm}}
-						<div class="message-buttons sandstorm-offer">
-							<i class="icon-plus" title="{{_ "Sandstorm_Powerbox_Share"}}"></i>
-						</div>
-					{{/if}}
+						{{#if fileUploadEnabled}}
 
-					{{#if showLocation}}
-						<div class="message-buttons location">
-							<i class="icon-location location"></i>
-						</div>
-					{{/if}}
+							<div class="message-buttons file">
+								<i class="icon-attach file"></i>
+								<input type="file" accept="{{fileUploadAllowedMediaTypes}}">
+							</div>
+
+							{{#if showMic}}
+								<div class="message-buttons mic-button">
+									<div class="mic">
+										<i class="icon-mic" aria-label="{{_ "Record"}}"></i>
+									</div>
+									<div class="stop-mic hidden">
+										<i class="icon-stop" aria-label="{{_ "Stop_Recording"}}"></i>
+									</div>
+								</div>
+							{{/if}}
+
+							{{#if showVRec}}
+								<div class="message-buttons video-button">
+									<i class="icon-videocam" aria-label="{{_ "Record"}}"></i>
+								</div>
+							{{/if}}
+
+						{{/if}}
 
-					{{#if showMic}}
-						<div class="message-buttons">
-							<div class="mic">
-								<i class="icon-mic" aria-label="{{_ "Record"}}"></i>
+						{{#if showLocation}}
+							<div class="message-buttons location-button">
+								<i class="icon-location"></i>
 							</div>
-							<div class="stop-mic hidden">
-								<i class="icon-stop" aria-label="{{_ "Stop_Recording"}}"></i>
+						{{/if}}
+
+						{{#if showSandstorm}}
+							<div class="message-buttons sandstorm-offer">
+								<i class="icon-plus" title="{{_ "Sandstorm_Powerbox_Share"}}"></i>
 							</div>
-						</div>
-					{{/if}}
+						{{/if}}
+
+					</div>
 
-					{{#if showVRec}}
-						<div class="message-buttons video-button">
-							<i class="icon-videocam" aria-label="{{_ "Record"}}"></i>
+					{{#if groupAttachHidden}}
+						<div class="message-buttons share">
+							<i class="icon-plus"></i>
 						</div>
 					{{/if}}
+
 				{{/unless}}
 
 				{{#if showSend}}
@@ -58,16 +73,7 @@
 					</div>
 				{{/if}}
 			</div>
-			{{else}}
-			<div class="stream-info">
-				{{#if isBlockedOrBlocker}}
-					{{_ "room_is_blocked"}}
-				{{else}}
-					{{_ "room_is_read_only"}}
-				{{/if}}
-			</div>
-			{{/if}}
-			<div class="stream-info">
+			<div class="users-typing">
 				{{#with usersTyping}}
 					<strong>{{users}}</strong>
 					{{#if multi}}
@@ -85,26 +91,25 @@
 					{{/if}}
 				{{/with}}
 			</div>
-			{{#if allowedToSend}}
-				{{#if showFormattingTips}}
-				<div class="formatting-tips" aria-hidden="true" dir="auto">
-					{{#if showMarkdown}}
-					<b>*{{_ "bold"}}*</b>
-					<i>_{{_ "italics"}}_</i>
-					<span>~<strike>{{_ "strike"}}</strike>~</span>
-					{{/if}}
-					{{#if showMarkdownCode}}
-					<code class="code-colors inline">`{{_ "inline_code"}}`</code>
-					<code class="code-colors inline"><span class="hidden-br"><br></span>```<span class="hidden-br"><br></span><i class="icon-level-down"></i>{{_ "multi"}}<span class="hidden-br"><br></span><i class="icon-level-down"></i>{{_ "line"}}<span class="hidden-br"><br></span><i class="icon-level-down"></i>```</code>
-					{{/if}}
-					{{#if katexSyntax}}
-					<span><a href="https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX" target="_blank">{{katexSyntax}}</a></span>
-					{{/if}}
-					{{#if showMarkdown}}
-					<q><span class="hidden-br"><br></span>&gt;{{_ "quote"}}</q>
-					{{/if}}
-				</div>
+
+			{{#if showFormattingTips}}
+			<div class="formatting-tips" aria-hidden="true" dir="auto">
+				{{#if showMarkdown}}
+				<b>*{{_ "bold"}}*</b>
+				<i>_{{_ "italics"}}_</i>
+				<span>~<strike>{{_ "strike"}}</strike>~</span>
+				{{/if}}
+				{{#if showMarkdownCode}}
+				<code class="code-colors inline">`{{_ "inline_code"}}`</code>
+				<code class="code-colors inline"><span class="hidden-br"><br></span>```<span class="hidden-br"><br></span><i class="icon-level-down"></i>{{_ "multi"}}<span class="hidden-br"><br></span><i class="icon-level-down"></i>{{_ "line"}}<span class="hidden-br"><br></span><i class="icon-level-down"></i>```</code>
 				{{/if}}
+				{{#if katexSyntax}}
+				<span><a href="https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX" target="_blank">{{katexSyntax}}</a></span>
+				{{/if}}
+				{{#if showMarkdown}}
+				<q><span class="hidden-br"><br></span>&gt;{{_ "quote"}}</q>
+				{{/if}}
+			</div>
 			{{/if}}
 			<div class="editing-commands" aria-hidden="true" dir="auto">
 				<div class="editing-commands-cancel">{{_ 'Esc_to'}} <button type="button">{{_ 'Cancel_message_input'}}</button></div>
@@ -118,9 +123,6 @@
 			{{#if canJoin}}
 			<div>
 				{{{_ "you_are_in_preview_mode_of" room_name=roomName}}}
-				{{#if joinCodeRequired}}
-					<input type="text" name="joinCode" placeholder="{{_ 'Code'}}" style="width: 100px">
-				{{/if}}
 				<button class="button join"><span><i class="icon-login"></i> {{_ "join"}}</span></button>
 			</div>
 			{{/if}}