Misc submodule - Add export param to "Set Variables"

src/apps/callflows/i18n/en-US.json

@@ -1203,7 +1203,9 @@
 			"tip": "Set Custom Application Var ",
 			"help": "This feature allows you to set custom application variables providing key/value",
 			"key": "Key",
-			"value": "Value"
+			"value": "Value",
+			"export_label": "Export",
+			"export_tooltip": "When true the provided key-value pairs are set on the channel and any channel bridged to it later"
 		},
 
 		"__comment": "UI-2646: adding ring group togle to adv. callflows",

src/apps/callflows/submodules/misc/misc.css

@@ -1,36 +1,29 @@
 /********** Two columns **********/
-
 .callflows-port #two_columns {
-	padding-bottom: 20px;
-}
+	padding-bottom: 20px; }
 
 .callflows-port #two_columns .wrapper {
 	clear: left;
 	width: 520px;
-	padding: 10px;
-}
+	padding: 10px; }
 
 .callflows-port #two_columns .wrapper_form {
 	margin-top: 20px;
-	margin-left: 40px;
-}
+	margin-left: 40px; }
 
 .callflows-port #two_columns .wrapper .column {
 	width: 220px;
 	padding: 6px 0px 5px;
 	background: #444;
-	border-radius: 6px;
-}
+	border-radius: 6px; }
 
 .callflows-port #two_columns .wrapper .column.right {
 	float: right;
-	margin-left: 10px;
-}
+	margin-left: 10px; }
 
 .callflows-port #two_columns .wrapper .column.left {
 	float: left;
-	margin-right: 10px;
-}
+	margin-right: 10px; }
 
 .callflows-port #two_columns .wrapper .title_column {
 	background-color: #AFAFAF;
@@ -39,27 +32,23 @@
 	font-weight: bold;
 	font-size: 14px;
 	text-align: center;
-	margin-bottom: 3px;
-}
+	margin-bottom: 3px; }
 
 .callflows-port #two_columns .wrapper .left ul.connect {
 	background-color: #444444;
 	height: 289px;
 	width: 220px;
 	overflow: auto;
-	float: left;
-}
+	float: left; }
 
 .callflows-port #two_columns .wrapper .connect {
-	min-height: 289px;
-}
+	min-height: 289px; }
 
 .callflows-port #two_columns .wrapper .right ul.connect {
 	background-color: #444444;
 	height: 289px;
 	width: 220px;
-	overflow: auto;
-}
+	overflow: auto; }
 
 .callflows-port #two_columns .wrapper li {
 	list-style-type: none;
@@ -71,37 +60,32 @@
 	list-style-type: none;
 	overflow: hidden;
 	position: relative;
-	cursor: default;
-}
+	cursor: default; }
 
 .callflows-port #two_columns .wrapper li:not(:first-child) {
-	border-top: 1px solid #444;
-}
+	border-top: 1px solid #444; }
 
 .callflows-port #two_columns .item_name {
-	float:left;
+	float: left;
 	overflow: hidden;
 	height: 28px;
 	line-height: 28px;
 	width: 155px;
 	font-size: 12px;
-	white-space: nowrap;
-}
+	white-space: nowrap; }
+
 .callflows-port #two_columns .item_name.right {
-	width: 120px;
-}
+	width: 120px; }
 
 .callflows-port #two_columns .wrapper li:hover {
-	background-color: #cccccc;
-}
+	background-color: #cccccc; }
 
 .callflows-port #two_columns .wrapper li a.drag_btn {
 	float: left;
 	height: 28px;
 	width: 7px;
 	margin-right: 5px;
-	margin-left: 1px;
-}
+	margin-left: 1px; }
 
 /* Ring group specific css */
 .callflows-port #two_columns .options {
@@ -109,50 +93,42 @@
 	margin-right: 2px;
 	padding-left: 4px;
 	border-left: 1px solid #444444;
-	height: 28px;
-}
+	height: 28px; }
 
 .callflows-port #two_columns .options .option {
 	width: 30px;
 	font-size: 12px;
 	margin-top: 2px;
