padding-top: 60px;
}
+.inline-block {
+ display: inline-block;
+}
+
+.icon-tiny {
+ font-size: 14px;
+}
+
+.back-icon {
+ cursor: pointer;
+ margin-top: -2px;
+ float: left;
+ margin-left: -2px;
+ margin-right: 7px;
+}
+
.container-fluid {
height: 100%;
}
width: 100%;
}
+#dialpad .list-icon {
+ margin-top: 8px;
+ float: right;
+ margin-left: 2px;
+}
+
#dialpad .dialpad-display .btn-fab {
font-size: 32px;
position: relative;
position: relative;
}
+.call_direction {
+ position: absolute;
+ margin-top: 6px;
+}
+
#dialpad #call_history.active {
visibility: visible;
text-overflow: clip;
overflow: hidden;
overflow-wrap: break-word;
+ margin-left: 26px !important;
+ position: absolute;
}
#dialpad .dialpad-number {
color: rgb(38, 204, 218);
}
+#dialpad .date {
+ margin-top: 15px;
+ display: block;
+ font-size: 11px;
+ color: #CCC;
+}
+
#dialpad .dialpad-alpha {
font-size: 11px;
color: #CCC;
<script type="text/javascript" src="src/storageService/storageService.module.js"></script>
<script type="text/javascript" src="src/storageService/services/storage.js"></script>
+ <script type="text/javascript" src="src/storageService/services/call_history.js"></script>
<!-- endbuild -->
<div id="call_history" class="shadow-z-2 panel">
<div class="panel-heading">
<div class="panel-title">
- Call History
+ <i class="mdi-navigation-arrow-back back-icon" ng-click="viewCallsList()" ng-if="call_list"></i>
+ <span ng-if="!call_list">Call History</span>
+ <span ng-if="call_list">{{ call_list[0].number }}</span>
<span class="pull-right pull-right-margin dropdown">
<a href="" class="dropdown-toggle" data-target="#" data-toggle="dropdown" aria-expanded="true">
</div>
</div>
<ul class="call-history">
- <div ng-show="!storage.data.call_history.length">
+ <div ng-if="!has_history">
<p class="text-center text-muted">No history calls.</p>
</div>
- <li ng-repeat="call in storage.data.call_history">
- <a ng-show="call.number" href="" ng-dblclick="$parent.call(call.number)" ng-click="$parent.fillDialpadNumber(call.number)">
- <i ng-show="call.direction == 'inbound'" ng-class="{'mdi-communication-call-missed': !call.status,'mdi-communication-call-received': call.status}"></i>
- <i ng-show="call.direction == 'outbound'" class="mdi-communication-call-made"></i>
- <h2 class="dialpad-number dialpad-number-limited">{{ call.number }}</h2>
+ <li ng-repeat="number in history_control track by number" ng-if="!call_list">
+ <a ng-init="call = call_history[number][0]" class="inline-block" ng-show="call.number" href="" ng-dblclick="$parent.call(call.number)" ng-click="$parent.fillDialpadNumber(call.number)">
+ <div class="call-history-info">
+ <i ng-if="call.direction == 'inbound'" ng-class="{'mdi-communication-call-missed': !call.status,'mdi-communication-call-received': call.status}"></i>
+ <i ng-if="call.direction == 'outbound'" class="mdi-communication-call-made call_direction"></i>
+ <h2 class="dialpad-number dialpad-number-limited">{{ call.number }} ({{ call_history[number].length }})</h2>
<br/>
+ <span class="date">{{ call.call_start }}</span>
+ </div>
+ </a>
+ <a href="" ng-click="$parent.viewCallsList(call_history[number])" class="list-icon">
+ <i class="mdi-action-view-list"></i>
+ </a>
+ </li>
+
+ <li ng-repeat="call in call_list">
+ <a ng-show="call.number" href="" ng-dblclick="$parent.call(call.number)" ng-click="$parent.fillDialpadNumber(call.number)">
+ <i ng-if="call.direction == 'inbound'" class="icon-tiny" ng-class="{'mdi-communication-call-missed': !call.status,'mdi-communication-call-received': call.status}"></i>
+ <i ng-if="call.direction == 'outbound'" class="icon-tiny mdi-communication-call-made"></i>
<span class="dialpad-alpha">{{ call.call_start }}</span>
</a>
+
</li>
</ul>
</div>
--- /dev/null
+'use strict';
+
+ angular
+ .module('storageService')
+ .factory('CallHistory', function(storage) {
+
+ var history = storage.data.call_history;
+ var history_control = storage.data.history_control;
+
+ var addCallToHistory = function(number, direction, status) {
+ if(history[number] == undefined) {
+ history[number] = [];
+ }
+
+ history[number].unshift({
+ 'number': number,
+ 'direction': direction,
+ 'status': status,
+ 'call_start': Date()
+ });
+
+ var index = history_control.indexOf(number);
+ console.log(index);
+ if(index > -1) {
+ history_control.splice(index, 1);
+ }
+
+ history_control.unshift(number);
+
+ };
+
+ var getCallsFromHistory = function(number) {
+ return history[number];
+ };
+
+ return {
+ all: function() {
+ return history;
+ },
+ all_control: function() {
+ return history_control;
+ },
+ get: function(number) {
+ return getCallsFromHistory(number);
+ },
+ add: function(number, direction, status) {
+ return addCallToHistory(number, direction, status);
+ },
+ clear: function() {
+ storage.data.call_history = {};
+ storage.data.history_control = [];
+ history = storage.data.call_history;
+ history_control = storage.data.history_control;
+ return history_control;
+ }
+ }
+});
cur_call: 0,
called_number: '',
useVideo: true,
- call_history: [],
+ call_history: {},
+ history_control: [],
call_start: false,
name: '',
email: '',
angular
.module('vertoControllers')
.controller('DialPadController', ['$rootScope', '$scope',
- '$http', '$location', 'toastr', 'verto', 'storage',
- function($rootScope, $scope, $http, $location, toastr, verto, storage) {
+ '$http', '$location', 'toastr', 'verto', 'storage', 'CallHistory',
+ function($rootScope, $scope, $http, $location, toastr, verto, storage, CallHistory) {
console.debug('Executing DialPadController.');
-
$scope.checkBrowser();
+ $scope.call_history = CallHistory.all();
+ $scope.history_control = CallHistory.all_control();
+ $scope.has_history = Object.keys($scope.call_history).length;
storage.data.videoCall = false;
storage.data.userStatus = 'connecting';
storage.data.calling = false;
+ $scope.clearCallHistory = function() {
+ CallHistory.clear();
+ $scope.call_history = CallHistory.all();
+ $scope.history_control = CallHistory.all_control();
+ $scope.has_history = Object.keys($scope.call_history).length;
+ return $scope.history_control;
+ };
+
+ $scope.viewCallsList = function(calls) {
+ return $scope.call_list = calls;
+ };
+
/**
* fill dialpad via querystring [?autocall=\d+]
*/
verto.call($rootScope.dialpadNumber);
storage.data.called_number = $rootScope.dialpadNumber;
- storage.data.call_history.unshift({
- 'number': $rootScope.dialpadNumber,
- 'direction': 'outbound',
- 'call_start': Date()
- });
+ CallHistory.add($rootScope.dialpadNumber, 'outbound');
$location.path('/incall');
}
}
]);
-})();
\ No newline at end of file
+})();
angular
.module('vertoControllers')
.controller('MainController',
- function($scope, $rootScope, $location, $modal, $timeout, verto, storage, toastr, Fullscreen, prompt) {
-
+ function($scope, $rootScope, $location, $modal, $timeout, verto, storage, CallHistory, toastr, Fullscreen, prompt) {
+
console.debug('Executing MainController.');
var myVideo = document.getElementById("webcam");
);
};
- $scope.openModal = function(templateUrl, controller) {
+ $rootScope.openModal = function(templateUrl, controller) {
var modalInstance = $modal.open({
animation: $scope.animationsEnabled,
templateUrl: templateUrl,
$scope.call_history = angular.element("#call_history").hasClass('active');
};
- $scope.clearCallHistory = function() {
- storage.data.call_history = [];
- };
-
$scope.toggleChat = function() {
if ($scope.chatStatus && $rootScope.activePane === 'chat') {
$rootScope.chat_counter = 0;
$scope.answerCall();
storage.data.called_number = data;
-
- storage.data.call_history.unshift({
- 'number': data,
- 'direction': 'inbound',
- 'status': true,
- 'call_start': Date()
- });
+ CallHistory.add(number, 'inbound', true);
$location.path('/incall');
}, function() {
$scope.declineCall();
- storage.data.call_history.unshift({
- 'number': data,
- 'direction': 'inbound',
- 'status': false,
- 'call_start': Date()
- });
+ CallHistory.add(number, 'inbound', false);
});
});
}
);
-})();
\ No newline at end of file
+})();
label: device.label || device.id
});
}
- console.debug('Devices were refreshed, checking that we have cameras.');
-
+ console.debug('Devices were refreshed, checking that we have cameras.');
+
// This means that we cannot use video!
if (data.videoDevices.length === 0) {
console.log('No camera, disabling video.');
},
refreshDevices: function(callback) {
- console.debug('Attempting to refresh the devices.');
+ console.debug('Attempting to refresh the devices.');
jQuery.verto.refreshDevices(this.refreshDevicesCallback);
},
console.log('Has data.liveArray.');
$rootScope.$emit('members.clear');
data.liveArray = null;
-
+
} else {
console.log('Doesn\'t found data.liveArray.');
}