[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

@@ -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;

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;

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>