share files to new modal

packages/rocketchat-google-vision/.npm/package/npm-shrinkwrap.json

@@ -47,9 +47,9 @@
       "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
     "async": {
-      "version": "2.5.0",
+      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+      "resolved": "https://registry.npmjs.org/async/-/async-2.6.0.tgz",
-      "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
+      "integrity": "sha512-xAfGg1/NTLBBKlHFmnd7PlmUW9KhVQIUuSrYem9xzFUZy13ScvtyGGejaae9iAVRiRq9+Cx7DPFaAAhCpyxyPw=="
     },
     "asynckit": {
       "version": "0.4.0",

packages/rocketchat-livechat/app/package-lock.json

@@ -86,7 +86,7 @@
     "bcrypt": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/bcrypt/-/bcrypt-1.0.3.tgz",
-      "integrity": "sha512-pRyDdo73C8Nim3jwFJ7DWe3TZCgwDfWZ6nHS5LSdU77kWbj1frruvdndP02AOavtD4y8v6Fp2dolbHgp4SDrfg==",
+      "integrity": "sha1-sC3cbAtS6ha40883XVoy54DatUg=",
       "requires": {
         "nan": "2.6.2",
         "node-pre-gyp": "0.6.36"
@@ -314,7 +314,7 @@
     "glob": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+      "integrity": "sha1-wZyd+aAocC1nhhI4SmVSQExjbRU=",
       "requires": {
         "fs.realpath": "1.0.0",
         "inflight": "1.0.6",
@@ -469,7 +469,7 @@
     "minimatch": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+      "integrity": "sha1-UWbihkV/AzBgZL5Ul+jbsMPTIIM=",
       "requires": {
         "brace-expansion": "1.1.8"
       }
@@ -530,7 +530,7 @@
     "npmlog": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
-      "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
+      "integrity": "sha1-CKfyqL9zRgR3mp76StXMcXq7lUs=",
       "requires": {
         "are-we-there-yet": "1.1.4",
         "console-control-strings": "1.1.0",
@@ -626,7 +626,7 @@
     "readable-stream": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
+      "integrity": "sha1-No8lEtefnUb9/HE0mueHi7weuVw=",
       "requires": {
         "core-util-is": "1.0.2",
         "inherits": "2.0.3",
@@ -640,7 +640,7 @@
     "regenerator-runtime": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
-      "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
+      "integrity": "sha1-flT+W1zNXWYk6mJVw0c74JC4AuE="
     },
     "request": {
       "version": "2.83.0",
@@ -682,12 +682,12 @@
     "safe-buffer": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
-      "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
+      "integrity": "sha1-iTMSr2myEj3vcfV4iQAWce6yyFM="
     },
     "semver": {
       "version": "5.4.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-      "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+      "integrity": "sha1-4FnAnYVx8FQII3M0M1BdOi8AsY4="
     },
     "set-blocking": {
       "version": "2.0.0",
@@ -740,7 +740,7 @@
     "string_decoder": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
+      "integrity": "sha1-D8Z9fBQYJd6UKC3VNr7GubzoYKs=",
       "requires": {
         "safe-buffer": "5.1.1"
       }
@@ -842,7 +842,7 @@
     "uuid": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz",
-      "integrity": "sha512-DIWtzUkw04M4k3bf1IcpS2tngXEL26YUD2M0tMDUpnUrz2hgzUBlD55a4FjdLGPvfHxS6uluGWvaVEqgBcVa+g=="
+      "integrity": "sha1-PdPT55Crwk17DToDT/q6vijrvAQ="
     },
     "verror": {
       "version": "1.10.0",
@@ -857,7 +857,7 @@
     "wide-align": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
-      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w==",
+      "integrity": "sha1-Vx4PGwYEY268DfwhsDObvjE0FxA=",
       "requires": {
         "string-width": "1.0.2"
       }

packages/rocketchat-theme/client/imports/components/modal.css

@@ -1,6 +1,6 @@
 
 .rc-modal {
-  min-width: 300px;
+  min-width: 400px;
   background: white;
 
   boder-radius: 15px;
@@ -9,6 +9,7 @@
 	box-shadow: 0 0 2px 0 rgba(47, 52, 61, 0.08), 0 0 12px 0 rgba(47, 52, 61, 0.12);
 
   &-wrapper {
+		padding: 10px;
 		z-index: 10;
     display: flex;
     position: fixed;
@@ -59,12 +60,11 @@
 	&__footer {
     padding: 16px;
     background: #F7F8FA;
+		display: flex;
+		justify-content: space-between;
 		& > .rc-button {
 			margin: 0;
 		}
-		& .rc-button--primary {
-			float: right;
-		}
 	}
 }
 @media (width <= 400px) {

packages/rocketchat-ui-message/startup/messageBoxActions.js

@@ -90,8 +90,9 @@ RocketChat.messageBox.actions.add('Share', 'My_location', {
 		const position = RocketChat.Geolocation.get();
 		const latitude = position.coords.latitude;
 		const longitude = position.coords.longitude;
-		const text = `<div class="location-preview"><img style="height: 250px; width: 250px;" src="https://maps.googleapis.com/maps/api/staticmap?zoom=14&size=250x250&markers=color:gray%7Clabel:%7C${ latitude },${ longitude }&key=${ RocketChat.settings.get('MapView_GMapsAPIKey') }" /></div>`;
+		const text = `<img style="height: 250px; width: 500px;" src="https://maps.googleapis.com/maps/api/staticmap?zoom=14&size=250x500&markers=color:gray%7Clabel:%7C${ latitude },${ longitude }&key=${ RocketChat.settings.get('MapView_GMapsAPIKey') }" />`;
-		swal({
+
+		modal.open({
 			title: t('Share_Location_Title'),
 			text,
 			showCancelButton: true,

packages/rocketchat-ui/client/lib/fileUpload.js

@@ -54,12 +54,12 @@ fileUpload = function(filesToUpload) {
 	function consume() {
 		const file = files.pop();
 		if ((file == null)) {
-			swal.close();
+			modal.close();
 			return;
 		}
 
 		if (!RocketChat.fileUploadIsValidContentType(file.file.type)) {
-			swal({
+			modal.open({
 				title: t('FileUpload_MediaType_NotAccepted'),
 				text: file.file.type || `*.${ s.strRightBack(file.file.name, '.') }`,
 				type: 'error',
@@ -69,7 +69,7 @@ fileUpload = function(filesToUpload) {
 		}
 
 		if (file.file.size === 0) {
-			swal({
+			modal.open({
 				title: t('FileUpload_File_Empty'),
 				type: 'error',
 				timer: 1000
@@ -89,8 +89,12 @@ fileUpload = function(filesToUpload) {
 	</audio>
 </div>
 <div class='upload-preview-title'>
-	<input id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	<div class="rc-input__wrapper">
-	<input id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+		<input class="rc-input__element" id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	</div>
+	<div class="rc-input__wrapper">
+		<input class="rc-input__element" id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+	</div>
 </div>`;
 			} else if (file.type === 'video') {
 				text = `\
@@ -101,8 +105,12 @@ fileUpload = function(filesToUpload) {
 	</video>
 </div>
 <div class='upload-preview-title'>
-	<input id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	<div class="rc-input__wrapper">
-	<input id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+		<input class="rc-input__element" id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	</div>
+	<div class="rc-input__wrapper">
+		<input class="rc-input__element" id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+	</div>
 </div>`;
 			} else if (file.type === 'image') {
 				text = `\
@@ -110,8 +118,12 @@ fileUpload = function(filesToUpload) {
 	<div class='upload-preview-file' style='background-image: url(${ preview })'></div>
 </div>
 <div class='upload-preview-title'>
-	<input id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	<div class="rc-input__wrapper">
-	<input id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+		<input class="rc-input__element" id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	</div>
+	<div class="rc-input__wrapper">
+		<input class="rc-input__element" id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+	</div>
 </div>`;
 			} else {
 				const fileSize = formatBytes(file.file.size);
@@ -121,12 +133,16 @@ fileUpload = function(filesToUpload) {
 	<div>${ Handlebars._escape(file.name) } - ${ fileSize }</div>
 </div>
 <div class='upload-preview-title'>
-	<input id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	<div class="rc-input__wrapper">
-	<input id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+		<input class="rc-input__element" id='file-name' style='display: inherit;' value='${ Handlebars._escape(file.name) }' placeholder='${ t('Upload_file_name') }'>
+	</div>
+	<div class="rc-input__wrapper">
+		<input class="rc-input__element" id='file-description' style='display: inherit;' value='' placeholder='${ t('Upload_file_description') }'>
+	</div>
 </div>`;
 			}
 
-			return swal({
+			return modal.open({
 				title: t('Upload_file_question'),
 				text,
 				showCancelButton: true,
@@ -136,10 +152,6 @@ fileUpload = function(filesToUpload) {
 				cancelButtonText: t('Cancel'),
 				html: true
 			}, function(isConfirm) {
-				consume();
-				if (!isConfirm) {
-					return;
-				}
 
 				const record = {
 					name: document.getElementById('file-name').value || file.name || file.file.name,
@@ -149,6 +161,10 @@ fileUpload = function(filesToUpload) {
 					description: document.getElementById('file-description').value
 				};
 
+				consume();
+				if (!isConfirm) {
+					return;
+				}
 				const upload = fileUploadHandler('Uploads', record, file.file);
 
 				let uploading = Session.get('uploading') || [];

packages/rocketchat-ui/client/views/app/modal.html

@@ -17,10 +17,21 @@
 					{{# if content}}
 						{{> Template.dynamic template=content data=data}}
 					{{/if}}
+					{{# if text}}
+						{{# if html}}
+							{{{text}}}
+						{{else}}
+							{{text}}
+						{{/if}}
+					{{/if}}
 				</main>
 				<div class="rc-modal__footer">
+					{{# if showCancelButton}}
 					<input class="rc-button rc-button--nude js-close" type="submit" data-button="cancel" value="Cancel">
-					<input class="rc-button rc-button--primary" type="submit" data-button="create" value="Create">
+					{{/if}}
+
+					<input style="background-color:{{confirmButtonColor}}" class="rc-button rc-button--primary js-confirm" type="submit" data-button="create" value="{{confirmButtonText}}">
+
 				</div>
 			{{/if}}
 

packages/rocketchat-ui/client/views/app/modal.js

@@ -2,15 +2,31 @@
 
 this.modal = {
 	renderedModal: null,
-	open(config) {
+	open(config = {
+		confirmButtonText: t('ok'),
+		cancelButtonText: t('Cancel')
+	}, fn) {
 		this.close();
 		this.renderedModal = Blaze.renderWithData(Template.rc_modal, config, document.body);
+		this.fn = fn;
+		this.config = config;
+		this.timer = null;
+		if (config.timer) {
+			this.timer = setTimeout(() => this.close(), config.timer);
+		}
 	},
 	close() {
 		if (this.renderedModal) {
 			Blaze.remove(this.renderedModal);
 		}
-
+		this.fn = null;
+		if (this.timer) {
+			clearTimeout(this.timer);
+		}
+	},
+	confirm() {
+		this.fn(true);
+		this.config.closeOnConfirm && this.close();
 	}
 };
 
@@ -39,5 +55,8 @@ Template.rc_modal.events({
 	},
 	'click .js-close'() {
 		modal.close();
+	},
+	'click .js-confirm'() {
+		modal.confirm();
 	}
 });