134 lines
2.9 KiB
JavaScript
134 lines
2.9 KiB
JavaScript
/*
|
|
---
|
|
name: MooDialog
|
|
description: The base class of MooDialog
|
|
authors: Arian Stolwijk
|
|
license: MIT-style license
|
|
requires: [Core/Class, Core/Element, Core/Element.Styles, Core/Element.Event]
|
|
provides: [MooDialog, Element.MooDialog]
|
|
...
|
|
*/
|
|
|
|
|
|
var MooDialog = new Class({
|
|
|
|
Implements: [Options, Events],
|
|
|
|
options: {
|
|
'class': 'MooDialog',
|
|
title: null,
|
|
scroll: true, // IE
|
|
forceScroll: false,
|
|
useEscKey: true,
|
|
destroyOnHide: true,
|
|
autoOpen: true,
|
|
closeButton: true,
|
|
onInitialize: function(){
|
|
this.wrapper.setStyle('display', 'none');
|
|
},
|
|
onBeforeOpen: function(){
|
|
this.wrapper.setStyle('display', 'block');
|
|
this.fireEvent('show');
|
|
},
|
|
onBeforeClose: function(){
|
|
this.wrapper.setStyle('display', 'none');
|
|
this.fireEvent('hide');
|
|
}
|
|
},
|
|
|
|
initialize: function(options){
|
|
this.setOptions(options);
|
|
this.options.inject = this.options.inject || document.body;
|
|
options = this.options;
|
|
|
|
var wrapper = this.wrapper = new Element('div.' + options['class'].replace(' ', '.')).inject(options.inject);
|
|
|
|
if (options.title){
|
|
this.title = new Element('div.title').set('text', options.title).inject(wrapper);
|
|
// this.title.addClass('MooDialogTitle');
|
|
}
|
|
|
|
if (options.closeButton){
|
|
this.closeButton = new Element('a.close', {
|
|
events: {click: this.close.bind(this)}
|
|
}).inject(wrapper);
|
|
}
|
|
this.content = new Element('div.content').inject(wrapper);
|
|
|
|
|
|
/*<ie6>*/// IE 6 scroll
|
|
if ((options.scroll && Browser.ie6) || options.forceScroll){
|
|
wrapper.setStyle('position', 'absolute');
|
|
var position = wrapper.getPosition(options.inject);
|
|
window.addEvent('scroll', function(){
|
|
var scroll = document.getScroll();
|
|
wrapper.setPosition({
|
|
x: position.x + scroll.x,
|
|
y: position.y + scroll.y
|
|
});
|
|
});
|
|
}
|
|
/*</ie6>*/
|
|
|
|
if (options.useEscKey){
|
|
// Add event for the esc key
|
|
document.addEvent('keydown', function(e){
|
|
if (e.key == 'esc') this.close();
|
|
}.bind(this));
|
|
}
|
|
|
|
this.addEvent('hide', function(){
|
|
if (options.destroyOnHide)
|
|
this.destroy();
|
|
}.bind(this));
|
|
|
|
this.fireEvent('initialize', wrapper);
|
|
},
|
|
|
|
setContent: function(){
|
|
var content = Array.from(arguments);
|
|
if (content.length == 1) content = content[0];
|
|
|
|
this.content.empty();
|
|
|
|
var type = typeOf(content);
|
|
if (['string', 'number'].contains(type)) this.content.set('text', content);
|
|
else this.content.adopt(content);
|
|
|
|
return this;
|
|
},
|
|
|
|
open: function(){
|
|
this.fireEvent('beforeOpen', this.wrapper).fireEvent('open');
|
|
this.opened = true;
|
|
return this;
|
|
},
|
|
|
|
close: function(){
|
|
this.fireEvent('beforeClose', this.wrapper).fireEvent('close');
|
|
this.opened = false;
|
|
return this;
|
|
},
|
|
|
|
destroy: function(){
|
|
this.wrapper.destroy();
|
|
},
|
|
|
|
toElement: function(){
|
|
return this.wrapper;
|
|
}
|
|
|
|
});
|
|
|
|
|
|
Element.implement({
|
|
|
|
MooDialog: function(options){
|
|
this.store('MooDialog',
|
|
new MooDialog(options).setContent(this).open()
|
|
);
|
|
return this;
|
|
}
|
|
|
|
});
|