diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json index c5468b6945b..d7b19ab4ac4 100644 --- a/packages/rocketchat-i18n/i18n/en.i18n.json +++ b/packages/rocketchat-i18n/i18n/en.i18n.json @@ -132,6 +132,7 @@ "Add_agent": "Add agent", "Add_custom_oauth": "Add custom oauth", "Add_Domain": "Add Domain", + "Add_files_from": "Add files from", "Add_manager": "Add manager", "Add_Role": "Add Role", "Add_user": "Add user", @@ -220,6 +221,7 @@ "AtlassianCrowd": "Atlassian Crowd", "Attachment_File_Uploaded": "File Uploaded", "Attribute_handling": "Attribute handling", + "Audio_message": "Audio message", "Auth_Token": "Auth Token", "Author": "Author", "Authorization_URL": "Authorization URL", @@ -1067,6 +1069,7 @@ "Mute_user": "Mute user", "Muted": "Muted", "My_Account": "My Account", + "My_location": "My location", "n_messages": "%s messages", "N_new_messages": "%s new messages", "Name": "Name", @@ -1846,6 +1849,7 @@ "Version": "Version", "Video_Chat_Window": "Video Chat", "Video_Conference": "Video Conference", + "Video_message": "Video message", "Videocall_declined": "Videocall declined.", "Videocall_enabled": "Videocall enabled", "View_All": "View All", diff --git a/packages/rocketchat-lib/lib/messageBox.js b/packages/rocketchat-lib/lib/messageBox.js index 0608fd2d043..1d0933842ac 100644 --- a/packages/rocketchat-lib/lib/messageBox.js +++ b/packages/rocketchat-lib/lib/messageBox.js @@ -7,15 +7,15 @@ RocketChat.messageBox.actions = new class { /* Add a action to messagebox @param group - @param action name + @param label @param config icon: icon class action: action function condition: condition to display the action */ - add(group, actionName, config) { - if (!group && !actionName && !config) { + add(group, label, config) { + if (!group && !label && !config) { return; } @@ -24,14 +24,14 @@ RocketChat.messageBox.actions = new class { } const actionExists = this.actions[group].find((action) => { - return action.actionName === actionName; + return action.label === label; }); if (actionExists) { return; } - this.actions[group].push({...config, actionName}); + this.actions[group].push({...config, label}); } get(group) { diff --git a/packages/rocketchat-lib/lib/startup/messageBoxActions.js b/packages/rocketchat-lib/lib/startup/messageBoxActions.js index 54ba58aa646..89b3dbd2fb4 100644 --- a/packages/rocketchat-lib/lib/startup/messageBoxActions.js +++ b/packages/rocketchat-lib/lib/startup/messageBoxActions.js @@ -1,173 +1,53 @@ -RocketChat.messageBox.actions.add('Share', 'location', { - icon: 'map-pin', - condition: () => RocketChat.Geolocation.get() !== false, - action({rid}) { - const position = RocketChat.Geolocation.get(); - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - const text = `
`; - return swal({ - title: t('Share_Location_Title'), - text, - showCancelButton: true, - closeOnConfirm: true, - closeOnCancel: true, - html: true - }, function(isConfirm) { - if (isConfirm !== true) { - return; - } - return Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: '', - location: { - type: 'Point', - coordinates: [longitude, latitude] - } - }); - }); - } -}); +/* globals fileUpload */ -RocketChat.messageBox.actions.add('Share2', 'location', { - icon: 'map-pin', - condition: () => RocketChat.Geolocation.get() !== false, - action({rid}) { - const position = RocketChat.Geolocation.get(); - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - const text = `
`; - return swal({ - title: t('Share_Location_Title'), - text, - showCancelButton: true, - closeOnConfirm: true, - closeOnCancel: true, - html: true - }, function(isConfirm) { - if (isConfirm !== true) { - return; - } - return Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: '', - location: { - type: 'Point', - coordinates: [longitude, latitude] - } - }); - }); - } -}); -RocketChat.messageBox.actions.add('Share3', 'hello', { - icon: 'map-pin', +import mime from 'mime-type/with-db'; + +RocketChat.messageBox.actions.add('Create_new', 'Video_message', { + icon: 'video', condition: () => true, - action({rid, event}) { - event.preventDefault(); - event.stopPropagation(); - Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: 'hello' - }); + action() { + return; } }); -RocketChat.messageBox.actions.add('Share', 'location3', { - icon: 'map-pin', - condition: () => RocketChat.Geolocation.get() !== false, - action({rid}) { - const position = RocketChat.Geolocation.get(); - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - const text = `
`; - return swal({ - title: t('Share_Location_Title'), - text, - showCancelButton: true, - closeOnConfirm: true, - closeOnCancel: true, - html: true - }, function(isConfirm) { - if (isConfirm !== true) { - return; - } - return Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: '', - location: { - type: 'Point', - coordinates: [longitude, latitude] - } - }); - }); - } -}); -RocketChat.messageBox.actions.add('Share', 'location4', { - icon: 'map-pin', - condition: () => RocketChat.Geolocation.get() !== false, - action({rid}) { - const position = RocketChat.Geolocation.get(); - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - const text = `
`; - return swal({ - title: t('Share_Location_Title'), - text, - showCancelButton: true, - closeOnConfirm: true, - closeOnCancel: true, - html: true - }, function(isConfirm) { - if (isConfirm !== true) { - return; - } - return Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: '', - location: { - type: 'Point', - coordinates: [longitude, latitude] - } - }); - }); + +RocketChat.messageBox.actions.add('Create_new', 'Audio_message', { + icon: 'audio', + condition: () => true, + action() { + return; } }); -RocketChat.messageBox.actions.add('Share', 'location5', { - icon: 'map-pin', - condition: () => RocketChat.Geolocation.get() !== false, - action({rid}) { - const position = RocketChat.Geolocation.get(); - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - const text = `
`; - return swal({ - title: t('Share_Location_Title'), - text, - showCancelButton: true, - closeOnConfirm: true, - closeOnCancel: true, - html: true - }, function(isConfirm) { - if (isConfirm !== true) { - return; - } - return Meteor.call('sendMessage', { - _id: Random.id(), - rid, - msg: '', - location: { - type: 'Point', - coordinates: [longitude, latitude] - } + +RocketChat.messageBox.actions.add('Add_files_from', 'Computer', { + icon: 'computer', + condition: () => RocketChat.settings.get('FileUpload_Enabled'), + action() { + const input = document.createElement('input'); + input.style.display = 'none'; + input.type = 'file'; + input.setAttribute('multiple', 'multiple'); + document.body.appendChild(input); + + input.click(); + + input.addEventListener('change', function(e) { + const filesToUpload = [...e.target.files].map(file => { + Object.defineProperty(file, 'type', { + value: mime.lookup(file.name) + }); + return { + file, + name: file.name + }; }); - }); + return fileUpload(filesToUpload); + }, {once: true}); + + input.remove(); } }); -RocketChat.messageBox.actions.add('Share', 'location6', { + +RocketChat.messageBox.actions.add('Share', 'My_location', { icon: 'map-pin', condition: () => RocketChat.Geolocation.get() !== false, action({rid}) { diff --git a/packages/rocketchat-theme/client/imports/components/popover.css b/packages/rocketchat-theme/client/imports/components/popover.css index 737ccb7dd1f..617a5bd3235 100644 --- a/packages/rocketchat-theme/client/imports/components/popover.css +++ b/packages/rocketchat-theme/client/imports/components/popover.css @@ -28,7 +28,6 @@ z-index: 9999; &__content { - width: 100%; display: flex; padding: 1rem; border-radius: 2px; @@ -44,8 +43,16 @@ &__column { display: flex; flex-direction: column; - width: 100%; min-width: 130px; + flex: 1 0 auto; + + &:not(:first-child) { + padding-left: 1rem; + } + + &-wrapper:not(:first-child) { + margin-top: 1rem; + } } &__title { @@ -94,6 +101,26 @@ width: 14px; height: 14px; } + + &--video { + width: 17px; + height: 13px; + } + + &--audio { + width: 16px; + height: 14px; + } + + &--computer { + width: 16px; + height: 14px; + } + + &--map-pin { + width: 12px; + height: 16px; + } } &__item-text { diff --git a/packages/rocketchat-theme/client/imports/general/base_old.css b/packages/rocketchat-theme/client/imports/general/base_old.css index 0de736231c4..4d0b4a78fc4 100644 --- a/packages/rocketchat-theme/client/imports/general/base_old.css +++ b/packages/rocketchat-theme/client/imports/general/base_old.css @@ -92,7 +92,7 @@ } } -.rc-old .upload-preview { +.upload-preview { padding: 1rem; & .upload-preview-file { @@ -103,7 +103,7 @@ } } -.rc-old .upload-preview-title { +.upload-preview-title { padding: 3px; border-radius: 0 0 5px 5px; } @@ -4833,7 +4833,7 @@ body:not(.is-cordova) { } @media (height <= 400px) { - .rc-old .upload-preview .upload-preview-file { + .upload-preview .upload-preview-file { height: 100px; } } diff --git a/packages/rocketchat-theme/client/imports/general/forms.css b/packages/rocketchat-theme/client/imports/general/forms.css index 7f7521ea641..ec32ac0a981 100644 --- a/packages/rocketchat-theme/client/imports/general/forms.css +++ b/packages/rocketchat-theme/client/imports/general/forms.css @@ -314,10 +314,6 @@ color: #9ea2a8; text-transform: none; } - - &__item { - padding: 1px 0; - } } } } diff --git a/packages/rocketchat-ui-master/public/icons.svg b/packages/rocketchat-ui-master/public/icons.svg index 58cbc924a63..fe2dd6837a0 100644 --- a/packages/rocketchat-ui-master/public/icons.svg +++ b/packages/rocketchat-ui-master/public/icons.svg @@ -20,4 +20,7 @@ - + + + + \ No newline at end of file diff --git a/packages/rocketchat-ui-message/client/messageBox.html b/packages/rocketchat-ui-message/client/messageBox.html index 770a7c57916..b7df78f73ff 100644 --- a/packages/rocketchat-ui-message/client/messageBox.html +++ b/packages/rocketchat-ui-message/client/messageBox.html @@ -33,24 +33,25 @@
{{# each column in columns }}
- {{# each group in column }} -
-

{{group.name}}

-
    - {{# each group.actions }} -
  • - - - - - - {{_ actionName}} -
    • - {{/each}} -
-
+ {{#each group in column }} +
+

{{_ group.name}}

+
    + {{# each group.actions }} +
  • + + {{#if icon}} + + + + {{/if}} + + {{_ label}} +
    • + {{/each}} +
+
{{/each}} -
{{/each}}
diff --git a/packages/rocketchat-ui-message/client/messageBox.js b/packages/rocketchat-ui-message/client/messageBox.js index 4dd00c229ed..f293cb47c28 100644 --- a/packages/rocketchat-ui-message/client/messageBox.js +++ b/packages/rocketchat-ui-message/client/messageBox.js @@ -35,6 +35,35 @@ function applyMd(e, t) { }, 100); } box.focus(); + + // removes markdown if selected text in inside the same clicked markdown + const startPattern = this.pattern.substr(0, this.pattern.indexOf('{{text}}')); + const startPatternFound = [...startPattern].reverse().every((char, index) => { + return box.value.substr(selectionStart - index - 1, 1) === char; + }); + + if (startPatternFound) { + const endPattern = this.pattern.substr(this.pattern.indexOf('{{text}}') + '{{text}}'.length); + const endPatternFound = [...endPattern].every((char, index) => { + return box.value.substr(selectionEnd + index, 1) === char; + }); + + if (endPatternFound) { + box.selectionStart = selectionStart - startPattern.length; + box.selectionEnd = selectionEnd + endPattern.length; + + if (document.execCommand) { + document.execCommand('insertText', false, selectedText); + } else { + box.value = initText.substr(0, initText.length - startPattern.length) + selectedText + finalText.substr(endPattern.length); + } + box.selectionStart = selectionStart - startPattern.length; + box.selectionEnd = box.selectionStart + selectedText.length; + $(box).change(); + return; + } + } + /* get text apply pattern @@ -82,11 +111,14 @@ const markdownButtons = [ ]; Template.messageBox.helpers({ - toString(obj) { return JSON.stringify(obj); }, + toString(obj) { + return JSON.stringify(obj); + }, columns() { const groups = RocketChat.messageBox.actions.get(); const sorted = Object.keys(groups).sort((a, b) => groups[b].length - groups[a].length); - const totalColumn = sorted.reduce((total, key) => total + groups[key].length, 0) / 2; + const totalColumn = sorted.reduce((total, key) => total + groups[key].length, 0); + const totalPerColumn = Math.ceil(totalColumn / 2); const columns = []; let counter = 0; @@ -97,7 +129,7 @@ Template.messageBox.helpers({ counter += actions.length; columns[index].push({name: key, actions}); - if (counter > totalColumn) { + if (counter > totalPerColumn) { counter = 0; index++; }