-	height: 20px;
-}
+	height: 20px; }
 
 .callflows-port #two_columns .ring_group_form_wrapper {
 	display: block;
 	margin: auto;
-	width: 260px;
-}
+	width: 260px; }
 
 .callflows-port #two_columns .form_field_div {
-	width: 260px;
-}
+	width: 260px; }
 
 .callflows-port #two_columns .button_field_div {
 	margin: 20px 0px 5px;
-	text-align: center;
-}
+	text-align: center; }
 
 /********** Listpanel's search box **********/
-
 .callflows-port .search_box {
 	height: 28px;
-	background-color:#444444;
+	background-color: #444444;
 	padding-top: 7px;
-	border-bottom: 1px solid #222;
-}
+	border-bottom: 1px solid #222; }
 
 .callflows-port .search_box .searchsubmit1 {
 	float: left;
 	height: 20px;
-	width: 23px;
-}
+	width: 23px; }
+
 .callflows-port .search_box .searchsubmit2 {
 	float: left;
 	height: 20px;
-	width: 26px;
-}
+	width: 26px; }
 
 .callflows-port .search_box .searchfield {
 	border: medium none;
@@ -160,37 +136,72 @@
 	height: 14px;
 	width: 130px;
 	border-radius: 0px;
-	box-shadow: none;
-}
+	box-shadow: none; }
 
 .callflows-port .search_box .searchfield:focus {
 	border: none;
 	border-color: transparent;
 	-webkit-box-shadow: none;
 	-moz-box-shadow: none;
-	box-shadow: none;
-}
+	box-shadow: none; }
 
 /********** Receive Fax **********/
-
 .callflows-port#fax_callflow_popup #t_38_checkbox {
-	margin-top: 8px;
-}
+	margin-top: 8px; }
 
 /* Missed call alert */
 #missed_call_alert_popup {
-	width: 540px;
-}
+	width: 540px; }
+
 #missed_call_alert_popup .buttons-center {
-	margin-top: 10px;
-}
+	margin-top: 10px; }
 
 #missed_call_alert_popup form {
 	margin-bottom: 0;
-	margin-top: 20px;
-}
+	margin-top: 20px; }
+
+/* Set CAV */
+#set_cav_alert_popup .cav-add-row {
+	margin-bottom: 15px; }
+#set_cav_alert_popup .cav-add-row .svg-icon {
+	cursor: pointer; }
+
+#set_cav_alert_popup .cav-remove-row {
+	margin-top: -10px;
+	cursor: pointer;
+	display: inline;
+	visibility: hidden; }
+
+#set_cav_alert_popup .cav-remove-row:hover {
+	color: #ff0000; }
+
+#set_cav_alert_popup .cav-list tr:hover .cav-remove-row {
+	visibility: visible; }
+
+#set_cav_alert_popup .popup_field > label,
+#set_cav_alert_popup .field_wrapper {
+	display: inline-block;
+	width: auto;
+	float: none; }
+
+#set_cav_alert_popup .monster-switch {
+	float: none; }
 
 /* Collect DTMF Popup */
 .dialog_popup.collect-dtmf-popup .form_content .popup_field {
-	padding-bottom: 0;
-}
+	padding-bottom: 0; }
+
+/************ Webhooks *************/
+.callflows-port#webhook_popup {
+	max-width: 450px; }
+.callflows-port#webhook_popup .custom-data label[for="custom_data"] {
+	display: block;
+	text-align: center;
+	width: 100%; }
+.callflows-port#webhook_popup .custom-data .custom-data-container {
+	clear: both; }
+.callflows-port#webhook_popup .custom-data .custom-data-container .data-key {
+	flex: initial;
+	width: 140px; }
+.callflows-port#webhook_popup .monster-invalid {
+	float: none; }

src/apps/callflows/submodules/misc/misc.js

