癤?** * */ if(typeof Control == 'undefined') throw("You require md/js/control/Control.js!!"); Control.Modal.openDialog = function(elm, evt, src, width, height) { if(Control.Modal.loaded) { if(typeof(this.modal) == 'undefined') { this.modal = new Control.Modal(); } this.modal.open(elm, src, width, height); /* 泥?濡쒕뵫???꾩튂 紐살옟??踰꾧렇?뚮Ц???쒕쾲 ?レ븯?ㅺ? ?ㅼ떆 ?댁뼱以?*/ this.modal.close(); this.modal.open(elm, src, width, height); } if(evt) { Event.stop(evt); } return false; }; Control.Modal.center = function(element) { var DEFAULT_PADDING = 30; if(!element._absolutized){ element.setStyle({ position: 'absolute' }); element._absolutized = true; } var dimensions = element.getDimensions(); Position.prepare(); var offset_left = (Position.deltaX + Math.floor((Control.Modal.getWindowWidth() - dimensions.width) / 2)); var offset_top = (Position.deltaY + Math.floor((Control.Modal.getWindowHeight() - dimensions.height) / 2)); var getTop = function(dimensions, offset_top){ if(dimensions.height <= Control.Modal.getWindowHeight() && (offset_top != null && offset_top > 0)) { return offset_top +'px'; } return (Position.deltaY +DEFAULT_PADDING) +'px'; } var getLeft = function(dimensions, offset_left) { if(dimensions.width <= Control.Modal.getWindowWidth() && (offset_left != null && offset_left > 0)) { return offset_left +'px'; } return (Position.deltaX +DEFAULT_PADDING) +'px'; } element.setStyle({ top: getTop(dimensions, offset_top), left: getLeft(dimensions, offset_left) }); }; Object.extend(Control.Modal.prototype,{ html: false, element: false, initialize: function(){ this.options = { template: new Template( '
' + '' + '
'), containerClassName: 'popup_image', overlayClassName: 'popup_overlay', opacity: 0.6, zIndex: 9990 }; this.container = new Control.Container(Control.Modal.container, this.options); this.overlay = new Control.Overlay(Control.Modal.overlay, this.options); this.position = function() { var dimensions = this.container.getDimensions(); this.overlay.position(dimensions); this.container.center(); }.bind(this); }, open: function(element, src, width, height){ if(!Control.Modal.loaded) { Control.Modal.load(); } Control.Modal.close(); this.workaround(false); this.element = $(element); Control.Modal.current = this; Event.observe(document, 'keydown',Control.Modal.onKeyDown); this.update(this.options.template.evaluate({ 'src': src, id: 'modal_image' })); this.container.open(width, height); this.overlay.open(); this.position(); }, update: function(html){ this.container.update(html); this.position(); }, close: function(){ Control.Modal.current = false; Event.stopObserving(window,'keyup',Control.Modal.onKeyDown); this.workaround(true); this.overlay.close(); this.container.close(); }, workaround: function(isVisible) { var handleVisible = function(_tagName, _isVisible){ $A(document.getElementsByTagName(_tagName)).each(function(tag){ tag.style.visibility = _isVisible? 'visible': 'hidden'; }); } if(Control.Modal.ie){ handleVisible("select", isVisible); } handleVisible("object", isVisible); handleVisible("iframe", isVisible); handleVisible("embed", isVisible); } }); Control.Container = Class.create(); Object.extend(Control.Container.prototype, { PADDING_HEIGHT: 6, PADDING_WIDTH: 6, initialize: function(element, options) { this.TITLE_HEIGHT = 21; this.element = element; this.zIndex = options.zIndex; this.className = options.containerClassName; }, open: function(width, height) { var img = $('modal_image'); Event.observe(img, 'click', Control.Modal.close); this.element.setStyle({ zIndex: this.zIndex + 1, width: (width == null? img.getWidth(): parseInt(width)) +this.PADDING_WIDTH +'px', height: (height == null? img.getHeight(): parseInt(height)) +this.PADDING_HEIGHT +'px' }); this.element.addClassName(this.className); this.center(); }, update: function(html) { Element.update(this.element, html); Element.show(this.element); }, close: function() { Event.stopObserving($('modal_image'), 'click',Control.Modal.close); this.element.hide(); this.element.update(''); this.element.removeClassName(this.className); this.element.setStyle({ height: null, width: null, top: null, left: null }); }, center: function() { Control.Modal.center(this.element); }, getDimensions: function() { return Element.getDimensions(this.element); } }); Control.Overlay = Class.create(); Object.extend(Control.Overlay.prototype, { initialize: function(element, options) { this.element = element; this.zIndex = options.zIndex; this.opacity = options.opacity; this.className = options.overlayClassName; }, open: function() { Event.observe(this.element, 'click', Control.Modal.close); this.element.setStyle({ zIndex: this.zIndex, opacity: this.opacity }); this.element.addClassName(this.className); this.element.show(); }, close: function() { Event.stopObserving(this.element, 'click',Control.Modal.close); this.element.hide(); this.element.removeClassName(this.className); }, position: function(dimensions) { var getWidth = function(imgWidth) { var _width = Control.Modal.getDocumentWidth(); if(_width < imgWidth +20) { return imgWidth +20; }else { return _width -20; } } var getHeight = function(imgHeight) { Position.prepare(); var _height = Control.Modal.getDocumentHeight(); if(_height < Position.deltaY +imgHeight +60) { return Position.deltaY +imgHeight +60; }else { return _height; } } Element.setStyle(this.element, { height: getHeight(dimensions.height) + 'px', width: getWidth(dimensions.width) + 'px' }); } }); if(typeof(Object.Event) != 'undefined') Object.Event.extend(Control.Modal); Control.Modal.attachEvents();