/**
* @ngdoc mosaico
* @name MosaicoCtrl
* @module s4c.components.moisaco.MosaicoCtrl
*
* @description Controller do módulo de mosaico
*
*
*/
(function () {
'use strict';
/**
* @method MosaicoCtrl
*
* @param {*} $scope
* @param {*} $state
* @param {*} $http
* @param {*} API_ENDPOINT
* @param {*} $sce
* @param {*} UserInfo
* @param {*} $mdDialog
* @param {*} $timeout
* @param {*} AuthService
* @param {*} MainState
*/
function MosaicoCtrl($scope,
$state,
$http,
API_ENDPOINT,
$sce,
UserInfo,
$mdDialog,
$timeout,
AuthService,
MainState) {
$scope.res = $scope.$root.res;
function getMosaicos() {
$http.get('/mosaico')
.then(function (res) {
$scope.mosaicos = res.data;
});
}
/**
* @method selecionarMosaico
*
* @param {*} mosaico
*/
function selecionarMosaico(mosaico) {
$scope.mosaicoSelecionadoId = mosaico;
$scope.limparCameras();
$http.get('/mosaico/' + mosaico)
.then(function (res) {
console.log(res.data);
$scope.mosaico = res.data;
});
$http.get('/mosaico/' + mosaico + '/getcameras')
.then(function (res) {
var cameras = _.orderBy(res.data, 'CameraMosaico.index');
_.each(cameras, function (camera) {
var id = camera.numero;
var url = '/data-s4c/cameras/' + id + '.jpeg';
camera.urlApi = url;
var packery = $scope.$directives.packery || {};
packery.adicionarCamera(camera);
});
});
}
/**
* @method limparCameras
*/
function limparCameras() {
var packery = $scope.$directives.packery || {};
var camerasAtivas = packery.pegarCamerasAtivas();
_.each(camerasAtivas, function (camera) {
camera.fechar();
});
$timeout(function () {
var container = $('.module-container');
container.attr('style', '');
}, 0);
}
/**
* @method changeState
*
* @param {*} state
*/
function changeState(state) {
$state.go(state);
}
/**
* @method adicionarCamera
*/
function adicionarCamera() {
var packery = $scope.$directives.packery || {};
$mdDialog.show({
templateUrl: 'app/components/mosaico/mosaico_escolha_cameras.html',
controller: function ($scope, $mdDialog, $http) {
$scope.res = $scope.$root.res;
$scope.loadingCameras = true;
var cameras = {};
$scope.todasSelecionadas = {};
$http
.get('/cameras')
.then(function (res) {
$scope.loadingCameras = false;
if (typeof res.data === 'object') {
var dados = _.clone(res.data);
_.each(dados, function (camera) {
cameras[camera.CategoriaCamera.nome] = {
ativo: true,
data: []
};
});
_.each(dados, function (camera) {
cameras[camera.CategoriaCamera.nome].data.push(camera);
});
_.each(Object.keys(cameras), function (key) {
cameras[key].data = _.chain(cameras[key].data)
.map(function (camera) {
var id = camera.numero;
var url = '/data-s4c/cameras/' + id + '.jpeg';
camera.urlApi = url;
camera.selecionada = (packery != undefined || {}) ? (_.includes(packery.pegarOrdem(), camera.id.toString()) ? true : false) : false;
camera.inativa = (packery != undefined || {}) ? (_.includes(packery.pegarOrdem(), camera.id.toString()) ? true : false) : false;
return camera;
})
.filter(function (camera) {
return camera.numero !== null;
}).value();
});
$scope.cameras = cameras;
}
}, function (err) {
$scope.loadingCameras = false;
});
$scope.selecionarTodas = function (camerasBairro, bairro) {
$scope.todasSelecionadas[bairro] = !$scope.todasSelecionadas[bairro];
cameras = _.map(camerasBairro.data, function (camera) {
if (!camera.inativa) {
camera.selecionada = $scope.todasSelecionadas[bairro];
}
return camera;
});
};
$scope.toggleCamera = function (camera, camerasBairro, bairro) {
camera.selecionada = !camera.selecionada;
$scope.todasSelecionadas[bairro] = _.every(camerasBairro.data, function (camera) {
return camera.selecionada;
})
}
$scope.cancelar = function () {
$mdDialog.cancel();
}
$scope.closeDialog = function () {
var _camerasAtivas = [];
_.each($scope.cameras, function (bairro) {
_.each(bairro.data, function (camera) {
if (camera.selecionada) {
_camerasAtivas.push(camera);
}
});
});
$mdDialog.hide(_camerasAtivas);
};
$scope.escolherCamera = function (camera) {
$mdDialog.hide(camera);
};
}
}).then(function (cameras) {
//var camerasRepetidasSelecionadas = false;
var packery = $scope.$directives.packery || {};
_.each(cameras, function (camera) {
if (!_.includes(packery.pegarOrdem(), camera.id.toString())) {
packery.adicionarCamera(camera);
}
//else{
// camerasRepetidasSelecionadas = true;
//}
});
//if (camerasRepetidasSelecionadas){
// $mdDialog
// .show($mdDialog.alert()
// .title('Aviso')
// .content('Câmeras selecionadas que já estavam no mosaico não foram adicionadas.')
// .ok('OK'));
//}
});
}
/**
* @method salvarCameras
*
* @param {*} mosaicoId
*/
function salvarCameras(mosaicoId) {
var packery = $scope.$directives.packery || {};
var ordem = packery.pegarOrdem();
var payload = {
mosaicoId: mosaicoId,
cameras: _.map(ordem, function (camera) {
return {
id: parseInt(camera, 10)
};
})
};
$http.post('/mosaico/saveCameras', payload)
.then(function (res) {
$mdDialog.hide();
$mdDialog
.show($mdDialog.alert()
.title($scope.res('COMUM_SUCESSO'))
.content($scope.res('MOSAICO_SALVO_SUCESSO'))
.ok($scope.res('COMUM_OK')));
getMosaicos();
});
}
/**
* @method salvarMosaico
*
* @param {*} mosaico
*/
function salvarMosaico(mosaico) {
$http.put('/mosaico', {
id: mosaico.id,
nome: mosaico.nome,
descricao: mosaico.descricao
}).then(function (res) {
salvarCameras(res.data.id);
}, function (erro) {
$mdDialog.hide();
$mdDialog
.show($mdDialog.alert()
.title($scope.res('COMUM_ERRO'))
.content($scope.res(erro.data.message))
.ok($scope.res('COMUM_OK')));
});
$scope.escolherCamera = function (camera) {
$mdDialog.hide(camera);
};
}
/**
* @method removerMosaico
*
* @param {*} mosaico
*/
function removerMosaico(mosaico) {
$http.delete('/mosaico/' + mosaico.id).then(function (res) {
$mdDialog
.show($mdDialog.alert()
.title($scope.res('COMUM_SUCESSO'))
.content($scope.res('MOSAICO_EXCLUIDO_SUCESSO'))
.ok($scope.res('COMUM_OK')));
var mosaicoIndex = $scope.mosaicos.indexOf(mosaico);
$scope.mosaicos.splice(mosaicoIndex, 1);
if (mosaico.id == $scope.mosaicoSelecionadoId) {
limparCameras();
var mosaicoText = '{}';
var mosaicoObj = JSON.parse(mosaicoText);
//mosaicoObj.nome = 'Selecionar Mosaico';
$scope.mosaico = mosaicoObj;
}
//selecionarMosaico(_.first($scope.mosaicos).id);
}, function (erro) {
$mdDialog.hide();
$mdDialog
.show($mdDialog.alert()
.title($scope.res('COMUM_ERRO'))
.content($scope.res(erro.data.message))
.ok($scope.res('COMUM_OK')));
});
}
/**
* @method abrirSave
*/
function abrirSave() {
/*if ($scope.mosaicoSelecionadoId) {
console.log('Mosaico Selecionado => ', $scope.mosaicoSelecioandoId);
salvarMosaico($scope.mosaico);
} else {*/
var packery = $scope.$directives.packery || {};
var ordem = packery.pegarOrdem();
var selecionado = $scope.mosaicoSelecionadoId;
var mosaico = $scope.mosaico;
$mdDialog.show({
templateUrl: 'app/components/mosaico/mosaico_salvar.html',
controller: function ($scope, $mdDialog) {
$scope.res = $scope.$root.res;
$scope.mosaico = mosaico;
if (selecionado) {
$scope.novo = 'atual';
} else {
$scope.disabled = true;
$scope.novo = 'novo';
}
$scope.mudei = function (wat) {
console.log(wat);
};
$scope.selecionado = selecionado;
$scope.ok = function (mosaico) {
if ($scope.novo === 'novo') {
delete mosaico.id;
}
$mdDialog.hide(mosaico);
};
}
}).then(function (mosaico) {
salvarMosaico(mosaico);
});
//}
}
angular.extend($scope, {
selecionarMosaico: selecionarMosaico,
usuario: UserInfo,
adicionarCamera: adicionarCamera,
salvarMosaico: salvarMosaico,
abrirSave: abrirSave,
changeState: changeState,
limparCameras: limparCameras,
removerMosaico: removerMosaico,
cameras: [],
mosaicoAtivo: {},
logout: function () {
if (MainState.getDirective('voip') != null) {
MainState.getDirective('voip').deslogar();
}
AuthService.logout();
$state.go('inicio');
}
});
getMosaicos();
/*$mdDialog.show({
templateUrl: 'dialog-mosaico',
controller: function($scope) {
$scope.fechar = function() {
$mdDialog.hide();
}
}
})*/
}
MosaicoCtrl.$inject = [
'$scope',
'$state',
'$http',
'API_ENDPOINT',
'$sce',
'UserInfo',
'$mdDialog',
'$timeout',
'AuthService',
'MainState'
];
angular.module('s4c.controllers.MosaicoCtrl', [
'ngMaterial'
])
.controller('MosaicoCtrl', MosaicoCtrl)
.directive('workspace', [
'$rootScope',
'$compile',
'$mdDialog',
'$filter',
'$stateParams',
function ($rootScope, $compile, $mdDialog, $filter, $stateParams) {
return {
constrain: 'A',
link: function ($scope, $elem) {
$scope.camerasAtivas = [];
$scope.pegarOrdem = pegarOrdem;
$scope.pegarCamerasAtivas = pegarCamerasAtivas;
$scope.abrirNoMapa = abrirNoMapa;
$scope.abrirCamera = abrirCamera;
$scope.exibirMosaicos = exibirMosaicos;
$scope.fecharMosaico = fecharMosaico;
$scope.exibirExcluirMosaico = exibirExcluirMosaico;
$scope.ocultarExcluirMosaico = ocultarExcluirMosaico;
$scope.excluirMosaico = excluirMosaico;
$scope.showDeleteIcon = false;
$scope.$api = {
packery: $scope.packery,
pegarOrdem: pegarOrdem,
adicionarCamera: adicionarCamera,
pegarCamerasAtivas: pegarCamerasAtivas
};
var $container = $elem[0];
$scope.packery = new Packery($container, {
columnWidth: 320,
rowHeight: 242,
gutter: 10,
itemSelector: '.module'
});
angular.forEach($scope.packery.getItemElements(), function (item) {
var draggable = new Draggabilly(item);
$scope.packery.bindDraggabillyEvents(draggable);
});
$scope.packery.layout();
$scope.packery.on('layoutComplete', function () {
$rootScope.camerasMosaico = $scope.pegarOrdem();
});
$scope.fecharItem = function (e) {
var elem = $($(e)[0].target)
.parent()
.parent()
.parent()
.parent()
.parent();
$scope.packery.remove(elem);
$scope.packery.layout();
};
/**
* @method fecharMosaico
*/
function fecharMosaico() {
$('.option').hide();
// $scope.showDropdown = false;
}
/**
* @method exibirMosaicos
*/
function exibirMosaicos() {
//$('#dropdown-demo-menu').trigger('click');
//$scope.showDropdown = true;
$('.option').show();
}
/**
* @method ocultarExcluirMosaico
*
* @param {*} obj
*/
function ocultarExcluirMosaico(obj) {
//$('#dropdown-demo-menu').trigger('click');
//$scope.showDropdown = true;
$("#" + obj).hide();
}
/**
* @method exibirExcluirMosaico
*
* @param {*} obj
*/
function exibirExcluirMosaico(obj) {
//$('#dropdown-demo-menu').trigger('click');
//$scope.showDropdown = true;
$("#" + obj).show();
}
/**
* @method excluirMosaico
* @param {*} mosaico
*/
function excluirMosaico(mosaico) {
var confirm = $mdDialog.confirm()
.title($scope.res('MSG_MOSAICO_DELETE_ALL_USUARIOS', mosaico.nome))
.ariaLabel($scope.res('EXCLUIR_MOSAICO'))
.ok($scope.res('COMUM_SIM'))
.cancel($scope.res('COMUM_NAO'));
$mdDialog.show(confirm).then(function () {
$scope.removerMosaico(mosaico);
});
}
/**
* @method abrirCamera
*
* @param {*} camera
*/
function abrirCamera(camera) {
window.open(camera.url, 'Camera', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=false,resizable=false,width=320,height=220');
}
/**
* @method pegarCamerasAtivas
*/
function pegarCamerasAtivas() {
return $scope.camerasAtivas;
}
/**
* @method abrirNoMapa
*
* @param {*} camera
*/
function abrirNoMapa(camera) {
$mdDialog.show({
templateUrl: 'app/components/mosaico/camera-detalhamento.html',
controller: ['$scope', '$http', 'API_ENDPOINT', 'leafletData',
function ($scope, $http, API_ENDPOINT, leafletData) {
$http.get(API_ENDPOINT + 'cameras/' + camera)
.then(function (res) {
if (typeof res.data === 'object') {
var _camera = res.data;
var coords = JSON.parse(_camera.geojson).coordinates;
leafletData.getMap()
.then(function (map) {
console.log(_camera);
var cameraIcon = L.icon({
iconUrl: _camera.urlIcone,
iconSize: [48, 48],
iconAnchor: [6, 6],
shadowAnchor: [5, 5],
popupAnchor: [5, 5]
});
console.log(cameraIcon);
var marker = L.marker(coords, {
icon: new L.DivIcon({
html: '<img src=' + _camera.urlIcone + '"/>',
iconSize: [24, 24]
})
}).addTo(map);
console.log(marker);
map.setView(coords.reverse(), 16);
map.invalidateSize();
});
window.scrollTo(0, 0);
$scope.markers = [{
lat: coords[1],
lng: coords[0]
}];
$scope.camera = _camera;
}
});
$scope.fechar = function () {
$mdDialog.hide();
};
}
]
}).then(function () { }, function () { });
}
if ($stateParams.cameras) {
var cameras = JSON.parse($stateParams.cameras);
if (cameras.length > 20) {
cameras = _.sampleSize(cameras, 20);
}
_.each(cameras, function (camera) {
var id = camera.numero;
var url = '/data-s4c/cameras/' + id + '.jpeg';
camera.urlApi = url;
adicionarCamera(camera);
});
}
/**
* @method adicionarCamera
*
* @param {*} camera
*/
function adicionarCamera(camera) {
var cameraUrl;
var alturaCamera = 170;
var larguraCamera = 290;
if (camera.CategoriaCamera.tipo == "wowza") {
cameraUrl = "/Cam/Dvr/simple.html?data=" + escape(JSON.stringify(camera));
}
else {
cameraUrl = camera.url + "&largura=" + larguraCamera + "&altura=" + alturaCamera;
}
var larguraFrame = larguraCamera + 24;
var alturaFrame = alturaCamera + 27;
var larguraDiv = larguraCamera + 25;
var alturaDiv = alturaCamera + 80;
var iframe = '<iframe width="' + larguraFrame + '" height= "' + alturaFrame + '" src="' + cameraUrl + '" frameborder="0"></iframe>';
iframe += '<div class="dragme">';
iframe += '<div class="menuBar" layout="row" layout-align="start center">';
iframe += '<div class="md-toolbar-tools">';
iframe += '<span class="titulo-camera">' + camera.nome + '</span>';
iframe += '<div class="toolbox" flex layout="row" layout-align="end end">';
iframe += '<img ng-click="abrirNoMapa(' + camera.id + ')" src="/assets/images/Mosaico/ic_localizacao_white_24px.svg"/>';
iframe += '<img ng-click="fecharItem($event)" src="/assets/images/Modulos/ic_close_30pc_24px.svg"/>';
iframe += '</div>';
iframe += '</div>';
iframe += '</div>';
iframe += '<div class="nome-camera">';
iframe += '<span class="camera-numero" layout="row" layout-align="start center">n. ' + camera.numero + ' <span class="camera-descricao">' + $filter('characters')(camera.descricao, 35) + '</span></span>';
iframe += '</div>';
var item = '<div style="height: ' + alturaDiv + 'px; width: ' + larguraDiv + 'px;" class="md-whiteframe-z1 module" numero="' + camera.id + '">' + iframe + '</div>';
var $item = $compile($(item))($scope);
$item.fechar = function () {
$scope.packery.remove(this);
};
$($container).append($item);
if (!$scope.camerasAtivas) {
$scope.camerasAtivas = [];
}
$scope.camerasAtivas.push($item);
$scope.packery.appended($item);
angular.forEach($scope.packery.getItemElements(), function (item) {
var draggable = new Draggabilly(item);
$scope.packery.bindDraggabillyEvents(draggable);
});
$scope.packery.layout();
}
/**
* @method pegarOrdem
*/
function pegarOrdem() {
var itens = $scope.packery.getItemElements();
var ordem = [];
_.each(itens, function (item) {
var x = $(item);
var numero = x.context.attributes.numero;
ordem.push(numero.value);
});
return ordem;
}
$scope.$parent.$directives = $scope.$parent.$directives || {};
if ($scope.$parent.$directives.packery) {
throw 'Directive name already in use!';
}
$scope.$parent.$directives.packery = $scope.$api;
$scope.$on('$destroy', function () {
$scope.limparCameras();
$scope.$parent.$directives.packery = undefined;
});
}
};
}
]);
}());