Registrations currently disabled due to spam. Contact me externally if you need an account

Commit a18d1641 authored by Gabriel Engel's avatar Gabriel Engel Committed by GitHub
Browse files

Merge pull request #5231 from RocketChat/livechat-icon-minimize-maximize 

Add icon to minimize and maximize livechat widget
parents d9dc99d3 69e8fd1a

packages/rocketchat-livechat/app/client/lib/_livechat.js

+14 −0
Original line number Diff line number Diff line
@@ -26,6 +26,8 @@ this.Livechat = new (class Livechat { 


		this._ready = new ReactiveVar(false);



		this._widgetOpened = new ReactiveVar(false);



		Tracker.autorun(() => {

			if (this._room.get() && Meteor.userId()) {

				RoomHistoryManager.getMoreIfIsEmpty(this._room.get());
@@ -150,4 +152,16 @@ this.Livechat = new (class Livechat { 
	isReady() {

		return this._ready.get();

	}



	setWidgetOpened() {

		return this._widgetOpened.set(true);

	}



	setWidgetClosed() {

		return this._widgetOpened.set(false);

	}



	isWidgetOpened() {

		return this._widgetOpened.get();

	}

})();

packages/rocketchat-livechat/app/client/lib/hooks.js

+8 −0
Original line number Diff line number Diff line
@@ -27,6 +27,14 @@ var api = { 


	clearDepartment: function() {

		Livechat.department = null;

	},



	widgetOpened: function() {

		Livechat.setWidgetOpened();

	},



	widgetClosed: function() {

		Livechat.setWidgetClosed();

	}

};

packages/rocketchat-livechat/app/client/stylesheets/main.less

+11 −0
Original line number Diff line number Diff line
@@ -153,6 +153,7 @@ input:focus { 
			padding-right: 5px;



			svg {

				cursor: pointer;

				fill: currentColor;

				width: 14px;

				margin: 0 2px;
@@ -160,6 +161,16 @@ input:focus { 
			}

		}

	}



	&.popout {

		border-top-right-radius: 0;

		border-top-left-radius: 0;



		.title {

			cursor: default;

		}

	}



	.messages {

		flex: 1 1 100%;

packages/rocketchat-livechat/app/client/views/livechatWindow.html

+14 −4
Original line number Diff line number Diff line 
<template name="livechatWindow">

	{{#if livechatStarted}}

		<div class="livechat-room">

		<div class="livechat-room {{#if popoutActive}}popout{{/if}}">

			<div class="title" style="background-color:{{color}}; color: {{fontColor}}">

				<div class="toolbar">

					&nbsp;

					{{#unless popoutActive}}

						{{#if isOpened}}

							<svg class="minimize" title="Minimize" viewBox="0 0 448 448" xmlns="http://www.w3.org/2000/svg">

								<path d="M448 328v48c0 22-18 40-40 40h-368c-22 0-40-18-40-40v-48c0-22 18-40 40-40h368c22 0 40 18 40 40z"></path>

							</svg>

						{{else}}

							<svg class="maximize" title="Maximize" viewBox="0 0 448 448" xmlns="http://www.w3.org/2000/svg">

								<path d="M64 352h320v-192h-320v192zM448 72v304c0 22-18 40-40 40h-368c-22 0-40-18-40-40v-304c0-22 18-40 40-40h368c22 0 40 18 40 40z"></path>

							</svg>

						{{/if}}

					{{/unless}}

					{{#if soundActive}}

						<svg class="sound" title="Toggle notification sound" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">

							<path d="M912 1696q0-16-16-16-59 0-101.5-42.5t-42.5-101.5q0-16-16-16t-16 16q0 73 51.5 124.5t124.5 51.5q16 0 16-16zm816-288q0 52-38 90t-90 38h-448q0 106-75 181t-181 75-181-75-75-181h-448q-52 0-90-38t-38-90q50-42 91-88t85-119.5 74.5-158.5 50-206 19.5-260q0-152 117-282.5t307-158.5q-8-19-8-39 0-40 28-68t68-28 68 28 28 68q0 20-8 39 190 28 307 158.5t117 282.5q0 139 19.5 260t50 206 74.5 158.5 85 119.5 91 88z" />
@@ -14,9 +25,8 @@ 
						</svg>

					{{/if}}

					{{#unless popoutActive}}

						<svg class="popout" aria-label="{{_ "Open in a new window"}}" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">

							<path d="M392.857,292.354h-18.274c-2.669,0-4.859,0.855-6.563,2.573c-1.718,1.708-2.573,3.897-2.573,6.563v91.361 c0,12.563-4.47,23.315-13.415,32.262c-8.945,8.945-19.701,13.414-32.264,13.414H82.224c-12.562,0-23.317-4.469-32.264-13.414 c-8.945-8.946-13.417-19.698-13.417-32.262V155.31c0-12.562,4.471-23.313,13.417-32.259c8.947-8.947,19.702-13.418,32.264-13.418 h200.994c2.669,0,4.859-0.859,6.57-2.57c1.711-1.713,2.566-3.9,2.566-6.567V82.221c0-2.662-0.855-4.853-2.566-6.563 c-1.711-1.713-3.901-2.568-6.57-2.568H82.224c-22.648,0-42.016,8.042-58.102,24.125C8.042,113.297,0,132.665,0,155.313v237.542 c0,22.647,8.042,42.018,24.123,58.095c16.086,16.084,35.454,24.13,58.102,24.13h237.543c22.647,0,42.017-8.046,58.101-24.13 c16.085-16.077,24.127-35.447,24.127-58.095v-91.358c0-2.669-0.856-4.859-2.574-6.57 C397.709,293.209,395.519,292.354,392.857,292.354z"></path>

							<path d="M506.199,41.971c-3.617-3.617-7.905-5.424-12.85-5.424H347.171c-4.948,0-9.233,1.807-12.847,5.424 c-3.617,3.615-5.428,7.898-5.428,12.847s1.811,9.233,5.428,12.85l50.247,50.248L198.424,304.067 c-1.906,1.903-2.856,4.093-2.856,6.563c0,2.479,0.953,4.668,2.856,6.571l32.548,32.544c1.903,1.903,4.093,2.852,6.567,2.852 s4.665-0.948,6.567-2.852l186.148-186.148l50.251,50.248c3.614,3.617,7.898,5.426,12.847,5.426s9.233-1.809,12.851-5.426 c3.617-3.616,5.424-7.898,5.424-12.847V54.818C511.626,49.866,509.813,45.586,506.199,41.971z"></path>

						<svg class="popout" aria-label="{{_ "Open in a new window"}}" viewBox="0 0 448 448" xmlns="http://www.w3.org/2000/svg">

							<path d="M320 232v-120c0-8.75-7.25-16-16-16h-120c-6.5 0-12.25 4-14.75 9.75-2.5 6-1.25 13 3.5 17.5l36 36-133.5 133.5c-6.25 6.25-6.25 16.25 0 22.5l25.5 25.5c6.25 6.25 16.25 6.25 22.5 0l133.5-133.5 36 36c3 3.25 7 4.75 11.25 4.75 2 0 4.25-0.5 6.25-1.25 5.75-2.5 9.75-8.25 9.75-14.75zM384 104v240c0 39.75-32.25 72-72 72h-240c-39.75 0-72-32.25-72-72v-240c0-39.75 32.25-72 72-72h240c39.75 0 72 32.25 72 72z"></path>

						</svg>

					{{/unless}}

				</div>

packages/rocketchat-livechat/app/client/views/livechatWindow.js

+3 −0
Original line number Diff line number Diff line
@@ -41,6 +41,9 @@ Template.livechatWindow.helpers({ 
	},

	videoCalling() {

		return LivechatVideoCall.isActive();

	},

	isOpened() {

		return Livechat.isWidgetOpened();

	}

});