FS-8955 [verto_communicator] Adding DTMF shortcuts and handling DTMF history on DTMF widget
This commit is contained in:
parent
6d6bd1efa5
commit
2511ad50e1
|
@ -188,7 +188,8 @@
|
|||
<div class="chat-message-input">
|
||||
<form ng-submit="send()" >
|
||||
<div class="chat-message-input-group">
|
||||
<textarea ng-model="message" ng-keydown="($event.keyCode == 13 && $event.shiftKey !== true) && send($event)" required="required" class="form-control input-sm" placeholder="{{ 'CHAT_TYPE_MESSAGE' | translate }}"></textarea>
|
||||
<textarea ng-model="message" ng-keydown="($event.keyCode == 13 && $event.shiftKey !== true) && send($event)" required="required" class="form-control input-sm" placeholder="{{ 'CHAT_TYPE_MESSAGE' | translate }}"
|
||||
ng-focus="disableOnKeydownDtmf()" ng-blur="enableOnKeydownDtmf()"></textarea>
|
||||
<button class="btn btn-success btn-sm" type="submit">
|
||||
{{ 'CHAT_SEND_MESSAGE' | translate }}
|
||||
<span class="mdi-navigation-arrow-forward chat-message-input-group-icon-button"></span>
|
||||
|
|
|
@ -1,25 +1,25 @@
|
|||
<div class="panel panel-default shadow-z-2" ng-class="{'shadow-z-2': !call_history}">
|
||||
<form name="form">
|
||||
<div class="input-group dialpad-display">
|
||||
<input name="dialpadnumber" type="text" class="form-control text-center" placeholder="" ng-model="dialpadNumber" />
|
||||
<input name="dtmfHistory" type="text" class="form-control text-center" placeholder="" ng-model="dtmfHistory.value" />
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="dialpad-numbers">
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(1)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(1)">
|
||||
<h2 class="dialpad-number">1</h2>
|
||||
<span class="dialpad-alpha">./@</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(2)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(2)">
|
||||
<h2 class="dialpad-number">2</h2>
|
||||
<span class="dialpad-alpha">ABC</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(3)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(3)">
|
||||
<h2 class="dialpad-number">3</h2>
|
||||
<span class="dialpad-alpha">DEF</span>
|
||||
</a>
|
||||
|
@ -27,19 +27,19 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(4)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(4)">
|
||||
<h2 class="dialpad-number">4</h2>
|
||||
<span class="dialpad-alpha">GHI</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(5)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(5)">
|
||||
<h2 class="dialpad-number">5</h2>
|
||||
<span class="dialpad-alpha">JKL</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(6)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(6)">
|
||||
<h2 class="dialpad-number">6</h2>
|
||||
<span class="dialpad-alpha">MNO</span>
|
||||
</a>
|
||||
|
@ -47,19 +47,19 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(7)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(7)">
|
||||
<h2 class="dialpad-number">7</h2>
|
||||
<span class="dialpad-alpha">PQRS</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(8)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(8)">
|
||||
<h2 class="dialpad-number">8</h2>
|
||||
<span class="dialpad-alpha">TUV</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(9)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(9)">
|
||||
<h2 class="dialpad-number">9</h2>
|
||||
<span class="dialpad-alpha">WXYZ</span>
|
||||
</a>
|
||||
|
@ -67,19 +67,19 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf('*')">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget('*')">
|
||||
<h2 class="dialpad-number dialpad-star">*</h2>
|
||||
<span class="dialpad-alpha"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf(0)">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget(0)">
|
||||
<h2 class="dialpad-number">0</h2>
|
||||
<span class="dialpad-alpha">+</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4 col-xs-4">
|
||||
<a class="btn btn-block" href="" ng-click="dtmf('#')">
|
||||
<a class="btn btn-block" href="" ng-click="dtmfWidget('#')">
|
||||
<h2 class="dialpad-number dialpad-pound">#</h2>
|
||||
<span class="dialpad-alpha"></span>
|
||||
</a>
|
||||
|
|
|
@ -4,9 +4,11 @@
|
|||
angular
|
||||
.module('vertoControllers')
|
||||
.controller('MainController',
|
||||
function($scope, $rootScope, $location, $modal, $timeout, $q, verto, storage, CallHistory, toastr, Fullscreen, prompt, eventQueue, $translate) {
|
||||
function($scope, $rootScope, $location, $modal, $timeout, $q, verto, storage, CallHistory, toastr, Fullscreen, prompt, eventQueue, $translate, $window) {
|
||||
|
||||
console.debug('Executing MainController.');
|
||||
$rootScope.dtmfHistory = { value: '' };
|
||||
$rootScope.onKeydownDtmfEnabled = true;
|
||||
|
||||
if (storage.data.language && storage.data.language !== 'browser') {
|
||||
$translate.use(storage.data.language);
|
||||
|
@ -239,7 +241,8 @@
|
|||
* @param {String} number - New touched number.
|
||||
*/
|
||||
$rootScope.dtmf = function(number) {
|
||||
$rootScope.dialpadNumber = $scope.dialpadNumber + number;
|
||||
console.log('dtmf', number);
|
||||
$rootScope.dialpadNumber = $rootScope.dialpadNumber + number;
|
||||
if (verto.data.call) {
|
||||
verto.dtmf(number);
|
||||
}
|
||||
|
@ -555,6 +558,38 @@
|
|||
}
|
||||
}
|
||||
|
||||
$rootScope.dtmfWidget = function(number) {
|
||||
$rootScope.dtmfHistory.value = $rootScope.dtmfHistory.value + number;
|
||||
if (verto.data.call) {
|
||||
verto.dtmf(number);
|
||||
}
|
||||
}
|
||||
|
||||
$rootScope.disableOnKeydownDtmf = function() {
|
||||
$rootScope.onKeydownDtmfEnabled = false;
|
||||
};
|
||||
|
||||
$rootScope.enableOnKeydownDtmf = function() {
|
||||
$rootScope.onKeydownDtmfEnabled = true;
|
||||
};
|
||||
|
||||
$rootScope.$on("$routeChangeStart", function(event, next, current) {
|
||||
if (next.$$route.originalPath === '/incall') {
|
||||
$rootScope.dtmfHistory.value = '';
|
||||
angular.element($window).bind('keydown', onKeydownDtmfHistory);
|
||||
} else {
|
||||
angular.element($window).unbind('keydown', onKeydownDtmfHistory);
|
||||
}
|
||||
});
|
||||
|
||||
function onKeydownDtmfHistory(event) {
|
||||
var caracter = event.key;
|
||||
if ($rootScope.onKeydownDtmfEnabled && caracter.match(/^(\*|\#|[0-9a-dA-D])$/g)) {
|
||||
$rootScope.dtmfWidget(caracter);
|
||||
$scope.$applyAsync();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
|
|
Loading…
Reference in New Issue