Last active
August 29, 2015 14:05
-
-
Save jsgandalf/19c4e7c4405656ad5488 to your computer and use it in GitHub Desktop.
Popup.js - angularJS service to simplify bootstrap ui modal service call
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// General Modal Service to use for pop-ups | |
// Example openTemplate: Popup.openTemplate("/views/common/modal.html","","","",function(){alert('hello')}); | |
angular.module('myApp').service('Popup', function($modal) { | |
//The alert function only has 1 customizable button | |
var alert = function(title, body, button, cb) { | |
var contents = {}; | |
contents.title = title; | |
contents.body = body; | |
contents.button = button; | |
contents.cb = cb || angular.noop; | |
var modalInstance = $modal.open({ | |
templateUrl: '/views/common/modalAlert.html', | |
controller: ModalInstanceCtrl, | |
resolve: { | |
contents: function() { | |
return contents; | |
} | |
} | |
}); | |
modalInstance.result.then(function() {}, function() { | |
console.log('Popup dismissed at: ' + new Date()); | |
}); | |
}; | |
//Open function will have cancel as a default option and 1 customizable button | |
//Example: "youchoose" button and "cancel" button | |
// Example open: Popup.open("Delete?","Are you sure?","confirm",function(){alert('test')}); | |
var open = function(title, body, button, cb) { | |
var contents = {}; | |
contents.title = title; | |
contents.body = body; | |
contents.button = button; | |
contents.cb = cb || angular.noop; | |
var modalInstance = $modal.open({ | |
templateUrl: '/views/common/modal.html', | |
controller: ModalInstanceCtrl, | |
resolve: { | |
contents: function() { | |
return contents; | |
} | |
} | |
}); | |
modalInstance.result.then(function() {}, function() { | |
console.log('Popup dismissed at: ' + new Date()); | |
}); | |
}; | |
// NOTE: This bracket minification notation is required here, or ngmin will not minify correctly and you will get errors!!! | |
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'contents', | |
function($scope, $modalInstance, contents) { | |
$scope.title = contents.title; | |
$scope.body = contents.body; | |
$scope.button = contents.button; | |
$scope.ok = function() { | |
//run callback function | |
contents.cb(); | |
$modalInstance.close(); | |
}; | |
$scope.cancel = function() { | |
$modalInstance.dismiss('cancel'); | |
}; | |
} | |
]; | |
var openTemplate = function(templateUrl, title, body, button, cb) { | |
var contents = {}; | |
contents.cb = cb || angular.noop; | |
contents.title = title; | |
contents.body = body; | |
contents.button = button; | |
var modalInstance = $modal.open({ | |
templateUrl: templateUrl, | |
controller: ModalInstanceCtrl2, | |
resolve: { | |
contents: function () { | |
return contents; | |
} | |
} | |
}); | |
modalInstance.result.then(function () { | |
}, function () { | |
console.log('Modal dismissed at: ' + new Date()); | |
}); | |
}; | |
// NOTE: This bracket minification notation is required here, or ngmin will not minify correctly and you will get errors!!! | |
var ModalInstanceCtrl2 = ['$scope', '$modalInstance', 'contents', function ($scope, $modalInstance, contents) { | |
$scope.title = contents.title; | |
$scope.body = contents.body; | |
$scope.button = contents.button; | |
$scope.ok = function (args) { | |
//run callback function | |
contents.cb(args); | |
$modalInstance.close(); | |
}; | |
$scope.cancel = function () { | |
$modalInstance.dismiss('cancel'); | |
}; | |
}]; | |
return { | |
open: open, | |
openTemplate: openTemplate, | |
alert: alert | |
}; | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment