From 54dae6ec939e44f2804193b0aa7a7d4472eeff4d Mon Sep 17 00:00:00 2001 From: Maxime Roux Date: Tue, 28 Jul 2015 15:00:19 -0700 Subject: [PATCH] UI-1206: Added the CID prepend feature to SmartPBX's User Groups --- i18n/en-US.json | 9 +++ submodules/groups/groups.css | 24 +++++- submodules/groups/groups.js | 127 ++++++++++++++++++++++++------ views/groups-feature-prepend.html | 33 ++++++++ 4 files changed, 166 insertions(+), 27 deletions(-) create mode 100644 views/groups-feature-prepend.html diff --git a/i18n/en-US.json b/i18n/en-US.json index 2eb9879..627ba42 100644 --- a/i18n/en-US.json +++ b/i18n/en-US.json @@ -116,6 +116,15 @@ "3": "Purchase, Port and Assign numbers. Once complete, it will automatically be assigned to the specific User Group.", "4": "Turn on/off and seamlessly manage any of the User Features specific to the User Group." } + }, + + "__comment": "UI-1206: Adding a feature to add a Caller ID prepend on groups", + "__version": "3.22", + "prepend": { + "title": "Caller ID Prepend", + "headline": "Caller ID Prepend", + "cidNameLabel": "Caller ID Name prefix", + "cidNumberLabel": "Caller ID Number prefix" } }, diff --git a/submodules/groups/groups.css b/submodules/groups/groups.css index ebc0c7f..0380b8d 100644 --- a/submodules/groups/groups.css +++ b/submodules/groups/groups.css @@ -424,9 +424,8 @@ display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; - box-sizing: border-box; - width: 25%; + width: 33.33%; height: 150px; border: 1px solid #FFF; text-align: center; @@ -547,7 +546,26 @@ } -/* Next Action Feature */ +/* Allow Call Forward Feature */ .feature-popup-container[data-feature="forward"] .help-box { margin: 5px 20px 20px +} + +/* CID Prepend Feature */ +.feature-popup-container[data-feature="prepend"] form { + margin-bottom: 0; +} +.feature-popup-container[data-feature="prepend"] form > div { + position: relative; + margin-bottom: 10px; +} +.feature-popup-container[data-feature="prepend"] form span { + display: inline-block; + width: 160px; + vertical-align: middle; + text-align: right; +} +.feature-popup-container[data-feature="prepend"] form input { + margin-bottom: 0; + width: 100px; } \ No newline at end of file diff --git a/submodules/groups/groups.js b/submodules/groups/groups.js index c5cffd6..eba42dc 100644 --- a/submodules/groups/groups.js +++ b/submodules/groups/groups.js @@ -146,6 +146,11 @@ define(function(require){ icon: 'fa fa-mail-forward', iconColor: 'monster-orange', title: self.i18n.active().groups.forward.title + }, + prepend: { + icon: 'fa fa-file-text-o', + iconColor: 'monster-pink', + title: self.i18n.active().groups.prepend.title } }, hasFeatures: false @@ -226,9 +231,9 @@ define(function(require){ emptySearch = template.find('.groups-rows .empty-search-row'); _.each(rows, function(row) { - var row = $(row); + var $row = $(row); - row.data('search').toLowerCase().indexOf(searchString) < 0 ? row.hide() : row.show(); + $row.data('search').toLowerCase().indexOf(searchString) < 0 ? $row.hide() : $row.show(); }); if(rows.size() > 0) { @@ -471,17 +476,22 @@ define(function(require){ template.find('.feature[data-feature="forward"]').on('click', function() { self.groupsRenderForward(data); }); + + template.find('.feature[data-feature="prepend"]').on('click', function() { + self.groupsRenderPrepend(data); + }); }, groupsRenderCallRecording: function(data) { var self = this, + recordCallNode = monster.util.findCallflowNode(data.callflow, 'record_call'), templateData = $.extend(true, { group: data.group }, - (data.group.extra.mapFeatures.call_recording.active ? { - url: data.callflow.flow.data.url, - format: data.callflow.flow.data.format, - timeLimit: data.callflow.flow.data.time_limit + (data.group.extra.mapFeatures.call_recording.active && recordCallNode ? { + url: recordCallNode.data.url, + format: recordCallNode.data.format, + timeLimit: recordCallNode.data.time_limit } : {}) ), featureTemplate = $(monster.template(self, 'groups-feature-call_recording', templateData)), @@ -519,21 +529,23 @@ define(function(require){ if(data.group.smartpbx.call_recording.enabled || enabled) { data.group.smartpbx.call_recording.enabled = enabled; - var newCallflow = $.extend(true, {}, data.callflow); + var newCallflow = $.extend(true, {}, data.callflow), + currentNode = monster.util.findCallflowNode(newCallflow, 'record_call') || monster.util.findCallflowNode(newCallflow, 'callflow'); if(enabled) { - if(newCallflow.flow.module === 'record_call') { - newCallflow.flow.data = $.extend(true, { action: "start" }, formData); + + if(currentNode.module === 'record_call') { + currentNode.data = $.extend(true, { action: "start" }, formData); } else { - newCallflow.flow = { - children: { - "_": $.extend(true, {}, data.callflow.flow) - }, - module: "record_call", - data: $.extend(true, { action: "start" }, formData) - } + currentNode.children = { + "_": $.extend(true, {}, currentNode) + }; + currentNode.module = "record_call"; + currentNode.data = $.extend(true, { action: "start" }, formData); } - } else { - newCallflow.flow = $.extend(true, {}, data.callflow.flow.children["_"]); + } else if(currentNode.module === 'record_call') { + currentNode.module = currentNode.children["_"].module; + currentNode.data = currentNode.children["_"].data; + currentNode.children = currentNode.children["_"].children; } self.groupsUpdateCallflow(newCallflow, function(updatedCallflow) { self.groupsUpdate(data.group, function(updatedGroup) { @@ -755,14 +767,11 @@ define(function(require){ if(data.group.smartpbx.next_action.enabled || enabled) { data.group.smartpbx.next_action.enabled = enabled; var newCallflow = $.extend(true, {}, data.callflow), - newFlow = newCallflow.flow; + callflowNode = monster.util.findCallflowNode(newCallflow, 'callflow'); - if(newFlow.module === 'record_call') { - newFlow = newFlow.children['_']; - } - newFlow.children = {}; + callflowNode.children = {}; if(enabled) { - newFlow.children['_'] = { + callflowNode.children['_'] = { children: {}, module: selectedOption.data('module'), data: { id: selectedOption.val() } @@ -831,6 +840,76 @@ define(function(require){ }); }, + groupsRenderPrepend: function(data) { + var self = this, + prependNode = monster.util.findCallflowNode(data.callflow, 'prepend_cid'), + templateData = $.extend(true, { + group: data.group + }, + (data.group.extra.mapFeatures.call_recording.active && prependNode ? { + caller_id_name_prefix: prependNode.data.caller_id_name_prefix, + caller_id_number_prefix: prependNode.data.caller_id_number_prefix + } : {}) + ), + featureTemplate = $(monster.template(self, 'groups-feature-prepend', templateData)), + switchFeature = featureTemplate.find('.switch-state'), + popup; + + featureTemplate.find('.cancel-link').on('click', function() { + popup.dialog('close').remove(); + }); + + switchFeature.on('change', function() { + $(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp(); + }); + + featureTemplate.find('.save').on('click', function() { + var enabled = switchFeature.prop('checked'), + prependData = $.extend(true, { action: 'prepend' }, monster.ui.getFormData('prepend_form')); + + if(!('smartpbx' in data.group)) { data.group.smartpbx = {}; } + if(!('prepend' in data.group.smartpbx)) { + data.group.smartpbx.prepend = { + enabled: false + }; + } + + if(data.group.smartpbx.prepend.enabled || enabled) { + data.group.smartpbx.prepend.enabled = enabled; + var newCallflow = $.extend(true, {}, data.callflow); + if(enabled) { + if(newCallflow.flow.module !== 'prepend_cid') { + newCallflow.flow = { + children: { + "_": $.extend(true, {}, data.callflow.flow) + }, + module: 'prepend_cid', + data: prependData + } + } + } else { + if(prependNode) { + newCallflow.flow = $.extend(true, {}, prependNode.children["_"]); + } + } + self.groupsUpdateCallflow(newCallflow, function(updatedCallflow) { + self.groupsUpdate(data.group, function(updatedGroup) { + popup.dialog('close').remove(); + self.groupsRender({ groupId: data.group.id }); + }); + }); + } else { + popup.dialog('close').remove(); + self.groupsRender({ groupId: data.group.id }); + } + }); + + popup = monster.ui.dialog(featureTemplate, { + title: data.group.extra.mapFeatures.prepend.title, + position: ['center', 20] + }); + }, + groupsBindName: function(template, data) { var self = this, nameForm = template.find('#form-name'); diff --git a/views/groups-feature-prepend.html b/views/groups-feature-prepend.html new file mode 100644 index 0000000..b183bc9 --- /dev/null +++ b/views/groups-feature-prepend.html @@ -0,0 +1,33 @@ +
+
+
+ +
+ {{ i18n.groups.prepend.headline }} +
+ {{#monsterSwitch}} + + {{/monsterSwitch}} +
+
+ +
+
+
+ {{ i18n.groups.prepend.cidNameLabel }} + +
+
+ {{ i18n.groups.prepend.cidNumberLabel }} + +
+
+
+ +
+
+ {{ i18n.cancel }} + +
+
+
\ No newline at end of file