From ae4eb33f0e010dd5fdb20e0399266b30fe1ca3a0 Mon Sep 17 00:00:00 2001
From: Ricardo Merino <masmerino@gmail.com>
Date: Mon, 27 Apr 2020 09:57:25 -0600
Subject: [PATCH] [4.3] MSPB-73: Update conference parameters and styling
 improvements (#192)

* Use switch control isntead of checkbox

* Update conference values

* Conference form styling improvements
---
 submodules/users/users.js                     |  6 ++---
 submodules/users/users.scss                   | 22 ++++++++++++++++++-
 .../users/views/feature-conferencing.html     | 19 ++++++++--------
 3 files changed, 33 insertions(+), 14 deletions(-)

diff --git a/submodules/users/users.js b/submodules/users/users.js
index 97ce4e6..00eee15 100644
--- a/submodules/users/users.js
+++ b/submodules/users/users.js
@@ -2104,9 +2104,9 @@ define(function(require) {
 
 					if (data.conference.enable_video_conferencing) {
 						data.conference = _.merge(data.conference, {
-							profile_name: 'verto',
-							caller_controls: 'verto-participant',
-							moderator_controls: 'verto-moderator'
+							profile_name: 'video',
+							caller_controls: 'video-participant',
+							moderator_controls: 'video-moderator'
 						});
 					} else {
 						delete data.conference.profile_name;
diff --git a/submodules/users/users.scss b/submodules/users/users.scss
index 3ec8e31..88cc106 100644
--- a/submodules/users/users.scss
+++ b/submodules/users/users.scss
@@ -854,12 +854,32 @@
 		form {
 			margin-bottom: 0;
 
+			.control-group {
+				&.main{
+					display: flex;
+					flex-direction: row;
+					align-items: center;
+					padding-bottom: 15px;
+
+					label.title {
+						font-size: 1em;
+						padding-right: 1em;
+						margin-bottom: 0px;
+						width: 230px;
+						text-align: right;
+					}
+				}
+
+				&.extra {
+					margin-bottom: 40px;
+				}
+			}
+
 			.list-numbers {
 				display: inline-block;
 				font-weight: 600;
 				height: 65px;
 				line-height: 15px;
-				margin-left: 25px;
 				overflow: auto;
 				vertical-align: middle;
 				width: 180px;
diff --git a/submodules/users/views/feature-conferencing.html b/submodules/users/views/feature-conferencing.html
index 9ee5ff6..a5af9a5 100644
--- a/submodules/users/views/feature-conferencing.html
+++ b/submodules/users/views/feature-conferencing.html
@@ -17,8 +17,8 @@
 
 	<div class="content{{#unless user.extra.mapFeatures.conferencing.active}} disabled{{/unless}}">
 		<form id="conferencing_form">
-			<div class="main-line">
-				{{ i18n.users.conferencing.number }}
+			<div class="control-group main">
+				<label class="title">{{ i18n.users.conferencing.number }}</label>
 				<div class="list-numbers" data-count="{{listConferences.length}}">
 					{{#each listConferences}}
 						<div class="conference-number">{{formatPhoneNumber this}}</div>
@@ -26,17 +26,16 @@
 				</div>
 			</div>
 
-			<div class="main-line">
-				{{ i18n.users.conferencing.pinLabel }}
+			<div class="control-group main">
+				<label class="title">{{ i18n.users.conferencing.pinLabel }}</label>
 				<input required id="pin" type="text" name="conference_numbers[]" class="input-small" value="{{conference.conference_numbers.[0]}}"></input>
 			</div>
 
-			<div class="main-line">
-				<label class="fix-left">
-					{{#monsterCheckbox i18n.users.conferencing.enableVideoConferencing}}
-						<input type="checkbox" name="enable_video_conferencing"{{#if conference.enable_video_conferencing}} checked{{/if}}></input>
-					{{/monsterCheckbox}}
-				</label>
+			<div class="control-group main">
+				<label class="title">{{i18n.users.conferencing.enableVideoConferencing}}</label>
+				{{#monsterSwitch}}
+					<input type="checkbox" name="enable_video_conferencing" id="enable_video_conferencing" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if conference.enable_video_conferencing}} checked="checked"{{/if}}></input>
+				{{/monsterSwitch}}
 			</div>
 		</form>