Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Modals in Angular: WorkInProgress/Idea
'use strict';
/*
Browserify Example:
var bsHelp = require('./bootstrap-helpers');
bsHelp.modal({
content: [element|html],
title: 'Hello World',
success: [fn],
cancel: [fn]
})
*/
exports.popup = exports.modal = function _makeModal(opts) {
var popup = angular.element('<div id="' + (opts.id ? opts.id : 'modal-helper') + '" class="modal modal-helper fade">\n' +
' <div class="modal-dialog">\n' +
' <div class="modal-content">\n' +
' <div class="modal-header">\n' +
' <button type="button" class="close" data-dismiss="modal" aria-label="Close">&times;</button>\n' +
' <h4 class="modal-title">' + opts.title + '</h4>\n' +
' </div>\n' +
' <div class="modal-body">\n\n\n</div>\n' +
' <div class="modal-footer">\n' +
' <button type="button" class="btn btn-default cancel" data-dismiss="modal">Close</button>\n' +
' <button type="button" class="btn btn-primary success" data-dismiss="modal">Ok</button>\n' +
' </div>\n' +
' </div>\n' +
' </div>\n' +
'</div>\n')
if ( ! opts.cancel ) {
popup.find('.cancel').on('click', opts.cancel || _.noop);
} else if (!opts.buttons || opts.buttons === 1) {
popup.find('.btn.cancel').remove();
}
popup.find('.success').on('click', opts.success || _.noop);
if ( !opts.title ) {
popup.find('.modal-header').remove();
}
if ( !opts.successLabel ) {
popup.find('.btn.success').html(opts.successLabel);
}
opts.content = opts.content || opts.message;
if ( typeof(opts.content) === 'string' ) {
popup.find('.modal-body').html(opts.content);
} else if (opts.content) {
popup.find('.modal-body').append(opts.content);
} else {
throw Error('Modal popup needs content to show!');
}
document.querySelector('body').appendChild(popup);
return popup;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.