From 490a9afddf33b46ddc2d831ad0929407590c161a Mon Sep 17 00:00:00 2001 From: Carlos Hernandez Date: Tue, 10 Jan 2017 18:48:33 +0100 Subject: [PATCH 1/5] Add option for not upload files --- dist/chat.js | 8 ++++++++ js/chat.js | 8 ++++++++ 2 files changed, 16 insertions(+) diff --git a/dist/chat.js b/dist/chat.js index 0bbb8c1..7f60ebc 100644 --- a/dist/chat.js +++ b/dist/chat.js @@ -18,6 +18,7 @@ function IASChat(config) { var defaultSupportPic = config.defaultSupportPic || 'https://s3.amazonaws.com/uifaces/faces/twitter/robertovivancos/128.jpg'; var container = config.container || null; var hashSign = config.hashSign || '?'; + var uploadFiles = config.uploadFiles || true; // Prepare interface printInterface(container); @@ -169,6 +170,13 @@ function IASChat(config) { // Form colors form.children[0].style.borderColor = inputBorderColor; + + // Upload form buttons + if(!uploadFiles) { + form.children[0].style.display = 'none'; + form.children[1].style.margin = '0 16px'; + form.children[1].style.width = 'calc(100% - 88px)'; + } } diff --git a/js/chat.js b/js/chat.js index b5cbb40..2751bad 100644 --- a/js/chat.js +++ b/js/chat.js @@ -18,6 +18,7 @@ function IASChat(config) { var defaultSupportPic = config.defaultSupportPic || 'https://s3.amazonaws.com/uifaces/faces/twitter/robertovivancos/128.jpg'; var container = config.container || null; var hashSign = config.hashSign || '?'; + var uploadFiles = config.uploadFiles || true; // Prepare interface printInterface(container); @@ -169,6 +170,13 @@ function IASChat(config) { // Form colors form.children[0].style.borderColor = inputBorderColor; + + // Upload form buttons + if(!uploadFiles) { + form.children[0].style.display = 'none'; + form.children[1].style.margin = '0 16px'; + form.children[1].style.width = 'calc(100% - 88px)'; + } } From 102840d48f2deec2b22d136273bbe64819c6cff8 Mon Sep 17 00:00:00 2001 From: Carlos Hernandez Date: Tue, 10 Jan 2017 18:53:20 +0100 Subject: [PATCH 2/5] Add option for upload only pictures --- js/chat.js | 56 ++++++++++++++++++++++++++++++------------------------ 1 file changed, 31 insertions(+), 25 deletions(-) diff --git a/js/chat.js b/js/chat.js index 2751bad..98e009b 100644 --- a/js/chat.js +++ b/js/chat.js @@ -19,6 +19,7 @@ function IASChat(config) { var container = config.container || null; var hashSign = config.hashSign || '?'; var uploadFiles = config.uploadFiles || true; + var onlyImages = config.onlyImages || true; // Prepare interface printInterface(container); @@ -427,43 +428,48 @@ function IASChat(config) { // File or Blob named mountains.jpg var file = attatchment; // uploadFile.files[0]; + var metadata; if(!file) { console.error('Empty file'); return false; } - var extension = validateExtension(file); + if(onlyPictures) { - if(extension === null) { - console.error('Invalid file extension'); - return false; - } + var extension = validateExtension(file); - var contentType = ''; - switch(extension) { - case '.jpg': - case '.jpeg': - contentType = 'image/jpeg'; - break; + if(extension === null) { + console.error('Invalid file extension'); + return false; + } - case '.png': - contentType = 'image/png'; - break; + var contentType = ''; + switch(extension) { + case '.jpg': + case '.jpeg': + contentType = 'image/jpeg'; + break; - case '.bmp': - contentType = 'image/bmp'; - break; + case '.png': + contentType = 'image/png'; + break; - case '.gif': - contentType = 'image/gif'; - break; - } + case '.bmp': + contentType = 'image/bmp'; + break; - // Create the file metadata - var metadata = { - contentType: contentType - }; + case '.gif': + contentType = 'image/gif'; + break; + } + + // Create the file metadata + metadata = { + contentType: contentType + }; + + } // Upload file and metadata to the object 'images/mountains.jpg' var uploadTask = storageRef.child('images/' + uid + '/' + file.name).put(file, metadata); From 61971e986d2b1abfdea88ddb863531d6649ecef8 Mon Sep 17 00:00:00 2001 From: Carlos Hernandez Date: Tue, 10 Jan 2017 18:58:10 +0100 Subject: [PATCH 3/5] [Fix] Send only file (no text) --- dist/chat.js | 58 +++++++++++++++++++++++++++++----------------------- js/chat.js | 4 ++-- 2 files changed, 34 insertions(+), 28 deletions(-) diff --git a/dist/chat.js b/dist/chat.js index 7f60ebc..167d36c 100644 --- a/dist/chat.js +++ b/dist/chat.js @@ -19,6 +19,7 @@ function IASChat(config) { var container = config.container || null; var hashSign = config.hashSign || '?'; var uploadFiles = config.uploadFiles || true; + var onlyPictures = config.onlyPictures || true; // Prepare interface printInterface(container); @@ -207,7 +208,7 @@ function IASChat(config) { var text = e.srcElement.children[1].value - if(text === '') { + if(text === '' && attatchment === null) { console.log('tried to send empty form. Rejected.'); return false; } @@ -427,43 +428,48 @@ function IASChat(config) { // File or Blob named mountains.jpg var file = attatchment; // uploadFile.files[0]; + var metadata; if(!file) { console.error('Empty file'); return false; } - var extension = validateExtension(file); + if(onlyPictures) { - if(extension === null) { - console.error('Invalid file extension'); - return false; - } + var extension = validateExtension(file); - var contentType = ''; - switch(extension) { - case '.jpg': - case '.jpeg': - contentType = 'image/jpeg'; - break; + if(extension === null) { + console.error('Invalid file extension'); + return false; + } - case '.png': - contentType = 'image/png'; - break; + var contentType = ''; + switch(extension) { + case '.jpg': + case '.jpeg': + contentType = 'image/jpeg'; + break; - case '.bmp': - contentType = 'image/bmp'; - break; + case '.png': + contentType = 'image/png'; + break; - case '.gif': - contentType = 'image/gif'; - break; - } + case '.bmp': + contentType = 'image/bmp'; + break; - // Create the file metadata - var metadata = { - contentType: contentType - }; + case '.gif': + contentType = 'image/gif'; + break; + } + + // Create the file metadata + metadata = { + contentType: contentType + }; + + } // Upload file and metadata to the object 'images/mountains.jpg' var uploadTask = storageRef.child('images/' + uid + '/' + file.name).put(file, metadata); diff --git a/js/chat.js b/js/chat.js index 98e009b..c530723 100644 --- a/js/chat.js +++ b/js/chat.js @@ -19,7 +19,7 @@ function IASChat(config) { var container = config.container || null; var hashSign = config.hashSign || '?'; var uploadFiles = config.uploadFiles || true; - var onlyImages = config.onlyImages || true; + var onlyPictures = config.onlyPictures || true; // Prepare interface printInterface(container); @@ -208,7 +208,7 @@ function IASChat(config) { var text = e.srcElement.children[1].value - if(text === '') { + if(text === '' && attatchment === null) { console.log('tried to send empty form. Rejected.'); return false; } From b831ea0750f2361d36274801ba411c7de59b63a5 Mon Sep 17 00:00:00 2001 From: Carlos Hernandez Date: Tue, 10 Jan 2017 19:38:56 +0100 Subject: [PATCH 4/5] Add desktop support --- dist/chat.js | 2 +- template/ias_style.html | 21 +++++++++++++++++++++ 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/dist/chat.js b/dist/chat.js index 167d36c..7f01ae0 100644 --- a/dist/chat.js +++ b/dist/chat.js @@ -135,7 +135,7 @@ function IASChat(config) { } // Also add the styles from css/style.css - ias += ''; + ias += ''; var printplace = null; diff --git a/template/ias_style.html b/template/ias_style.html index 3596ebe..f46eb6a 100644 --- a/template/ias_style.html +++ b/template/ias_style.html @@ -151,4 +151,25 @@ right: 16px; width: 56px; } + + @media screen and (min-width: 842px) { + #ias { + height: 600px; + width: 368px; + position: fixed; + right: 0; + bottom: 0; + top: auto; + overflow: hidden; + left: auto; + } + + #ias_message { + height: 483px; + } + + #ias_attachment, #ias_write { + position: absolute; + } + } \ No newline at end of file From 7852d3c2bfa15f10d49ebdd0f6b899f785f1335c Mon Sep 17 00:00:00 2001 From: Carlos Hernandez Date: Tue, 10 Jan 2017 19:42:33 +0100 Subject: [PATCH 5/5] Update documentation --- README.md | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index de4f1ee..c581e8e 100644 --- a/README.md +++ b/README.md @@ -47,14 +47,13 @@ To configure the chat, just use the object passed on IASChat instantiation. *Bol - hashSign: String Symbol or string to add before url hash when chat open (Default: '?'. I.e.: url#existentHash**?**ias=true) - defaultSupportName: String Default support name (if no supporter assigned) - defaultSupportPic: String Default support picture (if no supporter assigned) + - uploadFiles: Boolean Enable or disable the option to upload and send files (Default: true) + - onlyPictures: Boolean Allow only pictures, or all file types (Default: true) In IASChatProvider, there are some extra features: - container: String Container for support panel (*#identifier* or *.className*. Default: *body*) - chatContainer: String Container for chat (*#identifier* or *.className*. Default: *body* or support container) -In the future, early future, I hope to add... - - uploadFiles: Boolean Enable or disable the option to upload and send pictures. - - onlyPictures: Boolean Allow only pictures, or all file types. *I'm open to any suggestion or request for more configuration params. Don't hesitate to open a new Issue* @@ -118,9 +117,6 @@ Initialize the support user, and done. ### Secure the panel This is your work. Support pannel in demo folder is not really a support panel, but a demo. This is not a fully control panel app, just a support chat "component" to add to your existing app. - -## Responsiveness -Nope, right now is not desktop/tablet responsive, just mobile, but I'm doing my best to add larger screen support. ## Contribute You can use this code as you like. If you find a bug, or want to ask for a feature, just open an issue, and we'll do our best. If you can fix it, do a pull request to ``dev`` branch, and we promise to review it as fast as possible to merge it.