@@ -1352,7 +1352,7 @@ define(function(require) {
 				},
 				'set_variables[]': {
 					name: self.i18n.active().callflows.setCav.title,
-					icon: 'settings2',
+					icon: 'check',
 					category: self.i18n.active().oldCallflows.advanced_cat,
 					module: 'set_variables',
 					tip: self.i18n.active().callflows.setCav.tip,
@@ -1363,7 +1363,8 @@ define(function(require) {
 					isUsable: 'true',
 					weight: 31,
 					caption: function(node) {
-						return '';
+						var variables = node.getMetadata('custom_application_vars') || {};
+						return Object.keys(variables).join(', ').substring(0, 25);
 					},
 					edit: function(node, callback) {
 						self.miscEditSetCAV(node, callback);
@@ -1461,11 +1462,13 @@ define(function(require) {
 		miscEditSetCAV: function(node, callback) {
 			var self = this,
 				variables = _.extend({}, node.getMetadata('custom_application_vars')),
+				exportParam = node.getMetadata('export'),
 				initTemplate = function() {
 					var template = $(self.getTemplate({
 							name: 'setcav-dialog',
 							data: {
-								variables: variables
+								variables: variables,
+								exportParam: exportParam
 							},
 							submodule: 'misc'
 						})),
@@ -1492,6 +1495,8 @@ define(function(require) {
 						}
 					});
 
+					monster.ui.tooltips(popup);
+
 					bindSetCavEvents({
 						template: template,
 						popup: popup
@@ -1518,7 +1523,9 @@ define(function(require) {
 							.mapValues('value')
 							.value();
 
+						node.setMetadata('export', formData.export);
 						node.setMetadata('custom_application_vars', variables);
+						node.caption = Object.keys(variables).join(', ').substring(0, 25);
 
 						popup.dialog('close');
 					});

src/apps/callflows/submodules/misc/misc.scss

@@ -191,8 +191,12 @@
 }
 
 /* Set CAV */
-#set_cav_alert_popup .cav-add-row .svg-icon {
-	cursor: pointer;
+#set_cav_alert_popup .cav-add-row {
+	margin-bottom: 15px;
+
+	.svg-icon {
+		cursor: pointer;
+	}
 }
 
 #set_cav_alert_popup .cav-remove-row {
@@ -210,6 +214,18 @@
 	visibility: visible;
 }
 
+#set_cav_alert_popup {
+	.popup_field > label,
+	.field_wrapper {
+		display: inline-block;
+		width: auto;
+		float: none;
+	}
+	.monster-switch {
+		float: none;
+	}
+}
+
 /* Collect DTMF Popup */
 .dialog_popup.collect-dtmf-popup .form_content .popup_field {
 	padding-bottom: 0;

src/apps/callflows/submodules/misc/views/setcav-dialog.html

@@ -3,18 +3,35 @@
 		{{ i18n.callflows.setCav.help }}
 	{{/monsterText}}
 	<form name="form" method="post" action="#" id="set_cav_form">
-		<table class="cav-list">
-			<thead>
-				<tr>
-					<th>{{i18n.callflows.setCav.key}}</th>
-					<th>{{i18n.callflows.setCav.value}}</th>
-					<th width="5"></th>
-				</tr>
-			</thead>
-			<tbody></tbody>
-		</table>
-		<div class="cav-add-row">
-			{{telicon "plus--circle-o"}}
+		<div class="form_content">
+			<table class="cav-list">
+				<thead>
+					<tr>
+						<th>{{i18n.callflows.setCav.key}}</th>
+						<th>{{i18n.callflows.setCav.value}}</th>
+						<th width="5"></th>
+					</tr>
+				</thead>
+				<tbody></tbody>
+			</table>
+			<div class="cav-add-row">
+				{{telicon "plus--circle-o"}}
+			</div>
+
+			<div class="popup_field clear">
+				<label for="cav-export">
+					{{ i18n.callflows.setCav.export_label }}
+					<i class="help-popover fa fa-question-circle"
+					   data-original-title="{{ i18n.callflows.setCav.export_tooltip}}"
+					   data-placement="bottom"
+					   data-toggle="tooltip"></i>
+				</label>
+				<div class="field_wrapper">
+					{{#monsterSwitch}}
+						<input id="cav-export" name="export" type="checkbox"{{#if exportParam}} checked="checked"{{/if}}>
+					{{/monsterSwitch}}
+				</div>
+			</div>
 		</div>
 	</form>