diff --git a/src/apps/callflows/i18n/en-US.json b/src/apps/callflows/i18n/en-US.json index 35e8066..6beebb9 100644 --- a/src/apps/callflows/i18n/en-US.json +++ b/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", diff --git a/src/apps/callflows/submodules/misc/misc.css b/src/apps/callflows/submodules/misc/misc.css index f8db865..c457d70 100644 --- a/src/apps/callflows/submodules/misc/misc.css +++ b/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; -} \ No newline at end of file + 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; } diff --git a/src/apps/callflows/submodules/misc/misc.js b/src/apps/callflows/submodules/misc/misc.js index 102a934..4e10d2a 100644 --- a/src/apps/callflows/submodules/misc/misc.js +++ b/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'); }); diff --git a/src/apps/callflows/submodules/misc/misc.scss b/src/apps/callflows/submodules/misc/misc.scss index e10a934..eed45f4 100644 --- a/src/apps/callflows/submodules/misc/misc.scss +++ b/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; diff --git a/src/apps/callflows/submodules/misc/views/setcav-dialog.html b/src/apps/callflows/submodules/misc/views/setcav-dialog.html index f159c10..8bf9c4b 100644 --- a/src/apps/callflows/submodules/misc/views/setcav-dialog.html +++ b/src/apps/callflows/submodules/misc/views/setcav-dialog.html @@ -3,18 +3,35 @@ {{ i18n.callflows.setCav.help }} {{/monsterText}}
- - - - - - - - - -
{{i18n.callflows.setCav.key}}{{i18n.callflows.setCav.value}}
-
- {{telicon "plus--circle-o"}} +
+ + + + + + + + + +
{{i18n.callflows.setCav.key}}{{i18n.callflows.setCav.value}}
+
+ {{telicon "plus--circle-o"}} +
+ +