forked from Coded/SIPRP
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
150 lines
4.5 KiB
150 lines
4.5 KiB
|
|
//https://github.com/jschr/bootstrap-modal
|
|
|
|
evoapp.directive('modalWindow', function($rootScope) {
|
|
|
|
var modalWindowEl = $rootScope.viewCache.find('#genericModalWindow'),
|
|
template = modalWindowEl[0].outerHTML;
|
|
|
|
return {
|
|
require: '^ngController',
|
|
restrict: 'AE',
|
|
template: template,
|
|
scope: {
|
|
itemId: '@',
|
|
title: '@',
|
|
view: '@'
|
|
},
|
|
controller: function($rootScope, $scope, $filter, globals, $timeout) {
|
|
|
|
$scope.main = $scope.$parent.$parent;//TODO: this is a crap!!!
|
|
|
|
//add reference to this window, in parent controller
|
|
if($scope.$parent[$scope.itemId] == undefined)
|
|
{
|
|
$scope.$parent[$scope.itemId] = $scope;
|
|
}
|
|
else
|
|
{
|
|
throw Error('Modal Window ' + $scope.itemId + ' already exists!');
|
|
}
|
|
},
|
|
link: function (scope, elem, attrs) {
|
|
|
|
$(elem).css('display', 'none');
|
|
|
|
scope.viewController = null;
|
|
|
|
scope.resizeIcon = 'icon-resize-full';
|
|
|
|
scope.modalWindow = $(elem.find('.modal')[0]);
|
|
|
|
scope.modalBody = $(elem.find('.modal-body')[0]);
|
|
|
|
var modalDialog = $(scope.modalWindow.find('.modal-dialog')[0]);
|
|
|
|
//$(modalDialog).draggable({
|
|
// handle: ".modal-header"
|
|
//});
|
|
|
|
scope.viewEl = null;
|
|
|
|
scope.modalWindow.on('show.bs.modal', function () {
|
|
|
|
});
|
|
|
|
scope.modalWindow.on('shown.bs.modal', function () {
|
|
|
|
});
|
|
|
|
scope.modalWindow.on('hide.bs.modal', function () {
|
|
|
|
});
|
|
|
|
scope.modalWindow.on('hidden.bs.modal', function () {
|
|
|
|
});
|
|
|
|
modalDialog.removeClass('modal-large');
|
|
modalDialog.removeClass('modal-medium');
|
|
modalDialog.removeClass('modal-small');
|
|
|
|
//apply width
|
|
if(attrs.width != null && attrs.width != undefined)
|
|
{
|
|
modalDialog.addClass(attrs.width);
|
|
}
|
|
|
|
scope.show = function(config){
|
|
|
|
config = config == undefined ? null : config;
|
|
|
|
scope.main.renderModule(scope.modalBody, scope.view, config, false, function(className, mscope){
|
|
|
|
scope.modalWindow.modal('show');
|
|
|
|
scope.$emit('onShow');
|
|
});
|
|
|
|
scope.viewEl = $(scope.modalBody.children()[0]);
|
|
scope.viewController = angular.element(scope.viewEl).scope();
|
|
//scope.viewController['$$view-id'] = scope.view;
|
|
|
|
//var currentWindowHeight = $(window).height();
|
|
//var newHeight = (currentWindowHeight - (currentWindowHeight * 30 / 100));
|
|
|
|
//TODO: compute height!!!
|
|
scope.modalWindow.modal({
|
|
height: 460,
|
|
minHeight: 460,
|
|
maxHeight: 460,
|
|
show: false,
|
|
backdrop: false
|
|
});
|
|
};
|
|
|
|
scope.hide = function(){
|
|
|
|
//must be here otherwise controller inside modal will be destroyed
|
|
scope.$emit('onHide');
|
|
|
|
scope.viewEl.remove();
|
|
|
|
scope.viewController.$destroy();
|
|
|
|
scope.viewController = null;
|
|
|
|
scope.modalWindow.modal('hide');
|
|
};
|
|
|
|
scope.maximize = function(){
|
|
|
|
if(scope.resizeIcon == 'glyphicon glyphicon-resize-full')
|
|
{
|
|
scope.resizeIcon = 'glyphicon glyphicon-resize-small';
|
|
}
|
|
else
|
|
{
|
|
scope.resizeIcon = 'glyphicon glyphicon-resize-full';
|
|
}
|
|
|
|
modalDialog.toggleClass(attrs.width);
|
|
|
|
modalDialog.toggleClass('modal-large');
|
|
|
|
scope.$emit('onMaximize');
|
|
};
|
|
|
|
//scope.minimize = function(){
|
|
|
|
// scope.modalWindow.animate({
|
|
// height: '40px',
|
|
// top: $(window).height() - 50
|
|
// }, 200);
|
|
|
|
//};
|
|
|
|
|
|
}
|
|
}
|
|
}); |