Skip to content

Instantly share code, notes, and snippets.

@dansdantas
Created January 20, 2017 13:17
Show Gist options
  • Select an option

  • Save dansdantas/48d5322e8a0adb640dc9118207d5e48e to your computer and use it in GitHub Desktop.

Select an option

Save dansdantas/48d5322e8a0adb640dc9118207d5e48e to your computer and use it in GitHub Desktop.
modalComponent = (function(){
self = this
self.display = false
self.header = ''
self.content = ''
self.domElement;
function _buildComponent() {
return [
'<div class="alg-modal-overlay" data-modal-component>',
'<div class="alg-modal">',
'<div class="alg-modal-header">',
self.header,
'</div>',
'<div class="alg-modal-content">',
self.content,
'</div>',
'<div class="alg-modal-footer">',
self.footer,
'</div>',
'</div>',
'</div>'
].join('');
}
function _setAttributes(args) {
self.header = args['header'] || '';
self.footer = args['footer'] || '<button data-dismiss="modal" class="button-close">Close</button><button data-dismiss="modal" class="button-accept">Accept</button>';
self.content = args['content'] || '';
}
function _start() {
document.body.innerHTML += _buildComponent();
self.display = true;
self.domElement = document.querySelector('[data-modal-component]');
self.domElement.addEventListener('click', close);
var closetriggers = document.querySelectorAll('[data-dismiss="modal"]');
for (i = 0; i < triggers.length; i++) {
triggers[i].addEventListener('click', close);
}
}
function init(args={}) {
_setAttributes(args);
_start();
}
function close() {
self.domElement.remove();
}
return {
init: init
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment